@coorpacademy/components 11.35.1 → 11.35.2-alpha.10

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":";AAAA,OAAOA,SAAS,MAAM,YAAY;AAElC,OAAOC,UAAU,MAAM,wBAAwB;AAC/C,OAAOC,WAAW,MAAM,yBAAyB;AACjD,OAAOC,KAAK,MAAM,kBAAkB;AACpC,OAAOC,IAAI,MAAM,iBAAiB;AAElC,OAAOC,SAAS,MAAM,2BAA2B;AACjD,OAAOC,SAAS,MAAM,2BAA2B;AACjD,SAAQC,KAAK,QAAO,yBAAyB;AAC7C,SAAQC,aAAa,QAAO,iBAAiB;AAE7C,MAAMC,SAAS,GAAG;EAChBC,OAAO,EAAEV,SAAS,CAACW,MAAM;EACzBC,IAAI,EAAEZ,SAAS,CAACa,KAAK,CAAC,CAAC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;EAC1EC,MAAM,EAAEd,SAAS,CAACe,KAAK,CAAC;IACtBC,KAAK,EAAEhB,SAAS,CAACe,KAAK,CAACZ,KAAK,CAACM,SAAS,CAAC;IACvCQ,UAAU,EAAEjB,SAAS,CAACW,MAAM;IAC5BO,eAAe,EAAElB,SAAS,CAACW;EAC7B,CAAC,CAAC;EACFQ,WAAW,EAAEnB,SAAS,CAACe,KAAK,CAAC;IAC3BK,KAAK,EAAEpB,SAAS,CAACW,MAAM;IACvBU,aAAa,EAAErB,SAAS,CAACsB,IAAI;IAC7B,YAAY,EAAEtB,SAAS,CAACW,MAAM;IAC9BY,WAAW,EAAEvB,SAAS,CAACwB,IAAI;IAC3BC,IAAI,EAAEzB,SAAS,CAACa,KAAK,CAAC,CAAC,WAAW,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,CAAC,CAAC;IACxEa,WAAW,EAAEzB,UAAU,CAACQ,SAAS,CAACiB;EACpC,CAAC,CAAC;EACFC,YAAY,EAAE3B,SAAS,CAACe,KAAK,CAAC;IAC5BK,KAAK,EAAEpB,SAAS,CAACW,MAAM;IACvBU,aAAa,EAAErB,SAAS,CAACsB,IAAI;IAC7BG,IAAI,EAAEzB,SAAS,CAACa,KAAK,CAAC,CAAC,WAAW,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC;IAC5D,YAAY,EAAEb,SAAS,CAACW,MAAM;IAC9BY,WAAW,EAAEvB,SAAS,CAACwB,IAAI;IAC3BE,WAAW,EAAEzB,UAAU,CAACQ,SAAS,CAACiB,WAAW;IAC7CE,IAAI,EAAE5B,SAAS,CAACe,KAAK,CAAC;MACpBc,QAAQ,EAAE7B,SAAS,CAACa,KAAK,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;MAC5CY,IAAI,EAAEzB,SAAS,CAACa,KAAK,CAACiB,KAAA,CAAKvB,KAAK,CAAC;IACnC,CAAC;EACH,CAAC,CAAC;EACFwB,WAAW,EAAE/B,SAAS,CAACe,KAAK,CAAC;IAC3BK,KAAK,EAAEpB,SAAS,CAACW,MAAM;IACvBU,aAAa,EAAErB,SAAS,CAACsB,IAAI;IAC7BG,IAAI,EAAEzB,SAAS,CAACa,KAAK,CAAC,CAAC,WAAW,EAAE,SAAS,EAAE,WAAW,CAAC,CAAC;IAC5D,YAAY,EAAEb,SAAS,CAACW,MAAM;IAC9BY,WAAW,EAAEvB,SAAS,CAACwB,IAAI;IAC3BE,WAAW,EAAEzB,UAAU,CAACQ,SAAS,CAACiB;EACpC,CAAC,CAAC;EACFM,OAAO,EAAEhC,SAAS,CAACsB,IAAI;EACvBM,IAAI,EAAE5B,SAAS,CAACiC,SAAS,CAAC,CAACjC,SAAS,CAACW,MAAM,EAAEX,SAAS,CAACe,KAAK,CAACP,aAAa,CAAC,CAAC,CAAC;EAC7E0B,kBAAkB,EAAElC,SAAS,CAACW,MAAM;EACpCwB,eAAe,EAAEnC,SAAS,CAACW,MAAM;EACjCyB,WAAW,EAAEpC,SAAS,CAACW,MAAM;EAC7B0B,cAAc,EAAErC,SAAS,CAACW,MAAM;EAChC2B,iBAAiB,EAAEtC,SAAS,CAACW,MAAM;EACnC4B,aAAa,EAAEvC,SAAS,CAACwC,OAAO,CAACxC,SAAS,CAACe,KAAK,CAACb,WAAW,CAACO,SAAS,CAAC,CAAC;EACxEgC,KAAK,EAAEzC,SAAS,CAACe,KAAK,CAAC;IACrBU,IAAI,EAAEzB,SAAS,CAACa,KAAK,CAAC,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IAC1C6B,IAAI,EAAE1C,SAAS,CAACiC,SAAS,CAAC,CACxBjC,SAAS,CAACe,KAAK,CAACV,SAAS,CAACI,SAAS,CAAC,EACpCT,SAAS,CAACe,KAAK,CAACT,SAAS,CAACG,SAAS,CAAC,CACrC;EACH,CAAC,CAAC;EACFkC,IAAI,EAAE3C,SAAS,CAACe,KAAK,CAACX,IAAI,CAACK,SAAS;AACtC,CAAC;AAqCD,eAAeA,SAAS","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/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;;;;;;;;;;;;;;;;;;;;;CA6HhF,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,92 @@ 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.cm_grey_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", {
+  }), 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,
+    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 +121,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

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

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

package/es/molecule/learner-skill-card/prop-types.d.ts

@@ -0,0 +1,37 @@
+import PropTypes from 'prop-types';
+declare const propTypes: {
+    'aria-label': PropTypes.Requireable<string>;
+    cardIndex: PropTypes.Requireable<number>;
+    skillTitle: PropTypes.Requireable<string>;
+    skillAriaLabel: PropTypes.Requireable<string>;
+    focus: PropTypes.Requireable<boolean>;
+    metrics: PropTypes.Requireable<PropTypes.InferProps<{
+        content: PropTypes.Requireable<number>;
+        score: PropTypes.Requireable<number>;
+        questionsToReview: PropTypes.Requireable<number>;
+    }>>;
+    icon: PropTypes.Requireable<PropTypes.InferProps<{
+        color: PropTypes.Requireable<string>;
+        name: PropTypes.Requireable<string>;
+    }>>;
+    onExploreClick: PropTypes.Requireable<(...args: any[]) => any>;
+};
+export declare type LearnerSkillCardProps = {
+    'aria-label'?: string;
+    cardIndex: number;
+    skillTitle: string;
+    skillAriaLabel?: string;
+    focus: boolean;
+    metrics: {
+        content: number;
+        score: number;
+        questionsToReview?: number;
+    };
+    icon: {
+        color: string;
+        name: string;
+    };
+    onExploreClick: () => void;
+};
+export default propTypes;
+//# sourceMappingURL=prop-types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/learner-skill-card/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;CAgBd,CAAC;AAEF,oBAAY,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,OAAO,CAAC;IACf,OAAO,EAAE;QACP,OAAO,EAAE,MAAM,CAAC;QAChB,KAAK,EAAE,MAAM,CAAC;QACd,iBAAiB,CAAC,EAAE,MAAM,CAAC;KAC5B,CAAC;IACF,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF,cAAc,EAAE,MAAM,IAAI,CAAC;CAC5B,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/es/molecule/learner-skill-card/prop-types.js

@@ -0,0 +1,20 @@
+import PropTypes from 'prop-types';
+const propTypes = {
+  'aria-label': PropTypes.string,
+  cardIndex: PropTypes.number,
+  skillTitle: PropTypes.string,
+  skillAriaLabel: PropTypes.string,
+  focus: PropTypes.bool,
+  metrics: PropTypes.shape({
+    content: PropTypes.number,
+    score: PropTypes.number,
+    questionsToReview: PropTypes.number
+  }),
+  icon: PropTypes.shape({
+    color: PropTypes.string,
+    name: PropTypes.string
+  }),
+  onExploreClick: PropTypes.func
+};
+export default propTypes;
+//# sourceMappingURL=prop-types.js.map

package/es/molecule/learner-skill-card/prop-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prop-types.js","names":["PropTypes","propTypes","string","cardIndex","number","skillTitle","skillAriaLabel","focus","bool","metrics","shape","content","score","questionsToReview","icon","color","name","onExploreClick","func"],"sources":["../../../src/molecule/learner-skill-card/prop-types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst propTypes = {\n  'aria-label': PropTypes.string,\n  cardIndex: PropTypes.number,\n  skillTitle: PropTypes.string,\n  skillAriaLabel: PropTypes.string,\n  focus: PropTypes.bool,\n  metrics: PropTypes.shape({\n    content: PropTypes.number,\n    score: PropTypes.number,\n    questionsToReview: PropTypes.number\n  }),\n  icon: PropTypes.shape({\n    color: PropTypes.string,\n    name: PropTypes.string\n  }),\n  onExploreClick: PropTypes.func\n};\n\nexport type LearnerSkillCardProps = {\n  'aria-label'?: string;\n  cardIndex: number;\n  skillTitle: string;\n  skillAriaLabel?: string;\n  focus: boolean;\n  metrics: {\n    content: number;\n    score: number;\n    questionsToReview?: number;\n  };\n  icon: {\n    color: string;\n    name: string;\n  };\n  onExploreClick: () => void;\n};\n\nexport default propTypes;\n"],"mappings":"AAAA,OAAOA,SAAS,MAAM,YAAY;AAElC,MAAMC,SAAS,GAAG;EAChB,YAAY,EAAED,SAAS,CAACE,MAAM;EAC9BC,SAAS,EAAEH,SAAS,CAACI,MAAM;EAC3BC,UAAU,EAAEL,SAAS,CAACE,MAAM;EAC5BI,cAAc,EAAEN,SAAS,CAACE,MAAM;EAChCK,KAAK,EAAEP,SAAS,CAACQ,IAAI;EACrBC,OAAO,EAAET,SAAS,CAACU,KAAK,CAAC;IACvBC,OAAO,EAAEX,SAAS,CAACI,MAAM;IACzBQ,KAAK,EAAEZ,SAAS,CAACI,MAAM;IACvBS,iBAAiB,EAAEb,SAAS,CAACI;EAC/B,CAAC,CAAC;EACFU,IAAI,EAAEd,SAAS,CAACU,KAAK,CAAC;IACpBK,KAAK,EAAEf,SAAS,CAACE,MAAM;IACvBc,IAAI,EAAEhB,SAAS,CAACE;EAClB,CAAC,CAAC;EACFe,cAAc,EAAEjB,SAAS,CAACkB;AAC5B,CAAC;AAoBD,eAAejB,SAAS","ignoreList":[]}