@coorpacademy/components 11.9.2-alpha.1 → 11.9.2-alpha.4
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.
- package/es/atom/avatar/index.js +0 -1
- package/es/atom/avatar/index.js.map +1 -1
- package/es/atom/avatar/style.css +1 -0
- package/es/atom/card-image-preview/index.d.ts.map +1 -1
- package/es/atom/card-image-preview/index.js +3 -1
- package/es/atom/card-image-preview/index.js.map +1 -1
- package/es/atom/difficulty-level/index.js +4 -8
- package/es/atom/difficulty-level/index.js.map +1 -1
- package/es/atom/difficulty-level/style.css +1 -0
- package/es/atom/input-html/index.js +6 -2
- package/es/atom/input-html/index.js.map +1 -1
- package/es/atom/life/index.js +9 -3
- package/es/atom/life/index.js.map +1 -1
- package/es/atom/resource-miniature/index.js +3 -1
- package/es/atom/resource-miniature/index.js.map +1 -1
- package/es/atom/review-presentation/index.d.ts.map +1 -1
- package/es/atom/review-presentation/index.js +62 -12
- package/es/atom/review-presentation/index.js.map +1 -1
- package/es/atom/review-presentation/style.css +67 -7
- package/es/molecule/audio/index.js +3 -1
- package/es/molecule/audio/index.js.map +1 -1
- package/es/molecule/battle-request/index.js +3 -1
- package/es/molecule/battle-request/index.js.map +1 -1
- package/es/molecule/brand-download-box/index.js +3 -1
- package/es/molecule/brand-download-box/index.js.map +1 -1
- package/es/molecule/brand-upload-box/index.js +3 -1
- package/es/molecule/brand-upload-box/index.js.map +1 -1
- package/es/molecule/card/favorite.js +6 -2
- package/es/molecule/card/favorite.js.map +1 -1
- package/es/molecule/card/index.d.ts.map +1 -1
- package/es/molecule/card/index.js +6 -2
- package/es/molecule/card/index.js.map +1 -1
- package/es/molecule/card/notification.js +3 -1
- package/es/molecule/card/notification.js.map +1 -1
- package/es/molecule/card-content/index.d.ts.map +1 -1
- package/es/molecule/card-content/index.js +1 -2
- package/es/molecule/card-content/index.js.map +1 -1
- package/es/molecule/card-content/style.css +1 -0
- package/es/molecule/dashboard/cards-list/index.js +9 -3
- package/es/molecule/dashboard/cards-list/index.js.map +1 -1
- package/es/molecule/discipline-partners/index.js +3 -1
- package/es/molecule/discipline-partners/index.js.map +1 -1
- package/es/molecule/drag-and-drop/overlay.js +3 -1
- package/es/molecule/drag-and-drop/overlay.js.map +1 -1
- package/es/molecule/drag-and-drop/upload-report.js +3 -1
- package/es/molecule/drag-and-drop/upload-report.js.map +1 -1
- package/es/molecule/filters/index.js +6 -2
- package/es/molecule/filters/index.js.map +1 -1
- package/es/molecule/pdf/index.js +3 -1
- package/es/molecule/pdf/index.js.map +1 -1
- package/es/molecule/resource-player/index.js +3 -1
- package/es/molecule/resource-player/index.js.map +1 -1
- package/es/molecule/search-form/index.js +3 -1
- package/es/molecule/search-form/index.js.map +1 -1
- package/es/molecule/select-multiple/index.js +6 -2
- package/es/molecule/select-multiple/index.js.map +1 -1
- package/es/molecule/setup-section/index.js +3 -1
- package/es/molecule/setup-section/index.js.map +1 -1
- package/es/molecule/table/index.js +6 -2
- package/es/molecule/table/index.js.map +1 -1
- package/es/molecule/titled-checkbox/index.js +1 -2
- package/es/molecule/titled-checkbox/index.js.map +1 -1
- package/es/molecule/titled-checkbox/style.css +1 -0
- package/es/organism/accordion/coorp-manager/part/index.d.ts.map +1 -1
- package/es/organism/accordion/coorp-manager/part/index.js +13 -6
- package/es/organism/accordion/coorp-manager/part/index.js.map +1 -1
- package/es/organism/accordion/coorp-manager/part/style.css +1 -0
- package/es/organism/accordion/part/index.js +7 -4
- package/es/organism/accordion/part/index.js.map +1 -1
- package/es/organism/accordion/part/style.css +1 -0
- package/es/organism/brand-form/index.js +3 -1
- package/es/organism/brand-form/index.js.map +1 -1
- package/es/organism/get-the-app/index.js +3 -1
- package/es/organism/get-the-app/index.js.map +1 -1
- package/es/organism/mooc-header/index.d.ts.map +1 -1
- package/es/organism/mooc-header/index.js +21 -7
- package/es/organism/mooc-header/index.js.map +1 -1
- package/es/organism/slider/index.js +6 -2
- package/es/organism/slider/index.js.map +1 -1
- package/es/template/activity/engine-stars.css +33 -16
- package/es/template/activity/engine-stars.d.ts +17 -15
- package/es/template/activity/engine-stars.d.ts.map +1 -1
- package/es/template/activity/engine-stars.js +122 -129
- package/es/template/activity/engine-stars.js.map +1 -1
- package/es/template/activity/index.d.ts +0 -1
- package/es/template/activity/index.d.ts.map +1 -1
- package/es/template/activity/index.js +9 -18
- package/es/template/activity/index.js.map +1 -1
- package/es/template/activity/progression-item.js +13 -5
- package/es/template/activity/progression-item.js.map +1 -1
- package/es/template/activity/stars-summary.d.ts +0 -1
- package/es/template/activity/stars-summary.d.ts.map +1 -1
- package/es/template/activity/stars-summary.js +14 -13
- package/es/template/activity/stars-summary.js.map +1 -1
- package/es/template/app-player/player/slides/header/learner.css +1 -0
- package/es/template/app-player/player/slides/header/learner.js +1 -2
- package/es/template/app-player/player/slides/header/learner.js.map +1 -1
- package/es/template/app-player/player/slides/header/microlearning.css +1 -0
- package/es/template/app-player/player/slides/header/microlearning.js +1 -2
- package/es/template/app-player/player/slides/header/microlearning.js.map +1 -1
- package/es/template/app-player/popin-correction/index.js +4 -3
- package/es/template/app-player/popin-correction/index.js.map +1 -1
- package/es/template/app-player/popin-correction/style.css +1 -0
- package/es/template/app-player/popin-end/summary.js +3 -1
- package/es/template/app-player/popin-end/summary.js.map +1 -1
- package/es/template/app-player/popin-header/index.js +6 -3
- package/es/template/app-player/popin-header/index.js.map +1 -1
- package/es/template/app-player/popin-header/style.css +1 -0
- package/lib/atom/avatar/index.js +0 -1
- package/lib/atom/avatar/index.js.map +1 -1
- package/lib/atom/avatar/style.css +1 -0
- package/lib/atom/card-image-preview/index.d.ts.map +1 -1
- package/lib/atom/card-image-preview/index.js +3 -1
- package/lib/atom/card-image-preview/index.js.map +1 -1
- package/lib/atom/difficulty-level/index.js +4 -8
- package/lib/atom/difficulty-level/index.js.map +1 -1
- package/lib/atom/difficulty-level/style.css +1 -0
- package/lib/atom/input-html/index.js +6 -2
- package/lib/atom/input-html/index.js.map +1 -1
- package/lib/atom/life/index.js +9 -3
- package/lib/atom/life/index.js.map +1 -1
- package/lib/atom/resource-miniature/index.js +3 -1
- package/lib/atom/resource-miniature/index.js.map +1 -1
- package/lib/atom/review-presentation/index.d.ts.map +1 -1
- package/lib/atom/review-presentation/index.js +66 -13
- package/lib/atom/review-presentation/index.js.map +1 -1
- package/lib/atom/review-presentation/style.css +67 -7
- package/lib/molecule/audio/index.js +3 -1
- package/lib/molecule/audio/index.js.map +1 -1
- package/lib/molecule/battle-request/index.js +3 -1
- package/lib/molecule/battle-request/index.js.map +1 -1
- package/lib/molecule/brand-download-box/index.js +3 -1
- package/lib/molecule/brand-download-box/index.js.map +1 -1
- package/lib/molecule/brand-upload-box/index.js +3 -1
- package/lib/molecule/brand-upload-box/index.js.map +1 -1
- package/lib/molecule/card/favorite.js +6 -2
- package/lib/molecule/card/favorite.js.map +1 -1
- package/lib/molecule/card/index.d.ts.map +1 -1
- package/lib/molecule/card/index.js +6 -2
- package/lib/molecule/card/index.js.map +1 -1
- package/lib/molecule/card/notification.js +3 -1
- package/lib/molecule/card/notification.js.map +1 -1
- package/lib/molecule/card-content/index.d.ts.map +1 -1
- package/lib/molecule/card-content/index.js +1 -2
- package/lib/molecule/card-content/index.js.map +1 -1
- package/lib/molecule/card-content/style.css +1 -0
- package/lib/molecule/dashboard/cards-list/index.js +9 -3
- package/lib/molecule/dashboard/cards-list/index.js.map +1 -1
- package/lib/molecule/discipline-partners/index.js +3 -1
- package/lib/molecule/discipline-partners/index.js.map +1 -1
- package/lib/molecule/drag-and-drop/overlay.js +3 -1
- package/lib/molecule/drag-and-drop/overlay.js.map +1 -1
- package/lib/molecule/drag-and-drop/upload-report.js +3 -1
- package/lib/molecule/drag-and-drop/upload-report.js.map +1 -1
- package/lib/molecule/filters/index.js +6 -2
- package/lib/molecule/filters/index.js.map +1 -1
- package/lib/molecule/pdf/index.js +3 -1
- package/lib/molecule/pdf/index.js.map +1 -1
- package/lib/molecule/resource-player/index.js +3 -1
- package/lib/molecule/resource-player/index.js.map +1 -1
- package/lib/molecule/search-form/index.js +3 -1
- package/lib/molecule/search-form/index.js.map +1 -1
- package/lib/molecule/select-multiple/index.js +6 -2
- package/lib/molecule/select-multiple/index.js.map +1 -1
- package/lib/molecule/setup-section/index.js +3 -1
- package/lib/molecule/setup-section/index.js.map +1 -1
- package/lib/molecule/table/index.js +6 -2
- package/lib/molecule/table/index.js.map +1 -1
- package/lib/molecule/titled-checkbox/index.js +1 -2
- package/lib/molecule/titled-checkbox/index.js.map +1 -1
- package/lib/molecule/titled-checkbox/style.css +1 -0
- package/lib/organism/accordion/coorp-manager/part/index.d.ts.map +1 -1
- package/lib/organism/accordion/coorp-manager/part/index.js +13 -6
- package/lib/organism/accordion/coorp-manager/part/index.js.map +1 -1
- package/lib/organism/accordion/coorp-manager/part/style.css +1 -0
- package/lib/organism/accordion/part/index.js +7 -4
- package/lib/organism/accordion/part/index.js.map +1 -1
- package/lib/organism/accordion/part/style.css +1 -0
- package/lib/organism/brand-form/index.js +3 -1
- package/lib/organism/brand-form/index.js.map +1 -1
- package/lib/organism/get-the-app/index.js +3 -1
- package/lib/organism/get-the-app/index.js.map +1 -1
- package/lib/organism/mooc-header/index.d.ts.map +1 -1
- package/lib/organism/mooc-header/index.js +21 -7
- package/lib/organism/mooc-header/index.js.map +1 -1
- package/lib/organism/slider/index.js +6 -2
- package/lib/organism/slider/index.js.map +1 -1
- package/lib/template/activity/engine-stars.css +33 -16
- package/lib/template/activity/engine-stars.d.ts +17 -15
- package/lib/template/activity/engine-stars.d.ts.map +1 -1
- package/lib/template/activity/engine-stars.js +122 -135
- package/lib/template/activity/engine-stars.js.map +1 -1
- package/lib/template/activity/index.d.ts +0 -1
- package/lib/template/activity/index.d.ts.map +1 -1
- package/lib/template/activity/index.js +9 -21
- package/lib/template/activity/index.js.map +1 -1
- package/lib/template/activity/progression-item.js +13 -5
- package/lib/template/activity/progression-item.js.map +1 -1
- package/lib/template/activity/stars-summary.d.ts +0 -1
- package/lib/template/activity/stars-summary.d.ts.map +1 -1
- package/lib/template/activity/stars-summary.js +14 -13
- package/lib/template/activity/stars-summary.js.map +1 -1
- package/lib/template/app-player/player/slides/header/learner.css +1 -0
- package/lib/template/app-player/player/slides/header/learner.js +1 -2
- package/lib/template/app-player/player/slides/header/learner.js.map +1 -1
- package/lib/template/app-player/player/slides/header/microlearning.css +1 -0
- package/lib/template/app-player/player/slides/header/microlearning.js +1 -2
- package/lib/template/app-player/player/slides/header/microlearning.js.map +1 -1
- package/lib/template/app-player/popin-correction/index.js +4 -3
- package/lib/template/app-player/popin-correction/index.js.map +1 -1
- package/lib/template/app-player/popin-correction/style.css +1 -0
- package/lib/template/app-player/popin-end/summary.js +3 -1
- package/lib/template/app-player/popin-end/summary.js.map +1 -1
- package/lib/template/app-player/popin-header/index.js +6 -3
- package/lib/template/app-player/popin-header/index.js.map +1 -1
- package/lib/template/app-player/popin-header/style.css +1 -0
- package/locales/en/global.json +0 -1
- package/package.json +3 -4
- package/es/atom/tooltip/index.d.ts +0 -22
- package/es/atom/tooltip/index.d.ts.map +0 -1
- package/es/atom/tooltip/index.js +0 -117
- package/es/atom/tooltip/index.js.map +0 -1
- package/es/atom/tooltip/style.css +0 -96
- package/lib/atom/tooltip/index.d.ts +0 -22
- package/lib/atom/tooltip/index.d.ts.map +0 -1
- package/lib/atom/tooltip/index.js +0 -137
- package/lib/atom/tooltip/index.js.map +0 -1
- package/lib/atom/tooltip/style.css +0 -96
package/es/atom/avatar/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyBolt","BoltIcon","style","Avatar","url","container","circle","avatar","avatarImg","iconBubble","icon","propTypes","string","isRequired"],"sources":["../../../src/atom/avatar/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {NovaCompositionCoorpacademyBolt as BoltIcon} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst Avatar = ({url}) => {\n return (\n <div className={style.container}>\n <div className={style.circle}>\n <div className={style.avatar}>\n <img className={style.avatarImg} src={url} />\n </div>\n </div>\n <div className={style.iconBubble}>\n <BoltIcon
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyBolt","BoltIcon","style","Avatar","url","container","circle","avatar","avatarImg","iconBubble","icon","propTypes","string","isRequired"],"sources":["../../../src/atom/avatar/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {NovaCompositionCoorpacademyBolt as BoltIcon} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst Avatar = ({url}) => {\n return (\n <div className={style.container}>\n <div className={style.circle}>\n <div className={style.avatar}>\n <img className={style.avatarImg} src={url} />\n </div>\n </div>\n <div className={style.iconBubble}>\n <BoltIcon className={style.icon} />\n </div>\n </div>\n );\n};\n\nAvatar.propTypes = {\n url: PropTypes.string.isRequired\n};\n\nexport default Avatar;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAAQC,+BAA+B,IAAIC,QAA3C,QAA0D,0BAA1D;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,MAAM,GAAG,CAAC;EAACC;AAAD,CAAD,KAAW;EACxB,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACG;EAAtB,gBACE;IAAK,SAAS,EAAEH,KAAK,CAACI;EAAtB,gBACE;IAAK,SAAS,EAAEJ,KAAK,CAACK;EAAtB,gBACE;IAAK,SAAS,EAAEL,KAAK,CAACM,SAAtB;IAAiC,GAAG,EAAEJ;EAAtC,EADF,CADF,CADF,eAME;IAAK,SAAS,EAAEF,KAAK,CAACO;EAAtB,gBACE,oBAAC,QAAD;IAAU,SAAS,EAAEP,KAAK,CAACQ;EAA3B,EADF,CANF,CADF;AAYD,CAbD;;AAeAP,MAAM,CAACQ,SAAP,2CAAmB;EACjBP,GAAG,EAAEL,SAAS,CAACa,MAAV,CAAiBC;AADL,CAAnB;AAIA,eAAeV,MAAf"}
|
package/es/atom/avatar/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/card-image-preview/index.js"],"names":[],"mappings":";AAQA;;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/card-image-preview/index.js"],"names":[],"mappings":";AAQA;;;;gBAiBC"}
|
|
@@ -14,7 +14,9 @@ const CardImagePreview = ({
|
|
|
14
14
|
|
|
15
15
|
const emptyIcon = !image ? /*#__PURE__*/React.createElement(PicturesIcon, {
|
|
16
16
|
className: style.emptyIcon,
|
|
17
|
-
|
|
17
|
+
style: {
|
|
18
|
+
color: whiteColor
|
|
19
|
+
}
|
|
18
20
|
}) : null;
|
|
19
21
|
return /*#__PURE__*/React.createElement("div", {
|
|
20
22
|
className: style.image,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyPictures","PicturesIcon","Provider","style","CardImagePreview","image","skin","whiteColor","emptyIcon","backgroundImage","contextTypes","childContextTypes","propTypes","string"],"sources":["../../../src/atom/card-image-preview/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport {NovaCompositionCoorpacademyPictures as PicturesIcon} from '@coorpacademy/nova-icons';\nimport Provider from '../provider';\n\nimport style from './style.css';\n\nconst CardImagePreview = ({image}, {skin}) => {\n const whiteColor = get('common.white', skin);\n const emptyIcon = !image ? <PicturesIcon className={style.emptyIcon}
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionCoorpacademyPictures","PicturesIcon","Provider","style","CardImagePreview","image","skin","whiteColor","emptyIcon","color","backgroundImage","contextTypes","childContextTypes","propTypes","string"],"sources":["../../../src/atom/card-image-preview/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get} from 'lodash/fp';\nimport {NovaCompositionCoorpacademyPictures as PicturesIcon} from '@coorpacademy/nova-icons';\nimport Provider from '../provider';\n\nimport style from './style.css';\n\nconst CardImagePreview = ({image}, {skin}) => {\n const whiteColor = get('common.white', skin);\n const emptyIcon = !image ? (\n <PicturesIcon className={style.emptyIcon} style={{color: whiteColor}} />\n ) : null;\n\n return (\n <div\n className={style.image}\n style={{\n backgroundImage: image ? `url('${image}')` : 'none'\n }}\n data-name=\"card-image-preview\"\n >\n {emptyIcon}\n </div>\n );\n};\n\nCardImagePreview.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nCardImagePreview.propTypes = {\n image: PropTypes.string\n};\nexport default CardImagePreview;\n"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAAQC,mCAAmC,IAAIC,YAA/C,QAAkE,0BAAlE;AACA,OAAOC,QAAP,MAAqB,aAArB;AAEA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,gBAAgB,GAAG,CAAC;EAACC;AAAD,CAAD,EAAU;EAACC;AAAD,CAAV,KAAqB;EAC5C,MAAMC,UAAU,GAAG,KAAI,cAAJ,EAAoBD,IAApB,CAAnB;;EACA,MAAME,SAAS,GAAG,CAACH,KAAD,gBAChB,oBAAC,YAAD;IAAc,SAAS,EAAEF,KAAK,CAACK,SAA/B;IAA0C,KAAK,EAAE;MAACC,KAAK,EAAEF;IAAR;EAAjD,EADgB,GAEd,IAFJ;EAIA,oBACE;IACE,SAAS,EAAEJ,KAAK,CAACE,KADnB;IAEE,KAAK,EAAE;MACLK,eAAe,EAAEL,KAAK,GAAI,QAAOA,KAAM,IAAjB,GAAuB;IADxC,CAFT;IAKE,aAAU;EALZ,GAOGG,SAPH,CADF;AAWD,CAjBD;;AAmBAJ,gBAAgB,CAACO,YAAjB,GAAgC;EAC9BL,IAAI,EAAEJ,QAAQ,CAACU,iBAAT,CAA2BN;AADH,CAAhC;AAIAF,gBAAgB,CAACS,SAAjB,2CAA6B;EAC3BR,KAAK,EAAEN,SAAS,CAACe;AADU,CAA7B;AAGA,eAAeV,gBAAf"}
|
|
@@ -11,26 +11,22 @@ const Icon = ({
|
|
|
11
11
|
switch (level) {
|
|
12
12
|
case 1:
|
|
13
13
|
return /*#__PURE__*/React.createElement(NovaCompositionCoorpacademyLevel1, {
|
|
14
|
-
className: style.icon
|
|
15
|
-
color: "#fff"
|
|
14
|
+
className: style.icon
|
|
16
15
|
});
|
|
17
16
|
|
|
18
17
|
case 2:
|
|
19
18
|
return /*#__PURE__*/React.createElement(NovaCompositionCoorpacademyLevel2, {
|
|
20
|
-
className: style.icon
|
|
21
|
-
color: "#fff"
|
|
19
|
+
className: style.icon
|
|
22
20
|
});
|
|
23
21
|
|
|
24
22
|
case 3:
|
|
25
23
|
return /*#__PURE__*/React.createElement(NovaCompositionCoorpacademyLevel3, {
|
|
26
|
-
className: style.icon
|
|
27
|
-
color: "#fff"
|
|
24
|
+
className: style.icon
|
|
28
25
|
});
|
|
29
26
|
|
|
30
27
|
default:
|
|
31
28
|
return /*#__PURE__*/React.createElement(NovaCompositionCoorpacademyLevel0, {
|
|
32
|
-
className: style.icon
|
|
33
|
-
color: "#fff"
|
|
29
|
+
className: style.icon
|
|
34
30
|
});
|
|
35
31
|
}
|
|
36
32
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","includes","NovaCompositionCoorpacademyLevel0","NovaCompositionCoorpacademyLevel1","NovaCompositionCoorpacademyLevel2","NovaCompositionCoorpacademyLevel3","style","Icon","level","icon","propTypes","oneOf","DifficultyLevel","children","inlineContainer","unknownContainer","easyContainer","normalContainer","hardContainer","text","string"],"sources":["../../../src/atom/difficulty-level/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport includes from 'lodash/fp/includes';\nimport {\n NovaCompositionCoorpacademyLevel0,\n NovaCompositionCoorpacademyLevel1,\n NovaCompositionCoorpacademyLevel2,\n NovaCompositionCoorpacademyLevel3\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst Icon = ({level = 0}) => {\n switch (level) {\n case 1:\n return <NovaCompositionCoorpacademyLevel1 className={style.icon}
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","includes","NovaCompositionCoorpacademyLevel0","NovaCompositionCoorpacademyLevel1","NovaCompositionCoorpacademyLevel2","NovaCompositionCoorpacademyLevel3","style","Icon","level","icon","propTypes","oneOf","DifficultyLevel","children","inlineContainer","unknownContainer","easyContainer","normalContainer","hardContainer","text","string"],"sources":["../../../src/atom/difficulty-level/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport includes from 'lodash/fp/includes';\nimport {\n NovaCompositionCoorpacademyLevel0,\n NovaCompositionCoorpacademyLevel1,\n NovaCompositionCoorpacademyLevel2,\n NovaCompositionCoorpacademyLevel3\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\n\nconst Icon = ({level = 0}) => {\n switch (level) {\n case 1:\n return <NovaCompositionCoorpacademyLevel1 className={style.icon} />;\n case 2:\n return <NovaCompositionCoorpacademyLevel2 className={style.icon} />;\n case 3:\n return <NovaCompositionCoorpacademyLevel3 className={style.icon} />;\n default:\n return <NovaCompositionCoorpacademyLevel0 className={style.icon} />;\n }\n};\n\nIcon.propTypes = {\n level: PropTypes.oneOf([1, 2, 3])\n};\n\nconst DifficultyLevel = ({level, children}) => (\n <div className={style.inlineContainer}>\n <div\n className={classnames({\n [style.unknownContainer]: !includes(level, [1, 2, 3]),\n [style.easyContainer]: level === 1,\n [style.normalContainer]: level === 2,\n [style.hardContainer]: level === 3\n })}\n >\n <Icon level={level} />\n <span className={style.text}>{children}</span>\n </div>\n </div>\n);\n\nDifficultyLevel.propTypes = {\n level: Icon.propTypes.level,\n children: PropTypes.string\n};\n\nexport default DifficultyLevel;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,QAAP,MAAqB,oBAArB;AACA,SACEC,iCADF,EAEEC,iCAFF,EAGEC,iCAHF,EAIEC,iCAJF,QAKO,0BALP;AAMA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,IAAI,GAAG,CAAC;EAACC,KAAK,GAAG;AAAT,CAAD,KAAiB;EAC5B,QAAQA,KAAR;IACE,KAAK,CAAL;MACE,oBAAO,oBAAC,iCAAD;QAAmC,SAAS,EAAEF,KAAK,CAACG;MAApD,EAAP;;IACF,KAAK,CAAL;MACE,oBAAO,oBAAC,iCAAD;QAAmC,SAAS,EAAEH,KAAK,CAACG;MAApD,EAAP;;IACF,KAAK,CAAL;MACE,oBAAO,oBAAC,iCAAD;QAAmC,SAAS,EAAEH,KAAK,CAACG;MAApD,EAAP;;IACF;MACE,oBAAO,oBAAC,iCAAD;QAAmC,SAAS,EAAEH,KAAK,CAACG;MAApD,EAAP;EARJ;AAUD,CAXD;;AAaAF,IAAI,CAACG,SAAL,2CAAiB;EACfF,KAAK,EAAET,SAAS,CAACY,KAAV,CAAgB,CAAC,CAAD,EAAI,CAAJ,EAAO,CAAP,CAAhB;AADQ,CAAjB;;AAIA,MAAMC,eAAe,GAAG,CAAC;EAACJ,KAAD;EAAQK;AAAR,CAAD,kBACtB;EAAK,SAAS,EAAEP,KAAK,CAACQ;AAAtB,gBACE;EACE,SAAS,EAAEd,UAAU,CAAC;IACpB,CAACM,KAAK,CAACS,gBAAP,GAA0B,CAACd,QAAQ,CAACO,KAAD,EAAQ,CAAC,CAAD,EAAI,CAAJ,EAAO,CAAP,CAAR,CADf;IAEpB,CAACF,KAAK,CAACU,aAAP,GAAuBR,KAAK,KAAK,CAFb;IAGpB,CAACF,KAAK,CAACW,eAAP,GAAyBT,KAAK,KAAK,CAHf;IAIpB,CAACF,KAAK,CAACY,aAAP,GAAuBV,KAAK,KAAK;EAJb,CAAD;AADvB,gBAQE,oBAAC,IAAD;EAAM,KAAK,EAAEA;AAAb,EARF,eASE;EAAM,SAAS,EAAEF,KAAK,CAACa;AAAvB,GAA8BN,QAA9B,CATF,CADF,CADF;;AAgBAD,eAAe,CAACF,SAAhB,2CAA4B;EAC1BF,KAAK,EAAED,IAAI,CAACG,SAAL,CAAeF,KADI;EAE1BK,QAAQ,EAAEd,SAAS,CAACqB;AAFM,CAA5B;AAKA,eAAeR,eAAf"}
|
|
@@ -69,10 +69,14 @@ class InputHtml extends React.Component {
|
|
|
69
69
|
} = this.state;
|
|
70
70
|
const className = error ? style.error : style.default;
|
|
71
71
|
const iconContent = !preview ? /*#__PURE__*/React.createElement(PreviewIcon, {
|
|
72
|
-
|
|
72
|
+
style: {
|
|
73
|
+
color: mediumColor
|
|
74
|
+
},
|
|
73
75
|
height: 16
|
|
74
76
|
}) : /*#__PURE__*/React.createElement(PencilIcon, {
|
|
75
|
-
|
|
77
|
+
style: {
|
|
78
|
+
color: mediumColor
|
|
79
|
+
},
|
|
76
80
|
height: 16
|
|
77
81
|
});
|
|
78
82
|
return /*#__PURE__*/React.createElement("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","NovaLineBusinessCircleView","PreviewIcon","NovaLineContentEditionPencil2","PencilIcon","InputPreview","style","InputHtml","Component","getDerivedStateFromProps","props","state","value","text","preview","constructor","context","handleChange","bind","handlePreview","e","onChange","target","setState","preventDefault","render","skin","mediumColor","title","placeholder","error","description","disabled","className","default","iconContent","contentWrapper","input","toggle","propTypes","string","bool","func"],"sources":["../../../src/atom/input-html/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr, isUndefined} from 'lodash/fp';\nimport {\n NovaLineBusinessCircleView as PreviewIcon,\n NovaLineContentEditionPencil2 as PencilIcon\n} from '@coorpacademy/nova-icons';\nimport InputPreview from './input-preview';\nimport style from './style.css';\n\nclass InputHtml extends React.Component {\n static propTypes = {\n title: PropTypes.string,\n placeholder: PropTypes.string,\n disabled: PropTypes.bool,\n value: PropTypes.string,\n error: PropTypes.string,\n onChange: PropTypes.func,\n description: PropTypes.string\n };\n\n static getDerivedStateFromProps(props, state) {\n const {value} = props;\n\n if (isUndefined(value)) return null;\n\n return {\n text: value,\n preview: state.preview\n };\n }\n\n constructor(props, context) {\n super(props);\n this.state = {\n text: getOr('', 'value', props),\n preview: true\n };\n this.handleChange = this.handleChange.bind(this);\n this.handlePreview = this.handlePreview.bind(this);\n }\n\n handleChange(e) {\n const {onChange = noop} = this.props;\n const value = e.target.value;\n this.setState(state => ({\n text: value,\n preview: state.preview\n }));\n onChange(value);\n }\n\n handlePreview(e) {\n e.preventDefault();\n this.setState(state => ({\n text: state.text,\n preview: !state.preview\n }));\n }\n\n render() {\n const {skin} = this.context;\n const mediumColor = getOr('#999999', 'common.medium', skin);\n\n const {title, placeholder, error, description, disabled} = this.props;\n const {text, preview} = this.state;\n\n const className = error ? style.error : style.default;\n const iconContent = !preview ? (\n <PreviewIcon
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","NovaLineBusinessCircleView","PreviewIcon","NovaLineContentEditionPencil2","PencilIcon","InputPreview","style","InputHtml","Component","getDerivedStateFromProps","props","state","value","text","preview","constructor","context","handleChange","bind","handlePreview","e","onChange","target","setState","preventDefault","render","skin","mediumColor","title","placeholder","error","description","disabled","className","default","iconContent","color","contentWrapper","input","toggle","propTypes","string","bool","func"],"sources":["../../../src/atom/input-html/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr, isUndefined} from 'lodash/fp';\nimport {\n NovaLineBusinessCircleView as PreviewIcon,\n NovaLineContentEditionPencil2 as PencilIcon\n} from '@coorpacademy/nova-icons';\nimport InputPreview from './input-preview';\nimport style from './style.css';\n\nclass InputHtml extends React.Component {\n static propTypes = {\n title: PropTypes.string,\n placeholder: PropTypes.string,\n disabled: PropTypes.bool,\n value: PropTypes.string,\n error: PropTypes.string,\n onChange: PropTypes.func,\n description: PropTypes.string\n };\n\n static getDerivedStateFromProps(props, state) {\n const {value} = props;\n\n if (isUndefined(value)) return null;\n\n return {\n text: value,\n preview: state.preview\n };\n }\n\n constructor(props, context) {\n super(props);\n this.state = {\n text: getOr('', 'value', props),\n preview: true\n };\n this.handleChange = this.handleChange.bind(this);\n this.handlePreview = this.handlePreview.bind(this);\n }\n\n handleChange(e) {\n const {onChange = noop} = this.props;\n const value = e.target.value;\n this.setState(state => ({\n text: value,\n preview: state.preview\n }));\n onChange(value);\n }\n\n handlePreview(e) {\n e.preventDefault();\n this.setState(state => ({\n text: state.text,\n preview: !state.preview\n }));\n }\n\n render() {\n const {skin} = this.context;\n const mediumColor = getOr('#999999', 'common.medium', skin);\n\n const {title, placeholder, error, description, disabled} = this.props;\n const {text, preview} = this.state;\n\n const className = error ? style.error : style.default;\n const iconContent = !preview ? (\n <PreviewIcon style={{color: mediumColor}} height={16} />\n ) : (\n <PencilIcon style={{color: mediumColor}} height={16} />\n );\n return (\n <div className={className}>\n <label>\n <span className={style.title}>{`${title} `}</span>\n <div className={style.contentWrapper}>\n <InputPreview\n title={title}\n text={text}\n placeholder={placeholder}\n onChange={this.handleChange}\n disabled={disabled}\n preview={preview}\n className={style.input}\n />\n </div>\n <span className={style.toggle} onClick={this.handlePreview}>\n {iconContent}\n </span>\n </label>\n <div className={style.description}>{description}</div>\n </div>\n );\n }\n}\nexport default InputHtml;\n"],"mappings":";;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SACEC,0BAA0B,IAAIC,WADhC,EAEEC,6BAA6B,IAAIC,UAFnC,QAGO,0BAHP;AAIA,OAAOC,YAAP,MAAyB,iBAAzB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,SAAN,SAAwBR,KAAK,CAACS,SAA9B,CAAwC;EAWP,OAAxBC,wBAAwB,CAACC,KAAD,EAAQC,KAAR,EAAe;IAC5C,MAAM;MAACC;IAAD,IAAUF,KAAhB;IAEA,IAAI,aAAYE,KAAZ,CAAJ,EAAwB,OAAO,IAAP;IAExB,OAAO;MACLC,IAAI,EAAED,KADD;MAELE,OAAO,EAAEH,KAAK,CAACG;IAFV,CAAP;EAID;;EAEDC,WAAW,CAACL,KAAD,EAAQM,OAAR,EAAiB;IAC1B,MAAMN,KAAN;IACA,KAAKC,KAAL,GAAa;MACXE,IAAI,EAAE,OAAM,EAAN,EAAU,OAAV,EAAmBH,KAAnB,CADK;MAEXI,OAAO,EAAE;IAFE,CAAb;IAIA,KAAKG,YAAL,GAAoB,KAAKA,YAAL,CAAkBC,IAAlB,CAAuB,IAAvB,CAApB;IACA,KAAKC,aAAL,GAAqB,KAAKA,aAAL,CAAmBD,IAAnB,CAAwB,IAAxB,CAArB;EACD;;EAEDD,YAAY,CAACG,CAAD,EAAI;IACd,MAAM;MAACC,QAAQ;IAAT,IAAoB,KAAKX,KAA/B;IACA,MAAME,KAAK,GAAGQ,CAAC,CAACE,MAAF,CAASV,KAAvB;IACA,KAAKW,QAAL,CAAcZ,KAAK,KAAK;MACtBE,IAAI,EAAED,KADgB;MAEtBE,OAAO,EAAEH,KAAK,CAACG;IAFO,CAAL,CAAnB;IAIAO,QAAQ,CAACT,KAAD,CAAR;EACD;;EAEDO,aAAa,CAACC,CAAD,EAAI;IACfA,CAAC,CAACI,cAAF;IACA,KAAKD,QAAL,CAAcZ,KAAK,KAAK;MACtBE,IAAI,EAAEF,KAAK,CAACE,IADU;MAEtBC,OAAO,EAAE,CAACH,KAAK,CAACG;IAFM,CAAL,CAAnB;EAID;;EAEDW,MAAM,GAAG;IACP,MAAM;MAACC;IAAD,IAAS,KAAKV,OAApB;;IACA,MAAMW,WAAW,GAAG,OAAM,SAAN,EAAiB,eAAjB,EAAkCD,IAAlC,CAApB;;IAEA,MAAM;MAACE,KAAD;MAAQC,WAAR;MAAqBC,KAArB;MAA4BC,WAA5B;MAAyCC;IAAzC,IAAqD,KAAKtB,KAAhE;IACA,MAAM;MAACG,IAAD;MAAOC;IAAP,IAAkB,KAAKH,KAA7B;IAEA,MAAMsB,SAAS,GAAGH,KAAK,GAAGxB,KAAK,CAACwB,KAAT,GAAiBxB,KAAK,CAAC4B,OAA9C;IACA,MAAMC,WAAW,GAAG,CAACrB,OAAD,gBAClB,oBAAC,WAAD;MAAa,KAAK,EAAE;QAACsB,KAAK,EAAET;MAAR,CAApB;MAA0C,MAAM,EAAE;IAAlD,EADkB,gBAGlB,oBAAC,UAAD;MAAY,KAAK,EAAE;QAACS,KAAK,EAAET;MAAR,CAAnB;MAAyC,MAAM,EAAE;IAAjD,EAHF;IAKA,oBACE;MAAK,SAAS,EAAEM;IAAhB,gBACE,gDACE;MAAM,SAAS,EAAE3B,KAAK,CAACsB;IAAvB,GAAgC,GAAEA,KAAM,GAAxC,CADF,eAEE;MAAK,SAAS,EAAEtB,KAAK,CAAC+B;IAAtB,gBACE,oBAAC,YAAD;MACE,KAAK,EAAET,KADT;MAEE,IAAI,EAAEf,IAFR;MAGE,WAAW,EAAEgB,WAHf;MAIE,QAAQ,EAAE,KAAKZ,YAJjB;MAKE,QAAQ,EAAEe,QALZ;MAME,OAAO,EAAElB,OANX;MAOE,SAAS,EAAER,KAAK,CAACgC;IAPnB,EADF,CAFF,eAaE;MAAM,SAAS,EAAEhC,KAAK,CAACiC,MAAvB;MAA+B,OAAO,EAAE,KAAKpB;IAA7C,GACGgB,WADH,CAbF,CADF,eAkBE;MAAK,SAAS,EAAE7B,KAAK,CAACyB;IAAtB,GAAoCA,WAApC,CAlBF,CADF;EAsBD;;AArFqC;;AAAlCxB,S,CACGiC,S,2CAAY;EACjBZ,KAAK,EAAE5B,SAAS,CAACyC,MADA;EAEjBZ,WAAW,EAAE7B,SAAS,CAACyC,MAFN;EAGjBT,QAAQ,EAAEhC,SAAS,CAAC0C,IAHH;EAIjB9B,KAAK,EAAEZ,SAAS,CAACyC,MAJA;EAKjBX,KAAK,EAAE9B,SAAS,CAACyC,MALA;EAMjBpB,QAAQ,EAAErB,SAAS,CAAC2C,IANH;EAOjBZ,WAAW,EAAE/B,SAAS,CAACyC;AAPN,C;AAsFrB,eAAelC,SAAf"}
|
package/es/atom/life/index.js
CHANGED
|
@@ -76,13 +76,19 @@ const Life = (props, context) => {
|
|
|
76
76
|
style: heartCustomStyle
|
|
77
77
|
}, /*#__PURE__*/React.createElement(HeartIconOutline, {
|
|
78
78
|
className: cssStyle.heartOutline,
|
|
79
|
-
|
|
79
|
+
style: {
|
|
80
|
+
color: white
|
|
81
|
+
}
|
|
80
82
|
}), /*#__PURE__*/React.createElement(HeartIcon, {
|
|
81
83
|
className: pickStyle(cssStyle.heartNormalDefault, cssStyle.heartNormalFailed, cssStyle.heartNormalAnimatedFailed, cssStyle.heartNormalRevival),
|
|
82
|
-
|
|
84
|
+
style: {
|
|
85
|
+
color: negativeColor
|
|
86
|
+
}
|
|
83
87
|
}), /*#__PURE__*/React.createElement(HeartBrokenIcon, {
|
|
84
88
|
className: pickStyle(cssStyle.heartBrokenDefault, cssStyle.heartBrokenFailed, cssStyle.heartBrokenAnimatedFailed, cssStyle.heartBrokenRevival),
|
|
85
|
-
|
|
89
|
+
style: {
|
|
90
|
+
color: negativeColor
|
|
91
|
+
}
|
|
86
92
|
})));
|
|
87
93
|
};
|
|
88
94
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","NovaSolidVoteRewardsVoteHeart","HeartIcon","NovaCompositionCoorpacademyBrokenHeart","HeartBrokenIcon","NovaCompositionCoorpacademyVoteHeartOutline","HeartIconOutline","Provider","cssStyle","MODES","default","small","BOUNCES","bounce","bounceTwice","bounceAndPause","Life","props","context","skin","heartOnRight","animated","count","failed","mode","operator","revival","className","style","customStyle","negativeColor","white","pickStyle","successStyle","failedStyle","animatedFailedStyle","revivalStyle","heartWrapper","heartWrapperFailed","heartWrapperDefault","bounceClass","type","heartCustomStyle","animationDelay","delay","animationDuration","duration","left","countStyle","livesCounterFailed","livesCounterDefault","livesCounterWrapper","previousLivesCounterDefault","previousLivesCounterFailed","previousLivesRevival","operatorWrapper","heartOutline","heartNormalDefault","heartNormalFailed","heartNormalAnimatedFailed","heartNormalRevival","heartBrokenDefault","heartBrokenFailed","heartBrokenAnimatedFailed","heartBrokenRevival","contextTypes","childContextTypes","propTypes","bool","shape","oneOf","string","number"],"sources":["../../../src/atom/life/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {get, keys} from 'lodash/fp';\nimport {\n NovaSolidVoteRewardsVoteHeart as HeartIcon,\n NovaCompositionCoorpacademyBrokenHeart as HeartBrokenIcon,\n NovaCompositionCoorpacademyVoteHeartOutline as HeartIconOutline\n} from '@coorpacademy/nova-icons';\nimport Provider from '../provider';\nimport cssStyle from './style.css';\n\nconst MODES = {\n default: cssStyle.default,\n small: cssStyle.small\n};\n\nconst BOUNCES = {\n bounce: cssStyle.bounce,\n bounceTwice: cssStyle.bounceTwice,\n bounceAndPause: cssStyle.bounceAndPause\n};\n\nconst Life = (props, context) => {\n const {skin} = context;\n const {\n bounce = null,\n heartOnRight = false,\n animated = false,\n count = 3,\n failed = false,\n mode = 'default',\n operator = 'x',\n revival,\n className,\n style: customStyle\n } = props;\n const negativeColor = get('common.negative', skin);\n const white = get('common.white', skin);\n\n if (count === null) {\n return null;\n }\n\n const pickStyle = (successStyle, failedStyle, animatedFailedStyle, revivalStyle) => {\n if (revival) return revivalStyle;\n if (failed && animated) return animatedFailedStyle;\n if (failed) return failedStyle;\n return successStyle;\n };\n\n const heartWrapper =\n failed && animated ? cssStyle.heartWrapperFailed : cssStyle.heartWrapperDefault;\n const bounceClass = bounce ? BOUNCES[bounce.type] : null;\n const heartCustomStyle = {\n animationDelay: bounce && bounce.delay,\n animationDuration: bounce && bounce.duration,\n left: heartOnRight && '70px'\n };\n\n const countStyle = failed ? cssStyle.livesCounterFailed : cssStyle.livesCounterDefault;\n\n return (\n <div data-name=\"life\" className={classnames(MODES[mode], className)} style={customStyle}>\n <div className={cssStyle.livesCounterWrapper}>\n <div\n className={pickStyle(\n cssStyle.previousLivesCounterDefault,\n cssStyle.previousLivesCounterDefault,\n cssStyle.previousLivesCounterFailed,\n cssStyle.previousLivesRevival\n )}\n >\n {count + 1}\n </div>\n <div data-name=\"counter\" className={countStyle}>\n {count}\n </div>\n </div>\n <div className={cssStyle.operatorWrapper}>\n <span className={cssStyle.operator}>{operator}</span>\n </div>\n <div className={classnames(heartWrapper, bounceClass)} style={heartCustomStyle}>\n <HeartIconOutline className={cssStyle.heartOutline}
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","NovaSolidVoteRewardsVoteHeart","HeartIcon","NovaCompositionCoorpacademyBrokenHeart","HeartBrokenIcon","NovaCompositionCoorpacademyVoteHeartOutline","HeartIconOutline","Provider","cssStyle","MODES","default","small","BOUNCES","bounce","bounceTwice","bounceAndPause","Life","props","context","skin","heartOnRight","animated","count","failed","mode","operator","revival","className","style","customStyle","negativeColor","white","pickStyle","successStyle","failedStyle","animatedFailedStyle","revivalStyle","heartWrapper","heartWrapperFailed","heartWrapperDefault","bounceClass","type","heartCustomStyle","animationDelay","delay","animationDuration","duration","left","countStyle","livesCounterFailed","livesCounterDefault","livesCounterWrapper","previousLivesCounterDefault","previousLivesCounterFailed","previousLivesRevival","operatorWrapper","heartOutline","color","heartNormalDefault","heartNormalFailed","heartNormalAnimatedFailed","heartNormalRevival","heartBrokenDefault","heartBrokenFailed","heartBrokenAnimatedFailed","heartBrokenRevival","contextTypes","childContextTypes","propTypes","bool","shape","oneOf","string","number"],"sources":["../../../src/atom/life/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {get, keys} from 'lodash/fp';\nimport {\n NovaSolidVoteRewardsVoteHeart as HeartIcon,\n NovaCompositionCoorpacademyBrokenHeart as HeartBrokenIcon,\n NovaCompositionCoorpacademyVoteHeartOutline as HeartIconOutline\n} from '@coorpacademy/nova-icons';\nimport Provider from '../provider';\nimport cssStyle from './style.css';\n\nconst MODES = {\n default: cssStyle.default,\n small: cssStyle.small\n};\n\nconst BOUNCES = {\n bounce: cssStyle.bounce,\n bounceTwice: cssStyle.bounceTwice,\n bounceAndPause: cssStyle.bounceAndPause\n};\n\nconst Life = (props, context) => {\n const {skin} = context;\n const {\n bounce = null,\n heartOnRight = false,\n animated = false,\n count = 3,\n failed = false,\n mode = 'default',\n operator = 'x',\n revival,\n className,\n style: customStyle\n } = props;\n const negativeColor = get('common.negative', skin);\n const white = get('common.white', skin);\n\n if (count === null) {\n return null;\n }\n\n const pickStyle = (successStyle, failedStyle, animatedFailedStyle, revivalStyle) => {\n if (revival) return revivalStyle;\n if (failed && animated) return animatedFailedStyle;\n if (failed) return failedStyle;\n return successStyle;\n };\n\n const heartWrapper =\n failed && animated ? cssStyle.heartWrapperFailed : cssStyle.heartWrapperDefault;\n const bounceClass = bounce ? BOUNCES[bounce.type] : null;\n const heartCustomStyle = {\n animationDelay: bounce && bounce.delay,\n animationDuration: bounce && bounce.duration,\n left: heartOnRight && '70px'\n };\n\n const countStyle = failed ? cssStyle.livesCounterFailed : cssStyle.livesCounterDefault;\n\n return (\n <div data-name=\"life\" className={classnames(MODES[mode], className)} style={customStyle}>\n <div className={cssStyle.livesCounterWrapper}>\n <div\n className={pickStyle(\n cssStyle.previousLivesCounterDefault,\n cssStyle.previousLivesCounterDefault,\n cssStyle.previousLivesCounterFailed,\n cssStyle.previousLivesRevival\n )}\n >\n {count + 1}\n </div>\n <div data-name=\"counter\" className={countStyle}>\n {count}\n </div>\n </div>\n <div className={cssStyle.operatorWrapper}>\n <span className={cssStyle.operator}>{operator}</span>\n </div>\n <div className={classnames(heartWrapper, bounceClass)} style={heartCustomStyle}>\n <HeartIconOutline className={cssStyle.heartOutline} style={{color: white}} />\n <HeartIcon\n className={pickStyle(\n cssStyle.heartNormalDefault,\n cssStyle.heartNormalFailed,\n cssStyle.heartNormalAnimatedFailed,\n cssStyle.heartNormalRevival\n )}\n style={{color: negativeColor}}\n />\n <HeartBrokenIcon\n className={pickStyle(\n cssStyle.heartBrokenDefault,\n cssStyle.heartBrokenFailed,\n cssStyle.heartBrokenAnimatedFailed,\n cssStyle.heartBrokenRevival\n )}\n style={{color: negativeColor}}\n />\n </div>\n </div>\n );\n};\n\nLife.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nLife.propTypes = {\n revival: PropTypes.bool,\n animated: PropTypes.bool,\n bounce: PropTypes.shape({\n type: PropTypes.oneOf(['bounce', 'bounceTwice', 'bounceAndPause']),\n delay: PropTypes.string\n }),\n heartOnRight: PropTypes.bool,\n mode: PropTypes.oneOf(keys(MODES)),\n count: PropTypes.number,\n failed: PropTypes.bool,\n className: PropTypes.string,\n operator: PropTypes.string,\n style: PropTypes.shape({})\n};\n\nexport default Life;\n"],"mappings":"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"}
|
|
@@ -55,7 +55,9 @@ const ResourceMiniature = (props, context) => {
|
|
|
55
55
|
backgroundImage: `url(${poster})`
|
|
56
56
|
}
|
|
57
57
|
}), !selected ? /*#__PURE__*/React.createElement(Icon, {
|
|
58
|
-
|
|
58
|
+
style: {
|
|
59
|
+
color: white
|
|
60
|
+
},
|
|
59
61
|
className: style.icon
|
|
60
62
|
}) : null), /*#__PURE__*/React.createElement("div", {
|
|
61
63
|
className: classnames(descriptionClassName, style.innerHTML) // eslint-disable-next-line react/no-danger
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","NovaSolidAudioAudioControlPlay","PlayIcon","NovaLineFilesOfficeFileOfficePdf","PDFIcon","NovaCompositionCoorpacademyMicrophone","PodcastIcon","classnames","Provider","style","TYPES","pdf","icon","audio","video","ResourceMiniature","props","context","skin","type","description","poster","onClick","handleOnClick","selected","descriptionClassName","selectedDescription","white","primary","posterOutlineColor","Icon","posterWrapper","borderColor","backgroundImage","innerHTML","__html","propTypes","oneOf","bool","string","func","contextTypes","childContextTypes"],"sources":["../../../src/atom/resource-miniature/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get, keys} from 'lodash/fp';\nimport {\n NovaSolidAudioAudioControlPlay as PlayIcon,\n NovaLineFilesOfficeFileOfficePdf as PDFIcon,\n NovaCompositionCoorpacademyMicrophone as PodcastIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport Provider from '../provider';\nimport style from './style.css';\n\nconst TYPES = {\n pdf: {style: style.pdf, icon: PDFIcon},\n audio: {style: style.audio, icon: PodcastIcon},\n video: {style: style.video, icon: PlayIcon}\n};\n\nconst ResourceMiniature = (props, context) => {\n const {skin} = context;\n const {type, description, poster, onClick: handleOnClick, selected = false} = props;\n const descriptionClassName = selected ? style.selectedDescription : style.description;\n const white = get('common.white', skin);\n const primary = get('common.primary', skin);\n const posterOutlineColor = selected ? primary : white;\n const Icon = TYPES[type].icon;\n return (\n <div className={TYPES[type].style} onClick={handleOnClick} data-type={type}>\n <div className={style.posterWrapper} style={{borderColor: posterOutlineColor}}>\n <div className={style.poster} style={{backgroundImage: `url(${poster})`}} />\n {!selected ? <Icon
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","NovaSolidAudioAudioControlPlay","PlayIcon","NovaLineFilesOfficeFileOfficePdf","PDFIcon","NovaCompositionCoorpacademyMicrophone","PodcastIcon","classnames","Provider","style","TYPES","pdf","icon","audio","video","ResourceMiniature","props","context","skin","type","description","poster","onClick","handleOnClick","selected","descriptionClassName","selectedDescription","white","primary","posterOutlineColor","Icon","posterWrapper","borderColor","backgroundImage","color","innerHTML","__html","propTypes","oneOf","bool","string","func","contextTypes","childContextTypes"],"sources":["../../../src/atom/resource-miniature/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {get, keys} from 'lodash/fp';\nimport {\n NovaSolidAudioAudioControlPlay as PlayIcon,\n NovaLineFilesOfficeFileOfficePdf as PDFIcon,\n NovaCompositionCoorpacademyMicrophone as PodcastIcon\n} from '@coorpacademy/nova-icons';\nimport classnames from 'classnames';\nimport Provider from '../provider';\nimport style from './style.css';\n\nconst TYPES = {\n pdf: {style: style.pdf, icon: PDFIcon},\n audio: {style: style.audio, icon: PodcastIcon},\n video: {style: style.video, icon: PlayIcon}\n};\n\nconst ResourceMiniature = (props, context) => {\n const {skin} = context;\n const {type, description, poster, onClick: handleOnClick, selected = false} = props;\n const descriptionClassName = selected ? style.selectedDescription : style.description;\n const white = get('common.white', skin);\n const primary = get('common.primary', skin);\n const posterOutlineColor = selected ? primary : white;\n const Icon = TYPES[type].icon;\n return (\n <div className={TYPES[type].style} onClick={handleOnClick} data-type={type}>\n <div className={style.posterWrapper} style={{borderColor: posterOutlineColor}}>\n <div className={style.poster} style={{backgroundImage: `url(${poster})`}} />\n {!selected ? <Icon style={{color: white}} className={style.icon} /> : null}\n </div>\n <div\n className={classnames(descriptionClassName, style.innerHTML)}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: description}}\n />\n </div>\n );\n};\n\nResourceMiniature.propTypes = {\n type: PropTypes.oneOf(keys(TYPES)),\n selected: PropTypes.bool,\n description: PropTypes.string,\n poster: PropTypes.string,\n onClick: PropTypes.func\n};\n\nResourceMiniature.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nexport default ResourceMiniature;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SACEC,8BAA8B,IAAIC,QADpC,EAEEC,gCAAgC,IAAIC,OAFtC,EAGEC,qCAAqC,IAAIC,WAH3C,QAIO,0BAJP;AAKA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,QAAP,MAAqB,aAArB;AACA,OAAOC,KAAP,MAAkB,aAAlB;AAEA,MAAMC,KAAK,GAAG;EACZC,GAAG,EAAE;IAACF,KAAK,EAAEA,KAAK,CAACE,GAAd;IAAmBC,IAAI,EAAER;EAAzB,CADO;EAEZS,KAAK,EAAE;IAACJ,KAAK,EAAEA,KAAK,CAACI,KAAd;IAAqBD,IAAI,EAAEN;EAA3B,CAFK;EAGZQ,KAAK,EAAE;IAACL,KAAK,EAAEA,KAAK,CAACK,KAAd;IAAqBF,IAAI,EAAEV;EAA3B;AAHK,CAAd;;AAMA,MAAMa,iBAAiB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EAC5C,MAAM;IAACC;EAAD,IAASD,OAAf;EACA,MAAM;IAACE,IAAD;IAAOC,WAAP;IAAoBC,MAApB;IAA4BC,OAAO,EAAEC,aAArC;IAAoDC,QAAQ,GAAG;EAA/D,IAAwER,KAA9E;EACA,MAAMS,oBAAoB,GAAGD,QAAQ,GAAGf,KAAK,CAACiB,mBAAT,GAA+BjB,KAAK,CAACW,WAA1E;;EACA,MAAMO,KAAK,GAAG,KAAI,cAAJ,EAAoBT,IAApB,CAAd;;EACA,MAAMU,OAAO,GAAG,KAAI,gBAAJ,EAAsBV,IAAtB,CAAhB;;EACA,MAAMW,kBAAkB,GAAGL,QAAQ,GAAGI,OAAH,GAAaD,KAAhD;EACA,MAAMG,IAAI,GAAGpB,KAAK,CAACS,IAAD,CAAL,CAAYP,IAAzB;EACA,oBACE;IAAK,SAAS,EAAEF,KAAK,CAACS,IAAD,CAAL,CAAYV,KAA5B;IAAmC,OAAO,EAAEc,aAA5C;IAA2D,aAAWJ;EAAtE,gBACE;IAAK,SAAS,EAAEV,KAAK,CAACsB,aAAtB;IAAqC,KAAK,EAAE;MAACC,WAAW,EAAEH;IAAd;EAA5C,gBACE;IAAK,SAAS,EAAEpB,KAAK,CAACY,MAAtB;IAA8B,KAAK,EAAE;MAACY,eAAe,EAAG,OAAMZ,MAAO;IAAhC;EAArC,EADF,EAEG,CAACG,QAAD,gBAAY,oBAAC,IAAD;IAAM,KAAK,EAAE;MAACU,KAAK,EAAEP;IAAR,CAAb;IAA6B,SAAS,EAAElB,KAAK,CAACG;EAA9C,EAAZ,GAAqE,IAFxE,CADF,eAKE;IACE,SAAS,EAAEL,UAAU,CAACkB,oBAAD,EAAuBhB,KAAK,CAAC0B,SAA7B,CADvB,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACC,MAAM,EAAEhB;IAAT;EAH3B,EALF,CADF;AAaD,CArBD;;AAuBAL,iBAAiB,CAACsB,SAAlB,2CAA8B;EAC5BlB,IAAI,EAAEnB,SAAS,CAACsC,KAAV,CAAgB,MAAK5B,KAAL,CAAhB,CADsB;EAE5Bc,QAAQ,EAAExB,SAAS,CAACuC,IAFQ;EAG5BnB,WAAW,EAAEpB,SAAS,CAACwC,MAHK;EAI5BnB,MAAM,EAAErB,SAAS,CAACwC,MAJU;EAK5BlB,OAAO,EAAEtB,SAAS,CAACyC;AALS,CAA9B;AAQA1B,iBAAiB,CAAC2B,YAAlB,GAAiC;EAC/BxB,IAAI,EAAEV,QAAQ,CAACmC,iBAAT,CAA2BzB;AADF,CAAjC;AAIA,eAAeH,iBAAf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/review-presentation/index.js"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/review-presentation/index.js"],"names":[],"mappings":";AAyGA,6DA+BC"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
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); }
|
|
2
|
+
|
|
3
|
+
import React, { useState, useCallback } from 'react';
|
|
2
4
|
import PropTypes from 'prop-types';
|
|
3
5
|
import getOr from 'lodash/fp/getOr';
|
|
4
6
|
import map from 'lodash/fp/map';
|
|
5
|
-
import { NovaSolidStatusCheckCircle2 as CheckIcon, NovaSolidVoteRewardsVoteHeart as HeartIcon, NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon, NovaLineSelectionCursorsCursorArrowTarget as TargetIcon } from '@coorpacademy/nova-icons';
|
|
6
|
-
import ToolTip from '../tooltip';
|
|
7
|
+
import { NovaSolidStatusCheckCircle2 as CheckIcon, NovaSolidVoteRewardsVoteHeart as HeartIcon, NovaCompositionCoorpacademyInformationIcon as InformationIcon, NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon, NovaLineSelectionCursorsCursorArrowTarget as TargetIcon } from '@coorpacademy/nova-icons';
|
|
7
8
|
import style from './style.css';
|
|
8
9
|
import propTypes from './prop-types';
|
|
9
10
|
const ICONS = {
|
|
@@ -30,6 +31,50 @@ const ReviewIcon = ({
|
|
|
30
31
|
});
|
|
31
32
|
};
|
|
32
33
|
|
|
34
|
+
const ToolTip = ({
|
|
35
|
+
tooltipText,
|
|
36
|
+
'aria-label': moreDetailsAriaLabel,
|
|
37
|
+
'data-testid': dataTestId,
|
|
38
|
+
closeToolTipInformationTextAriaLabel
|
|
39
|
+
}) => {
|
|
40
|
+
const [toolTipIsVisible, setToolTipIsVisible] = useState(false);
|
|
41
|
+
const handleKeyPress = useCallback(event => {
|
|
42
|
+
if (event.key === 'Enter') {
|
|
43
|
+
setToolTipIsVisible(!toolTipIsVisible);
|
|
44
|
+
} else if (event.key === 'Tab' || event.key === 'Escape') {
|
|
45
|
+
setToolTipIsVisible(false);
|
|
46
|
+
}
|
|
47
|
+
}, [setToolTipIsVisible, toolTipIsVisible]);
|
|
48
|
+
const handleMouseOver = useCallback(() => {
|
|
49
|
+
setToolTipIsVisible(true);
|
|
50
|
+
}, [setToolTipIsVisible]);
|
|
51
|
+
const handleMouseLeave = useCallback(() => {
|
|
52
|
+
setToolTipIsVisible(false);
|
|
53
|
+
}, [setToolTipIsVisible]);
|
|
54
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
55
|
+
className: style.tooltipContainer,
|
|
56
|
+
onMouseLeave: handleMouseLeave,
|
|
57
|
+
onMouseOver: handleMouseOver
|
|
58
|
+
}, /*#__PURE__*/React.createElement("button", {
|
|
59
|
+
type: "button",
|
|
60
|
+
className: style.tooltipIconContainer,
|
|
61
|
+
"data-testid": dataTestId,
|
|
62
|
+
onKeyDown: handleKeyPress,
|
|
63
|
+
tabIndex: 0
|
|
64
|
+
}, /*#__PURE__*/React.createElement(InformationIcon, {
|
|
65
|
+
className: style.informationIcon,
|
|
66
|
+
width: 12,
|
|
67
|
+
height: 12,
|
|
68
|
+
"aria-label": moreDetailsAriaLabel
|
|
69
|
+
})), toolTipIsVisible ? /*#__PURE__*/React.createElement("div", {
|
|
70
|
+
className: style.toolTip,
|
|
71
|
+
"data-testid": "review-presentation-tooltip",
|
|
72
|
+
"aria-label": closeToolTipInformationTextAriaLabel
|
|
73
|
+
}, /*#__PURE__*/React.createElement("p", {
|
|
74
|
+
className: style.tooltipText
|
|
75
|
+
}, tooltipText)) : null);
|
|
76
|
+
};
|
|
77
|
+
|
|
33
78
|
const ReviewListItemWrapper = ({
|
|
34
79
|
iconKey,
|
|
35
80
|
label
|
|
@@ -44,10 +89,10 @@ const ReviewListItemWrapper = ({
|
|
|
44
89
|
}, /*#__PURE__*/React.createElement(ReviewIcon, {
|
|
45
90
|
icon: iconKey
|
|
46
91
|
}), " ", label.text), /*#__PURE__*/React.createElement(ToolTip, {
|
|
47
|
-
|
|
92
|
+
tooltipText: label.tooltipText,
|
|
93
|
+
"aria-label": label.moreDetailsAriaLabel,
|
|
48
94
|
closeToolTipInformationTextAriaLabel: label.closeToolTipInformationTextAriaLabel,
|
|
49
|
-
"data-testid": `review-list-item-tooltip-button-${iconKey}
|
|
50
|
-
"aria-label": label.moreDetailsAriaLabel
|
|
95
|
+
"data-testid": `review-list-item-tooltip-button-${iconKey}`
|
|
51
96
|
}));
|
|
52
97
|
};
|
|
53
98
|
|
|
@@ -90,18 +135,23 @@ const ReviewPresentation = props => {
|
|
|
90
135
|
}, labelsList)));
|
|
91
136
|
};
|
|
92
137
|
|
|
138
|
+
ToolTip.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
139
|
+
tooltipText: PropTypes.string,
|
|
140
|
+
'aria-label': PropTypes.string,
|
|
141
|
+
'data-testid': PropTypes.string,
|
|
142
|
+
closeToolTipInformationTextAriaLabel: PropTypes.string
|
|
143
|
+
} : {};
|
|
93
144
|
ReviewIcon.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
94
145
|
icon: PropTypes.string
|
|
95
146
|
} : {};
|
|
96
|
-
ReviewListItemWrapper.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
147
|
+
ReviewListItemWrapper.propTypes = process.env.NODE_ENV !== "production" ? _extends({}, ToolTip.propTypes, {
|
|
97
148
|
iconKey: PropTypes.string,
|
|
98
149
|
label: PropTypes.shape({
|
|
99
|
-
tooltipText:
|
|
100
|
-
moreDetailsAriaLabel:
|
|
101
|
-
closeToolTipInformationTextAriaLabel:
|
|
102
|
-
text: PropTypes.string
|
|
150
|
+
tooltipText: PropTypes.string,
|
|
151
|
+
moreDetailsAriaLabel: PropTypes.string,
|
|
152
|
+
closeToolTipInformationTextAriaLabel: PropTypes.string
|
|
103
153
|
})
|
|
104
|
-
} : {};
|
|
154
|
+
}) : {};
|
|
105
155
|
ReviewPresentation.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
|
|
106
156
|
export default ReviewPresentation;
|
|
107
157
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","getOr","map","NovaSolidStatusCheckCircle2","CheckIcon","NovaSolidVoteRewardsVoteHeart","HeartIcon","NovaSolidInterfaceFeedbackInterfaceQuestionMark","QuestionIcon","NovaLineSelectionCursorsCursorArrowTarget","TargetIcon","
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","useState","useCallback","PropTypes","getOr","map","NovaSolidStatusCheckCircle2","CheckIcon","NovaSolidVoteRewardsVoteHeart","HeartIcon","NovaCompositionCoorpacademyInformationIcon","InformationIcon","NovaSolidInterfaceFeedbackInterfaceQuestionMark","QuestionIcon","NovaLineSelectionCursorsCursorArrowTarget","TargetIcon","style","propTypes","ICONS","skills","questions","lifes","allright","ReviewIcon","icon","Icon","labelIcon","ToolTip","tooltipText","moreDetailsAriaLabel","dataTestId","closeToolTipInformationTextAriaLabel","toolTipIsVisible","setToolTipIsVisible","handleKeyPress","event","key","handleMouseOver","handleMouseLeave","tooltipContainer","tooltipIconContainer","informationIcon","toolTip","ReviewListItemWrapper","iconKey","label","reviewListItemWrapper","reviewListText","text","ReviewPresentation","props","ariaLabel","reviewTitle","reviewText","labelsList","reviewWrapper","__html","reviewListWrapper","convert","cap","reviewList","string","shape"],"sources":["../../../src/atom/review-presentation/index.js"],"sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport getOr from 'lodash/fp/getOr';\nimport map from 'lodash/fp/map';\nimport {\n NovaSolidStatusCheckCircle2 as CheckIcon,\n NovaSolidVoteRewardsVoteHeart as HeartIcon,\n NovaCompositionCoorpacademyInformationIcon as InformationIcon,\n NovaSolidInterfaceFeedbackInterfaceQuestionMark as QuestionIcon,\n NovaLineSelectionCursorsCursorArrowTarget as TargetIcon\n} from '@coorpacademy/nova-icons';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst ICONS = {\n skills: TargetIcon,\n questions: QuestionIcon,\n lifes: HeartIcon,\n allright: CheckIcon\n};\n\nconst ReviewIcon = ({icon}) => {\n const Icon = getOr(null, icon, ICONS);\n\n /* istanbul ignore next */\n if (!Icon) {\n return <div className={style.labelIcon} />;\n }\n return <Icon className={style.labelIcon} />;\n};\n\nconst ToolTip = ({\n tooltipText,\n 'aria-label': moreDetailsAriaLabel,\n 'data-testid': dataTestId,\n closeToolTipInformationTextAriaLabel\n}) => {\n const [toolTipIsVisible, setToolTipIsVisible] = useState(false);\n const handleKeyPress = useCallback(\n event => {\n if (event.key === 'Enter') {\n setToolTipIsVisible(!toolTipIsVisible);\n } else if (event.key === 'Tab' || event.key === 'Escape') {\n setToolTipIsVisible(false);\n }\n },\n [setToolTipIsVisible, toolTipIsVisible]\n );\n const handleMouseOver = useCallback(() => {\n setToolTipIsVisible(true);\n }, [setToolTipIsVisible]);\n\n const handleMouseLeave = useCallback(() => {\n setToolTipIsVisible(false);\n }, [setToolTipIsVisible]);\n\n return (\n <div\n className={style.tooltipContainer}\n onMouseLeave={handleMouseLeave}\n onMouseOver={handleMouseOver}\n >\n <button\n type=\"button\"\n className={style.tooltipIconContainer}\n data-testid={dataTestId}\n onKeyDown={handleKeyPress}\n tabIndex={0}\n >\n <InformationIcon\n className={style.informationIcon}\n width={12}\n height={12}\n aria-label={moreDetailsAriaLabel}\n />\n </button>\n {toolTipIsVisible ? (\n <div\n className={style.toolTip}\n data-testid=\"review-presentation-tooltip\"\n aria-label={closeToolTipInformationTextAriaLabel}\n >\n <p className={style.tooltipText}>{tooltipText}</p>\n </div>\n ) : null}\n </div>\n );\n};\n\nconst ReviewListItemWrapper = ({iconKey, label}) => {\n return (\n <div className={style.reviewListItemWrapper} data-tip data-for=\"reviewListItem\" tabIndex={0}>\n <div className={style.reviewListText}>\n <ReviewIcon icon={iconKey} /> {label.text}\n </div>\n <ToolTip\n tooltipText={label.tooltipText}\n aria-label={label.moreDetailsAriaLabel}\n closeToolTipInformationTextAriaLabel={label.closeToolTipInformationTextAriaLabel}\n data-testid={`review-list-item-tooltip-button-${iconKey}`}\n />\n </div>\n );\n};\n\nconst ReviewPresentation = props => {\n const {'aria-label': ariaLabel, reviewTitle, reviewText, labelsList} = props;\n\n return (\n <div className={style.reviewWrapper} aria-label={ariaLabel}>\n <div\n className={style.reviewTitle}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: reviewTitle}}\n />\n <div\n className={style.reviewText}\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: reviewText}}\n />\n <ul className={style.reviewListWrapper}>\n {map.convert({cap: false})((label, key) => {\n return (\n <li key={`step-${key}`} className={style.reviewList}>\n <ReviewListItemWrapper\n iconKey={key}\n label={label}\n tooltipText={label.tooltipText}\n aria-label={label.moreDetailsAriaLabel}\n />\n </li>\n );\n }, labelsList)}\n </ul>\n </div>\n );\n};\n\nToolTip.propTypes = {\n tooltipText: PropTypes.string,\n 'aria-label': PropTypes.string,\n 'data-testid': PropTypes.string,\n closeToolTipInformationTextAriaLabel: PropTypes.string\n};\n\nReviewIcon.propTypes = {\n icon: PropTypes.string\n};\n\nReviewListItemWrapper.propTypes = {\n ...ToolTip.propTypes,\n iconKey: PropTypes.string,\n label: PropTypes.shape({\n tooltipText: PropTypes.string,\n moreDetailsAriaLabel: PropTypes.string,\n closeToolTipInformationTextAriaLabel: PropTypes.string\n })\n};\n\nReviewPresentation.propTypes = propTypes;\n\nexport default ReviewPresentation;\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,WAAzB,QAA2C,OAA3C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,KAAP,MAAkB,iBAAlB;AACA,OAAOC,GAAP,MAAgB,eAAhB;AACA,SACEC,2BAA2B,IAAIC,SADjC,EAEEC,6BAA6B,IAAIC,SAFnC,EAGEC,0CAA0C,IAAIC,eAHhD,EAIEC,+CAA+C,IAAIC,YAJrD,EAKEC,yCAAyC,IAAIC,UAL/C,QAMO,0BANP;AAOA,OAAOC,KAAP,MAAkB,aAAlB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AAEA,MAAMC,KAAK,GAAG;EACZC,MAAM,EAAEJ,UADI;EAEZK,SAAS,EAAEP,YAFC;EAGZQ,KAAK,EAAEZ,SAHK;EAIZa,QAAQ,EAAEf;AAJE,CAAd;;AAOA,MAAMgB,UAAU,GAAG,CAAC;EAACC;AAAD,CAAD,KAAY;EAC7B,MAAMC,IAAI,GAAGrB,KAAK,CAAC,IAAD,EAAOoB,IAAP,EAAaN,KAAb,CAAlB;EAEA;;EACA,IAAI,CAACO,IAAL,EAAW;IACT,oBAAO;MAAK,SAAS,EAAET,KAAK,CAACU;IAAtB,EAAP;EACD;;EACD,oBAAO,oBAAC,IAAD;IAAM,SAAS,EAAEV,KAAK,CAACU;EAAvB,EAAP;AACD,CARD;;AAUA,MAAMC,OAAO,GAAG,CAAC;EACfC,WADe;EAEf,cAAcC,oBAFC;EAGf,eAAeC,UAHA;EAIfC;AAJe,CAAD,KAKV;EACJ,MAAM,CAACC,gBAAD,EAAmBC,mBAAnB,IAA0ChC,QAAQ,CAAC,KAAD,CAAxD;EACA,MAAMiC,cAAc,GAAGhC,WAAW,CAChCiC,KAAK,IAAI;IACP,IAAIA,KAAK,CAACC,GAAN,KAAc,OAAlB,EAA2B;MACzBH,mBAAmB,CAAC,CAACD,gBAAF,CAAnB;IACD,CAFD,MAEO,IAAIG,KAAK,CAACC,GAAN,KAAc,KAAd,IAAuBD,KAAK,CAACC,GAAN,KAAc,QAAzC,EAAmD;MACxDH,mBAAmB,CAAC,KAAD,CAAnB;IACD;EACF,CAP+B,EAQhC,CAACA,mBAAD,EAAsBD,gBAAtB,CARgC,CAAlC;EAUA,MAAMK,eAAe,GAAGnC,WAAW,CAAC,MAAM;IACxC+B,mBAAmB,CAAC,IAAD,CAAnB;EACD,CAFkC,EAEhC,CAACA,mBAAD,CAFgC,CAAnC;EAIA,MAAMK,gBAAgB,GAAGpC,WAAW,CAAC,MAAM;IACzC+B,mBAAmB,CAAC,KAAD,CAAnB;EACD,CAFmC,EAEjC,CAACA,mBAAD,CAFiC,CAApC;EAIA,oBACE;IACE,SAAS,EAAEjB,KAAK,CAACuB,gBADnB;IAEE,YAAY,EAAED,gBAFhB;IAGE,WAAW,EAAED;EAHf,gBAKE;IACE,IAAI,EAAC,QADP;IAEE,SAAS,EAAErB,KAAK,CAACwB,oBAFnB;IAGE,eAAaV,UAHf;IAIE,SAAS,EAAEI,cAJb;IAKE,QAAQ,EAAE;EALZ,gBAOE,oBAAC,eAAD;IACE,SAAS,EAAElB,KAAK,CAACyB,eADnB;IAEE,KAAK,EAAE,EAFT;IAGE,MAAM,EAAE,EAHV;IAIE,cAAYZ;EAJd,EAPF,CALF,EAmBGG,gBAAgB,gBACf;IACE,SAAS,EAAEhB,KAAK,CAAC0B,OADnB;IAEE,eAAY,6BAFd;IAGE,cAAYX;EAHd,gBAKE;IAAG,SAAS,EAAEf,KAAK,CAACY;EAApB,GAAkCA,WAAlC,CALF,CADe,GAQb,IA3BN,CADF;AA+BD,CAxDD;;AA0DA,MAAMe,qBAAqB,GAAG,CAAC;EAACC,OAAD;EAAUC;AAAV,CAAD,KAAsB;EAClD,oBACE;IAAK,SAAS,EAAE7B,KAAK,CAAC8B,qBAAtB;IAA6C,gBAA7C;IAAsD,YAAS,gBAA/D;IAAgF,QAAQ,EAAE;EAA1F,gBACE;IAAK,SAAS,EAAE9B,KAAK,CAAC+B;EAAtB,gBACE,oBAAC,UAAD;IAAY,IAAI,EAAEH;EAAlB,EADF,OACiCC,KAAK,CAACG,IADvC,CADF,eAIE,oBAAC,OAAD;IACE,WAAW,EAAEH,KAAK,CAACjB,WADrB;IAEE,cAAYiB,KAAK,CAAChB,oBAFpB;IAGE,oCAAoC,EAAEgB,KAAK,CAACd,oCAH9C;IAIE,eAAc,mCAAkCa,OAAQ;EAJ1D,EAJF,CADF;AAaD,CAdD;;AAgBA,MAAMK,kBAAkB,GAAGC,KAAK,IAAI;EAClC,MAAM;IAAC,cAAcC,SAAf;IAA0BC,WAA1B;IAAuCC,UAAvC;IAAmDC;EAAnD,IAAiEJ,KAAvE;EAEA,oBACE;IAAK,SAAS,EAAElC,KAAK,CAACuC,aAAtB;IAAqC,cAAYJ;EAAjD,gBACE;IACE,SAAS,EAAEnC,KAAK,CAACoC,WADnB,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACI,MAAM,EAAEJ;IAAT;EAH3B,EADF,eAME;IACE,SAAS,EAAEpC,KAAK,CAACqC,UADnB,CAEE;IAFF;IAGE,uBAAuB,EAAE;MAACG,MAAM,EAAEH;IAAT;EAH3B,EANF,eAWE;IAAI,SAAS,EAAErC,KAAK,CAACyC;EAArB,GACGpD,GAAG,CAACqD,OAAJ,CAAY;IAACC,GAAG,EAAE;EAAN,CAAZ,EAA0B,CAACd,KAAD,EAAQT,GAAR,KAAgB;IACzC,oBACE;MAAI,GAAG,EAAG,QAAOA,GAAI,EAArB;MAAwB,SAAS,EAAEpB,KAAK,CAAC4C;IAAzC,gBACE,oBAAC,qBAAD;MACE,OAAO,EAAExB,GADX;MAEE,KAAK,EAAES,KAFT;MAGE,WAAW,EAAEA,KAAK,CAACjB,WAHrB;MAIE,cAAYiB,KAAK,CAAChB;IAJpB,EADF,CADF;EAUD,CAXA,EAWEyB,UAXF,CADH,CAXF,CADF;AA4BD,CA/BD;;AAiCA3B,OAAO,CAACV,SAAR,2CAAoB;EAClBW,WAAW,EAAEzB,SAAS,CAAC0D,MADL;EAElB,cAAc1D,SAAS,CAAC0D,MAFN;EAGlB,eAAe1D,SAAS,CAAC0D,MAHP;EAIlB9B,oCAAoC,EAAE5B,SAAS,CAAC0D;AAJ9B,CAApB;AAOAtC,UAAU,CAACN,SAAX,2CAAuB;EACrBO,IAAI,EAAErB,SAAS,CAAC0D;AADK,CAAvB;AAIAlB,qBAAqB,CAAC1B,SAAtB,wDACKU,OAAO,CAACV,SADb;EAEE2B,OAAO,EAAEzC,SAAS,CAAC0D,MAFrB;EAGEhB,KAAK,EAAE1C,SAAS,CAAC2D,KAAV,CAAgB;IACrBlC,WAAW,EAAEzB,SAAS,CAAC0D,MADF;IAErBhC,oBAAoB,EAAE1B,SAAS,CAAC0D,MAFX;IAGrB9B,oCAAoC,EAAE5B,SAAS,CAAC0D;EAH3B,CAAhB;AAHT;AAUAZ,kBAAkB,CAAChC,SAAnB,2CAA+BA,SAA/B;AAEA,eAAegC,kBAAf"}
|
|
@@ -3,14 +3,12 @@
|
|
|
3
3
|
@value mobile from breakpoints;
|
|
4
4
|
@value colors: "../../variables/colors.css";
|
|
5
5
|
@value xtraLightGrey from colors;
|
|
6
|
+
@value cm_blue_900 from colors;
|
|
6
7
|
@value cm_grey_75 from colors;
|
|
8
|
+
@value cm_grey_500 from colors;
|
|
9
|
+
@value cm_grey_700 from colors;
|
|
10
|
+
@value white from colors;
|
|
7
11
|
|
|
8
|
-
.reviewWrapper {
|
|
9
|
-
width: 100%;
|
|
10
|
-
border-radius: 16px;
|
|
11
|
-
background-color: xtraLightGrey;
|
|
12
|
-
padding-bottom: 40px;
|
|
13
|
-
}
|
|
14
12
|
|
|
15
13
|
.textBase {
|
|
16
14
|
font-family: "Gilroy";
|
|
@@ -19,6 +17,13 @@
|
|
|
19
17
|
user-select: none;
|
|
20
18
|
}
|
|
21
19
|
|
|
20
|
+
.reviewWrapper {
|
|
21
|
+
width: 100%;
|
|
22
|
+
border-radius: 16px;
|
|
23
|
+
background-color: xtraLightGrey;
|
|
24
|
+
padding-bottom: 40px;
|
|
25
|
+
}
|
|
26
|
+
|
|
22
27
|
.reviewTitle {
|
|
23
28
|
composes: textBase;
|
|
24
29
|
font-weight: 700;
|
|
@@ -72,6 +77,61 @@
|
|
|
72
77
|
width: 16px;
|
|
73
78
|
}
|
|
74
79
|
|
|
80
|
+
.informationIcon {
|
|
81
|
+
color: cm_grey_500;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.toolTip {
|
|
85
|
+
transition: opacity 0.8s;
|
|
86
|
+
position: absolute;
|
|
87
|
+
height: auto;
|
|
88
|
+
width: 200px;
|
|
89
|
+
border-radius: 7px;
|
|
90
|
+
background-color: cm_grey_700;
|
|
91
|
+
right: -81px;
|
|
92
|
+
bottom: 32px;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
.toolTip::before {
|
|
96
|
+
content: '';
|
|
97
|
+
display: inline-block;
|
|
98
|
+
visibility: inherit;
|
|
99
|
+
opacity: inherit;
|
|
100
|
+
width: 15px;
|
|
101
|
+
height: 15px;
|
|
102
|
+
transform: rotate(-45deg);
|
|
103
|
+
background-color: cm_grey_700;
|
|
104
|
+
position: inherit;
|
|
105
|
+
bottom: -5px;
|
|
106
|
+
right: 40%;
|
|
107
|
+
border-radius: 2px;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.tooltipText {
|
|
111
|
+
composes: textBase;
|
|
112
|
+
font-weight: 500;
|
|
113
|
+
font-size: 14px;
|
|
114
|
+
display: inline-block;
|
|
115
|
+
border-radius: 3px;
|
|
116
|
+
word-wrap: break-word;
|
|
117
|
+
color: white;
|
|
118
|
+
padding: 8px 14px;
|
|
119
|
+
text-align: center;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.tooltipContainer {
|
|
123
|
+
overflow: visible;
|
|
124
|
+
position: relative;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
.tooltipIconContainer {
|
|
128
|
+
display: flex;
|
|
129
|
+
justify-content: flex-end;
|
|
130
|
+
border: none;
|
|
131
|
+
background: cm_grey_75;
|
|
132
|
+
height: 25px;
|
|
133
|
+
}
|
|
134
|
+
|
|
75
135
|
@media tablet {
|
|
76
136
|
.reviewWrapper{
|
|
77
137
|
width: 100%;
|
|
@@ -82,4 +142,4 @@
|
|
|
82
142
|
.reviewWrapper{
|
|
83
143
|
width: 100%;
|
|
84
144
|
}
|
|
85
|
-
}
|
|
145
|
+
}
|
|
@@ -55,7 +55,9 @@ class Audio extends React.Component {
|
|
|
55
55
|
backgroundImage: `url(${poster})`
|
|
56
56
|
}
|
|
57
57
|
}, /*#__PURE__*/React.createElement(PodcastIcon, {
|
|
58
|
-
|
|
58
|
+
style: {
|
|
59
|
+
color: white
|
|
60
|
+
},
|
|
59
61
|
className: style.icon
|
|
60
62
|
}), description ? /*#__PURE__*/React.createElement("div", {
|
|
61
63
|
className: classnames(style.description, style.innerHTML),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","NovaCompositionCoorpacademyMicrophone","PodcastIcon","Provider","style","Audio","Component","constructor","props","context","setAudio","element","audioElement","handlePlay","bind","shouldComponentUpdate","nextProps","mediaUrl","componentDidUpdate","load","e","onPlay","render","description","poster","skin","white","frame","backgroundImage","icon","innerHTML","__html","audio","contextTypes","childContextTypes","propTypes","string","func"],"sources":["../../../src/molecule/audio/index.js"],"sourcesContent":["import React from 'react';\nimport {get} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {NovaCompositionCoorpacademyMicrophone as PodcastIcon} from '@coorpacademy/nova-icons';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nclass Audio extends React.Component {\n static propTypes = {\n description: PropTypes.string,\n mediaUrl: PropTypes.string,\n poster: PropTypes.string,\n onPlay: PropTypes.func\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin\n };\n\n constructor(props, context) {\n super(props, context);\n this.handlePlay = this.handlePlay.bind(this);\n this.audioElement = null;\n this.setAudio = this.setAudio.bind(this);\n }\n\n shouldComponentUpdate(nextProps) {\n const {mediaUrl} = this.props;\n return nextProps.mediaUrl !== mediaUrl;\n }\n\n componentDidUpdate() {\n this.audioElement.load();\n }\n\n setAudio = element => {\n this.audioElement = element;\n };\n\n handlePlay(e) {\n const {onPlay} = this.props;\n if (onPlay) onPlay(e);\n }\n\n render() {\n const {description, mediaUrl, poster} = this.props;\n const {skin} = this.context;\n\n const white = get('common.white', skin);\n return (\n <div className={style.frame} style={{backgroundImage: `url(${poster})`}}>\n <PodcastIcon
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","NovaCompositionCoorpacademyMicrophone","PodcastIcon","Provider","style","Audio","Component","constructor","props","context","setAudio","element","audioElement","handlePlay","bind","shouldComponentUpdate","nextProps","mediaUrl","componentDidUpdate","load","e","onPlay","render","description","poster","skin","white","frame","backgroundImage","color","icon","innerHTML","__html","audio","contextTypes","childContextTypes","propTypes","string","func"],"sources":["../../../src/molecule/audio/index.js"],"sourcesContent":["import React from 'react';\nimport {get} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {NovaCompositionCoorpacademyMicrophone as PodcastIcon} from '@coorpacademy/nova-icons';\nimport Provider from '../../atom/provider';\nimport style from './style.css';\n\nclass Audio extends React.Component {\n static propTypes = {\n description: PropTypes.string,\n mediaUrl: PropTypes.string,\n poster: PropTypes.string,\n onPlay: PropTypes.func\n };\n\n static contextTypes = {\n skin: Provider.childContextTypes.skin\n };\n\n constructor(props, context) {\n super(props, context);\n this.handlePlay = this.handlePlay.bind(this);\n this.audioElement = null;\n this.setAudio = this.setAudio.bind(this);\n }\n\n shouldComponentUpdate(nextProps) {\n const {mediaUrl} = this.props;\n return nextProps.mediaUrl !== mediaUrl;\n }\n\n componentDidUpdate() {\n this.audioElement.load();\n }\n\n setAudio = element => {\n this.audioElement = element;\n };\n\n handlePlay(e) {\n const {onPlay} = this.props;\n if (onPlay) onPlay(e);\n }\n\n render() {\n const {description, mediaUrl, poster} = this.props;\n const {skin} = this.context;\n\n const white = get('common.white', skin);\n return (\n <div className={style.frame} style={{backgroundImage: `url(${poster})`}}>\n <PodcastIcon style={{color: white}} className={style.icon} />\n {description ? (\n <div\n className={classnames(style.description, style.innerHTML)}\n data-name=\"audioDescription\"\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: description}}\n />\n ) : null}\n <audio\n className={style.audio}\n controls\n controlsList=\"nodownload\"\n ref={this.setAudio}\n autoPlay=\"\"\n onPlay={this.handlePlay}\n name=\"media\"\n data-name=\"audio\"\n preload=\"auto\"\n >\n <source src={mediaUrl} />\n </audio>\n </div>\n );\n }\n}\n\nexport default Audio;\n"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAAQC,qCAAqC,IAAIC,WAAjD,QAAmE,0BAAnE;AACA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,KAAN,SAAoBP,KAAK,CAACQ,SAA1B,CAAoC;EAYlCC,WAAW,CAACC,KAAD,EAAQC,OAAR,EAAiB;IAC1B,MAAMD,KAAN,EAAaC,OAAb;;IAD0B,KAgB5BC,QAhB4B,GAgBjBC,OAAO,IAAI;MACpB,KAAKC,YAAL,GAAoBD,OAApB;IACD,CAlB2B;;IAE1B,KAAKE,UAAL,GAAkB,KAAKA,UAAL,CAAgBC,IAAhB,CAAqB,IAArB,CAAlB;IACA,KAAKF,YAAL,GAAoB,IAApB;IACA,KAAKF,QAAL,GAAgB,KAAKA,QAAL,CAAcI,IAAd,CAAmB,IAAnB,CAAhB;EACD;;EAEDC,qBAAqB,CAACC,SAAD,EAAY;IAC/B,MAAM;MAACC;IAAD,IAAa,KAAKT,KAAxB;IACA,OAAOQ,SAAS,CAACC,QAAV,KAAuBA,QAA9B;EACD;;EAEDC,kBAAkB,GAAG;IACnB,KAAKN,YAAL,CAAkBO,IAAlB;EACD;;EAMDN,UAAU,CAACO,CAAD,EAAI;IACZ,MAAM;MAACC;IAAD,IAAW,KAAKb,KAAtB;IACA,IAAIa,MAAJ,EAAYA,MAAM,CAACD,CAAD,CAAN;EACb;;EAEDE,MAAM,GAAG;IACP,MAAM;MAACC,WAAD;MAAcN,QAAd;MAAwBO;IAAxB,IAAkC,KAAKhB,KAA7C;IACA,MAAM;MAACiB;IAAD,IAAS,KAAKhB,OAApB;;IAEA,MAAMiB,KAAK,GAAG,KAAI,cAAJ,EAAoBD,IAApB,CAAd;;IACA,oBACE;MAAK,SAAS,EAAErB,KAAK,CAACuB,KAAtB;MAA6B,KAAK,EAAE;QAACC,eAAe,EAAG,OAAMJ,MAAO;MAAhC;IAApC,gBACE,oBAAC,WAAD;MAAa,KAAK,EAAE;QAACK,KAAK,EAAEH;MAAR,CAApB;MAAoC,SAAS,EAAEtB,KAAK,CAAC0B;IAArD,EADF,EAEGP,WAAW,gBACV;MACE,SAAS,EAAEvB,UAAU,CAACI,KAAK,CAACmB,WAAP,EAAoBnB,KAAK,CAAC2B,SAA1B,CADvB;MAEE,aAAU,kBAFZ,CAGE;MAHF;MAIE,uBAAuB,EAAE;QAACC,MAAM,EAAET;MAAT;IAJ3B,EADU,GAOR,IATN,eAUE;MACE,SAAS,EAAEnB,KAAK,CAAC6B,KADnB;MAEE,QAAQ,MAFV;MAGE,YAAY,EAAC,YAHf;MAIE,GAAG,EAAE,KAAKvB,QAJZ;MAKE,QAAQ,EAAC,EALX;MAME,MAAM,EAAE,KAAKG,UANf;MAOE,IAAI,EAAC,OAPP;MAQE,aAAU,OARZ;MASE,OAAO,EAAC;IATV,gBAWE;MAAQ,GAAG,EAAEI;IAAb,EAXF,CAVF,CADF;EA0BD;;AApEiC;;AAA9BZ,K,CAQG6B,Y,GAAe;EACpBT,IAAI,EAAEtB,QAAQ,CAACgC,iBAAT,CAA2BV;AADb,C;AARlBpB,K,CACG+B,S,2CAAY;EACjBb,WAAW,EAAExB,SAAS,CAACsC,MADN;EAEjBpB,QAAQ,EAAElB,SAAS,CAACsC,MAFH;EAGjBb,MAAM,EAAEzB,SAAS,CAACsC,MAHD;EAIjBhB,MAAM,EAAEtB,SAAS,CAACuC;AAJD,C;AAsErB,eAAejC,KAAf"}
|