@pie-lib/correct-answer-toggle 2.12.0 → 2.13.0

package/CHANGELOG.md

@@ -3,7 +3,7 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-# [2.12.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.12.0) (2025-07-31)
+# [2.13.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.13.0) (2025-07-31)
 
 **Note:** Version bump only for package @pie-lib/correct-answer-toggle
 
@@ -11,38 +11,26 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
 
 
 
-# [2.11.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.11.0) (2025-07-31)
+# [2.12.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.12.0) (2025-07-31)
 
 **Note:** Version bump only for package @pie-lib/correct-answer-toggle
 
+# [2.11.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.11.0) (2025-07-31)
 
-
-
+**Note:** Version bump only for package @pie-lib/correct-answer-toggle
 
 # [2.10.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.10.0) (2025-07-31)
 
 **Note:** Version bump only for package @pie-lib/correct-answer-toggle
 
-
-
-
-
 # [2.9.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.9.0) (2025-07-31)
 
 **Note:** Version bump only for package @pie-lib/correct-answer-toggle
 
-
-
-
-
 # [2.8.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.8.0) (2025-07-31)
 
 **Note:** Version bump only for package @pie-lib/correct-answer-toggle
 
-
-
-
-
 # [2.10.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/correct-answer-toggle@2.5.11...@pie-lib/correct-answer-toggle@2.10.0) (2025-07-31)
 
 **Note:** Version bump only for package @pie-lib/correct-answer-toggle

package/lib/expander.js

@@ -0,0 +1,88 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _reactTransitionGroup = require("react-transition-group");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var Expander = function Expander(props) {
+  var classes = props.classes,
+      show = props.show,
+      children = props.children;
+  return /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.CSSTransition, {
+    "in": show,
+    appear: true,
+    mountOnEnter: false,
+    timeout: 300,
+    classNames: _objectSpread({}, classes)
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.expander
+  }, children));
+};
+
+Expander.propTypes = {
+  show: _propTypes["default"].bool.isRequired,
+  className: _propTypes["default"].string,
+  classes: _propTypes["default"].object,
+  children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]).isRequired
+};
+var transition = 'height ease-in 300ms, opacity ease-in 300ms';
+
+var _default = (0, _styles.withStyles)(function () {
+  return {
+    expander: {
+      position: 'relative',
+      height: 0,
+      overflow: 'hidden',
+      display: 'flex',
+      visibility: 'hidden',
+      width: 0
+    },
+    enter: {
+      transition: transition,
+      opacity: 1,
+      height: 'auto',
+      width: 'auto',
+      visibility: 'visible',
+      minHeight: '25px'
+    },
+    enterDone: {
+      height: 'auto',
+      visibility: 'visible',
+      width: 'auto',
+      minHeight: '25px'
+    },
+    exit: {
+      transition: transition,
+      opacity: 0,
+      height: 0,
+      visibility: 'visible',
+      width: 0
+    },
+    exitDone: {
+      opacity: 0,
+      visibility: 'hidden',
+      height: 0,
+      width: 0
+    }
+  };
+})(Expander);
+
+exports["default"] = _default;
+//# sourceMappingURL=expander.js.map

