@pie-element/multi-trait-rubric 2.8.3-next.37 → 2.8.3-next.41

package/lib/scale.js

@@ -62,6 +62,7 @@ var styles = function styles() {
       color: _renderUi.color.text(),
       fontSize: '14px',
       lineHeight: '16px',
+      overflow: 'unset',
       '& ul, ol': {
         marginBlockStart: 0,
         paddingInlineStart: '16px'
@@ -112,7 +113,8 @@ var ArrowContainer = function ArrowContainer(_ref) {
       margin: 'auto',
       position: 'absolute',
       alignItems: 'center',
-      justifyContent: 'center'
+      justifyContent: 'center',
+      cursor: 'pointer'
     }, extraStyles),
     onClick: onClick
   }, children);
@@ -164,28 +166,18 @@ var Scale = /*#__PURE__*/function (_React$Component) {
   (0, _createClass2["default"])(Scale, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      var _this2 = this;
-
       if (this.tableWrapper) {
         if (this.tableWrapper.offsetWidth < this.tableWrapper.scrollWidth) {
           this.setState({
             showRight: true
           });
         }
-
-        this.tableWrapper.onscroll = function () {
-          _this2.setState({
-            // 5 is a margin of error
-            showRight: _this2.tableWrapper.scrollLeft + _this2.tableWrapper.offsetWidth < _this2.tableWrapper.scrollWidth - 5 && _this2.tableWrapper.scrollLeft < _this2.tableWrapper.scrollWidth,
-            showLeft: _this2.tableWrapper.scrollLeft < _this2.tableWrapper.scrollWidth && _this2.tableWrapper.scrollLeft > 0
-          });
-        };
       }
     }
   }, {
     key: "render",
     value: function render() {
-      var _this3 = this;
+      var _this2 = this;
 
       var _this$state = this.state,
           showRight = _this$state.showRight,
@@ -249,7 +241,14 @@ var Scale = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/_react["default"].createElement(_ArrowBackIos["default"], null)), /*#__PURE__*/_react["default"].createElement("div", {
         className: classes.tableWrapper,
         ref: function ref(_ref3) {
-          _this3.tableWrapper = _ref3;
+          _this2.tableWrapper = _ref3;
+        },
+        onScroll: function onScroll() {
+          _this2.setState({
+            // 5 is a margin of error
+            showRight: _this2.tableWrapper.scrollLeft + _this2.tableWrapper.offsetWidth < _this2.tableWrapper.scrollWidth - 5 && _this2.tableWrapper.scrollLeft < _this2.tableWrapper.scrollWidth,
+            showLeft: _this2.tableWrapper.scrollLeft < _this2.tableWrapper.scrollWidth && _this2.tableWrapper.scrollLeft > 0
+          });
         }
       }, /*#__PURE__*/_react["default"].createElement("table", {
         key: "scale-".concat(scaleIndex),

package/lib/scale.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/scale.jsx"],"names":["styles","wrapper","display","position","tableWrapper","width","overflow","table","borderSpacing","marginBottom","borderRadius","color","text","fontSize","lineHeight","marginBlockStart","paddingInlineStart","padding","textAlign","backgroundColor","secondaryBackground","verticalAlign","scorePointHeader","border","minWidth","pointLabel","scorePointValue","fontWeight","ArrowContainer","show","onClick","extraStyles","children","height","top","margin","alignItems","justifyContent","propTypes","PropTypes","bool","func","object","Scale","scrollLeft","offsetWidth","setState","showRight","scrollWidth","showLeft","initialScrollLeft","onscroll","state","props","classes","scale","scaleIndex","showDescription","showPointsLabels","showStandards","excludeZero","maxPoints","traitLabel","traits","scorePointsLabels","scorePointsValues","descriptions","pointsLabels","standards","pointValue","push","reduce","tcc","trait","traitStandards","traitDescriptions","description","length","e","left","background","ref","__html","map","index","traitIndex","scrollRight","right","React","Component","number","shape","arrayOf","string","name","scorePointsDescriptors"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color } from '@pie-lib/render-ui';\nimport Trait from './trait';\nimport ArrowBackIosIcon from \"@material-ui/icons/ArrowBackIos\";\nimport ArrowForwardIosIcon from \"@material-ui/icons/ArrowForwardIos\";\n\nconst styles = () => ({\n  wrapper: {\n    display: 'flex',\n    position: 'relative'\n  },\n  tableWrapper: {\n    width: '100%',\n    overflow: 'scroll'\n  },\n  table: {\n    borderSpacing: 0,\n    marginBottom: '16px',\n    borderRadius: '4px',\n    color: color.text(),\n    fontSize: '14px',\n    lineHeight: '16px',\n\n    '& ul, ol': {\n      marginBlockStart: 0,\n      paddingInlineStart: '16px',\n    },\n\n    '& th': {\n      padding: '16px',\n      textAlign: 'left',\n      backgroundColor: color.secondaryBackground(),\n      verticalAlign: 'bottom',\n    },\n\n    '& th div': {\n      width: '200px',\n    },\n\n    '& td': {\n      width: '200px',\n      padding: '16px 8px',\n      verticalAlign: 'top',\n    },\n  },\n  scorePointHeader: {\n    '& td': {\n      border: 0,\n      padding: 0,\n      textAlign: 'center',\n      minWidth: '200px',\n    },\n  },\n  pointLabel: {\n    marginBottom: '4px',\n  },\n  scorePointValue: {\n    fontWeight: 'normal',\n  },\n});\n\nconst ArrowContainer = ({ show, onClick, extraStyles, children }) => (\n  <div\n    style={{\n      height: 'calc(100% - 1px)',\n      top: '1px',\n      display: show ? 'flex' : 'none',\n      width: '50px',\n      margin: 'auto',\n      position: 'absolute',\n      alignItems: 'center',\n      justifyContent: 'center',\n      ...extraStyles\n    }}\n    onClick={onClick}\n  >\n    {children}\n  </div>\n);\n\nArrowContainer.propTypes = {\n  show: PropTypes.bool,\n  onClick: PropTypes.func,\n  extraStyles: PropTypes.object,\n  children: PropTypes.object,\n};\n\n\nclass Scale extends React.Component {\n  state = {};\n\n  componentDidMount() {\n    if (this.tableWrapper) {\n      if (this.tableWrapper.offsetWidth < this.tableWrapper.scrollWidth) {\n        this.setState({ showRight: true });\n      }\n      this.tableWrapper.onscroll = () => {\n        this.setState({\n          // 5 is a margin of error\n          showRight: this.tableWrapper.scrollLeft + this.tableWrapper.offsetWidth < this.tableWrapper.scrollWidth - 5\n            && this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,\n          showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0,\n        });\n      }\n    }\n  }\n\n  scrollLeft = () => {\n    this.tableWrapper.scrollLeft -= this.tableWrapper.offsetWidth / 2;\n\n    this.setState({\n      showRight: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,\n      showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0,\n    });\n  }\n\n  scrollRight = () => {\n    const initialScrollLeft = this.tableWrapper.scrollLeft;\n    this.tableWrapper.scrollLeft += this.tableWrapper.offsetWidth / 2;\n\n    this.setState({\n      showRight: initialScrollLeft !== this.tableWrapper.scrollLeft && this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,\n      showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0,\n    });\n  }\n\n  render() {\n    const { showRight, showLeft } = this.state;\n    const { classes, scale, scaleIndex, showDescription, showPointsLabels, showStandards } = this.props;\n    const { excludeZero, maxPoints, traitLabel, traits, scorePointsLabels } = scale || {};\n\n    let scorePointsValues = [];\n    let descriptions;\n    let pointsLabels;\n    let standards;\n\n    try {\n      // determining the score points values\n      for (let pointValue = maxPoints; pointValue >= excludeZero ? 1 : 0; pointValue -= 1) {\n        scorePointsValues.push(pointValue);\n      }\n\n      const { traitStandards, traitDescriptions } = traits.reduce(\n        (tcc, trait) => ({\n          traitStandards: [...tcc.traitStandards, ...(trait.standards || [])],\n          traitDescriptions: [...tcc.traitDescriptions, ...(trait.description || [])],\n        }),\n        {\n          traitStandards: [],\n          traitDescriptions: [],\n        },\n      );\n\n      descriptions = showDescription && traitDescriptions.length;\n      pointsLabels = showPointsLabels && scorePointsLabels.length;\n      standards = showStandards && traitStandards.length;\n    } catch (e) {\n      descriptions = false;\n      pointsLabels = false;\n      standards = false;\n    }\n\n    return (\n      <div className={classes.wrapper}>\n\n        <ArrowContainer\n          show={showLeft}\n          onClick={this.scrollLeft}\n          extraStyles={{\n            left: 0,\n            background: `linear-gradient(to right, white, ${color.background()})`,\n          }}\n        >\n          <ArrowBackIosIcon/>\n        </ArrowContainer>\n\n        <div\n          className={classes.tableWrapper}\n          ref={ref => {\n            this.tableWrapper = ref;\n          }}\n        >\n          <table key={`scale-${scaleIndex}`} className={classes.table}>\n            <thead>\n            <tr>\n              <th>\n                <div dangerouslySetInnerHTML={{ __html: traitLabel }}/>\n              </th>\n\n              {standards ? (\n                <th>\n                  <div>Standard(s)</div>\n                </th>\n              ) : null}\n\n              {descriptions ? (\n                <th>\n                  <div>Description</div>\n                </th>\n              ) : null}\n\n              {scorePointsValues &&\n                scorePointsValues.map((scorePointValue, index) => {\n                  let pointLabel = '';\n\n                  // to handle the case when there aren't enough labels\n                  try {\n                    pointLabel = scorePointsLabels[scorePointsValues.length - index - 1] || '';\n                  } catch (e) {\n                    pointLabel = '';\n                  }\n\n                  return (\n                    <th key={`table-header-${index}`}>\n                      <table className={classes.scorePointHeader}>\n                        <thead>\n                        {pointsLabels ? (\n                          <tr>\n                            <td>\n                              <div className={classes.pointLabel} dangerouslySetInnerHTML={{ __html: pointLabel }}/>\n                            </td>\n                          </tr>\n                        ) : null}\n                        <tr>\n                          <td className={classes.scorePointValue}>\n                            {scorePointValue === 1 ? `${scorePointValue} point` : `${scorePointValue} points`}\n                          </td>\n                        </tr>\n                        </thead>\n                      </table>\n                    </th>\n                  );\n                })}\n            </tr>\n            </thead>\n\n            <tbody>\n            {traits &&\n              traits.map((trait, traitIndex) => (\n                <Trait\n                  key={`trait_${scaleIndex}_${traitIndex}`}\n                  trait={trait}\n                  traitIndex={traitIndex}\n                  showDescription={!!descriptions}\n                  showStandards={!!standards}\n                  scaleIndex={scaleIndex}\n                  scorePointsValues={scorePointsValues}\n                  excludeZero={excludeZero}\n                />\n              ))}\n            </tbody>\n          </table>\n        </div>\n\n        <ArrowContainer\n          show={showRight}\n          onClick={this.scrollRight}\n          extraStyles={{\n            right: 0,\n            background: `linear-gradient(to left, white, ${color.background()})`,\n          }}\n        >\n          <ArrowForwardIosIcon/>\n        </ArrowContainer>\n      </div>\n    );\n  }\n}\n\nScale.propTypes = {\n  classes: PropTypes.object,\n  scaleIndex: PropTypes.number,\n  scale: PropTypes.shape({\n    excludeZero: PropTypes.bool,\n    maxPoints: PropTypes.number,\n    scorePointsLabels: PropTypes.arrayOf(PropTypes.string),\n    traitLabel: PropTypes.string,\n    traits: PropTypes.arrayOf(\n      PropTypes.shape({\n        name: PropTypes.string,\n        standards: PropTypes.arrayOf(PropTypes.string),\n        scorePointsDescriptors: PropTypes.arrayOf(PropTypes.string),\n        description: PropTypes.string,\n      }),\n    ),\n  }),\n  showPointsLabels: PropTypes.bool,\n  showDescription: PropTypes.bool,\n  showStandards: PropTypes.bool,\n};\n\nexport default withStyles(styles)(Scale);\n"],"file":"scale.js"}
+{"version":3,"sources":["../src/scale.jsx"],"names":["styles","wrapper","display","position","tableWrapper","width","overflow","table","borderSpacing","marginBottom","borderRadius","color","text","fontSize","lineHeight","marginBlockStart","paddingInlineStart","padding","textAlign","backgroundColor","secondaryBackground","verticalAlign","scorePointHeader","border","minWidth","pointLabel","scorePointValue","fontWeight","ArrowContainer","show","onClick","extraStyles","children","height","top","margin","alignItems","justifyContent","cursor","propTypes","PropTypes","bool","func","object","Scale","scrollLeft","offsetWidth","setState","showRight","scrollWidth","showLeft","initialScrollLeft","state","props","classes","scale","scaleIndex","showDescription","showPointsLabels","showStandards","excludeZero","maxPoints","traitLabel","traits","scorePointsLabels","scorePointsValues","descriptions","pointsLabels","standards","pointValue","push","reduce","tcc","trait","traitStandards","traitDescriptions","description","length","e","left","background","ref","__html","map","index","traitIndex","scrollRight","right","React","Component","number","shape","arrayOf","string","name","scorePointsDescriptors"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color } from '@pie-lib/render-ui';\nimport Trait from './trait';\nimport ArrowBackIosIcon from '@material-ui/icons/ArrowBackIos';\nimport ArrowForwardIosIcon from '@material-ui/icons/ArrowForwardIos';\n\nconst styles = () => ({\n  wrapper: {\n    display: 'flex',\n    position: 'relative'\n  },\n  tableWrapper: {\n    width: '100%',\n    overflow: 'scroll'\n  },\n  table: {\n    borderSpacing: 0,\n    marginBottom: '16px',\n    borderRadius: '4px',\n    color: color.text(),\n    fontSize: '14px',\n    lineHeight: '16px',\n    overflow: 'unset',\n\n    '& ul, ol': {\n      marginBlockStart: 0,\n      paddingInlineStart: '16px',\n    },\n\n    '& th': {\n      padding: '16px',\n      textAlign: 'left',\n      backgroundColor: color.secondaryBackground(),\n      verticalAlign: 'bottom',\n    },\n\n    '& th div': {\n      width: '200px',\n    },\n\n    '& td': {\n      width: '200px',\n      padding: '16px 8px',\n      verticalAlign: 'top',\n    },\n  },\n  scorePointHeader: {\n    '& td': {\n      border: 0,\n      padding: 0,\n      textAlign: 'center',\n      minWidth: '200px',\n    },\n  },\n  pointLabel: {\n    marginBottom: '4px',\n  },\n  scorePointValue: {\n    fontWeight: 'normal',\n  },\n});\n\nconst ArrowContainer = ({ show, onClick, extraStyles, children }) => (\n  <div\n    style={{\n      height: 'calc(100% - 1px)',\n      top: '1px',\n      display: show ? 'flex' : 'none',\n      width: '50px',\n      margin: 'auto',\n      position: 'absolute',\n      alignItems: 'center',\n      justifyContent: 'center',\n      cursor: 'pointer',\n      ...extraStyles\n    }}\n    onClick={onClick}\n  >\n    {children}\n  </div>\n);\n\nArrowContainer.propTypes = {\n  show: PropTypes.bool,\n  onClick: PropTypes.func,\n  extraStyles: PropTypes.object,\n  children: PropTypes.object,\n};\n\n\nclass Scale extends React.Component {\n  state = {};\n\n  componentDidMount() {\n    if (this.tableWrapper) {\n      if (this.tableWrapper.offsetWidth < this.tableWrapper.scrollWidth) {\n        this.setState({ showRight: true });\n      }\n    }\n  }\n\n  scrollLeft = () => {\n    this.tableWrapper.scrollLeft -= this.tableWrapper.offsetWidth / 2;\n\n    this.setState({\n      showRight: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,\n      showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0,\n    });\n  }\n\n  scrollRight = () => {\n    const initialScrollLeft = this.tableWrapper.scrollLeft;\n    this.tableWrapper.scrollLeft += this.tableWrapper.offsetWidth / 2;\n\n    this.setState({\n      showRight: initialScrollLeft !== this.tableWrapper.scrollLeft && this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,\n      showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0,\n    });\n  }\n\n  render() {\n    const { showRight, showLeft } = this.state;\n    const { classes, scale, scaleIndex, showDescription, showPointsLabels, showStandards } = this.props;\n    const { excludeZero, maxPoints, traitLabel, traits, scorePointsLabels } = scale || {};\n\n    let scorePointsValues = [];\n    let descriptions;\n    let pointsLabels;\n    let standards;\n\n    try {\n      // determining the score points values\n      for (let pointValue = maxPoints; pointValue >= excludeZero ? 1 : 0; pointValue -= 1) {\n        scorePointsValues.push(pointValue);\n      }\n\n      const { traitStandards, traitDescriptions } = traits.reduce(\n        (tcc, trait) => ({\n          traitStandards: [...tcc.traitStandards, ...(trait.standards || [])],\n          traitDescriptions: [...tcc.traitDescriptions, ...(trait.description || [])],\n        }),\n        {\n          traitStandards: [],\n          traitDescriptions: [],\n        },\n      );\n\n      descriptions = showDescription && traitDescriptions.length;\n      pointsLabels = showPointsLabels && scorePointsLabels.length;\n      standards = showStandards && traitStandards.length;\n    } catch (e) {\n      descriptions = false;\n      pointsLabels = false;\n      standards = false;\n    }\n\n    return (\n      <div className={classes.wrapper}>\n\n        <ArrowContainer\n          show={showLeft}\n          onClick={this.scrollLeft}\n          extraStyles={{\n            left: 0,\n            background: `linear-gradient(to right, white, ${color.background()})`,\n          }}\n        >\n          <ArrowBackIosIcon/>\n        </ArrowContainer>\n\n        <div\n          className={classes.tableWrapper}\n          ref={ref => {\n            this.tableWrapper = ref;\n          }}\n          onScroll={() => {\n            this.setState({\n              // 5 is a margin of error\n              showRight: this.tableWrapper.scrollLeft + this.tableWrapper.offsetWidth < this.tableWrapper.scrollWidth - 5\n                && this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,\n              showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0,\n            });\n          }}\n        >\n          <table\n            key={`scale-${scaleIndex}`}\n            className={classes.table}\n          >\n            <thead>\n            <tr>\n              <th>\n                <div dangerouslySetInnerHTML={{ __html: traitLabel }}/>\n              </th>\n\n              {standards ? (\n                <th>\n                  <div>Standard(s)</div>\n                </th>\n              ) : null}\n\n              {descriptions ? (\n                <th>\n                  <div>Description</div>\n                </th>\n              ) : null}\n\n              {scorePointsValues &&\n                scorePointsValues.map((scorePointValue, index) => {\n                  let pointLabel = '';\n\n                  // to handle the case when there aren't enough labels\n                  try {\n                    pointLabel = scorePointsLabels[scorePointsValues.length - index - 1] || '';\n                  } catch (e) {\n                    pointLabel = '';\n                  }\n\n                  return (\n                    <th key={`table-header-${index}`}>\n                      <table className={classes.scorePointHeader}>\n                        <thead>\n                        {pointsLabels ? (\n                          <tr>\n                            <td>\n                              <div className={classes.pointLabel} dangerouslySetInnerHTML={{ __html: pointLabel }}/>\n                            </td>\n                          </tr>\n                        ) : null}\n                        <tr>\n                          <td className={classes.scorePointValue}>\n                            {scorePointValue === 1 ? `${scorePointValue} point` : `${scorePointValue} points`}\n                          </td>\n                        </tr>\n                        </thead>\n                      </table>\n                    </th>\n                  );\n                })}\n            </tr>\n            </thead>\n\n            <tbody>\n            {traits &&\n              traits.map((trait, traitIndex) => (\n                <Trait\n                  key={`trait_${scaleIndex}_${traitIndex}`}\n                  trait={trait}\n                  traitIndex={traitIndex}\n                  showDescription={!!descriptions}\n                  showStandards={!!standards}\n                  scaleIndex={scaleIndex}\n                  scorePointsValues={scorePointsValues}\n                  excludeZero={excludeZero}\n                />\n              ))}\n            </tbody>\n          </table>\n        </div>\n\n        <ArrowContainer\n          show={showRight}\n          onClick={this.scrollRight}\n          extraStyles={{\n            right: 0,\n            background: `linear-gradient(to left, white, ${color.background()})`,\n          }}\n        >\n          <ArrowForwardIosIcon/>\n        </ArrowContainer>\n      </div>\n    );\n  }\n}\n\nScale.propTypes = {\n  classes: PropTypes.object,\n  scaleIndex: PropTypes.number,\n  scale: PropTypes.shape({\n    excludeZero: PropTypes.bool,\n    maxPoints: PropTypes.number,\n    scorePointsLabels: PropTypes.arrayOf(PropTypes.string),\n    traitLabel: PropTypes.string,\n    traits: PropTypes.arrayOf(\n      PropTypes.shape({\n        name: PropTypes.string,\n        standards: PropTypes.arrayOf(PropTypes.string),\n        scorePointsDescriptors: PropTypes.arrayOf(PropTypes.string),\n        description: PropTypes.string,\n      }),\n    ),\n  }),\n  showPointsLabels: PropTypes.bool,\n  showDescription: PropTypes.bool,\n  showStandards: PropTypes.bool,\n};\n\nexport default withStyles(styles)(Scale);\n"],"file":"scale.js"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/multi-trait-rubric",
   "repository": "pie-framework/pie-elements",
-  "version": "2.8.3-next.37+deef9141a",
+  "version": "2.8.3-next.41+c2858855e",
   "publishConfig": {
     "access": "public"
   },
@@ -15,7 +15,7 @@
     "react": "^16.8.1",
     "react-dom": "^16.8.1"
   },
-  "gitHead": "deef9141a891f07db10fd3e0865f612e3796529b",
+  "gitHead": "c2858855e0df45a4cb86fbd20637fc82f27f07c6",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },