@coorpacademy/components 11.35.2-alpha.13 → 11.35.2-forcedeploy.13

package/es/molecule/cm-popin/types.d.ts

@@ -1,9 +1,10 @@
+/// <reference types="react" />
 import PropTypes from 'prop-types';
 import Link from '../../atom/link';
 import { TitleProps } from '../../atom/title/types';
 import CardsGrid from '../../organism/cards-grid';
 import ListItems from '../../organism/list-items';
-import { iconPropTypes } from '../../atom/icon';
+import { propTypes as iconPropTypes } from '../../atom/icon';
 declare const propTypes: {
     content: PropTypes.Requireable<string>;
     mode: PropTypes.Requireable<string>;
@@ -15,7 +16,7 @@ declare const propTypes: {
             'data-name': PropTypes.Requireable<string>;
             titleSize: PropTypes.Requireable<string>;
             subtitleSize: PropTypes.Requireable<string>;
-            icon: PropTypes.Requireable<PropTypes.InferProps<any>>;
+            icon: PropTypes.Requireable<PropTypes.InferProps<PropTypes.ValidationMap<any>>>;
             tag: PropTypes.Requireable<PropTypes.InferProps<{
                 label: PropTypes.Requireable<string>;
                 type: PropTypes.Requireable<string>;
@@ -23,7 +24,17 @@ declare const propTypes: {
                 customStyle: PropTypes.Requireable<{
                     [x: string]: NonNullable<string | number | null | undefined> | null | undefined;
                 }>;
-                icon: PropTypes.Requireable<PropTypes.InferProps<any>>;
+                icon: PropTypes.Requireable<PropTypes.InferProps<{
+                    position: PropTypes.Requireable<string>;
+                    iconName?: import("react").Validator<string> | undefined;
+                    iconColor?: import("react").Validator<string | null | undefined> | undefined;
+                    backgroundColor?: import("react").Validator<string | null | undefined> | undefined;
+                    gradientBackground?: import("react").Validator<boolean | null | undefined> | undefined;
+                    borderRadius?: import("react").Validator<string | null | undefined> | undefined;
+                    preset?: import("react").Validator<string | null | undefined> | undefined;
+                    size?: import("react").Validator<import("../../atom/icon").IconSize | null | undefined> | undefined;
+                    customStyle?: import("react").Validator<import("react").CSSProperties | null | undefined> | undefined;
+                }>>;
             }>>;
             button: PropTypes.Requireable<PropTypes.InferProps<{
                 type: PropTypes.Requireable<string>;
@@ -110,8 +121,8 @@ declare const propTypes: {
         borderRadius: PropTypes.Requireable<string>;
         preset: PropTypes.Requireable<string>;
         size: PropTypes.Requireable<PropTypes.InferProps<{
-            faSize: PropTypes.Requireable<number>;
-            wrapperSize: PropTypes.Requireable<number>;
+            faSize: PropTypes.Validator<number>;
+            wrapperSize: PropTypes.Validator<number>;
         }>>;
         customStyle: PropTypes.Requireable<{
             [x: string]: NonNullable<string | number | null | undefined> | null | undefined;
@@ -549,7 +560,7 @@ declare const propTypes: {
                 'data-name': PropTypes.Requireable<string>;
                 titleSize: PropTypes.Requireable<string>;
                 subtitleSize: PropTypes.Requireable<string>;
-                icon: PropTypes.Requireable<PropTypes.InferProps<any>>;
+                icon: PropTypes.Requireable<PropTypes.InferProps<PropTypes.ValidationMap<any>>>;
                 tag: PropTypes.Requireable<PropTypes.InferProps<{
                     label: PropTypes.Requireable<string>;
                     type: PropTypes.Requireable<string>;
@@ -557,7 +568,17 @@ declare const propTypes: {
                     customStyle: PropTypes.Requireable<{
                         [x: string]: NonNullable<string | number | null | undefined> | null | undefined;
                     }>;
-                    icon: PropTypes.Requireable<PropTypes.InferProps<any>>;
+                    icon: PropTypes.Requireable<PropTypes.InferProps<{
+                        position: PropTypes.Requireable<string>;
+                        iconName?: import("react").Validator<string> | undefined;
+                        iconColor?: import("react").Validator<string | null | undefined> | undefined;
+                        backgroundColor?: import("react").Validator<string | null | undefined> | undefined;
+                        gradientBackground?: import("react").Validator<boolean | null | undefined> | undefined;
+                        borderRadius?: import("react").Validator<string | null | undefined> | undefined;
+                        preset?: import("react").Validator<string | null | undefined> | undefined;
+                        size?: import("react").Validator<import("../../atom/icon").IconSize | null | undefined> | undefined;
+                        customStyle?: import("react").Validator<import("react").CSSProperties | null | undefined> | undefined;
+                    }>>;
                 }>>;
                 button: PropTypes.Requireable<PropTypes.InferProps<{
                     type: PropTypes.Requireable<string>;

package/es/molecule/cm-popin/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,IAAI,MAAM,iBAAiB,CAAC;AACnC,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAElD,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE9C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDd,CAAC;AAEF,aAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;IAC1D,IAAI,EAAE,OAAO,GAAG,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAC5D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,CAAC;IAC/B,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;QACzB,IAAI,EACA,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,GAChD,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;KACtD,CAAC;IACF,IAAI,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC;CACpD,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/cm-popin/types.ts"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,OAAO,IAAI,MAAM,iBAAiB,CAAC;AACnC,OAAO,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAClD,OAAO,SAAS,MAAM,2BAA2B,CAAC;AAElD,OAAO,EAAC,SAAS,IAAI,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAE3D,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDd,CAAC;AAEF,aAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,oBAAY,eAAe,GAAG;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE;QACZ,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,oBAAY,YAAY,GAAG;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;IAC1D,IAAI,EAAE,OAAO,GAAG,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAC5D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,eAAe,CAAC;IAC9B,YAAY,CAAC,EAAE,eAAe,CAAC;IAC/B,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,SAAS,GAAG,MAAM,CAAC;QACzB,IAAI,EACA,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,GAChD,SAAS,CAAC,UAAU,CAAC,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;KACtD,CAAC;IACF,IAAI,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC;CACpD,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/es/molecule/cm-popin/types.js

@@ -7,7 +7,7 @@ import Link from '../../atom/link';
 import CardsGrid from '../../organism/cards-grid';
 import ListItems from '../../organism/list-items';
 import { ICONS } from '../../util/button-icons';
-import { iconPropTypes } from '../../atom/icon';
+import { propTypes as iconPropTypes } from '../../atom/icon';
 const propTypes = {
   content: PropTypes.string,
   mode: PropTypes.oneOf(['alert', 'information', 'cookie', 'items', 'list']),

package/es/molecule/cm-popin/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["PropTypes","ButtonLink","InputSwitch","Title","Link","CardsGrid","ListItems","ICONS","iconPropTypes","propTypes","content","string","mode","oneOf","header","shape","title","headerIcon","backgroundImage","firstButton","label","handleOnclick","func","largeButton","bool","type","customStyle","secondButton","icon","position","_keys","thirdButton","onClose","oneOfType","backgroundImageUrl","descriptionText","cookieTitle","headerSubtitle","descriptionBtnTxt","listBtnSwicth","arrayOf","items","list","link"],"sources":["../../../src/molecule/cm-popin/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport ButtonLink from '../../atom/button-link';\nimport InputSwitch from '../../atom/input-switch';\nimport Title from '../../atom/title';\nimport Link from '../../atom/link';\nimport {TitleProps} from '../../atom/title/types';\nimport CardsGrid from '../../organism/cards-grid';\nimport ListItems from '../../organism/list-items';\nimport {ICONS} from '../../util/button-icons';\nimport {iconPropTypes} from '../../atom/icon';\n\nconst propTypes = {\n  content: PropTypes.string,\n  mode: PropTypes.oneOf(['alert', 'information', 'cookie', 'items', 'list']),\n  header: PropTypes.shape({\n    title: PropTypes.shape(Title.propTypes),\n    headerIcon: PropTypes.string,\n    backgroundImage: PropTypes.string\n  }),\n  firstButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary', 'tertiary']),\n    customStyle: ButtonLink.propTypes.customStyle\n  }),\n  secondButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    customStyle: ButtonLink.propTypes.customStyle,\n    icon: PropTypes.shape({\n      position: PropTypes.oneOf(['right', 'left']),\n      type: PropTypes.oneOf(keys(ICONS))\n    })\n  }),\n  thirdButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    customStyle: ButtonLink.propTypes.customStyle\n  }),\n  onClose: PropTypes.func,\n  icon: PropTypes.oneOfType([PropTypes.string, PropTypes.shape(iconPropTypes)]),\n  backgroundImageUrl: PropTypes.string,\n  descriptionText: PropTypes.string,\n  cookieTitle: PropTypes.string,\n  headerSubtitle: PropTypes.string,\n  descriptionBtnTxt: PropTypes.string,\n  listBtnSwicth: PropTypes.arrayOf(PropTypes.shape(InputSwitch.propTypes)),\n  items: PropTypes.shape({\n    type: PropTypes.oneOf(['content', 'list']),\n    list: PropTypes.oneOfType([\n      PropTypes.shape(CardsGrid.propTypes),\n      PropTypes.shape(ListItems.propTypes)\n    ])\n  }),\n  link: PropTypes.shape(Link.propTypes)\n};\n\ntype PopinHeaderProps = {\n  title: TitleProps;\n  backgroundImage: string;\n  headerIcon: string;\n};\n\nexport type QuitPopinButton = {\n  'aria-label'?: string;\n  label: string;\n  type: string;\n  customStyle?: {\n    backgroundColor?: string;\n    color?: string;\n  };\n  handleOnclick: () => void;\n};\n\nexport type CMPopinProps = {\n  content: string;\n  icon: string | PropTypes.InferProps<typeof iconPropTypes>;\n  mode: 'alert' | 'information' | 'cookie' | 'items' | 'list';\n  onClose?: () => void;\n  popinHeader?: PopinHeaderProps;\n  descriptionText: string;\n  firstButton?: QuitPopinButton;\n  secondButton?: QuitPopinButton;\n  items?: {\n    type: 'content' | 'list';\n    list:\n      | PropTypes.InferProps<typeof CardsGrid.propTypes>\n      | PropTypes.InferProps<typeof ListItems.propTypes>;\n  };\n  link?: PropTypes.InferProps<typeof Link.propTypes>;\n};\n\nexport default propTypes;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"types.js","names":["PropTypes","ButtonLink","InputSwitch","Title","Link","CardsGrid","ListItems","ICONS","propTypes","iconPropTypes","content","string","mode","oneOf","header","shape","title","headerIcon","backgroundImage","firstButton","label","handleOnclick","func","largeButton","bool","type","customStyle","secondButton","icon","position","_keys","thirdButton","onClose","oneOfType","backgroundImageUrl","descriptionText","cookieTitle","headerSubtitle","descriptionBtnTxt","listBtnSwicth","arrayOf","items","list","link"],"sources":["../../../src/molecule/cm-popin/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport {keys} from 'lodash/fp';\nimport ButtonLink from '../../atom/button-link';\nimport InputSwitch from '../../atom/input-switch';\nimport Title from '../../atom/title';\nimport Link from '../../atom/link';\nimport {TitleProps} from '../../atom/title/types';\nimport CardsGrid from '../../organism/cards-grid';\nimport ListItems from '../../organism/list-items';\nimport {ICONS} from '../../util/button-icons';\nimport {propTypes as iconPropTypes} from '../../atom/icon';\n\nconst propTypes = {\n  content: PropTypes.string,\n  mode: PropTypes.oneOf(['alert', 'information', 'cookie', 'items', 'list']),\n  header: PropTypes.shape({\n    title: PropTypes.shape(Title.propTypes),\n    headerIcon: PropTypes.string,\n    backgroundImage: PropTypes.string\n  }),\n  firstButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary', 'tertiary']),\n    customStyle: ButtonLink.propTypes.customStyle\n  }),\n  secondButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    customStyle: ButtonLink.propTypes.customStyle,\n    icon: PropTypes.shape({\n      position: PropTypes.oneOf(['right', 'left']),\n      type: PropTypes.oneOf(keys(ICONS))\n    })\n  }),\n  thirdButton: PropTypes.shape({\n    label: PropTypes.string,\n    handleOnclick: PropTypes.func,\n    type: PropTypes.oneOf(['dangerous', 'primary', 'secondary']),\n    'aria-label': PropTypes.string,\n    largeButton: PropTypes.bool,\n    customStyle: ButtonLink.propTypes.customStyle\n  }),\n  onClose: PropTypes.func,\n  icon: PropTypes.oneOfType([PropTypes.string, PropTypes.shape(iconPropTypes)]),\n  backgroundImageUrl: PropTypes.string,\n  descriptionText: PropTypes.string,\n  cookieTitle: PropTypes.string,\n  headerSubtitle: PropTypes.string,\n  descriptionBtnTxt: PropTypes.string,\n  listBtnSwicth: PropTypes.arrayOf(PropTypes.shape(InputSwitch.propTypes)),\n  items: PropTypes.shape({\n    type: PropTypes.oneOf(['content', 'list']),\n    list: PropTypes.oneOfType([\n      PropTypes.shape(CardsGrid.propTypes),\n      PropTypes.shape(ListItems.propTypes)\n    ])\n  }),\n  link: PropTypes.shape(Link.propTypes)\n};\n\ntype PopinHeaderProps = {\n  title: TitleProps;\n  backgroundImage: string;\n  headerIcon: string;\n};\n\nexport type QuitPopinButton = {\n  'aria-label'?: string;\n  label: string;\n  type: string;\n  customStyle?: {\n    backgroundColor?: string;\n    color?: string;\n  };\n  handleOnclick: () => void;\n};\n\nexport type CMPopinProps = {\n  content: string;\n  icon: string | PropTypes.InferProps<typeof iconPropTypes>;\n  mode: 'alert' | 'information' | 'cookie' | 'items' | 'list';\n  onClose?: () => void;\n  popinHeader?: PopinHeaderProps;\n  descriptionText: string;\n  firstButton?: QuitPopinButton;\n  secondButton?: QuitPopinButton;\n  items?: {\n    type: 'content' | 'list';\n    list:\n      | PropTypes.InferProps<typeof CardsGrid.propTypes>\n      | PropTypes.InferProps<typeof ListItems.propTypes>;\n  };\n  link?: PropTypes.InferProps<typeof Link.propTypes>;\n};\n\nexport default propTypes;\n"],"mappings":"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","ignoreList":[]}

package/es/molecule/dashboard/cards-list/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"names":[],"mappings":";AAuFA;IACE;;;OAGG;IACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAqBE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAkCC;IA/BC;;;;;;;;MAQC;IAED,0DAAgE;IAsHlE,qBAiBC;IAED,qBAGC;IAED,sBAGC;IAED,0BASC;IAvJC,uEAA6D;IAyJ/D,mCAIC;IA5DD,oCAMC;IAGD,sCAIC;IA5DD,qBAGC;IAnCD,0BAMC;IAED,2BAYC;IAED,6BAOC;IASD,wCAuCC;IAGC,kBAA2B;IA6D7B,sBAuGC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"names":[],"mappings":";AAwFA;IACE;;;OAGG;IACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAqBE;IAEF;;;;;;;;;;;;;;;;;;;;;;;MAGE;IAEF,wBAkCC;IA/BC;;;;;;;;MAQC;IAED,0DAAgE;IAsHlE,qBAiBC;IAED,qBAGC;IAED,sBAGC;IAED,0BASC;IAvJC,uEAA6D;IAyJ/D,mCAIC;IA5DD,oCAMC;IAGD,sCAIC;IA5DD,qBAGC;IAnCD,0BAMC;IAED,2BAYC;IAED,6BAOC;IASD,wCAuCC;IAGC,kBAA2B;IA6D7B,sBAwGC;CACF"}

package/es/molecule/dashboard/cards-list/index.js

@@ -19,6 +19,7 @@ import Provider from '../../../atom/provider';
 import Card, { cardPropTypes } from '../../card';
 import LearningPriorityCard from '../../learning-priority-card';
 import Icon from '../../../atom/icon';
+import { COLORS } from '../../../variables/colors';
 import style from './style.css';
 const ShowMoreLink = props => {
   const {
@@ -296,6 +297,7 @@ class CardsList extends React.PureComponent {
       color: dark,
       preset: 's',
       borderRadius: '8px',
+      backgroundColor: COLORS.neutral_75,
       ariaLabel: ariaLabel.showMoreOnLeftAriaLabel
     };
     const arrows = /*#__PURE__*/React.createElement("div", {

package/es/molecule/dashboard/cards-list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","PropTypes","NovaSolidContentContentBook1","LearnerIcon","NovaCompositionCoorpacademyTimer","TimerIcon","Provider","Card","cardPropTypes","LearningPriorityCard","Icon","style","ShowMoreLink","props","onShowMore","showMore","className","createElement","onClick","contextTypes","skin","childContextTypes","propTypes","process","env","NODE_ENV","func","string","IconView","context","contentType","ICONS","chapter","course","dark","_get","IconType","color","icon","computeWidth","card","type","nextPage","page","maxPages","CardsList","PureComponent","translate","constructor","state","actualPage","scrollLeft","offsetWidth","possiblePositions","possiblePages","cardsWidth","handleScroll_","_throttle","handleScroll","bind","handleOnLeft","handleOnRight","scrollTo","updateState","_debounce","updatePages","setCardsWrapper","getScrollWidth","handleResize","testingSizes","componentDidMount","cardsWrapper","addEventListener","window","componentDidUpdate","cards","newCardsWidth","_pipe","_map","_sum","updatePaginationState","setState","componentWillUnmount","removeEventListener","cancel","wrapperWidth","wrapperScrollLeft","cardWidths","_reduce","cardPositions","accWidth","cardWidth","_head","acc","pageIndex","accPageWidth","pageWidth","skip","_findIndex","position","_last","element","index","onScroll","leftBound","rightBound","leftIndex","rightIndex","_findLastIndex","limit","indexOfNextFirstCard","indexOf","nextPosition","render","title","customStyle","dataName","ariaLabel","_getOr","titleStyle","titleLink","cardsView","_toPairs","key","_extends","arrowIconProps","preset","borderRadius","showMoreOnLeftAriaLabel","arrows","arrowsWrapper","arrow","iconName","titleView","titleNode","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","ref","oneOfType","node","arrayOf","shape","objectOf","showMoreOnRightAriaLabel","oneOf","any"],"sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"sourcesContent":["import React from 'react';\nimport {\n  debounce,\n  throttle,\n  get,\n  getOr,\n  map,\n  sum,\n  last,\n  pipe,\n  toPairs,\n  reduce,\n  head,\n  findIndex,\n  findLastIndex\n} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {\n  NovaSolidContentContentBook1 as LearnerIcon,\n  NovaCompositionCoorpacademyTimer as TimerIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../../atom/provider';\nimport Card, {cardPropTypes} from '../../card';\nimport LearningPriorityCard from '../../learning-priority-card';\nimport Icon from '../../../atom/icon';\nimport style from './style.css';\n\nconst ShowMoreLink = props => {\n  const {onShowMore, showMore, className} = props;\n  return (\n    <div className={className} onClick={onShowMore}>\n      {showMore}\n    </div>\n  );\n};\n\nShowMoreLink.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nShowMoreLink.propTypes = {\n  onShowMore: PropTypes.func,\n  showMore: PropTypes.string,\n  className: PropTypes.string\n};\n\nconst IconView = (props, context) => {\n  const {skin} = context;\n  const {contentType} = props;\n  const ICONS = {\n    chapter: TimerIcon,\n    course: LearnerIcon\n  };\n\n  if (!contentType) {\n    return null;\n  }\n\n  const dark = get('common.dark', skin);\n  const IconType = ICONS[contentType];\n\n  return (\n    <div>\n      <IconType style={{color: dark}} className={style.icon} data-contenttype={contentType} />\n    </div>\n  );\n};\n\nconst computeWidth = card => {\n  switch (card && card.type) {\n    case 'chapter':\n      return 219;\n    default:\n      return 272;\n  }\n};\n\nconst nextPage = (page, maxPages) => {\n  if (page < 0) return maxPages;\n  if (page > maxPages) return 0;\n  return page;\n};\n\nIconView.propTypes = {\n  contentType: PropTypes.string\n};\n\nclass CardsList extends React.PureComponent {\n  /**\n   * IMPORTANT: update prop-types.ts too, 1st a migration of tests\n   * is intended, then, a TS + functional refactor is planned.\n   */\n  static propTypes = {\n    contentType: PropTypes.string,\n    dataName: PropTypes.string,\n    title: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),\n    showMore: PropTypes.string,\n    cards: PropTypes.arrayOf(\n      PropTypes.oneOfType([\n        PropTypes.shape(cardPropTypes),\n        PropTypes.shape(LearningPriorityCard.propTypes)\n      ])\n    ),\n    customStyle: PropTypes.objectOf(PropTypes.string),\n    onScroll: PropTypes.func,\n    onShowMore: PropTypes.func,\n    'arrows-aria-label': PropTypes.shape({\n      showMoreOnLeftAriaLabel: PropTypes.string,\n      showMoreOnRightAriaLabel: PropTypes.string\n    }),\n    type: PropTypes.oneOf(['cards', 'learningPrioritiesCards']),\n    // eslint-disable-next-line react/forbid-prop-types\n    testingSizes: PropTypes.any\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin,\n    translate: Provider.childContextTypes.translate\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      actualPage: 0,\n      maxPages: 0,\n      scrollLeft: 0,\n      offsetWidth: 0,\n      possiblePositions: [],\n      possiblePages: [],\n      cardsWidth: 0\n    };\n\n    this.handleScroll_ = throttle(200, this.handleScroll.bind(this));\n    this.handleScroll = this.handleScroll.bind(this);\n    this.handleOnLeft = this.handleOnLeft.bind(this);\n    this.handleOnRight = this.handleOnRight.bind(this);\n    this.scrollTo = this.scrollTo.bind(this);\n    this.updateState = debounce(200, this.updatePages.bind(this));\n    this.updatePages = this.updatePages.bind(this);\n    this.setCardsWrapper = this.setCardsWrapper.bind(this);\n    this.getScrollWidth = this.getScrollWidth.bind(this);\n    this.handleResize = this.handleResize.bind(this);\n\n    // for testing purposes only - no other way to test this polluted component\n    if (props.testingSizes) {\n      const {offsetWidth, scrollLeft, maxPages, possiblePages, possiblePositions} =\n        props.testingSizes;\n      this.state.offsetWidth = offsetWidth;\n      this.state.scrollLeft = scrollLeft;\n      this.state.maxPages = maxPages;\n      this.state.possiblePages = possiblePages;\n      this.state.possiblePositions = possiblePositions;\n    }\n  }\n\n  componentDidMount() {\n    this.cardsWrapper.addEventListener('scroll', this.handleScroll_);\n\n    if (window) {\n      window.addEventListener('resize', this.handleResize);\n    }\n  }\n\n  componentDidUpdate() {\n    const {cards = []} = this.props;\n    const {offsetWidth, cardsWidth} = this.state;\n    const newCardsWidth = pipe(map(computeWidth), sum)(cards);\n\n    if (newCardsWidth !== cardsWidth && offsetWidth !== 0) {\n      this.updatePaginationState(cards);\n      // eslint-disable-next-line react/no-did-update-set-state\n      this.setState({\n        cardsWidth: newCardsWidth\n      });\n    }\n  }\n\n  componentWillUnmount() {\n    this.cardsWrapper.removeEventListener('scroll', this.handleScroll_);\n\n    if (window) {\n      window.removeEventListener('resize', this.handleResize);\n    }\n    this.updateState.cancel();\n  }\n\n  /* istanbul ignore next */\n  handleResize() {\n    const {cards = []} = this.props;\n    this.updatePaginationState(cards);\n  }\n\n  /* istanbul ignore next */\n  updatePaginationState(cards) {\n    const {offsetWidth: wrapperWidth, scrollLeft: wrapperScrollLeft} = this.state;\n\n    const cardWidths = map(computeWidth)(cards);\n\n    const possiblePositions = pipe(\n      reduce(\n        ([cardPositions, accWidth], cardWidth) => [\n          [...cardPositions, accWidth],\n          cardWidth + accWidth\n        ],\n        [[], 0]\n      ),\n      head\n    )(cardWidths);\n\n    const possiblePages = pipe(\n      reduce(\n        ([acc, pageIndex, accPageWidth], cardWidth) => {\n          const pageWidth = accPageWidth + cardWidth;\n          if (pageWidth > wrapperWidth) {\n            return [[...acc, pageIndex + 1], pageIndex + 1, cardWidth];\n          }\n          return [[...acc, pageIndex], pageIndex, pageWidth];\n        },\n        [[], 0, 0]\n      ),\n      head\n    )(cardWidths);\n\n    const skip = findIndex(position => position >= wrapperScrollLeft, possiblePositions);\n    const actualPage = possiblePages[skip + 1];\n\n    this.setState({\n      possiblePositions,\n      possiblePages,\n      maxPages: last(possiblePages),\n      actualPage\n    });\n  }\n\n  setCardsWrapper(element) {\n    this.cardsWrapper = element;\n    this.setState({\n      scrollLeft: this.cardsWrapper?.scrollLeft,\n      offsetWidth: this.cardsWrapper?.offsetWidth\n    });\n  }\n\n  /* istanbul ignore next */\n  getScrollWidth(index) {\n    const {cards = []} = this.props;\n    const card = cards[index];\n    return computeWidth(card);\n  }\n\n  /* istanbul ignore next */\n  handleScroll() {\n    const scrollLeft = this.cardsWrapper?.scrollLeft;\n    this.setState({scrollLeft});\n\n    const {possiblePositions, offsetWidth} = this.state;\n    const {onScroll} = this.props;\n    if (onScroll) {\n      const leftBound = scrollLeft;\n      const rightBound = scrollLeft + offsetWidth;\n\n      const leftIndex = findIndex(position => position > leftBound, possiblePositions) - 1;\n      const rightIndex = findLastIndex(position => position < rightBound, possiblePositions);\n      const skip = leftIndex;\n      const limit = rightIndex - skip + 1;\n\n      onScroll(skip, limit);\n    }\n  }\n\n  handleOnLeft() {\n    const {actualPage, maxPages} = this.state;\n    this.scrollTo(nextPage(actualPage - 1, maxPages));\n  }\n\n  handleOnRight() {\n    const {actualPage, maxPages} = this.state;\n    this.scrollTo(nextPage(actualPage + 1, maxPages));\n  }\n\n  scrollTo(page) {\n    const {possiblePages, possiblePositions} = this.state;\n    const indexOfNextFirstCard = possiblePages.indexOf(page);\n    const nextPosition = possiblePositions[indexOfNextFirstCard];\n    this.cardsWrapper.scrollLeft = nextPosition;\n    this.updatePages(page);\n    this.setState({\n      scrollLeft: nextPosition\n    });\n  }\n\n  updatePages(actualPage) {\n    this.setState({\n      actualPage\n    });\n  }\n\n  render() {\n    const {\n      title,\n      showMore,\n      cards,\n      customStyle = {},\n      onShowMore,\n      dataName,\n      contentType,\n      'arrows-aria-label': ariaLabel = {},\n      type\n    } = this.props;\n    const {skin} = this.context;\n    const {maxPages} = this.state;\n    const dark = getOr('#90A4AE', 'common.dark', skin);\n    const titleStyle = onShowMore ? style.titleLink : style.title;\n    const cardsView = pipe(\n      toPairs,\n      map(([key, card]) => {\n        return (\n          <div className={style.card} key={key}>\n            {card && type === 'learningPrioritiesCards' ? (\n              <LearningPriorityCard {...card} dataName={`${dataName}-${key}`} />\n            ) : (\n              <Card {...card} dataName={`${dataName}-${key}`} />\n            )}\n          </div>\n        );\n      })\n    )(cards);\n\n    const arrowIconProps = {\n      color: dark,\n      preset: 's',\n      borderRadius: '8px',\n      ariaLabel: ariaLabel.showMoreOnLeftAriaLabel\n    };\n\n    const arrows = (\n      <div className={style.arrowsWrapper}>\n        <div className={style.arrow} onClick={this.handleOnLeft} data-name=\"card-list-left-arrow\">\n          <Icon {...arrowIconProps} iconName=\"arrow-left\" />\n        </div>\n        <div className={style.arrow} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n          <Icon {...arrowIconProps} iconName=\"arrow-right\" />\n        </div>\n      </div>\n    );\n\n    const titleView =\n      typeof title === 'string' ? (\n        <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n          <IconView contentType={contentType} />\n          <span>{title}</span>\n        </span>\n      ) : (\n        <span className={style.titleNode}>{title}</span>\n      );\n\n    const hasPages = maxPages > 0;\n    const showMoreView =\n      hasPages && showMore && onShowMore ? (\n        <ShowMoreLink\n          className={hasPages ? style.showMoreBar : style.showMore}\n          onShowMore={onShowMore}\n          showMore={showMore}\n        />\n      ) : null;\n\n    const switchPagesView = hasPages ? (\n      <div className={style.pagingWrapper}>\n        {showMoreView}\n        {arrows}\n      </div>\n    ) : null;\n\n    return (\n      <div\n        className={style.wrapper}\n        style={customStyle}\n        data-name=\"cardsList\"\n        data-max-pages={`${maxPages}`}\n        // eslint-disable-next-line react/destructuring-assignment\n        data-actual-page={`${this.state.actualPage}`}\n        data-scroll-left={this.cardsWrapper?.scrollLeft}\n      >\n        <div className={style.list}>\n          <div>\n            <div data-name=\"header\" className={style.header}>\n              {titleView}\n              {switchPagesView}\n            </div>\n            <div\n              className={style.cards}\n              data-testid=\"cards-view-wrapper\"\n              ref={this.setCardsWrapper}\n            >\n              {cardsView}\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default CardsList;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","PropTypes","NovaSolidContentContentBook1","LearnerIcon","NovaCompositionCoorpacademyTimer","TimerIcon","Provider","Card","cardPropTypes","LearningPriorityCard","Icon","COLORS","style","ShowMoreLink","props","onShowMore","showMore","className","createElement","onClick","contextTypes","skin","childContextTypes","propTypes","process","env","NODE_ENV","func","string","IconView","context","contentType","ICONS","chapter","course","dark","_get","IconType","color","icon","computeWidth","card","type","nextPage","page","maxPages","CardsList","PureComponent","translate","constructor","state","actualPage","scrollLeft","offsetWidth","possiblePositions","possiblePages","cardsWidth","handleScroll_","_throttle","handleScroll","bind","handleOnLeft","handleOnRight","scrollTo","updateState","_debounce","updatePages","setCardsWrapper","getScrollWidth","handleResize","testingSizes","componentDidMount","cardsWrapper","addEventListener","window","componentDidUpdate","cards","newCardsWidth","_pipe","_map","_sum","updatePaginationState","setState","componentWillUnmount","removeEventListener","cancel","wrapperWidth","wrapperScrollLeft","cardWidths","_reduce","cardPositions","accWidth","cardWidth","_head","acc","pageIndex","accPageWidth","pageWidth","skip","_findIndex","position","_last","element","index","onScroll","leftBound","rightBound","leftIndex","rightIndex","_findLastIndex","limit","indexOfNextFirstCard","indexOf","nextPosition","render","title","customStyle","dataName","ariaLabel","_getOr","titleStyle","titleLink","cardsView","_toPairs","key","_extends","arrowIconProps","preset","borderRadius","backgroundColor","neutral_75","showMoreOnLeftAriaLabel","arrows","arrowsWrapper","arrow","iconName","titleView","titleNode","hasPages","showMoreView","showMoreBar","switchPagesView","pagingWrapper","wrapper","list","header","ref","oneOfType","node","arrayOf","shape","objectOf","showMoreOnRightAriaLabel","oneOf","any"],"sources":["../../../../src/molecule/dashboard/cards-list/index.js"],"sourcesContent":["import React from 'react';\nimport {\n  debounce,\n  throttle,\n  get,\n  getOr,\n  map,\n  sum,\n  last,\n  pipe,\n  toPairs,\n  reduce,\n  head,\n  findIndex,\n  findLastIndex\n} from 'lodash/fp';\nimport PropTypes from 'prop-types';\nimport {\n  NovaSolidContentContentBook1 as LearnerIcon,\n  NovaCompositionCoorpacademyTimer as TimerIcon\n} from '@coorpacademy/nova-icons';\nimport Provider from '../../../atom/provider';\nimport Card, {cardPropTypes} from '../../card';\nimport LearningPriorityCard from '../../learning-priority-card';\nimport Icon from '../../../atom/icon';\nimport {COLORS} from '../../../variables/colors';\nimport style from './style.css';\n\nconst ShowMoreLink = props => {\n  const {onShowMore, showMore, className} = props;\n  return (\n    <div className={className} onClick={onShowMore}>\n      {showMore}\n    </div>\n  );\n};\n\nShowMoreLink.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nShowMoreLink.propTypes = {\n  onShowMore: PropTypes.func,\n  showMore: PropTypes.string,\n  className: PropTypes.string\n};\n\nconst IconView = (props, context) => {\n  const {skin} = context;\n  const {contentType} = props;\n  const ICONS = {\n    chapter: TimerIcon,\n    course: LearnerIcon\n  };\n\n  if (!contentType) {\n    return null;\n  }\n\n  const dark = get('common.dark', skin);\n  const IconType = ICONS[contentType];\n\n  return (\n    <div>\n      <IconType style={{color: dark}} className={style.icon} data-contenttype={contentType} />\n    </div>\n  );\n};\n\nconst computeWidth = card => {\n  switch (card && card.type) {\n    case 'chapter':\n      return 219;\n    default:\n      return 272;\n  }\n};\n\nconst nextPage = (page, maxPages) => {\n  if (page < 0) return maxPages;\n  if (page > maxPages) return 0;\n  return page;\n};\n\nIconView.propTypes = {\n  contentType: PropTypes.string\n};\n\nclass CardsList extends React.PureComponent {\n  /**\n   * IMPORTANT: update prop-types.ts too, 1st a migration of tests\n   * is intended, then, a TS + functional refactor is planned.\n   */\n  static propTypes = {\n    contentType: PropTypes.string,\n    dataName: PropTypes.string,\n    title: PropTypes.oneOfType([PropTypes.node, PropTypes.string]),\n    showMore: PropTypes.string,\n    cards: PropTypes.arrayOf(\n      PropTypes.oneOfType([\n        PropTypes.shape(cardPropTypes),\n        PropTypes.shape(LearningPriorityCard.propTypes)\n      ])\n    ),\n    customStyle: PropTypes.objectOf(PropTypes.string),\n    onScroll: PropTypes.func,\n    onShowMore: PropTypes.func,\n    'arrows-aria-label': PropTypes.shape({\n      showMoreOnLeftAriaLabel: PropTypes.string,\n      showMoreOnRightAriaLabel: PropTypes.string\n    }),\n    type: PropTypes.oneOf(['cards', 'learningPrioritiesCards']),\n    // eslint-disable-next-line react/forbid-prop-types\n    testingSizes: PropTypes.any\n  };\n\n  static contextTypes = {\n    skin: Provider.childContextTypes.skin,\n    translate: Provider.childContextTypes.translate\n  };\n\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      actualPage: 0,\n      maxPages: 0,\n      scrollLeft: 0,\n      offsetWidth: 0,\n      possiblePositions: [],\n      possiblePages: [],\n      cardsWidth: 0\n    };\n\n    this.handleScroll_ = throttle(200, this.handleScroll.bind(this));\n    this.handleScroll = this.handleScroll.bind(this);\n    this.handleOnLeft = this.handleOnLeft.bind(this);\n    this.handleOnRight = this.handleOnRight.bind(this);\n    this.scrollTo = this.scrollTo.bind(this);\n    this.updateState = debounce(200, this.updatePages.bind(this));\n    this.updatePages = this.updatePages.bind(this);\n    this.setCardsWrapper = this.setCardsWrapper.bind(this);\n    this.getScrollWidth = this.getScrollWidth.bind(this);\n    this.handleResize = this.handleResize.bind(this);\n\n    // for testing purposes only - no other way to test this polluted component\n    if (props.testingSizes) {\n      const {offsetWidth, scrollLeft, maxPages, possiblePages, possiblePositions} =\n        props.testingSizes;\n      this.state.offsetWidth = offsetWidth;\n      this.state.scrollLeft = scrollLeft;\n      this.state.maxPages = maxPages;\n      this.state.possiblePages = possiblePages;\n      this.state.possiblePositions = possiblePositions;\n    }\n  }\n\n  componentDidMount() {\n    this.cardsWrapper.addEventListener('scroll', this.handleScroll_);\n\n    if (window) {\n      window.addEventListener('resize', this.handleResize);\n    }\n  }\n\n  componentDidUpdate() {\n    const {cards = []} = this.props;\n    const {offsetWidth, cardsWidth} = this.state;\n    const newCardsWidth = pipe(map(computeWidth), sum)(cards);\n\n    if (newCardsWidth !== cardsWidth && offsetWidth !== 0) {\n      this.updatePaginationState(cards);\n      // eslint-disable-next-line react/no-did-update-set-state\n      this.setState({\n        cardsWidth: newCardsWidth\n      });\n    }\n  }\n\n  componentWillUnmount() {\n    this.cardsWrapper.removeEventListener('scroll', this.handleScroll_);\n\n    if (window) {\n      window.removeEventListener('resize', this.handleResize);\n    }\n    this.updateState.cancel();\n  }\n\n  /* istanbul ignore next */\n  handleResize() {\n    const {cards = []} = this.props;\n    this.updatePaginationState(cards);\n  }\n\n  /* istanbul ignore next */\n  updatePaginationState(cards) {\n    const {offsetWidth: wrapperWidth, scrollLeft: wrapperScrollLeft} = this.state;\n\n    const cardWidths = map(computeWidth)(cards);\n\n    const possiblePositions = pipe(\n      reduce(\n        ([cardPositions, accWidth], cardWidth) => [\n          [...cardPositions, accWidth],\n          cardWidth + accWidth\n        ],\n        [[], 0]\n      ),\n      head\n    )(cardWidths);\n\n    const possiblePages = pipe(\n      reduce(\n        ([acc, pageIndex, accPageWidth], cardWidth) => {\n          const pageWidth = accPageWidth + cardWidth;\n          if (pageWidth > wrapperWidth) {\n            return [[...acc, pageIndex + 1], pageIndex + 1, cardWidth];\n          }\n          return [[...acc, pageIndex], pageIndex, pageWidth];\n        },\n        [[], 0, 0]\n      ),\n      head\n    )(cardWidths);\n\n    const skip = findIndex(position => position >= wrapperScrollLeft, possiblePositions);\n    const actualPage = possiblePages[skip + 1];\n\n    this.setState({\n      possiblePositions,\n      possiblePages,\n      maxPages: last(possiblePages),\n      actualPage\n    });\n  }\n\n  setCardsWrapper(element) {\n    this.cardsWrapper = element;\n    this.setState({\n      scrollLeft: this.cardsWrapper?.scrollLeft,\n      offsetWidth: this.cardsWrapper?.offsetWidth\n    });\n  }\n\n  /* istanbul ignore next */\n  getScrollWidth(index) {\n    const {cards = []} = this.props;\n    const card = cards[index];\n    return computeWidth(card);\n  }\n\n  /* istanbul ignore next */\n  handleScroll() {\n    const scrollLeft = this.cardsWrapper?.scrollLeft;\n    this.setState({scrollLeft});\n\n    const {possiblePositions, offsetWidth} = this.state;\n    const {onScroll} = this.props;\n    if (onScroll) {\n      const leftBound = scrollLeft;\n      const rightBound = scrollLeft + offsetWidth;\n\n      const leftIndex = findIndex(position => position > leftBound, possiblePositions) - 1;\n      const rightIndex = findLastIndex(position => position < rightBound, possiblePositions);\n      const skip = leftIndex;\n      const limit = rightIndex - skip + 1;\n\n      onScroll(skip, limit);\n    }\n  }\n\n  handleOnLeft() {\n    const {actualPage, maxPages} = this.state;\n    this.scrollTo(nextPage(actualPage - 1, maxPages));\n  }\n\n  handleOnRight() {\n    const {actualPage, maxPages} = this.state;\n    this.scrollTo(nextPage(actualPage + 1, maxPages));\n  }\n\n  scrollTo(page) {\n    const {possiblePages, possiblePositions} = this.state;\n    const indexOfNextFirstCard = possiblePages.indexOf(page);\n    const nextPosition = possiblePositions[indexOfNextFirstCard];\n    this.cardsWrapper.scrollLeft = nextPosition;\n    this.updatePages(page);\n    this.setState({\n      scrollLeft: nextPosition\n    });\n  }\n\n  updatePages(actualPage) {\n    this.setState({\n      actualPage\n    });\n  }\n\n  render() {\n    const {\n      title,\n      showMore,\n      cards,\n      customStyle = {},\n      onShowMore,\n      dataName,\n      contentType,\n      'arrows-aria-label': ariaLabel = {},\n      type\n    } = this.props;\n    const {skin} = this.context;\n    const {maxPages} = this.state;\n    const dark = getOr('#90A4AE', 'common.dark', skin);\n    const titleStyle = onShowMore ? style.titleLink : style.title;\n    const cardsView = pipe(\n      toPairs,\n      map(([key, card]) => {\n        return (\n          <div className={style.card} key={key}>\n            {card && type === 'learningPrioritiesCards' ? (\n              <LearningPriorityCard {...card} dataName={`${dataName}-${key}`} />\n            ) : (\n              <Card {...card} dataName={`${dataName}-${key}`} />\n            )}\n          </div>\n        );\n      })\n    )(cards);\n\n    const arrowIconProps = {\n      color: dark,\n      preset: 's',\n      borderRadius: '8px',\n      backgroundColor: COLORS.neutral_75,\n      ariaLabel: ariaLabel.showMoreOnLeftAriaLabel\n    };\n\n    const arrows = (\n      <div className={style.arrowsWrapper}>\n        <div className={style.arrow} onClick={this.handleOnLeft} data-name=\"card-list-left-arrow\">\n          <Icon {...arrowIconProps} iconName=\"arrow-left\" />\n        </div>\n        <div className={style.arrow} onClick={this.handleOnRight} data-name=\"card-list-right-arrow\">\n          <Icon {...arrowIconProps} iconName=\"arrow-right\" />\n        </div>\n      </div>\n    );\n\n    const titleView =\n      typeof title === 'string' ? (\n        <span data-name=\"title\" className={titleStyle} onClick={onShowMore}>\n          <IconView contentType={contentType} />\n          <span>{title}</span>\n        </span>\n      ) : (\n        <span className={style.titleNode}>{title}</span>\n      );\n\n    const hasPages = maxPages > 0;\n    const showMoreView =\n      hasPages && showMore && onShowMore ? (\n        <ShowMoreLink\n          className={hasPages ? style.showMoreBar : style.showMore}\n          onShowMore={onShowMore}\n          showMore={showMore}\n        />\n      ) : null;\n\n    const switchPagesView = hasPages ? (\n      <div className={style.pagingWrapper}>\n        {showMoreView}\n        {arrows}\n      </div>\n    ) : null;\n\n    return (\n      <div\n        className={style.wrapper}\n        style={customStyle}\n        data-name=\"cardsList\"\n        data-max-pages={`${maxPages}`}\n        // eslint-disable-next-line react/destructuring-assignment\n        data-actual-page={`${this.state.actualPage}`}\n        data-scroll-left={this.cardsWrapper?.scrollLeft}\n      >\n        <div className={style.list}>\n          <div>\n            <div data-name=\"header\" className={style.header}>\n              {titleView}\n              {switchPagesView}\n            </div>\n            <div\n              className={style.cards}\n              data-testid=\"cards-view-wrapper\"\n              ref={this.setCardsWrapper}\n            >\n              {cardsView}\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n\nexport default CardsList;\n"],"mappings":"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","ignoreList":[]}

package/es/molecule/learner-skill-card/index.d.ts

@@ -1,44 +1,29 @@
-export default LearnerSkillCard;
-declare function LearnerSkillCard(props: any, context: any): JSX.Element;
-declare namespace LearnerSkillCard {
-    namespace contextTypes {
-        const skin: PropTypes.Requireable<PropTypes.InferProps<{
-            common: PropTypes.Requireable<{
-                [x: string]: any;
-            }>;
-            images: PropTypes.Requireable<PropTypes.InferProps<{
-                'logo-mobile': PropTypes.Requireable<any>;
-                logo: PropTypes.Requireable<any>;
-                'logo-email': PropTypes.Requireable<any>;
-                login: PropTypes.Requireable<any>;
-            }>>;
-            icons: PropTypes.Requireable<{
-                [x: string]: any;
-            }>;
-            mod: PropTypes.Requireable<{
-                [x: string]: any;
-            }>;
-            courses: PropTypes.Requireable<any[]>;
-            texts: PropTypes.Requireable<{
-                [x: string]: any;
-            }>;
+import React from 'react';
+import { WebContextValues } from '../../atom/provider/web-context';
+import { LearnerSkillCardProps } from './prop-types';
+export declare const updateBackgroundImage: (ref: React.RefObject<HTMLDivElement>, background: string) => void;
+declare const LearnerSkillCard: {
+    (props: LearnerSkillCardProps, context: WebContextValues): JSX.Element;
+    contextTypes: {
+        translate: import("prop-types").Requireable<(...args: any[]) => any>;
+    };
+    propTypes: {
+        'aria-label': import("prop-types").Requireable<string>;
+        cardIndex: import("prop-types").Requireable<number>;
+        skillTitle: import("prop-types").Requireable<string>;
+        skillAriaLabel: import("prop-types").Requireable<string>;
+        focus: import("prop-types").Requireable<boolean>;
+        metrics: import("prop-types").Requireable<import("prop-types").InferProps<{
+            content: import("prop-types").Requireable<number>;
+            score: import("prop-types").Requireable<number>;
+            questionsToReview: import("prop-types").Requireable<number>;
         }>>;
-        const translate: PropTypes.Requireable<(...args: any[]) => any>;
-    }
-    const propTypes: {
-        'aria-label': PropTypes.Requireable<string>;
-        skillTitle: PropTypes.Requireable<string>;
-        skillAriaLabel: PropTypes.Requireable<string>;
-        focus: PropTypes.Requireable<boolean>;
-        metrics: PropTypes.Requireable<PropTypes.InferProps<{
-            score: PropTypes.Requireable<number>;
-            content: PropTypes.Requireable<number>;
-            questionsToReview: PropTypes.Requireable<number>;
+        icon: import("prop-types").Requireable<import("prop-types").InferProps<{
+            color: import("prop-types").Requireable<string>;
+            name: import("prop-types").Requireable<string>;
         }>>;
-        review: PropTypes.Requireable<boolean>;
-        onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
-        onExploreClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onExploreClick: import("prop-types").Requireable<(...args: any[]) => any>;
     };
-}
-import PropTypes from "prop-types";
+};
+export default LearnerSkillCard;
 //# sourceMappingURL=index.d.ts.map

package/es/molecule/learner-skill-card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learner-skill-card/index.js"],"names":[],"mappings":";AAaA,yEAiHC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learner-skill-card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAC,gBAAgB,EAAC,MAAM,iCAAiC,CAAC;AAKjE,OAAkB,EAAC,qBAAqB,EAAC,MAAM,cAAc,CAAC;AAK9D,eAAO,MAAM,qBAAqB,QAAS,MAAM,SAAS,CAAC,cAAc,CAAC,cAAc,MAAM,SAI7F,CAAC;AAEF,QAAA,MAAM,gBAAgB;YAAW,qBAAqB,WAAW,gBAAgB;;;;;;;;;;;;;;;;;;;;;CA8HhF,CAAC;AAQF,eAAe,gBAAgB,CAAC"}

package/es/molecule/learner-skill-card/index.js

@@ -1,23 +1,26 @@
-import _get from "lodash/fp/get";
-import React from 'react';
-import { convert } from 'css-color-function';
-import PropTypes from 'prop-types';
-import Icon from '../../atom/icon';
-import ButtonLink from '../../atom/button-link';
-import Provider from '../../atom/provider';
+import React, { useCallback, useMemo, useRef } from 'react';
+import Provider, { GetTranslateFromContext } from '../../atom/provider';
 import ProgressBar from '../progress-bar';
 import { COLORS } from '../../variables/colors';
+import { createGradientBackground } from '../../util/get-background-gradient-color';
+import FaIcon from '../../atom/icon';
+import propTypes from './prop-types';
 import style from './style.css';
 const MAX_SCORE = 100;
+export const updateBackgroundImage = (ref, background) => {
+  if (ref.current) {
+    ref.current.style.backgroundImage = background;
+  }
+};
 const LearnerSkillCard = (props, context) => {
   const {
     'aria-label': ariaLabel,
+    cardIndex,
     skillTitle,
     skillAriaLabel,
-    focus = false,
+    focus,
     metrics,
-    review = false,
-    onReviewClick,
+    icon,
     onExploreClick
   } = props;
   const {
@@ -25,76 +28,97 @@ const LearnerSkillCard = (props, context) => {
     content,
     questionsToReview = 0
   } = metrics;
+  const translate = GetTranslateFromContext(context);
   const {
-    skin,
-    translate
-  } = context;
-  const primarySkinColor = _get('common.primary', skin);
-  const reviewLocale = translate('Review');
-  const exploreLocale = translate('Explore');
+    color,
+    name
+  } = icon;
   const questionsLocale = translate('skill_chart_side_panel_questions_to_review');
-  const skillFocusLocale = translate('skill_focus');
-  const buttonReviewProps = {
-    customStyle: {
-      backgroundColor: '#FFF',
-      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',
-      padding: '0px'
+  const [badgeIconName, badgeLocale, tagTextColor, tagBackgroundColor] = focus ? ['bullseye-arrow', translate('skill_focus'), COLORS.purple_700, COLORS.purple_100] : ['shapes', translate('skill'), COLORS.neutral_500, COLORS.gray];
+  const headerBackgroundRef = useRef(null);
+  const defaultBackground = useMemo(() => createGradientBackground(color, '93%', '100%'), [color]);
+  const focusBackground = useMemo(() => createGradientBackground(color, '83%', '100%'), [color]);
+  const handleMouseEnter = useCallback(() => {
+    updateBackgroundImage(headerBackgroundRef, focusBackground);
+  }, [focusBackground]);
+  const handleMouseLeave = useCallback(() => {
+    updateBackgroundImage(headerBackgroundRef, defaultBackground);
+  }, [defaultBackground]);
+  return /*#__PURE__*/React.createElement("div", {
+    "data-testid": `learner-skill-card-wrapper-${cardIndex}`,
+    onClick: onExploreClick,
+    className: style.learnerSkillCardContainer,
+    "aria-label": ariaLabel,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  }, /*#__PURE__*/React.createElement("div", {
+    "data-testid": "learner-skill-card-icon-header-wrapper",
+    ref: headerBackgroundRef,
+    className: style.iconHeaderWrapper,
+    style: {
+      backgroundImage: defaultBackground,
+      color: tagTextColor
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.iconWrapper,
+    "data-testid": "learner-skill-card-icon-wrapper"
+  }, /*#__PURE__*/React.createElement(FaIcon, {
+    iconName: name,
+    iconColor: color,
+    size: {
+      faSize: 20,
+      wrapperSize: 44
     },
-    disabled: !review,
-    onClick: onReviewClick,
-    'aria-label': `${skillTitle}, ${reviewLocale}`,
-    label: reviewLocale,
-    'data-name': 'learner-skill-card-review-button'
-  };
-  const buttonExploreProps = {
+    borderRadius: '12px',
+    gradientBackground: true,
     customStyle: {
-      backgroundColor: convert(`color(${primarySkinColor} a(0.07))`),
-      color: primarySkinColor,
-      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out'
-    },
-    hoverColor: '#FFFFFF',
-    hoverBackgroundColor: primarySkinColor,
-    onClick: onExploreClick,
-    'aria-label': `${skillTitle}, ${exploreLocale}`,
-    label: exploreLocale,
-    'data-name': 'learner-skill-card-explore-button',
-    icon: {
-      position: 'left',
-      faIcon: {
-        name: 'compass',
-        backgroundColor: convert(`color(${primarySkinColor} a(0.07))`),
-        color: primarySkinColor,
-        size: 16
-      }
+      border: '4px solid white'
     }
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: style.learnerSkillCardWrapper,
-    "data-name": "learner-skill-card-wrapper",
-    "aria-label": ariaLabel
-  }, questionsToReview ? /*#__PURE__*/React.createElement("div", {
-    className: style.skillQuestionsWrapper
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: style.learnerSkillCardContent
   }, /*#__PURE__*/React.createElement("div", {
-    className: style.skillInformation,
-    "data-name": "skill-questions"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: style.skillInformationNumber
-  }, questionsToReview), "\xA0", questionsLocale)) : null, /*#__PURE__*/React.createElement("div", {
     className: style.skillTitleWrapper
   }, /*#__PURE__*/React.createElement("div", {
-    "data-name": "skill-title",
-    className: style.skillTitle,
-    "aria-label": skillAriaLabel || skillTitle
-  }, skillTitle), focus ? /*#__PURE__*/React.createElement("div", {
-    className: style.skillFocusBadge
-  }, /*#__PURE__*/React.createElement(Icon, {
-    iconName: "bullseye-arrow",
-    backgroundColor: "#DDD1FF",
+    className: style.skillFocusBadge,
+    style: {
+      backgroundColor: tagBackgroundColor,
+      color: tagTextColor
+    }
+  }, /*#__PURE__*/React.createElement(FaIcon, {
+    iconName: badgeIconName,
+    backgroundColor: tagBackgroundColor,
     size: {
       faSize: 10,
       wrapperSize: 16
     }
-  }), skillFocusLocale) : null), content ? /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React.createElement("span", {
+    style: {
+      color: tagTextColor
+    }
+  }, badgeLocale)), /*#__PURE__*/React.createElement("div", {
+    className: style.questionWrapper
+  }, /*#__PURE__*/React.createElement("div", {
+    "data-name": "skill-card-title",
+    className: style.skillTitle,
+    "aria-label": skillAriaLabel || skillTitle
+  }, skillTitle), /*#__PURE__*/React.createElement("div", {
+    className: style.contentAndQuestionsWrapper
+  }, /*#__PURE__*/React.createElement("div", {
+    "data-name": "learner-skill-card-skill-content-number"
+  }, content, " ", translate('content')), questionsToReview ? /*#__PURE__*/React.createElement("div", {
+    className: style.skillInformation,
+    "data-name": "learner-skill-card-skill-questions-wrapper"
+  }, /*#__PURE__*/React.createElement(FaIcon, {
+    iconName: 'circle',
+    iconColor: COLORS.cm_grey_400,
+    backgroundColor: 'transparent',
+    size: {
+      faSize: 4,
+      wrapperSize: 0
+    }
+  }), /*#__PURE__*/React.createElement("span", {
+    "data-name": "learner-skill-card-questions-to-review"
+  }, questionsToReview), "\xA0", questionsLocale) : null)))), /*#__PURE__*/React.createElement("div", {
     className: style.progressInformations
   }, /*#__PURE__*/React.createElement(ProgressBar, {
     value: score,
@@ -102,38 +126,13 @@ const LearnerSkillCard = (props, context) => {
     max: MAX_SCORE,
     className: style.progressWrapper,
     style: {
-      backgroundColor: COLORS.positive
+      backgroundColor: COLORS.cm_positive_500
     }
-  }), /*#__PURE__*/React.createElement("div", {
-    className: style.progressInformation,
-    "data-name": "completed-percentage"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: style.progressInformationNumber
-  }, score, "%"))) : null, /*#__PURE__*/React.createElement("div", {
-    className: style.ctaWrapper,
-    "data-name": "cta-wrapper"
-  }, /*#__PURE__*/React.createElement(ButtonLink, buttonReviewProps), /*#__PURE__*/React.createElement("div", {
-    className: style.buttonWrapper,
-    "data-name": "button-explore-wrapper"
-  }, /*#__PURE__*/React.createElement(ButtonLink, buttonExploreProps))));
+  })));
 };
 LearnerSkillCard.contextTypes = {
-  skin: Provider.childContextTypes.skin,
   translate: Provider.childContextTypes.translate
 };
-LearnerSkillCard.propTypes = process.env.NODE_ENV !== "production" ? {
-  'aria-label': PropTypes.string,
-  skillTitle: PropTypes.string,
-  skillAriaLabel: PropTypes.string,
-  focus: PropTypes.bool,
-  metrics: PropTypes.shape({
-    score: PropTypes.number,
-    content: PropTypes.number,
-    questionsToReview: PropTypes.number
-  }),
-  review: PropTypes.bool,
-  onReviewClick: PropTypes.func,
-  onExploreClick: PropTypes.func
-} : {};
+LearnerSkillCard.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
 export default LearnerSkillCard;
 //# sourceMappingURL=index.js.map