package/lib/expander.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/expander.jsx"],"names":["Expander","props","classes","show","children","expander","propTypes","PropTypes","bool","isRequired","className","string","object","oneOfType","arrayOf","node","transition","position","height","overflow","display","visibility","width","enter","opacity","minHeight","enterDone","exit","exitDone"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAAW;AAC1B,MAAQC,OAAR,GAAoCD,KAApC,CAAQC,OAAR;AAAA,MAAiBC,IAAjB,GAAoCF,KAApC,CAAiBE,IAAjB;AAAA,MAAuBC,QAAvB,GAAoCH,KAApC,CAAuBG,QAAvB;AAEA,sBACE,gCAAC,mCAAD;AAAe,UAAID,IAAnB;AAAyB,IAAA,MAAM,EAAE,IAAjC;AAAuC,IAAA,YAAY,EAAE,KAArD;AAA4D,IAAA,OAAO,EAAE,GAArE;AAA0E,IAAA,UAAU,oBAAOD,OAAP;AAApF,kBACE;AAAK,IAAA,SAAS,EAAEA,OAAO,CAACG;AAAxB,KAAmCD,QAAnC,CADF,CADF;AAKD,CARD;;AAUAJ,QAAQ,CAACM,SAAT,GAAqB;AACnBH,EAAAA,IAAI,EAAEI,sBAAUC,IAAV,CAAeC,UADF;AAEnBC,EAAAA,SAAS,EAAEH,sBAAUI,MAFF;AAGnBT,EAAAA,OAAO,EAAEK,sBAAUK,MAHA;AAInBR,EAAAA,QAAQ,EAAEG,sBAAUM,SAAV,CAAoB,CAACN,sBAAUO,OAAV,CAAkBP,sBAAUQ,IAA5B,CAAD,EAAoCR,sBAAUQ,IAA9C,CAApB,EAAyEN;AAJhE,CAArB;AAOA,IAAMO,UAAU,GAAG,6CAAnB;;eAEe,wBAAW;AAAA,SAAO;AAC/BX,IAAAA,QAAQ,EAAE;AACRY,MAAAA,QAAQ,EAAE,UADF;AAERC,MAAAA,MAAM,EAAE,CAFA;AAGRC,MAAAA,QAAQ,EAAE,QAHF;AAIRC,MAAAA,OAAO,EAAE,MAJD;AAKRC,MAAAA,UAAU,EAAE,QALJ;AAMRC,MAAAA,KAAK,EAAE;AANC,KADqB;AAS/BC,IAAAA,KAAK,EAAE;AACLP,MAAAA,UAAU,EAAVA,UADK;AAELQ,MAAAA,OAAO,EAAE,CAFJ;AAGLN,MAAAA,MAAM,EAAE,MAHH;AAILI,MAAAA,KAAK,EAAE,MAJF;AAKLD,MAAAA,UAAU,EAAE,SALP;AAMLI,MAAAA,SAAS,EAAE;AANN,KATwB;AAiB/BC,IAAAA,SAAS,EAAE;AACTR,MAAAA,MAAM,EAAE,MADC;AAETG,MAAAA,UAAU,EAAE,SAFH;AAGTC,MAAAA,KAAK,EAAE,MAHE;AAITG,MAAAA,SAAS,EAAE;AAJF,KAjBoB;AAuB/BE,IAAAA,IAAI,EAAE;AACJX,MAAAA,UAAU,EAAVA,UADI;AAEJQ,MAAAA,OAAO,EAAE,CAFL;AAGJN,MAAAA,MAAM,EAAE,CAHJ;AAIJG,MAAAA,UAAU,EAAE,SAJR;AAKJC,MAAAA,KAAK,EAAE;AALH,KAvByB;AA8B/BM,IAAAA,QAAQ,EAAE;AACRJ,MAAAA,OAAO,EAAE,CADD;AAERH,MAAAA,UAAU,EAAE,QAFJ;AAGRH,MAAAA,MAAM,EAAE,CAHA;AAIRI,MAAAA,KAAK,EAAE;AAJC;AA9BqB,GAAP;AAAA,CAAX,EAoCXtB,QApCW,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { CSSTransition } from 'react-transition-group';\n\nconst Expander = (props) => {\n  const { classes, show, children } = props;\n\n  return (\n    <CSSTransition in={show} appear={true} mountOnEnter={false} timeout={300} classNames={{ ...classes }}>\n      <div className={classes.expander}>{children}</div>\n    </CSSTransition>\n  );\n};\n\nExpander.propTypes = {\n  show: PropTypes.bool.isRequired,\n  className: PropTypes.string,\n  classes: PropTypes.object,\n  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n};\n\nconst transition = 'height ease-in 300ms, opacity ease-in 300ms';\n\nexport default withStyles(() => ({\n  expander: {\n    position: 'relative',\n    height: 0,\n    overflow: 'hidden',\n    display: 'flex',\n    visibility: 'hidden',\n    width: 0,\n  },\n  enter: {\n    transition,\n    opacity: 1,\n    height: 'auto',\n    width: 'auto',\n    visibility: 'visible',\n    minHeight: '25px',\n  },\n  enterDone: {\n    height: 'auto',\n    visibility: 'visible',\n    width: 'auto',\n    minHeight: '25px',\n  },\n  exit: {\n    transition,\n    opacity: 0,\n    height: 0,\n    visibility: 'visible',\n    width: 0,\n  },\n  exitDone: {\n    opacity: 0,\n    visibility: 'hidden',\n    height: 0,\n    width: 0,\n  },\n}))(Expander);\n"],"file":"expander.js"}

