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

package/es/template/skill-detail/continue-learning.js.map

@@ -1 +1 @@
-{"version":3,"file":"continue-learning.js","names":["React","useCallback","PropTypes","Provider","CardsGrid","CardsList","style","ContinueLearning","props","context","ongoingCourses","translate","Title","createElement","Fragment","className","continueLearningTitle","continueLearningNumber","list","length","cards","_sortBy","course","_getOr","title","customStyle","padding","contextTypes","skin","childContextTypes","propTypes","process","env","NODE_ENV","shape"],"sources":["../../../src/template/skill-detail/continue-learning.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr, sortBy} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport CardsGrid from '../../organism/cards-grid';\nimport CardsList from '../../molecule/dashboard/cards-list';\nimport style from './continue-learning.css';\n\nconst ContinueLearning = (props, context) => {\n  const {ongoingCourses} = props;\n  const {translate} = context;\n\n  const Title = useCallback(\n    () => (\n      <>\n        <span className={style.continueLearningTitle}>{translate('continue_learning')}</span>\n        <span className={style.continueLearningNumber}>{ongoingCourses.list.length}</span>\n      </>\n    ),\n    [ongoingCourses, translate]\n  );\n\n  if (ongoingCourses.list.length === 0) {\n    return null;\n  }\n\n  return (\n    <CardsList\n      cards={sortBy(course => -getOr(0, ['progress'], course), ongoingCourses.list)}\n      title={<Title />}\n      // to override CardList wrapper padding\n      customStyle={{padding: '0px'}}\n    />\n  );\n};\n\nContinueLearning.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nContinueLearning.propTypes = {\n  ongoingCourses: PropTypes.shape(CardsGrid.propTypes)\n};\n\nexport default ContinueLearning;\n"],"mappings":";;AAAA,OAAOA,KAAK,IAAGC,WAAW,QAAO,OAAO;AACxC,OAAOC,SAAS,MAAM,YAAY;AAElC,OAAOC,QAAQ,MAAM,qBAAqB;AAC1C,OAAOC,SAAS,MAAM,2BAA2B;AACjD,OAAOC,SAAS,MAAM,qCAAqC;AAC3D,OAAOC,KAAK,MAAM,yBAAyB;AAE3C,MAAMC,gBAAgB,GAAGA,CAACC,KAAK,EAAEC,OAAO,KAAK;EAC3C,MAAM;IAACC;EAAc,CAAC,GAAGF,KAAK;EAC9B,MAAM;IAACG;EAAS,CAAC,GAAGF,OAAO;EAE3B,MAAMG,KAAK,GAAGX,WAAW,CACvB,mBACED,KAAA,CAAAa,aAAA,CAAAb,KAAA,CAAAc,QAAA,qBACEd,KAAA,CAAAa,aAAA;IAAME,SAAS,EAAET,KAAK,CAACU;EAAsB,GAAEL,SAAS,CAAC,mBAAmB,CAAQ,CAAC,eACrFX,KAAA,CAAAa,aAAA;IAAME,SAAS,EAAET,KAAK,CAACW;EAAuB,GAAEP,cAAc,CAACQ,IAAI,CAACC,MAAa,CACjF,CACH,EACD,CAACT,cAAc,EAAEC,SAAS,CAC5B,CAAC;EAED,IAAID,cAAc,CAACQ,IAAI,CAACC,MAAM,KAAK,CAAC,EAAE;IACpC,OAAO,IAAI;EACb;EAEA,oBACEnB,KAAA,CAAAa,aAAA,CAACR,SAAS;IACRe,KAAK,EAAEC,OAAA,CAAOC,MAAM,IAAI,CAACC,MAAA,CAAM,CAAC,EAAE,CAAC,UAAU,CAAC,EAAED,MAAM,CAAC,EAAEZ,cAAc,CAACQ,IAAI,CAAE;IAC9EM,KAAK,eAAExB,KAAA,CAAAa,aAAA,CAACD,KAAK,MAAE;IACf;IAAA;IACAa,WAAW,EAAE;MAACC,OAAO,EAAE;IAAK;EAAE,CAC/B,CAAC;AAEN,CAAC;AAEDnB,gBAAgB,CAACoB,YAAY,GAAG;EAC9BC,IAAI,EAAEzB,QAAQ,CAAC0B,iBAAiB,CAACD,IAAI;EACrCjB,SAAS,EAAER,QAAQ,CAAC0B,iBAAiB,CAAClB;AACxC,CAAC;AAEDJ,gBAAgB,CAACuB,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAG;EAC3BvB,cAAc,EAAER,SAAS,CAACgC,KAAK,CAAC9B,SAAS,CAAC0B,SAAS;AACrD,CAAC;AAED,eAAevB,gBAAgB","ignoreList":[]}
+{"version":3,"file":"continue-learning.js","names":["React","useCallback","PropTypes","Provider","CardsGrid","CardsList","style","ContinueLearning","props","context","ongoingCourses","translate","Title","createElement","Fragment","className","continueLearningTitle","continueLearningNumber","list","length","cards","_sortBy","course","_getOr","title","customStyle","padding","contextTypes","skin","childContextTypes","propTypes","process","env","NODE_ENV","shape"],"sources":["../../../src/template/skill-detail/continue-learning.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr, sortBy} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport CardsGrid, {CardsGridProps} from '../../organism/cards-grid';\nimport CardsList from '../../molecule/dashboard/cards-list';\nimport style from './continue-learning.css';\n\ninterface ProviderContext {\n  skin: {\n    common: {\n      primary: string;\n      secondary: string;\n    };\n  };\n  translate: (key: string, options?: any) => string;\n}\n\nconst ContinueLearning = (props: {ongoingCourses: CardsGridProps}, context: ProviderContext) => {\n  const {ongoingCourses} = props;\n  const {translate} = context;\n\n  const Title = useCallback(\n    () => (\n      <>\n        <span className={style.continueLearningTitle}>{translate('continue_learning')}</span>\n        <span className={style.continueLearningNumber}>{ongoingCourses.list.length}</span>\n      </>\n    ),\n    [ongoingCourses, translate]\n  );\n\n  if (ongoingCourses.list.length === 0) {\n    return null;\n  }\n\n  return (\n    <CardsList\n      cards={sortBy(course => -getOr(0, ['progress'], course), ongoingCourses.list)}\n      title={<Title />}\n      // to override CardList wrapper padding\n      customStyle={{padding: '0px'}}\n    />\n  );\n};\n\nContinueLearning.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nContinueLearning.propTypes = {\n  ongoingCourses: PropTypes.shape(CardsGrid.propTypes)\n};\n\nexport default ContinueLearning;\n"],"mappings":";;AAAA,OAAOA,KAAK,IAAGC,WAAW,QAAO,OAAO;AACxC,OAAOC,SAAS,MAAM,YAAY;AAElC,OAAOC,QAAQ,MAAM,qBAAqB;AAC1C,OAAOC,SAAS,MAAwB,2BAA2B;AACnE,OAAOC,SAAS,MAAM,qCAAqC;AAC3D,OAAOC,KAAK,MAAM,yBAAyB;AAY3C,MAAMC,gBAAgB,GAAGA,CAACC,KAAuC,EAAEC,OAAwB,KAAK;EAC9F,MAAM;IAACC;EAAc,CAAC,GAAGF,KAAK;EAC9B,MAAM;IAACG;EAAS,CAAC,GAAGF,OAAO;EAE3B,MAAMG,KAAK,GAAGX,WAAW,CACvB,mBACED,KAAA,CAAAa,aAAA,CAAAb,KAAA,CAAAc,QAAA,qBACEd,KAAA,CAAAa,aAAA;IAAME,SAAS,EAAET,KAAK,CAACU;EAAsB,GAAEL,SAAS,CAAC,mBAAmB,CAAQ,CAAC,eACrFX,KAAA,CAAAa,aAAA;IAAME,SAAS,EAAET,KAAK,CAACW;EAAuB,GAAEP,cAAc,CAACQ,IAAI,CAACC,MAAa,CACjF,CACH,EACD,CAACT,cAAc,EAAEC,SAAS,CAC5B,CAAC;EAED,IAAID,cAAc,CAACQ,IAAI,CAACC,MAAM,KAAK,CAAC,EAAE;IACpC,OAAO,IAAI;EACb;EAEA,oBACEnB,KAAA,CAAAa,aAAA,CAACR,SAAS;IACRe,KAAK,EAAEC,OAAA,CAAOC,MAAM,IAAI,CAACC,MAAA,CAAM,CAAC,EAAE,CAAC,UAAU,CAAC,EAAED,MAAM,CAAC,EAAEZ,cAAc,CAACQ,IAAI,CAAE;IAC9EM,KAAK,eAAExB,KAAA,CAAAa,aAAA,CAACD,KAAK,MAAE;IACf;IAAA;IACAa,WAAW,EAAE;MAACC,OAAO,EAAE;IAAK;EAAE,CAC/B,CAAC;AAEN,CAAC;AAEDnB,gBAAgB,CAACoB,YAAY,GAAG;EAC9BC,IAAI,EAAEzB,QAAQ,CAAC0B,iBAAiB,CAACD,IAAI;EACrCjB,SAAS,EAAER,QAAQ,CAAC0B,iBAAiB,CAAClB;AACxC,CAAC;AAEDJ,gBAAgB,CAACuB,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAG;EAC3BvB,cAAc,EAAER,SAAS,CAACgC,KAAK,CAAC9B,SAAS,CAAC0B,SAAS;AACrD,CAAC;AAED,eAAevB,gBAAgB","ignoreList":[]}

