@coorpacademy/components 10.30.12-alpha.5 → 10.30.12-alpha.7

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.
@@ -161,10 +161,6 @@
161
161
  height: auto;
162
162
  max-width: 100%;
163
163
  }
164
-
165
- .myStarsWrapper {
166
- max-width: 100%;
167
- }
168
164
 
169
165
  .allStars {
170
166
  height: auto;
@@ -1 +1 @@
1
- {"version":3,"file":"stars-summary.d.ts","sourceRoot":"","sources":["../../../src/template/activity/stars-summary.js"],"names":[],"mappings":";AAYA;IACE;;;;;;;;;;;;;;;;;;;MAME;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,wBAYC;IARC;;;MAGC;IAOH,qBAGC;IAED,sBAGC;IAED,0BAIC;IAED,6BA4DC;CACF"}
1
+ {"version":3,"file":"stars-summary.d.ts","sourceRoot":"","sources":["../../../src/template/activity/stars-summary.js"],"names":[],"mappings":";AAoCA;IACE;;;;;;;;;;;;;;;;;;;MAME;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,wBAYC;IARC;;;MAGC;IAOH,qBAGC;IAED,sBAGC;IAED,0BAIC;IAED,6BAiDC;CACF"}
@@ -1,16 +1,42 @@
1
+ import _map from "lodash/fp/map";
1
2
  import _isEmpty from "lodash/fp/isEmpty";
2
3
  import _getOr from "lodash/fp/getOr";
3
4
  import _get from "lodash/fp/get";
4
5
 
5
6
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
6
7
 
7
- import React from 'react';
8
+ import React, { useCallback, useMemo } from 'react';
8
9
  import PropTypes from 'prop-types';
9
10
  import { NovaCompositionNavigationArrowLeft as ArrowLeft, NovaCompositionNavigationArrowRight as ArrowRight, NovaCompositionCoorpacademyStar as StarIcon } from '@coorpacademy/nova-icons';
10
11
  import Provider from '../../atom/provider';
11
12
  import EngineStars from './engine-stars';
12
13
  import style from './stars-summary.css';
13
14
 
15
+ const EngineTabs = ({
16
+ engines,
17
+ state,
18
+ firstItem
19
+ }) => {
20
+ const buildEngineTab = useCallback((engine, index) => {
21
+ return /*#__PURE__*/React.createElement("div", {
22
+ className: style[state],
23
+ key: engine.type,
24
+ "data-name": `${engine.type}_total_${state}`
25
+ }, /*#__PURE__*/React.createElement(EngineStars, _extends({}, engine, {
26
+ className: index < firstItem ? style.hidden : style.active
27
+ })));
28
+ }, [firstItem, state]);
29
+ return useMemo(() => _map.convert({
30
+ cap: false
31
+ })(buildEngineTab, engines), [buildEngineTab, engines]);
32
+ };
33
+
34
+ EngineTabs.propTypes = process.env.NODE_ENV !== "production" ? {
35
+ engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes)),
36
+ state: PropTypes.oneOf(['hidden', 'active']),
37
+ firstItem: PropTypes.number
38
+ } : {};
39
+
14
40
  class StarsSummary extends React.Component {
15
41
  constructor(props) {
16
42
  super(props);
@@ -65,19 +91,8 @@ class StarsSummary extends React.Component {
65
91
 
66
92
  if (_isEmpty(engines)) {
67
93
  return null;
68
- } // transform component
69
-
94
+ }
70
95
 
71
- const engineTabs = engines.map((engine, index) => {
72
- const state = index < firstItem ? 'hidden' : 'active';
73
- return /*#__PURE__*/React.createElement("div", {
74
- className: style[state],
75
- key: engine.type,
76
- "data-name": `${engine.type}_total_${state}`
77
- }, /*#__PURE__*/React.createElement(EngineStars, _extends({}, engine, {
78
- className: index < firstItem ? style.hidden : style.active
79
- })));
80
- });
81
96
  const leftArrowView = totalItems > 6 && firstItem > 0 ? /*#__PURE__*/React.createElement("div", {
82
97
  className: style.circle,
83
98
  onClick: this.handleOnLeft,
@@ -107,7 +122,11 @@ class StarsSummary extends React.Component {
107
122
  }, /*#__PURE__*/React.createElement("div", {
108
123
  className: style.allStars,
109
124
  "data-name": "engineList"
110
- }, engineTabs), /*#__PURE__*/React.createElement("div", {
125
+ }, /*#__PURE__*/React.createElement(EngineStars, {
126
+ engines: engines,
127
+ state: this.state,
128
+ firstItem: firstItem
129
+ })), /*#__PURE__*/React.createElement("div", {
111
130
  className: style.footerSummaryStars,
112
131
  style: {
113
132
  backgroundColor: primary
@@ -1 +1 @@
1
- {"version":3,"file":"stars-summary.js","names":["React","PropTypes","NovaCompositionNavigationArrowLeft","ArrowLeft","NovaCompositionNavigationArrowRight","ArrowRight","NovaCompositionCoorpacademyStar","StarIcon","Provider","EngineStars","style","StarsSummary","Component","constructor","props","engines","state","firstItem","totalItems","length","handleOnLeft","bind","handleOnRight","scrollTo","page","setState","render","total","skin","context","dark","primary","engineTabs","map","engine","index","type","hidden","active","leftArrowView","circle","left","rightArrowView","right","myStars","myStarsWrapper","allStars","footerSummaryStars","backgroundColor","totalStars","label","stars","iconBubble","iconHeader","navigationLeft","navigationRight","contextTypes","childContextTypes","propTypes","shape","string","isRequired","number","arrayOf"],"sources":["../../../src/template/activity/stars-summary.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get, getOr, isEmpty} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowLeft as ArrowLeft,\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaCompositionCoorpacademyStar as StarIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../atom/provider';\nimport EngineStars from './engine-stars';\nimport style from './stars-summary.css';\n\nclass StarsSummary extends React.Component {\n static propTypes = {\n total: PropTypes.shape({\n label: PropTypes.string.isRequired,\n stars: PropTypes.number.isRequired\n }).isRequired,\n engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes))\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin\n };\n\n constructor(props) {\n super(props);\n\n const {engines = []} = props;\n this.state = {\n firstItem: 0,\n totalItems: engines.length\n };\n\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n }\n\n handleOnLeft() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem - 1);\n }\n\n handleOnRight() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem + 1);\n }\n\n scrollTo(page) {\n this.setState({\n firstItem: page\n });\n }\n\n render() {\n const {total, engines = []} = this.props;\n const {skin} = this.context;\n const {firstItem, totalItems} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const primary = get('common.primary', skin);\n\n if (isEmpty(engines)) {\n return null;\n }\n\n // transform component\n const engineTabs = engines.map((engine, index) => {\n const state = index < firstItem ? 'hidden' : 'active';\n return (\n <div className={style[state]} key={engine.type} data-name={`${engine.type}_total_${state}`}>\n <EngineStars {...engine} className={index < firstItem ? style.hidden : style.active} />\n </div>\n );\n });\n\n const leftArrowView =\n totalItems > 6 && firstItem > 0 ? (\n <div className={style.circle} onClick={this.handleOnLeft} data-name=\"left-arrow\">\n <ArrowLeft color={dark} className={style.left} width={10} height={10} />\n </div>\n ) : null;\n\n const rightArrowView =\n totalItems > 6 && firstItem < totalItems - 6 ? (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n ) : null;\n\n return (\n <div data-name=\"myStars\" className={style.myStars}>\n <div data-name=\"myStars-wrapper\" className={style.myStarsWrapper}>\n <div className={style.allStars} data-name=\"engineList\">\n {engineTabs}\n </div>\n <div\n className={style.footerSummaryStars}\n style={{\n backgroundColor: primary\n }}\n >\n <div className={style.totalStars}>\n <span>{total.label}</span>\n <p data-name=\"star-counter\">{total.stars}</p>\n <div className={style.iconBubble}>\n <StarIcon className={style.iconHeader} color={primary} />\n </div>\n </div>\n <div className={style.navigationLeft}>{leftArrowView}</div>\n <div className={style.navigationRight}>{rightArrowView}</div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default StarsSummary;\n"],"mappings":"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"}
1
+ {"version":3,"file":"stars-summary.js","names":["React","useCallback","useMemo","PropTypes","NovaCompositionNavigationArrowLeft","ArrowLeft","NovaCompositionNavigationArrowRight","ArrowRight","NovaCompositionCoorpacademyStar","StarIcon","Provider","EngineStars","style","EngineTabs","engines","state","firstItem","buildEngineTab","engine","index","type","hidden","active","convert","cap","propTypes","arrayOf","shape","oneOf","number","StarsSummary","Component","constructor","props","totalItems","length","handleOnLeft","bind","handleOnRight","scrollTo","page","setState","render","total","skin","context","dark","primary","leftArrowView","circle","left","rightArrowView","right","myStars","myStarsWrapper","allStars","footerSummaryStars","backgroundColor","totalStars","label","stars","iconBubble","iconHeader","navigationLeft","navigationRight","contextTypes","childContextTypes","string","isRequired"],"sources":["../../../src/template/activity/stars-summary.js"],"sourcesContent":["import React, {useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, getOr, isEmpty, map} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowLeft as ArrowLeft,\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaCompositionCoorpacademyStar as StarIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../atom/provider';\nimport EngineStars from './engine-stars';\nimport style from './stars-summary.css';\n\nconst EngineTabs = ({engines, state, firstItem}) => {\n const buildEngineTab = useCallback(\n (engine, index) => {\n return (\n <div className={style[state]} key={engine.type} data-name={`${engine.type}_total_${state}`}>\n <EngineStars {...engine} className={index < firstItem ? style.hidden : style.active} />\n </div>\n );\n },\n [firstItem, state]\n );\n\n return useMemo(\n () => map.convert({cap: false})(buildEngineTab, engines),\n [buildEngineTab, engines]\n );\n};\n\nEngineTabs.propTypes = {\n engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes)),\n state: PropTypes.oneOf(['hidden', 'active']),\n firstItem: PropTypes.number\n};\n\nclass StarsSummary extends React.Component {\n static propTypes = {\n total: PropTypes.shape({\n label: PropTypes.string.isRequired,\n stars: PropTypes.number.isRequired\n }).isRequired,\n engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes))\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin\n };\n\n constructor(props) {\n super(props);\n\n const {engines = []} = props;\n this.state = {\n firstItem: 0,\n totalItems: engines.length\n };\n\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n }\n\n handleOnLeft() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem - 1);\n }\n\n handleOnRight() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem + 1);\n }\n\n scrollTo(page) {\n this.setState({\n firstItem: page\n });\n }\n\n render() {\n const {total, engines = []} = this.props;\n const {skin} = this.context;\n const {firstItem, totalItems} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const primary = get('common.primary', skin);\n\n if (isEmpty(engines)) {\n return null;\n }\n const leftArrowView =\n totalItems > 6 && firstItem > 0 ? (\n <div className={style.circle} onClick={this.handleOnLeft} data-name=\"left-arrow\">\n <ArrowLeft color={dark} className={style.left} width={10} height={10} />\n </div>\n ) : null;\n\n const rightArrowView =\n totalItems > 6 && firstItem < totalItems - 6 ? (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n ) : null;\n\n return (\n <div data-name=\"myStars\" className={style.myStars}>\n <div data-name=\"myStars-wrapper\" className={style.myStarsWrapper}>\n <div className={style.allStars} data-name=\"engineList\">\n <EngineStars engines={engines} state={this.state} firstItem={firstItem} />\n </div>\n <div\n className={style.footerSummaryStars}\n style={{\n backgroundColor: primary\n }}\n >\n <div className={style.totalStars}>\n <span>{total.label}</span>\n <p data-name=\"star-counter\">{total.stars}</p>\n <div className={style.iconBubble}>\n <StarIcon className={style.iconHeader} color={primary} />\n </div>\n </div>\n <div className={style.navigationLeft}>{leftArrowView}</div>\n <div className={style.navigationRight}>{rightArrowView}</div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default StarsSummary;\n"],"mappings":"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"}
@@ -161,10 +161,6 @@
161
161
  height: auto;
162
162
  max-width: 100%;
163
163
  }
164
-
165
- .myStarsWrapper {
166
- max-width: 100%;
167
- }
168
164
 
169
165
  .allStars {
170
166
  height: auto;
@@ -1 +1 @@
1
- {"version":3,"file":"stars-summary.d.ts","sourceRoot":"","sources":["../../../src/template/activity/stars-summary.js"],"names":[],"mappings":";AAYA;IACE;;;;;;;;;;;;;;;;;;;MAME;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,wBAYC;IARC;;;MAGC;IAOH,qBAGC;IAED,sBAGC;IAED,0BAIC;IAED,6BA4DC;CACF"}
1
+ {"version":3,"file":"stars-summary.d.ts","sourceRoot":"","sources":["../../../src/template/activity/stars-summary.js"],"names":[],"mappings":";AAoCA;IACE;;;;;;;;;;;;;;;;;;;MAME;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF,wBAYC;IARC;;;MAGC;IAOH,qBAGC;IAED,sBAGC;IAED,0BAIC;IAED,6BAiDC;CACF"}
@@ -3,13 +3,15 @@
3
3
  exports.__esModule = true;
4
4
  exports.default = void 0;
5
5
 
6
+ var _map2 = _interopRequireDefault(require("lodash/fp/map"));
7
+
6
8
  var _isEmpty2 = _interopRequireDefault(require("lodash/fp/isEmpty"));
7
9
 
8
10
  var _getOr2 = _interopRequireDefault(require("lodash/fp/getOr"));
9
11
 
10
12
  var _get2 = _interopRequireDefault(require("lodash/fp/get"));
11
13
 
12
- var _react = _interopRequireDefault(require("react"));
14
+ var _react = _interopRequireWildcard(require("react"));
13
15
 
14
16
  var _propTypes = _interopRequireDefault(require("prop-types"));
15
17
 
@@ -21,10 +23,39 @@ var _engineStars = _interopRequireDefault(require("./engine-stars"));
21
23
 
22
24
  var _starsSummary = _interopRequireDefault(require("./stars-summary.css"));
23
25
 
26
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
+
28
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
+
24
30
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
31
 
26
32
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
27
33
 
34
+ const EngineTabs = ({
35
+ engines,
36
+ state,
37
+ firstItem
38
+ }) => {
39
+ const buildEngineTab = (0, _react.useCallback)((engine, index) => {
40
+ return /*#__PURE__*/_react.default.createElement("div", {
41
+ className: _starsSummary.default[state],
42
+ key: engine.type,
43
+ "data-name": `${engine.type}_total_${state}`
44
+ }, /*#__PURE__*/_react.default.createElement(_engineStars.default, _extends({}, engine, {
45
+ className: index < firstItem ? _starsSummary.default.hidden : _starsSummary.default.active
46
+ })));
47
+ }, [firstItem, state]);
48
+ return (0, _react.useMemo)(() => _map2.default.convert({
49
+ cap: false
50
+ })(buildEngineTab, engines), [buildEngineTab, engines]);
51
+ };
52
+
53
+ EngineTabs.propTypes = process.env.NODE_ENV !== "production" ? {
54
+ engines: _propTypes.default.arrayOf(_propTypes.default.shape(_engineStars.default.propTypes)),
55
+ state: _propTypes.default.oneOf(['hidden', 'active']),
56
+ firstItem: _propTypes.default.number
57
+ } : {};
58
+
28
59
  class StarsSummary extends _react.default.Component {
29
60
  constructor(props) {
30
61
  super(props);
@@ -77,19 +108,8 @@ class StarsSummary extends _react.default.Component {
77
108
 
78
109
  if ((0, _isEmpty2.default)(engines)) {
79
110
  return null;
80
- } // transform component
81
-
82
-
83
- const engineTabs = engines.map((engine, index) => {
84
- const state = index < firstItem ? 'hidden' : 'active';
85
- return /*#__PURE__*/_react.default.createElement("div", {
86
- className: _starsSummary.default[state],
87
- key: engine.type,
88
- "data-name": `${engine.type}_total_${state}`
89
- }, /*#__PURE__*/_react.default.createElement(_engineStars.default, _extends({}, engine, {
90
- className: index < firstItem ? _starsSummary.default.hidden : _starsSummary.default.active
91
- })));
92
- });
111
+ }
112
+
93
113
  const leftArrowView = totalItems > 6 && firstItem > 0 ? /*#__PURE__*/_react.default.createElement("div", {
94
114
  className: _starsSummary.default.circle,
95
115
  onClick: this.handleOnLeft,
@@ -119,7 +139,11 @@ class StarsSummary extends _react.default.Component {
119
139
  }, /*#__PURE__*/_react.default.createElement("div", {
120
140
  className: _starsSummary.default.allStars,
121
141
  "data-name": "engineList"
122
- }, engineTabs), /*#__PURE__*/_react.default.createElement("div", {
142
+ }, /*#__PURE__*/_react.default.createElement(_engineStars.default, {
143
+ engines: engines,
144
+ state: this.state,
145
+ firstItem: firstItem
146
+ })), /*#__PURE__*/_react.default.createElement("div", {
123
147
  className: _starsSummary.default.footerSummaryStars,
124
148
  style: {
125
149
  backgroundColor: primary
@@ -1 +1 @@
1
- {"version":3,"file":"stars-summary.js","names":["StarsSummary","React","Component","constructor","props","engines","state","firstItem","totalItems","length","handleOnLeft","bind","handleOnRight","scrollTo","page","setState","render","total","skin","context","dark","primary","engineTabs","map","engine","index","style","type","hidden","active","leftArrowView","circle","left","rightArrowView","right","myStars","myStarsWrapper","allStars","footerSummaryStars","backgroundColor","totalStars","label","stars","iconBubble","iconHeader","navigationLeft","navigationRight","contextTypes","Provider","childContextTypes","propTypes","PropTypes","shape","string","isRequired","number","arrayOf","EngineStars"],"sources":["../../../src/template/activity/stars-summary.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get, getOr, isEmpty} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowLeft as ArrowLeft,\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaCompositionCoorpacademyStar as StarIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../atom/provider';\nimport EngineStars from './engine-stars';\nimport style from './stars-summary.css';\n\nclass StarsSummary extends React.Component {\n static propTypes = {\n total: PropTypes.shape({\n label: PropTypes.string.isRequired,\n stars: PropTypes.number.isRequired\n }).isRequired,\n engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes))\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin\n };\n\n constructor(props) {\n super(props);\n\n const {engines = []} = props;\n this.state = {\n firstItem: 0,\n totalItems: engines.length\n };\n\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n }\n\n handleOnLeft() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem - 1);\n }\n\n handleOnRight() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem + 1);\n }\n\n scrollTo(page) {\n this.setState({\n firstItem: page\n });\n }\n\n render() {\n const {total, engines = []} = this.props;\n const {skin} = this.context;\n const {firstItem, totalItems} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const primary = get('common.primary', skin);\n\n if (isEmpty(engines)) {\n return null;\n }\n\n // transform component\n const engineTabs = engines.map((engine, index) => {\n const state = index < firstItem ? 'hidden' : 'active';\n return (\n <div className={style[state]} key={engine.type} data-name={`${engine.type}_total_${state}`}>\n <EngineStars {...engine} className={index < firstItem ? style.hidden : style.active} />\n </div>\n );\n });\n\n const leftArrowView =\n totalItems > 6 && firstItem > 0 ? (\n <div className={style.circle} onClick={this.handleOnLeft} data-name=\"left-arrow\">\n <ArrowLeft color={dark} className={style.left} width={10} height={10} />\n </div>\n ) : null;\n\n const rightArrowView =\n totalItems > 6 && firstItem < totalItems - 6 ? (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n ) : null;\n\n return (\n <div data-name=\"myStars\" className={style.myStars}>\n <div data-name=\"myStars-wrapper\" className={style.myStarsWrapper}>\n <div className={style.allStars} data-name=\"engineList\">\n {engineTabs}\n </div>\n <div\n className={style.footerSummaryStars}\n style={{\n backgroundColor: primary\n }}\n >\n <div className={style.totalStars}>\n <span>{total.label}</span>\n <p data-name=\"star-counter\">{total.stars}</p>\n <div className={style.iconBubble}>\n <StarIcon className={style.iconHeader} color={primary} />\n </div>\n </div>\n <div className={style.navigationLeft}>{leftArrowView}</div>\n <div className={style.navigationRight}>{rightArrowView}</div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default StarsSummary;\n"],"mappings":"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"}
1
+ {"version":3,"file":"stars-summary.js","names":["EngineTabs","engines","state","firstItem","buildEngineTab","useCallback","engine","index","style","type","hidden","active","useMemo","convert","cap","propTypes","PropTypes","arrayOf","shape","EngineStars","oneOf","number","StarsSummary","React","Component","constructor","props","totalItems","length","handleOnLeft","bind","handleOnRight","scrollTo","page","setState","render","total","skin","context","dark","primary","leftArrowView","circle","left","rightArrowView","right","myStars","myStarsWrapper","allStars","footerSummaryStars","backgroundColor","totalStars","label","stars","iconBubble","iconHeader","navigationLeft","navigationRight","contextTypes","Provider","childContextTypes","string","isRequired"],"sources":["../../../src/template/activity/stars-summary.js"],"sourcesContent":["import React, {useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, getOr, isEmpty, map} from 'lodash/fp';\nimport {\n NovaCompositionNavigationArrowLeft as ArrowLeft,\n NovaCompositionNavigationArrowRight as ArrowRight,\n NovaCompositionCoorpacademyStar as StarIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../atom/provider';\nimport EngineStars from './engine-stars';\nimport style from './stars-summary.css';\n\nconst EngineTabs = ({engines, state, firstItem}) => {\n const buildEngineTab = useCallback(\n (engine, index) => {\n return (\n <div className={style[state]} key={engine.type} data-name={`${engine.type}_total_${state}`}>\n <EngineStars {...engine} className={index < firstItem ? style.hidden : style.active} />\n </div>\n );\n },\n [firstItem, state]\n );\n\n return useMemo(\n () => map.convert({cap: false})(buildEngineTab, engines),\n [buildEngineTab, engines]\n );\n};\n\nEngineTabs.propTypes = {\n engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes)),\n state: PropTypes.oneOf(['hidden', 'active']),\n firstItem: PropTypes.number\n};\n\nclass StarsSummary extends React.Component {\n static propTypes = {\n total: PropTypes.shape({\n label: PropTypes.string.isRequired,\n stars: PropTypes.number.isRequired\n }).isRequired,\n engines: PropTypes.arrayOf(PropTypes.shape(EngineStars.propTypes))\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin\n };\n\n constructor(props) {\n super(props);\n\n const {engines = []} = props;\n this.state = {\n firstItem: 0,\n totalItems: engines.length\n };\n\n this.handleOnLeft = this.handleOnLeft.bind(this);\n this.handleOnRight = this.handleOnRight.bind(this);\n this.scrollTo = this.scrollTo.bind(this);\n }\n\n handleOnLeft() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem - 1);\n }\n\n handleOnRight() {\n const {firstItem} = this.state;\n this.scrollTo(firstItem + 1);\n }\n\n scrollTo(page) {\n this.setState({\n firstItem: page\n });\n }\n\n render() {\n const {total, engines = []} = this.props;\n const {skin} = this.context;\n const {firstItem, totalItems} = this.state;\n const dark = getOr('#90A4AE', 'common.dark', skin);\n const primary = get('common.primary', skin);\n\n if (isEmpty(engines)) {\n return null;\n }\n const leftArrowView =\n totalItems > 6 && firstItem > 0 ? (\n <div className={style.circle} onClick={this.handleOnLeft} data-name=\"left-arrow\">\n <ArrowLeft color={dark} className={style.left} width={10} height={10} />\n </div>\n ) : null;\n\n const rightArrowView =\n totalItems > 6 && firstItem < totalItems - 6 ? (\n <div className={style.circle} onClick={this.handleOnRight} data-name=\"right-arrow\">\n <ArrowRight color={dark} className={style.right} width={10} height={10} />\n </div>\n ) : null;\n\n return (\n <div data-name=\"myStars\" className={style.myStars}>\n <div data-name=\"myStars-wrapper\" className={style.myStarsWrapper}>\n <div className={style.allStars} data-name=\"engineList\">\n <EngineStars engines={engines} state={this.state} firstItem={firstItem} />\n </div>\n <div\n className={style.footerSummaryStars}\n style={{\n backgroundColor: primary\n }}\n >\n <div className={style.totalStars}>\n <span>{total.label}</span>\n <p data-name=\"star-counter\">{total.stars}</p>\n <div className={style.iconBubble}>\n <StarIcon className={style.iconHeader} color={primary} />\n </div>\n </div>\n <div className={style.navigationLeft}>{leftArrowView}</div>\n <div className={style.navigationRight}>{rightArrowView}</div>\n </div>\n </div>\n </div>\n );\n }\n}\n\nexport default StarsSummary;\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@coorpacademy/components",
3
- "version": "10.30.12-alpha.5+466d5aee7",
3
+ "version": "10.30.12-alpha.7+6a7968a03",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "module": "es/index.js",
@@ -158,5 +158,5 @@
158
158
  "last 2 versions",
159
159
  "IE 11"
160
160
  ],
161
- "gitHead": "466d5aee7df679afa120b0a0fb58c38429fca794"
161
+ "gitHead": "6a7968a03a83dc4fe57d3874f323d12acab5d5d3"
162
162
  }