package/lib/index.js

@@ -0,0 +1,181 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.CorrectAnswerToggle = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _styles2 = require("@material-ui/core/styles");
+
+var _CSSTransition = _interopRequireDefault(require("react-transition-group/CSSTransition"));
+
+var _icons = require("@pie-lib/icons");
+
+var _renderUi = require("@pie-lib/render-ui");
+
+var _expander = _interopRequireDefault(require("./expander"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _translator = _interopRequireDefault(require("@pie-lib/translator"));
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var translator = _translator["default"].translator;
+/**
+ * We export the raw unstyled class for testability. For public use please use the default export.
+ */
+
+var CorrectAnswerToggle = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(CorrectAnswerToggle, _React$Component);
+
+  var _super = _createSuper(CorrectAnswerToggle);
+
+  function CorrectAnswerToggle(props) {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, CorrectAnswerToggle);
+    _this = _super.call(this, props);
+    _this.state = {
+      show: props.show
+    };
+    CorrectAnswerToggle.defaultProps = _objectSpread(_objectSpread({}, CorrectAnswerToggle.defaultProps), {}, {
+      showMessage: translator.t('common:showCorrectAnswer', {
+        lng: props.language
+      }),
+      hideMessage: translator.t('common:hideCorrectAnswer', {
+        lng: props.language
+      })
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(CorrectAnswerToggle, [{
+    key: "onClick",
+    value: function onClick() {
+      this.props.onToggle(!this.props.toggled);
+    }
+  }, {
+    key: "onTouch",
+    value: function onTouch(event) {
+      event.preventDefault(); // Prevents the default action (click event)
+
+      this.props.onToggle(!this.props.toggled);
+    }
+  }, {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
+      var _this$props;
+
+      this.setState({
+        show: nextProps.show
+      });
+
+      if (nextProps.language !== ((_this$props = this.props) === null || _this$props === void 0 ? void 0 : _this$props.language)) {
+        CorrectAnswerToggle.defaultProps = _objectSpread(_objectSpread({}, CorrectAnswerToggle.defaultProps), {}, {
+          showMessage: translator.t('common:showCorrectAnswer', {
+            lng: nextProps.language
+          }),
+          hideMessage: translator.t('common:hideCorrectAnswer', {
+            lng: nextProps.language
+          })
+        });
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+          classes = _this$props2.classes,
+          className = _this$props2.className,
+          toggled = _this$props2.toggled,
+          hideMessage = _this$props2.hideMessage,
+          showMessage = _this$props2.showMessage;
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: (0, _classnames["default"])(classes.root, className)
+      }, /*#__PURE__*/_react["default"].createElement(_expander["default"], {
+        show: this.state.show,
+        className: classes.expander
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.content,
+        onClick: this.onClick.bind(this),
+        onTouchEnd: this.onTouch.bind(this)
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.iconHolder
+      }, /*#__PURE__*/_react["default"].createElement(_CSSTransition["default"], {
+        timeout: 400,
+        "in": toggled,
+        exit: !toggled,
+        classNames: classes
+      }, /*#__PURE__*/_react["default"].createElement(_icons.CorrectResponse, {
+        open: toggled,
+        key: "correct-open",
+        className: classes.icon
+      })), /*#__PURE__*/_react["default"].createElement(_CSSTransition["default"], {
+        timeout: 5000,
+        "in": !toggled,
+        exit: toggled,
+        classNames: classes
+      }, /*#__PURE__*/_react["default"].createElement(_icons.CorrectResponse, {
+        open: toggled,
+        key: "correct-closed",
+        className: classes.icon
+      }))), /*#__PURE__*/_react["default"].createElement(_renderUi.Readable, {
+        "false": true
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: classes.label,
+        "aria-hidden": !this.state.show
+      }, toggled ? hideMessage : showMessage)))));
+    }
+  }]);
+  return CorrectAnswerToggle;
+}(_react["default"].Component);
+
+exports.CorrectAnswerToggle = CorrectAnswerToggle;
+(0, _defineProperty2["default"])(CorrectAnswerToggle, "propTypes", {
+  onToggle: _propTypes["default"].func,
+  toggled: _propTypes["default"].bool,
+  show: _propTypes["default"].bool,
+  hideMessage: _propTypes["default"].string,
+  showMessage: _propTypes["default"].string,
+  classes: _propTypes["default"].object.isRequired,
+  className: _propTypes["default"].string,
+  language: _propTypes["default"].string
+});
+(0, _defineProperty2["default"])(CorrectAnswerToggle, "defaultProps", {
+  showMessage: 'Show correct answer',
+  hideMessage: 'Hide correct answer',
+  show: false,
+  toggled: false
+});
+
+var _default = (0, _styles2.withStyles)(_styles["default"])(CorrectAnswerToggle);
+
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.jsx"],"names":["translator","Translator","CorrectAnswerToggle","props","state","show","defaultProps","showMessage","t","lng","language","hideMessage","onToggle","toggled","event","preventDefault","nextProps","setState","classes","className","root","expander","content","onClick","bind","onTouch","iconHolder","icon","label","React","Component","PropTypes","func","bool","string","object","isRequired","styles"],"mappings":"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","sourcesContent":["import styles from './styles';\nimport { withStyles } from '@material-ui/core/styles';\nimport CSSTransition from 'react-transition-group/CSSTransition';\nimport { CorrectResponse } from '@pie-lib/icons';\nimport { Readable } from '@pie-lib/render-ui';\nimport Expander from './expander';\nimport React from 'react';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport Translator from '@pie-lib/translator';\n\nconst { translator } = Translator;\n\n/**\n * We export the raw unstyled class for testability. For public use please use the default export.\n */\nexport class CorrectAnswerToggle extends React.Component {\n  static propTypes = {\n    onToggle: PropTypes.func,\n    toggled: PropTypes.bool,\n    show: PropTypes.bool,\n    hideMessage: PropTypes.string,\n    showMessage: PropTypes.string,\n    classes: PropTypes.object.isRequired,\n    className: PropTypes.string,\n    language: PropTypes.string,\n  };\n\n  static defaultProps = {\n    showMessage: 'Show correct answer',\n    hideMessage: 'Hide correct answer',\n    show: false,\n    toggled: false,\n  };\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      show: props.show,\n    };\n\n    CorrectAnswerToggle.defaultProps = {\n      ...CorrectAnswerToggle.defaultProps,\n      showMessage: translator.t('common:showCorrectAnswer', { lng: props.language }),\n      hideMessage: translator.t('common:hideCorrectAnswer', { lng: props.language }),\n    };\n  }\n\n  onClick() {\n    this.props.onToggle(!this.props.toggled);\n  }\n  onTouch(event) {\n    event.preventDefault(); // Prevents the default action (click event)\n    this.props.onToggle(!this.props.toggled);\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    this.setState({\n      show: nextProps.show,\n    });\n\n    if (nextProps.language !== this.props?.language) {\n      CorrectAnswerToggle.defaultProps = {\n        ...CorrectAnswerToggle.defaultProps,\n        showMessage: translator.t('common:showCorrectAnswer', { lng: nextProps.language }),\n        hideMessage: translator.t('common:hideCorrectAnswer', { lng: nextProps.language }),\n      };\n    }\n  }\n\n  render() {\n    const { classes, className, toggled, hideMessage, showMessage } = this.props;\n\n    return (\n      <div className={classNames(classes.root, className)}>\n        <Expander show={this.state.show} className={classes.expander}>\n          <div className={classes.content} onClick={this.onClick.bind(this)} onTouchEnd={this.onTouch.bind(this)}>\n            <div className={classes.iconHolder}>\n              <CSSTransition timeout={400} in={toggled} exit={!toggled} classNames={classes}>\n                <CorrectResponse open={toggled} key=\"correct-open\" className={classes.icon} />\n              </CSSTransition>\n              <CSSTransition timeout={5000} in={!toggled} exit={toggled} classNames={classes}>\n                <CorrectResponse open={toggled} key=\"correct-closed\" className={classes.icon} />\n              </CSSTransition>\n            </div>\n            <Readable false>\n              <div className={classes.label} aria-hidden={!this.state.show}>\n                {toggled ? hideMessage : showMessage}\n              </div>\n            </Readable>\n          </div>\n        </Expander>\n      </div>\n    );\n  }\n}\n\nexport default withStyles(styles)(CorrectAnswerToggle);\n"],"file":"index.js"}

package/lib/styles.js

@@ -0,0 +1,66 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.animationStyles = void 0;
+
+var _renderUi = require("@pie-lib/render-ui");
+
+var noTouch = {
+  '-webkit-touchCcallout': 'none',
+  '-webkit-user-select': 'none',
+  '-khtml-user-select': 'none',
+  '-moz-user-select': 'none',
+  '-ms-user-select': 'none',
+  'user-select': 'none'
+};
+var _default = {
+  root: {
+    width: '100%',
+    cursor: 'pointer'
+  },
+  content: {
+    margin: '0 auto',
+    textAlign: 'center',
+    display: 'flex'
+  },
+  label: Object.assign({
+    width: 'fit-content',
+    minWidth: '140px',
+    // eslint-disable-next-line
+    fontFamily: "'Roboto', sans-serif",
+    alignSelf: 'center',
+    verticalAlign: 'middle',
+    color: "var(--correct-answer-toggle-label-color,  ".concat(_renderUi.color.text(), ")"),
+    fontWeight: 'normal'
+  }, noTouch),
+  icon: {
+    position: 'absolute',
+    width: '25px'
+  },
+  iconHolder: {
+    width: '25px',
+    marginRight: '5px',
+    display: 'flex',
+    alignItems: 'center'
+  },
+  enter: {
+    opacity: '0'
+  },
+  enterActive: {
+    opacity: '1',
+    transition: 'opacity 0.3s ease-in'
+  },
+  exit: {
+    opacity: '1'
+  },
+  exitActive: {
+    opacity: '0',
+    transition: 'opacity 0.3s ease-in'
+  }
+};
+exports["default"] = _default;
+var animationStyles = {};
+exports.animationStyles = animationStyles;
+//# sourceMappingURL=styles.js.map

package/lib/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/styles.js"],"names":["noTouch","root","width","cursor","content","margin","textAlign","display","label","Object","assign","minWidth","fontFamily","alignSelf","verticalAlign","color","text","fontWeight","icon","position","iconHolder","marginRight","alignItems","enter","opacity","enterActive","transition","exit","exitActive","animationStyles"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,OAAO,GAAG;AACd,2BAAyB,MADX;AAEd,yBAAuB,MAFT;AAGd,wBAAsB,MAHR;AAId,sBAAoB,MAJN;AAKd,qBAAmB,MALL;AAMd,iBAAe;AAND,CAAhB;eASe;AACbC,EAAAA,IAAI,EAAE;AACJC,IAAAA,KAAK,EAAE,MADH;AAEJC,IAAAA,MAAM,EAAE;AAFJ,GADO;AAKbC,EAAAA,OAAO,EAAE;AACPC,IAAAA,MAAM,EAAE,QADD;AAEPC,IAAAA,SAAS,EAAE,QAFJ;AAGPC,IAAAA,OAAO,EAAE;AAHF,GALI;AAUbC,EAAAA,KAAK,EAAEC,MAAM,CAACC,MAAP,CACL;AACER,IAAAA,KAAK,EAAE,aADT;AAEES,IAAAA,QAAQ,EAAE,OAFZ;AAGE;AACAC,IAAAA,UAAU,EAAE,sBAJd;AAKEC,IAAAA,SAAS,EAAE,QALb;AAMEC,IAAAA,aAAa,EAAE,QANjB;AAOEC,IAAAA,KAAK,sDAA+CA,gBAAMC,IAAN,EAA/C,MAPP;AAQEC,IAAAA,UAAU,EAAE;AARd,GADK,EAWLjB,OAXK,CAVM;AAuBbkB,EAAAA,IAAI,EAAE;AACJC,IAAAA,QAAQ,EAAE,UADN;AAEJjB,IAAAA,KAAK,EAAE;AAFH,GAvBO;AA2BbkB,EAAAA,UAAU,EAAE;AACVlB,IAAAA,KAAK,EAAE,MADG;AAEVmB,IAAAA,WAAW,EAAE,KAFH;AAGVd,IAAAA,OAAO,EAAE,MAHC;AAIVe,IAAAA,UAAU,EAAE;AAJF,GA3BC;AAiCbC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE;AADJ,GAjCM;AAoCbC,EAAAA,WAAW,EAAE;AACXD,IAAAA,OAAO,EAAE,GADE;AAEXE,IAAAA,UAAU,EAAE;AAFD,GApCA;AAwCbC,EAAAA,IAAI,EAAE;AACJH,IAAAA,OAAO,EAAE;AADL,GAxCO;AA2CbI,EAAAA,UAAU,EAAE;AACVJ,IAAAA,OAAO,EAAE,GADC;AAEVE,IAAAA,UAAU,EAAE;AAFF;AA3CC,C;;AAiDR,IAAMG,eAAe,GAAG,EAAxB","sourcesContent":["import { color } from '@pie-lib/render-ui';\n\nconst noTouch = {\n  '-webkit-touchCcallout': 'none',\n  '-webkit-user-select': 'none',\n  '-khtml-user-select': 'none',\n  '-moz-user-select': 'none',\n  '-ms-user-select': 'none',\n  'user-select': 'none',\n};\n\nexport default {\n  root: {\n    width: '100%',\n    cursor: 'pointer',\n  },\n  content: {\n    margin: '0 auto',\n    textAlign: 'center',\n    display: 'flex',\n  },\n  label: Object.assign(\n    {\n      width: 'fit-content',\n      minWidth: '140px',\n      // eslint-disable-next-line\n      fontFamily: \"'Roboto', sans-serif\",\n      alignSelf: 'center',\n      verticalAlign: 'middle',\n      color: `var(--correct-answer-toggle-label-color,  ${color.text()})`,\n      fontWeight: 'normal',\n    },\n    noTouch,\n  ),\n  icon: {\n    position: 'absolute',\n    width: '25px',\n  },\n  iconHolder: {\n    width: '25px',\n    marginRight: '5px',\n    display: 'flex',\n    alignItems: 'center',\n  },\n  enter: {\n    opacity: '0',\n  },\n  enterActive: {\n    opacity: '1',\n    transition: 'opacity 0.3s ease-in',\n  },\n  exit: {\n    opacity: '1',\n  },\n  exitActive: {\n    opacity: '0',\n    transition: 'opacity 0.3s ease-in',\n  },\n};\n\nexport const animationStyles = {};\n"],"file":"styles.js"}

package/package.json

@@ -11,15 +11,15 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "2.12.0",
+  "version": "2.13.0",
   "main": "lib/index.js",
   "module": "src/index.jsx",
   "scripts": {},
   "dependencies": {
     "@material-ui/core": "^3.8.3",
-    "@pie-lib/icons": "^2.11.0",
-    "@pie-lib/render-ui": "^4.22.0",
-    "@pie-lib/translator": "^2.10.0",
+    "@pie-lib/icons": "^2.12.0",
+    "@pie-lib/render-ui": "^4.23.0",
+    "@pie-lib/translator": "^2.11.0",
     "classnames": "^2.2.6",
     "lodash": "^4.17.11",
     "prop-types": "^15.6.2",
@@ -33,5 +33,5 @@
     "react": "^16.8.1",
     "react-dom": "^16.8.1"
   },
-  "gitHead": "b52ffaa60bc5a96e2ead9c2f6cfcd17e2db058f7"
+  "gitHead": "7ca3b0a214af57d742b4a9de6d8b424d31da1469"
 }