package/es/template/skill-detail/index.d.ts

@@ -1,7 +1,23 @@
-export function ContinueLearningButton(props: any, context: any): JSX.Element;
-export namespace ContinueLearningButton {
-    namespace contextTypes {
-        const skin: PropTypes.Requireable<PropTypes.InferProps<{
+/// <reference types="react" />
+import PropTypes from 'prop-types';
+import { CardsGridProps } from '../../organism/cards-grid';
+interface ContinueLearningButtonProps {
+    ongoingCoursesAvailable?: boolean;
+    onClick?: () => void;
+}
+interface ProviderContext {
+    skin: {
+        common: {
+            primary: string;
+            secondary: string;
+        };
+    };
+    translate: (key: string) => string;
+}
+export declare const ContinueLearningButton: {
+    (props: ContinueLearningButtonProps, context: ProviderContext): JSX.Element;
+    contextTypes: {
+        skin: PropTypes.Requireable<PropTypes.InferProps<{
             common: PropTypes.Requireable<{
                 [x: string]: any;
             }>;
@@ -22,19 +38,49 @@ export namespace ContinueLearningButton {
                 [x: string]: any;
             }>;
         }>>;
-        const translate: PropTypes.Requireable<(...args: any[]) => any>;
-    }
-    namespace propTypes {
-        const ongoingCoursesAvailable: PropTypes.Requireable<boolean>;
-        const onClick: PropTypes.Requireable<(...args: any[]) => any>;
-    }
+        translate: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    propTypes: {
+        ongoingCoursesAvailable: PropTypes.Requireable<boolean>;
+        onClick: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+};
+interface Metrics {
+    score?: number;
+    questionsToReview?: number;
+    totalContents?: number;
 }
-export default SkillDetail;
-import PropTypes from "prop-types";
-declare function SkillDetail(props: any, context: any): JSX.Element;
-declare namespace SkillDetail {
-    export namespace contextTypes_1 {
-        const skin_1: PropTypes.Requireable<PropTypes.InferProps<{
+declare type BannerMicrolearning = Record<string, never> | {
+    action: () => void;
+    oldSwitchValue: boolean;
+};
+interface SkillDetailProps {
+    title: string;
+    skillRef: string;
+    description?: string;
+    metrics?: Metrics;
+    focused?: boolean;
+    availableForReview?: boolean;
+    ongoingCoursesAvailable?: boolean;
+    skillIncludedCourses: CardsGridProps;
+    filters: {
+        onChange?: () => void;
+        options?: unknown[];
+    };
+    onBackClick?: () => void;
+    onReviewClick?: () => void;
+    onContinueLearningClick?: () => void;
+    search: {
+        oldValue: string;
+        onChange: () => void;
+    };
+    bannerMicrolearning?: BannerMicrolearning;
+}
+declare const SkillDetail: {
+    (props: SkillDetailProps, context: ProviderContext): JSX.Element;
+    contextTypes: {
+        translate: PropTypes.Requireable<(...args: any[]) => any>;
+        skin: PropTypes.Requireable<PropTypes.InferProps<{
             common: PropTypes.Requireable<{
                 [x: string]: any;
             }>;
@@ -55,32 +101,27 @@ declare namespace SkillDetail {
                 [x: string]: any;
             }>;
         }>>;
-        export { skin_1 as skin };
-        const translate_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { translate_1 as translate };
-    }
-    export { contextTypes_1 as contextTypes };
-    export namespace propTypes_1 {
-        export const title: PropTypes.Validator<string>;
-        export const skillRef: PropTypes.Validator<string>;
-        export const description: PropTypes.Requireable<string>;
-        export const metrics: PropTypes.Requireable<PropTypes.InferProps<{
+    };
+    propTypes: {
+        title: PropTypes.Validator<string>;
+        skillRef: PropTypes.Validator<string>;
+        description: PropTypes.Requireable<string>;
+        metrics: PropTypes.Requireable<PropTypes.InferProps<{
             score: PropTypes.Requireable<number>;
             questionsToReview: PropTypes.Requireable<number>;
             totalContents: PropTypes.Requireable<number>;
         }>>;
-        export const focused: PropTypes.Requireable<boolean>;
-        export const availableForReview: PropTypes.Requireable<boolean>;
-        const ongoingCoursesAvailable_1: PropTypes.Requireable<boolean>;
-        export { ongoingCoursesAvailable_1 as ongoingCoursesAvailable };
-        export const skillIncludedCourses: PropTypes.Requireable<PropTypes.InferProps<{
+        focused: PropTypes.Requireable<boolean>;
+        availableForReview: PropTypes.Requireable<boolean>;
+        ongoingCoursesAvailable: PropTypes.Requireable<boolean>;
+        skillIncludedCourses: PropTypes.Requireable<PropTypes.InferProps<{
             list: PropTypes.Requireable<(PropTypes.InferProps<any> | null | undefined)[]>;
             customStyle: PropTypes.Requireable<{
                 [x: string]: string | null | undefined;
             }>;
             loading: PropTypes.Requireable<boolean>;
         }>>;
-        export const filters: PropTypes.Requireable<PropTypes.InferProps<{
+        filters: PropTypes.Requireable<PropTypes.InferProps<{
             onChange: PropTypes.Requireable<(...args: any[]) => any>;
             options: PropTypes.Requireable<(PropTypes.InferProps<{
                 name: PropTypes.Validator<string>;
@@ -89,49 +130,18 @@ declare namespace SkillDetail {
                 validOption: PropTypes.Requireable<boolean>;
             }> | null | undefined)[]>;
         }>>;
-        export const sorting: PropTypes.Requireable<PropTypes.InferProps<{
-            title: PropTypes.Requireable<string>;
-            name: PropTypes.Requireable<string>;
-            className: PropTypes.Requireable<string>;
-            borderClassName: PropTypes.Requireable<string>;
-            disabled: PropTypes.Requireable<boolean>;
-            multiple: PropTypes.Requireable<boolean>;
-            description: PropTypes.Requireable<string>;
-            required: PropTypes.Requireable<boolean>;
-            onChange: PropTypes.Requireable<(...args: any[]) => any>;
-            theme: PropTypes.Requireable<string>;
-            options: PropTypes.Requireable<(PropTypes.InferProps<{
-                name: PropTypes.Validator<string>;
-                value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                selected: PropTypes.Requireable<boolean>;
-                validOption: PropTypes.Requireable<boolean>;
-            }> | null | undefined)[]>;
-            optgroups: PropTypes.Requireable<(PropTypes.InferProps<{
-                label: PropTypes.Validator<string>;
-                options: PropTypes.Requireable<(PropTypes.InferProps<{
-                    name: PropTypes.Validator<string>;
-                    value: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-                    selected: PropTypes.Requireable<boolean>;
-                    validOption: PropTypes.Requireable<boolean>;
-                }> | null | undefined)[]>;
-            }> | null | undefined)[]>;
-            modified: PropTypes.Requireable<boolean>;
-            error: PropTypes.Requireable<boolean>;
-            'aria-label': PropTypes.Requireable<string>;
-            'aria-labelledby': PropTypes.Requireable<string>;
-        }>>;
-        export const onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
-        export const onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
-        export const onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;
-        export const search: PropTypes.Requireable<PropTypes.InferProps<{
+        onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
+        onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;
+        search: PropTypes.Requireable<PropTypes.InferProps<{
             oldValue: PropTypes.Requireable<string>;
             onChange: PropTypes.Requireable<(...args: any[]) => any>;
         }>>;
-        export const bannerMicrolearning: PropTypes.Requireable<PropTypes.InferProps<{
+        bannerMicrolearning: PropTypes.Requireable<PropTypes.InferProps<{
             action: PropTypes.Requireable<(...args: any[]) => any>;
             oldSwitchValue: PropTypes.Requireable<boolean>;
         }>>;
-    }
-    export { propTypes_1 as propTypes };
-}
+    };
+};
+export default SkillDetail;
 //# sourceMappingURL=index.d.ts.map

package/es/template/skill-detail/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.js"],"names":[],"mappings":"AAeO,8EA+BN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYD,oEAgKC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/index.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAUnC,OAAkB,EAAC,cAAc,EAAC,MAAM,2BAA2B,CAAC;AAMpE,UAAU,2BAA2B;IACnC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AACD,UAAU,eAAe;IACvB,IAAI,EAAE;QACJ,MAAM,EAAE;YACN,OAAO,EAAE,MAAM,CAAC;YAChB,SAAS,EAAE,MAAM,CAAC;SACnB,CAAC;KACH,CAAC;IACF,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;CACpC;AAED,eAAO,MAAM,sBAAsB;YAC1B,2BAA2B,WACzB,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BzB,CAAC;AAYF,UAAU,OAAO;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,aAAK,mBAAmB,GACpB,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,GACrB;IACE,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,cAAc,EAAE,OAAO,CAAC;CACzB,CAAC;AACN,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,oBAAoB,EAAE,cAAc,CAAC;IACrC,OAAO,EAAE;QACP,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;QACtB,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;KACrB,CAAC;IACF,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;IACrC,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC;IACF,mBAAmB,CAAC,EAAE,mBAAmB,CAAC;CAC3C;AACD,QAAA,MAAM,WAAW;YAAW,gBAAgB,WAAW,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyMrE,CAAC;AAqCF,eAAe,WAAW,CAAC"}

package/es/template/skill-detail/index.js

@@ -2,17 +2,19 @@ import _isNil from "lodash/fp/isNil";
 import _get from "lodash/fp/get";
 import React, { useCallback, useState, useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import { convert } from 'css-color-function';
 import classnames from 'classnames';
 import Markdown from 'markdown-to-jsx';
+import { convert } from 'css-color-function';
 import Provider from '../../atom/provider';
-import Select, { SelectOptionPropTypes } from '../../atom/select';
-import ButtonLink from '../../atom/button-link';
 import ButtonLinkIcon from '../../atom/button-link-icon';
 import Icon from '../../atom/icon';
+import IconPreview from '../../molecule/icon-preview';
+import ButtonLink from '../../atom/button-link';
 import CardsGrid from '../../organism/cards-grid';
-import style from './style.css';
+import { COLORS } from '../../variables/colors';
+import { SelectOptionPropTypes } from '../../atom/select';
 import AllCourses from './all-courses';
+import style from './style.css';
 export const ContinueLearningButton = (props, context) => {
   const {
     ongoingCoursesAvailable,
@@ -23,7 +25,7 @@ export const ContinueLearningButton = (props, context) => {
     translate
   } = context;
   const primarySkinColor = _get('common.primary', skin);
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ButtonLink, {
+  return /*#__PURE__*/React.createElement(ButtonLink, {
     label: ongoingCoursesAvailable ? translate('continue_learning') : translate('start_learning'),
     type: "primary",
     customStyle: {
@@ -32,17 +34,17 @@ export const ContinueLearningButton = (props, context) => {
       backgroundColor: primarySkinColor
     },
     hoverBackgroundColor: convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`),
-    hoverColor: "#FFFFFF",
+    hoverColor: COLORS.white,
     icon: {
       position: 'left',
       faIcon: {
         name: 'play',
-        color: '#FFFFFF',
-        size: 16
+        color: COLORS.white,
+        size: 14
       }
     },
     onClick: onClick
-  }));
+  });
 };
 ContinueLearningButton.contextTypes = {
   skin: Provider.childContextTypes.skin,
@@ -63,29 +65,27 @@ const SkillDetail = (props, context) => {
     ongoingCoursesAvailable,
     skillIncludedCourses,
     filters,
-    sorting,
     onBackClick,
     onReviewClick,
     onContinueLearningClick,
     search,
-    bannerMicrolearning = {}
+    bannerMicrolearning
   } = props;
-  const descriptionRef = useRef(null);
   const {
     score = 0,
-    questionsToReview,
-    totalContents
+    questionsToReview = 0,
+    totalContents = 0
   } = metrics;
   const {
     translate
   } = context;
-  const {
-    action: bannerMicrolearningAction,
-    oldSwitchValue
-  } = bannerMicrolearning;
+  const bannerMicrolearningAction = bannerMicrolearning?.action;
+  const descriptionRef = useRef(null);
   const [isDescriptionTruncated, setIsDescriptionTruncated] = useState(false);
   const [showMore, setShowMore] = useState(false);
-  const handleShowMore = useCallback(() => setShowMore(!showMore), [setShowMore, showMore]);
+  const handleShowMore = useCallback(() => {
+    setShowMore(!showMore);
+  }, [showMore]);
   useEffect(() => {
     if (descriptionRef.current) {
       const {
@@ -99,29 +99,39 @@ const SkillDetail = (props, context) => {
     return /*#__PURE__*/React.createElement("div", {
       ref: descriptionRef,
       className: classnames(style.description, !showMore && style.truncate)
-    }, /*#__PURE__*/React.createElement(Markdown, null, description));
+    }, description ? /*#__PURE__*/React.createElement(Markdown, null, description) : null);
   }, [showMore, description]);
   const ProgressBar = useCallback(() => {
-    if (score === undefined) return null;
-    const progressBarColor = '#3EC483';
-    const inlineProgressValueStyle = {
+    if (typeof score !== 'number') return null;
+    const progressBarColor = COLORS.cm_positive_500;
+    const inlineProgressStyle = {
       backgroundColor: progressBarColor,
       width: `${score}%`
     };
     return /*#__PURE__*/React.createElement("div", {
+      className: style.progressBarRow
+    }, /*#__PURE__*/React.createElement("div", {
       className: style.progressBarWrapper
     }, /*#__PURE__*/React.createElement("div", {
       "data-name": "progress",
       className: style.progress,
-      style: inlineProgressValueStyle,
-      role: "progressbar"
-    }));
+      style: inlineProgressStyle,
+      role: "progressbar",
+      "aria-valuenow": score,
+      "aria-valuemin": 0,
+      "aria-valuemax": 100
+    })), /*#__PURE__*/React.createElement("span", {
+      className: style.progressInformationNumber
+    }, score.toFixed(1), "%"));
   }, [score]);
+  const hasDescription = Boolean(description && description.trim().length > 0);
   return /*#__PURE__*/React.createElement("div", {
     className: style.backgroundContainer
   }, /*#__PURE__*/React.createElement("div", {
     className: style.container,
     "data-name": skillRef
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.topSection
   }, !_isNil(onBackClick) ? /*#__PURE__*/React.createElement(ButtonLinkIcon, {
     faIcon: "arrow-left",
     "data-name": "back-button",
@@ -129,67 +139,91 @@ const SkillDetail = (props, context) => {
     onClick: onBackClick,
     className: style.backButton,
     tooltipPlacement: "right"
-  }) : null, /*#__PURE__*/React.createElement("div", {
-    className: style.ctaContainer
-  }, /*#__PURE__*/React.createElement("div", null, focused ? /*#__PURE__*/React.createElement("div", {
+  }) : null), /*#__PURE__*/React.createElement("div", {
+    className: style.mainSection
+  }, /*#__PURE__*/React.createElement("div", {
+    className: style.leftSide
+  }, /*#__PURE__*/React.createElement(IconPreview, {
+    icon: {
+      name: 'bullseye-arrow',
+      color: COLORS.purple_100
+    },
+    title: title
+  })), /*#__PURE__*/React.createElement("div", {
+    className: style.rightSide
+  }, focused ? /*#__PURE__*/React.createElement("div", {
     className: style.skillFocusBadge
   }, /*#__PURE__*/React.createElement(Icon, {
     iconName: "bullseye-arrow",
-    backgroundColor: "#DDD1FF",
+    backgroundColor: COLORS.purple_100,
+    size: {
+      faSize: 10,
+      wrapperSize: 16
+    }
+  }), translate('skill_focus')) : /*#__PURE__*/React.createElement("div", {
+    className: style.skillBadge
+  }, /*#__PURE__*/React.createElement(Icon, {
+    iconName: "shapes",
+    backgroundColor: COLORS.gray,
     size: {
       faSize: 10,
       wrapperSize: 16
     }
-  }), translate('skill_focus')) : null, /*#__PURE__*/React.createElement("div", {
+  }), translate('skill')), /*#__PURE__*/React.createElement("h2", {
     className: style.title
-  }, title), description ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Description, null), isDescriptionTruncated ? /*#__PURE__*/React.createElement("div", {
+  }, title), description && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Description, null), isDescriptionTruncated ? /*#__PURE__*/React.createElement("div", {
     className: style.showMoreWrapper,
     onClick: handleShowMore
   }, showMore ? translate('Show less') : translate('Show more'), /*#__PURE__*/React.createElement(Icon, {
     iconName: showMore ? 'chevron-up' : 'chevron-down',
     size: {
       faSize: 14,
-      wrapperSize: 16
+      wrapperSize: 14
+    },
+    customStyle: {
+      padding: '8px'
     }
-  })) : null) : null), /*#__PURE__*/React.createElement("div", {
+  })) : null), questionsToReview > 0 ? /*#__PURE__*/React.createElement("div", {
+    className: style.skillInformation
+  }, /*#__PURE__*/React.createElement("span", null, questionsToReview), "\xA0", translate('skill_chart_side_panel_questions_to_review')) : null, /*#__PURE__*/React.createElement("div", {
+    className: classnames(style.progressContainer, !hasDescription && style.noDescriptionSpacing)
+  }, /*#__PURE__*/React.createElement(ProgressBar, null)), /*#__PURE__*/React.createElement("div", {
     className: style.ctaWrapper
-  }, /*#__PURE__*/React.createElement(ButtonLink, {
+  }, /*#__PURE__*/React.createElement(ContinueLearningButton, {
+    ongoingCoursesAvailable: ongoingCoursesAvailable,
+    onClick: onContinueLearningClick
+  }), /*#__PURE__*/React.createElement(ButtonLink, {
     type: "secondary",
-    onClick: onReviewClick,
     label: translate('review_this_skill'),
     disabled: !availableForReview,
+    onClick: onReviewClick,
+    icon: {
+      position: 'left',
+      faIcon: {
+        name: 'rotate-right',
+        color: COLORS.cm_grey_700,
+        size: 14
+      }
+    },
     customStyle: {
-      width: 'fit-content',
-      borderRadius: '12px'
+      borderRadius: '12px',
+      width: 'fit-content'
     }
-  }), /*#__PURE__*/React.createElement(ContinueLearningButton, {
-    ongoingCoursesAvailable: ongoingCoursesAvailable,
-    onClick: onContinueLearningClick
-  }))), questionsToReview > 0 ? /*#__PURE__*/React.createElement("div", {
-    className: style.skillInformation,
-    "data-name": "skill-questions"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: style.skillInformationNumber
-  }, questionsToReview), "\xA0", translate('skill_chart_side_panel_questions_to_review')) : null, /*#__PURE__*/React.createElement("div", {
-    className: style.progressContainer
-  }, /*#__PURE__*/React.createElement(ProgressBar, null), /*#__PURE__*/React.createElement("span", {
-    className: style.progressInformationNumber
-  }, score.toFixed(1), "%")), /*#__PURE__*/React.createElement(AllCourses, {
+  })))), /*#__PURE__*/React.createElement(AllCourses, {
     content: skillIncludedCourses,
     filters: filters,
-    sorting: sorting,
     totalContents: totalContents,
-    bannerMicrolearning: bannerMicrolearningAction ? {
+    bannerMicrolearning: bannerMicrolearning && bannerMicrolearningAction ? {
       type: 'skill',
       action: bannerMicrolearningAction,
-      oldSwitchValue
-    } : {},
+      oldSwitchValue: bannerMicrolearning.oldSwitchValue
+    } : undefined,
     search: search
   })));
 };
 SkillDetail.contextTypes = {
-  skin: Provider.childContextTypes.skin,
-  translate: Provider.childContextTypes.translate
+  translate: Provider.childContextTypes.translate,
+  skin: Provider.childContextTypes.skin
 };
 SkillDetail.propTypes = process.env.NODE_ENV !== "production" ? {
   title: PropTypes.string.isRequired,
@@ -208,7 +242,6 @@ SkillDetail.propTypes = process.env.NODE_ENV !== "production" ? {
     onChange: PropTypes.func,
     options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))
   }),
-  sorting: PropTypes.shape(Select.propTypes),
   onBackClick: PropTypes.func,
   onReviewClick: PropTypes.func,
   onContinueLearningClick: PropTypes.func,

package/es/template/skill-detail/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useState","useRef","useEffect","PropTypes","convert","classnames","Markdown","Provider","Select","SelectOptionPropTypes","ButtonLink","ButtonLinkIcon","Icon","CardsGrid","style","AllCourses","ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","_get","createElement","label","type","customStyle","width","borderRadius","backgroundColor","hoverBackgroundColor","hoverColor","icon","position","faIcon","name","color","size","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","bool","func","SkillDetail","title","skillRef","description","metrics","focused","availableForReview","skillIncludedCourses","filters","sorting","onBackClick","onReviewClick","onContinueLearningClick","search","bannerMicrolearning","descriptionRef","score","questionsToReview","totalContents","action","bannerMicrolearningAction","oldSwitchValue","isDescriptionTruncated","setIsDescriptionTruncated","showMore","setShowMore","handleShowMore","current","clientHeight","scrollHeight","Description","ref","className","truncate","ProgressBar","undefined","progressBarColor","inlineProgressValueStyle","progressBarWrapper","progress","role","backgroundContainer","container","_isNil","backButton","tooltipPlacement","ctaContainer","skillFocusBadge","iconName","faSize","wrapperSize","Fragment","showMoreWrapper","ctaWrapper","disabled","skillInformation","skillInformationNumber","progressContainer","progressInformationNumber","toFixed","content","string","isRequired","shape","number","onChange","options","arrayOf","oldValue"],"sources":["../../../src/template/skill-detail/index.js"],"sourcesContent":["import React, {useCallback, useState, useRef, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport {convert} from 'css-color-function';\nimport classnames from 'classnames';\nimport {get, isNil} from 'lodash/fp';\nimport Markdown from 'markdown-to-jsx';\nimport Provider from '../../atom/provider';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport ButtonLinkIcon from '../../atom/button-link-icon';\nimport Icon from '../../atom/icon';\nimport CardsGrid from '../../organism/cards-grid';\nimport style from './style.css';\nimport AllCourses from './all-courses';\n\nexport const ContinueLearningButton = (props, context) => {\n  const {ongoingCoursesAvailable, onClick} = props;\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <div>\n      <ButtonLink\n        label={\n          ongoingCoursesAvailable ? translate('continue_learning') : translate('start_learning')\n        }\n        type=\"primary\"\n        customStyle={{\n          width: 'fit-content',\n          borderRadius: '12px',\n          backgroundColor: primarySkinColor\n        }}\n        hoverBackgroundColor={convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`)}\n        hoverColor=\"#FFFFFF\"\n        icon={{\n          position: 'left',\n          faIcon: {\n            name: 'play',\n            color: '#FFFFFF',\n            size: 16\n          }\n        }}\n        onClick={onClick}\n      />\n    </div>\n  );\n};\n\nContinueLearningButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nContinueLearningButton.propTypes = {\n  ongoingCoursesAvailable: PropTypes.bool,\n  onClick: PropTypes.func\n};\n\nconst SkillDetail = (props, context) => {\n  const {\n    title,\n    skillRef,\n    description,\n    metrics = {},\n    focused,\n    availableForReview,\n    ongoingCoursesAvailable,\n    skillIncludedCourses,\n    filters,\n    sorting,\n    onBackClick,\n    onReviewClick,\n    onContinueLearningClick,\n    search,\n    bannerMicrolearning = {}\n  } = props;\n  const descriptionRef = useRef(null);\n  const {score = 0, questionsToReview, totalContents} = metrics;\n  const {translate} = context;\n  const {action: bannerMicrolearningAction, oldSwitchValue} = bannerMicrolearning;\n\n  const [isDescriptionTruncated, setIsDescriptionTruncated] = useState(false);\n  const [showMore, setShowMore] = useState(false);\n\n  const handleShowMore = useCallback(() => setShowMore(!showMore), [setShowMore, showMore]);\n\n  useEffect(() => {\n    if (descriptionRef.current) {\n      const {clientHeight = 0, scrollHeight = 0} = descriptionRef.current;\n      setIsDescriptionTruncated(scrollHeight > clientHeight);\n    }\n  }, [description]);\n\n  const Description = useCallback(() => {\n    return (\n      <div\n        ref={descriptionRef}\n        className={classnames(style.description, !showMore && style.truncate)}\n      >\n        <Markdown>{description}</Markdown>\n      </div>\n    );\n  }, [showMore, description]);\n\n  const ProgressBar = useCallback(() => {\n    if (score === undefined) return null;\n    const progressBarColor = '#3EC483';\n    const inlineProgressValueStyle = {\n      backgroundColor: progressBarColor,\n      width: `${score}%`\n    };\n\n    return (\n      <div className={style.progressBarWrapper}>\n        <div\n          data-name=\"progress\"\n          className={style.progress}\n          style={inlineProgressValueStyle}\n          role=\"progressbar\"\n        />\n      </div>\n    );\n  }, [score]);\n\n  return (\n    <div className={style.backgroundContainer}>\n      <div className={style.container} data-name={skillRef}>\n        {!isNil(onBackClick) ? (\n          <ButtonLinkIcon\n            faIcon=\"arrow-left\"\n            data-name=\"back-button\"\n            aria-label={translate('back')}\n            onClick={onBackClick}\n            className={style.backButton}\n            tooltipPlacement=\"right\"\n          />\n        ) : null}\n        <div className={style.ctaContainer}>\n          <div>\n            {focused ? (\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                {translate('skill_focus')}\n              </div>\n            ) : null}\n            <div className={style.title}>{title}</div>\n            {description ? (\n              <>\n                <Description />\n                {isDescriptionTruncated ? (\n                  <div className={style.showMoreWrapper} onClick={handleShowMore}>\n                    {showMore ? translate('Show less') : translate('Show more')}\n                    <Icon\n                      iconName={showMore ? 'chevron-up' : 'chevron-down'}\n                      size={{\n                        faSize: 14,\n                        wrapperSize: 16\n                      }}\n                    />\n                  </div>\n                ) : null}\n              </>\n            ) : null}\n          </div>\n\n          <div className={style.ctaWrapper}>\n            <ButtonLink\n              type=\"secondary\"\n              onClick={onReviewClick}\n              label={translate('review_this_skill')}\n              disabled={!availableForReview}\n              customStyle={{\n                width: 'fit-content',\n                borderRadius: '12px'\n              }}\n            />\n            <ContinueLearningButton\n              ongoingCoursesAvailable={ongoingCoursesAvailable}\n              onClick={onContinueLearningClick}\n            />\n          </div>\n        </div>\n        {questionsToReview > 0 ? (\n          <div className={style.skillInformation} data-name=\"skill-questions\">\n            <span className={style.skillInformationNumber}>{questionsToReview}</span>\n            &nbsp;{translate('skill_chart_side_panel_questions_to_review')}\n          </div>\n        ) : null}\n        <div className={style.progressContainer}>\n          <ProgressBar />\n          <span className={style.progressInformationNumber}>{score.toFixed(1)}%</span>\n        </div>\n        <AllCourses\n          content={skillIncludedCourses}\n          filters={filters}\n          sorting={sorting}\n          totalContents={totalContents}\n          bannerMicrolearning={\n            bannerMicrolearningAction\n              ? {\n                  type: 'skill',\n                  action: bannerMicrolearningAction,\n                  oldSwitchValue\n                }\n              : {}\n          }\n          search={search}\n        />\n      </div>\n    </div>\n  );\n};\n\nSkillDetail.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nSkillDetail.propTypes = {\n  title: PropTypes.string.isRequired,\n  skillRef: PropTypes.string.isRequired,\n  description: PropTypes.string,\n  metrics: PropTypes.shape({\n    score: PropTypes.number,\n    questionsToReview: PropTypes.number,\n    totalContents: PropTypes.number\n  }),\n  focused: PropTypes.bool,\n  availableForReview: PropTypes.bool,\n  ongoingCoursesAvailable: PropTypes.bool,\n  skillIncludedCourses: PropTypes.shape(CardsGrid.propTypes),\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n  }),\n  sorting: PropTypes.shape(Select.propTypes),\n  onBackClick: PropTypes.func,\n  onReviewClick: PropTypes.func,\n  onContinueLearningClick: PropTypes.func,\n  search: PropTypes.shape({\n    oldValue: PropTypes.string,\n    onChange: PropTypes.func\n  }),\n  bannerMicrolearning: PropTypes.shape({\n    action: PropTypes.func,\n    oldSwitchValue: PropTypes.bool\n  })\n};\n\nexport default SkillDetail;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useCallback","useState","useRef","useEffect","PropTypes","classnames","Markdown","convert","Provider","ButtonLinkIcon","Icon","IconPreview","ButtonLink","CardsGrid","COLORS","SelectOptionPropTypes","AllCourses","style","ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","_get","createElement","label","type","customStyle","width","borderRadius","backgroundColor","hoverBackgroundColor","hoverColor","white","icon","position","faIcon","name","color","size","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","bool","func","SkillDetail","title","skillRef","description","metrics","focused","availableForReview","skillIncludedCourses","filters","onBackClick","onReviewClick","onContinueLearningClick","search","bannerMicrolearning","score","questionsToReview","totalContents","bannerMicrolearningAction","action","descriptionRef","isDescriptionTruncated","setIsDescriptionTruncated","showMore","setShowMore","handleShowMore","current","clientHeight","scrollHeight","Description","ref","className","truncate","ProgressBar","progressBarColor","cm_positive_500","inlineProgressStyle","progressBarRow","progressBarWrapper","progress","role","progressInformationNumber","toFixed","hasDescription","Boolean","trim","length","backgroundContainer","container","topSection","_isNil","backButton","tooltipPlacement","mainSection","leftSide","purple_100","rightSide","skillFocusBadge","iconName","faSize","wrapperSize","skillBadge","gray","Fragment","showMoreWrapper","padding","skillInformation","progressContainer","noDescriptionSpacing","ctaWrapper","disabled","cm_grey_700","content","oldSwitchValue","undefined","string","isRequired","shape","number","onChange","options","arrayOf","oldValue"],"sources":["../../../src/template/skill-detail/index.tsx"],"sourcesContent":["import React, {useCallback, useState, useRef, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {get, isNil} from 'lodash/fp';\nimport Markdown from 'markdown-to-jsx';\nimport {convert} from 'css-color-function';\nimport Provider from '../../atom/provider';\nimport ButtonLinkIcon from '../../atom/button-link-icon';\nimport Icon from '../../atom/icon';\nimport IconPreview from '../../molecule/icon-preview';\nimport ButtonLink from '../../atom/button-link';\nimport CardsGrid, {CardsGridProps} from '../../organism/cards-grid';\nimport {COLORS} from '../../variables/colors';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport AllCourses from './all-courses';\nimport style from './style.css';\n\ninterface ContinueLearningButtonProps {\n  ongoingCoursesAvailable?: boolean;\n  onClick?: () => void;\n}\ninterface ProviderContext {\n  skin: {\n    common: {\n      primary: string;\n      secondary: string;\n    };\n  };\n  translate: (key: string) => string;\n}\n\nexport const ContinueLearningButton = (\n  props: ContinueLearningButtonProps,\n  context: ProviderContext\n) => {\n  const {ongoingCoursesAvailable, onClick} = props;\n  const {skin, translate} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  return (\n    <ButtonLink\n      label={ongoingCoursesAvailable ? translate('continue_learning') : translate('start_learning')}\n      type=\"primary\"\n      customStyle={{\n        width: 'fit-content',\n        borderRadius: '12px',\n        backgroundColor: primarySkinColor\n      }}\n      hoverBackgroundColor={convert(`hsl(from ${primarySkinColor} h s calc(l*(1 - 0.08)))`)}\n      hoverColor={COLORS.white}\n      icon={{\n        position: 'left',\n        faIcon: {\n          name: 'play',\n          color: COLORS.white,\n          size: 14\n        }\n      }}\n      onClick={onClick}\n    />\n  );\n};\n\nContinueLearningButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nContinueLearningButton.propTypes = {\n  ongoingCoursesAvailable: PropTypes.bool,\n  onClick: PropTypes.func\n};\n\ninterface Metrics {\n  score?: number;\n  questionsToReview?: number;\n  totalContents?: number;\n}\n\ntype BannerMicrolearning =\n  | Record<string, never>\n  | {\n      action: () => void;\n      oldSwitchValue: boolean;\n    };\ninterface SkillDetailProps {\n  title: string;\n  skillRef: string;\n  description?: string;\n  metrics?: Metrics;\n  focused?: boolean;\n  availableForReview?: boolean;\n  ongoingCoursesAvailable?: boolean;\n  skillIncludedCourses: CardsGridProps;\n  filters: {\n    onChange?: () => void;\n    options?: unknown[];\n  };\n  onBackClick?: () => void;\n  onReviewClick?: () => void;\n  onContinueLearningClick?: () => void;\n  search: {\n    oldValue: string;\n    onChange: () => void;\n  };\n  bannerMicrolearning?: BannerMicrolearning;\n}\nconst SkillDetail = (props: SkillDetailProps, context: ProviderContext) => {\n  const {\n    title,\n    skillRef,\n    description,\n    metrics = {},\n    focused,\n    availableForReview,\n    ongoingCoursesAvailable,\n    skillIncludedCourses,\n    filters,\n    onBackClick,\n    onReviewClick,\n    onContinueLearningClick,\n    search,\n    bannerMicrolearning\n  } = props;\n\n  const {score = 0, questionsToReview = 0, totalContents = 0} = metrics;\n  const {translate} = context;\n  const bannerMicrolearningAction = bannerMicrolearning?.action;\n  const descriptionRef = useRef(null);\n  const [isDescriptionTruncated, setIsDescriptionTruncated] = useState(false);\n  const [showMore, setShowMore] = useState(false);\n\n  const handleShowMore = useCallback(() => {\n    setShowMore(!showMore);\n  }, [showMore]);\n\n  useEffect(() => {\n    if (descriptionRef.current) {\n      const {clientHeight = 0, scrollHeight = 0} = descriptionRef.current;\n      setIsDescriptionTruncated(scrollHeight > clientHeight);\n    }\n  }, [description]);\n\n  const Description = useCallback(() => {\n    return (\n      <div\n        ref={descriptionRef}\n        className={classnames(style.description, !showMore && style.truncate)}\n      >\n        {description ? <Markdown>{description}</Markdown> : null}\n      </div>\n    );\n  }, [showMore, description]);\n\n  const ProgressBar = useCallback(() => {\n    if (typeof score !== 'number') return null;\n\n    const progressBarColor = COLORS.cm_positive_500;\n    const inlineProgressStyle = {\n      backgroundColor: progressBarColor,\n      width: `${score}%`\n    };\n\n    return (\n      <div className={style.progressBarRow}>\n        <div className={style.progressBarWrapper}>\n          <div\n            data-name=\"progress\"\n            className={style.progress}\n            style={inlineProgressStyle}\n            role=\"progressbar\"\n            aria-valuenow={score}\n            aria-valuemin={0}\n            aria-valuemax={100}\n          />\n        </div>\n        <span className={style.progressInformationNumber}>{score.toFixed(1)}%</span>\n      </div>\n    );\n  }, [score]);\n  const hasDescription = Boolean(description && description.trim().length > 0);\n\n  return (\n    <div className={style.backgroundContainer}>\n      <div className={style.container} data-name={skillRef}>\n        {/* Top section for the back arrow (optional) */}\n        <div className={style.topSection}>\n          {!isNil(onBackClick) ? (\n            <ButtonLinkIcon\n              faIcon=\"arrow-left\"\n              data-name=\"back-button\"\n              aria-label={translate('back')}\n              onClick={onBackClick}\n              className={style.backButton}\n              tooltipPlacement=\"right\"\n            />\n          ) : null}\n        </div>\n\n        {/* Main section: icon on the left, skill info on the right */}\n        <div className={style.mainSection}>\n          <div className={style.leftSide}>\n            <IconPreview\n              icon={{\n                name: 'bullseye-arrow',\n                color: COLORS.purple_100\n              }}\n              title={title}\n            />\n          </div>\n          <div className={style.rightSide}>\n            {focused ? (\n              <div className={style.skillFocusBadge}>\n                <Icon\n                  iconName=\"bullseye-arrow\"\n                  backgroundColor={COLORS.purple_100}\n                  size={{faSize: 10, wrapperSize: 16}}\n                />\n                {translate('skill_focus')}\n              </div>\n            ) : (\n              <div className={style.skillBadge}>\n                <Icon\n                  iconName=\"shapes\"\n                  backgroundColor={COLORS.gray}\n                  size={{faSize: 10, wrapperSize: 16}}\n                />\n                {translate('skill')}\n              </div>\n            )}\n\n            <h2 className={style.title}>{title}</h2>\n\n            {description && (\n              <>\n                <Description />\n                {isDescriptionTruncated ? (\n                  <div className={style.showMoreWrapper} onClick={handleShowMore}>\n                    {showMore ? translate('Show less') : translate('Show more')}\n                    <Icon\n                      iconName={showMore ? 'chevron-up' : 'chevron-down'}\n                      size={{faSize: 14, wrapperSize: 14}}\n                      customStyle={{padding: '8px'}}\n                    />\n                  </div>\n                ) : null}\n              </>\n            )}\n\n            {questionsToReview > 0 ? (\n              <div className={style.skillInformation}>\n                <span>{questionsToReview}</span>\n                &nbsp;{translate('skill_chart_side_panel_questions_to_review')}\n              </div>\n            ) : null}\n\n            <div\n              className={classnames(\n                style.progressContainer,\n                !hasDescription && style.noDescriptionSpacing\n              )}\n            >\n              <ProgressBar />\n            </div>\n\n            <div className={style.ctaWrapper}>\n              <ContinueLearningButton\n                ongoingCoursesAvailable={ongoingCoursesAvailable}\n                onClick={onContinueLearningClick}\n              />\n              <ButtonLink\n                type=\"secondary\"\n                label={translate('review_this_skill')}\n                disabled={!availableForReview}\n                onClick={onReviewClick}\n                icon={{\n                  position: 'left',\n                  faIcon: {\n                    name: 'rotate-right',\n                    color: COLORS.cm_grey_700,\n                    size: 14\n                  }\n                }}\n                customStyle={{borderRadius: '12px', width: 'fit-content'}}\n              />\n            </div>\n          </div>\n        </div>\n\n        {/* Courses section below */}\n        <AllCourses\n          content={skillIncludedCourses}\n          filters={filters}\n          totalContents={totalContents}\n          bannerMicrolearning={\n            bannerMicrolearning && bannerMicrolearningAction\n              ? {\n                  type: 'skill',\n                  action: bannerMicrolearningAction,\n                  oldSwitchValue: bannerMicrolearning.oldSwitchValue\n                }\n              : undefined\n          }\n          search={search}\n        />\n      </div>\n    </div>\n  );\n};\n\nSkillDetail.contextTypes = {\n  translate: Provider.childContextTypes.translate,\n  skin: Provider.childContextTypes.skin\n};\n\nSkillDetail.propTypes = {\n  title: PropTypes.string.isRequired,\n  skillRef: PropTypes.string.isRequired,\n  description: PropTypes.string,\n  metrics: PropTypes.shape({\n    score: PropTypes.number,\n    questionsToReview: PropTypes.number,\n    totalContents: PropTypes.number\n  }),\n  focused: PropTypes.bool,\n  availableForReview: PropTypes.bool,\n  ongoingCoursesAvailable: PropTypes.bool,\n  skillIncludedCourses: PropTypes.shape(CardsGrid.propTypes),\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n  }),\n  onBackClick: PropTypes.func,\n  onReviewClick: PropTypes.func,\n  onContinueLearningClick: PropTypes.func,\n  search: PropTypes.shape({\n    oldValue: PropTypes.string,\n    onChange: PropTypes.func\n  }),\n  bannerMicrolearning: PropTypes.shape({\n    action: PropTypes.func,\n    oldSwitchValue: PropTypes.bool\n  })\n};\n\nexport default SkillDetail;\n"],"mappings":"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","ignoreList":[]}