@coorpacademy/components 11.35.3-forcedeploy5.4 → 11.35.3-forcedeploy7.4

package/es/molecule/icon-preview/style.css

@@ -7,7 +7,6 @@
 
 .iconPreview {
     display: flex;
-    padding: 72px 48px 64px 48px;
     flex-direction: column;
     text-align: center; 
     align-items: center;

package/es/template/skill-detail/all-courses.d.ts

@@ -34,7 +34,6 @@ declare const AllCourses: {
             onChange?: ((value: string) => void) | undefined;
             options?: unknown[] | undefined;
         };
-        sorting?: unknown;
     }, context: ProviderContext): JSX.Element;
     contextTypes: {
         skin: PropTypes.Requireable<PropTypes.InferProps<{
@@ -78,37 +77,6 @@ declare const AllCourses: {
                 validOption: PropTypes.Requireable<boolean>;
             }> | null | undefined)[]>;
         }>>;
-        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>;
-        }>>;
         bannerMicrolearning: PropTypes.Requireable<PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
             action: PropTypes.Requireable<(...args: any[]) => any>;

package/es/template/skill-detail/all-courses.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"all-courses.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/all-courses.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAMnC,OAAkB,EAAC,cAAc,EAAC,MAAM,2BAA2B,CAAC;AAQpE,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,EAAE,OAAO,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;CACnD;AAgDD,QAAA,MAAM,UAAU;;;;;;iBAMH;YACP,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;YAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;SACnB;;;sBAGW,MAAM;8BACE,MAAM,KAAK,IAAI;;;kBAG3B,OAAO,GAAG,UAAU;oBAClB,MAAM,IAAI;4BACF,OAAO;;;gCAGJ,MAAM,KAAK,IAAI;;;kBAG1B,OAAO;gBAEV,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgKzB,CAAC;AA0BF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"all-courses.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/all-courses.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAMnC,OAAkB,EAAC,cAAc,EAAC,MAAM,2BAA2B,CAAC;AAQpE,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,EAAE,OAAO,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;CACnD;AAgDD,QAAA,MAAM,UAAU;;;;;;iBAMH;YACP,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;YAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;SACnB;;;sBAGW,MAAM;8BACE,MAAM,KAAK,IAAI;;;kBAG3B,OAAO,GAAG,UAAU;oBAClB,MAAM,IAAI;4BACF,OAAO;;;gCAGJ,MAAM,KAAK,IAAI;;;gBAI7B,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkJzB,CAAC;AAyBF,eAAe,UAAU,CAAC"}

package/es/template/skill-detail/all-courses.js

@@ -5,11 +5,10 @@ import _size from "lodash/fp/size";
 import _map from "lodash/fp/map";
 import _filter from "lodash/fp/filter";
 import _get from "lodash/fp/get";
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React, { useState, useCallback, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import Provider from '../../atom/provider';
-import Select, { SelectOptionPropTypes } from '../../atom/select';
+import { SelectOptionPropTypes } from '../../atom/select';
 import ButtonLink from '../../atom/button-link';
 import SearchForm from '../../molecule/search-form';
 import CardsGrid from '../../organism/cards-grid';
@@ -66,7 +65,6 @@ const AllCourses = (props, context) => {
   const {
     content,
     filters,
-    sorting,
     totalContents,
     bannerMicrolearning = undefined,
     search: {
@@ -87,11 +85,6 @@ const AllCourses = (props, context) => {
   const oldSwitchValue = bannerMicrolearning?.oldSwitchValue;
   const [showCompleted, setShowCompleted] = useState(true);
   const [searchValue, setSearchValue] = useState(oldSearchValue || '');
-  const sortView = sorting !== undefined ? /*#__PURE__*/React.createElement("div", {
-    "data-name": "choice"
-  }, /*#__PURE__*/React.createElement(Select, _extends({}, sorting, {
-    "aria-label": "All courses sort"
-  }))) : null;
   const filteredContent = useMemo(() => {
     return showCompleted ? list : _filter(course => course.progress < 1, list);
   }, [list, showCompleted]);
@@ -139,9 +132,7 @@ const AllCourses = (props, context) => {
     "aria-label": 'Show completed courses aria label',
     value: showCompleted,
     onChange: handleShowCompletedToggle
-  }), sortView ? /*#__PURE__*/React.createElement("div", {
-    className: style.sortWrapper
-  }, translate('sort_by'), sortView) : null)), !_isEmpty(bannerMicrolearning) ? /*#__PURE__*/React.createElement("div", {
+  }))), !_isEmpty(bannerMicrolearning) ? /*#__PURE__*/React.createElement("div", {
     className: style.bannerWrapper
   }, /*#__PURE__*/React.createElement(Banner, {
     type: "info",
@@ -205,7 +196,6 @@ AllCourses.propTypes = process.env.NODE_ENV !== "production" ? {
     onChange: PropTypes.func,
     options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))
   }),
-  sorting: PropTypes.shape(Select.propTypes),
   bannerMicrolearning: PropTypes.shape({
     type: PropTypes.oneOf(['skill', 'playlist']),
     action: PropTypes.func,

package/es/template/skill-detail/all-courses.js.map

@@ -1 +1 @@
-{"version":3,"file":"all-courses.js","names":["React","useState","useCallback","useMemo","PropTypes","Provider","Select","SelectOptionPropTypes","ButtonLink","SearchForm","CardsGrid","InputSwitch","Banner","COLORS","style","uncappedMap","_map","convert","cap","FilterButton","props","context","dataName","ariaLabel","selected","label","onClick","skin","primarySkinColor","_get","buttonProps","customStyle","backgroundColor","cm_grey_150","color","white","cm_grey_500","transition","width","createElement","contextTypes","childContextTypes","translate","propTypes","process","env","NODE_ENV","string","bool","func","AllCourses","content","filters","sorting","totalContents","bannerMicrolearning","undefined","search","oldValue","oldSearchValue","onChange","handleSearch","options","list","loading","bannerMessageType","type","bannerAction","action","oldSwitchValue","showCompleted","setShowCompleted","searchValue","setSearchValue","sortView","_extends","filteredContent","_filter","course","progress","debounceHandleSearch","_debounce","value","onSearchChange","handleSearchReset","handleShowCompletedToggle","prevShowCompleted","Fragment","className","continueLearningWrapper","continueLearningTitle","continueLearningNumber","_isNil","_size","searchAndSortSection","searchWrapper","placeholder","onReset","dataTestId","sortSection","id","name","title","theme","sortWrapper","_isEmpty","bannerWrapper","message","cta","filterWrapper","filterProps","index","handleFilterChange","key","filterButtonWrapper","divider","justifyContent","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","shape","number","arrayOf","oneOf"],"sources":["../../../src/template/skill-detail/all-courses.tsx"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, filter, map, size, isNil, isEmpty, debounce} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport SearchForm from '../../molecule/search-form';\nimport CardsGrid, {CardsGridProps} from '../../organism/cards-grid';\nimport InputSwitch from '../../atom/input-switch';\nimport Banner from '../../molecule/banner';\nimport {COLORS} from '../../variables/colors';\nimport style from './all-courses.css';\n\n// @ts-expect-error convert untypped\nconst uncappedMap = map.convert({cap: false});\ninterface ProviderContext {\n  skin: {\n    common: {\n      primary: string;\n      secondary: string;\n    };\n  };\n  translate: (key: string, options?: any) => string;\n}\n\ninterface FilterOption {\n  name: string;\n  value: string;\n  selected: boolean;\n}\n\ninterface FilterButtonProps {\n  dataName?: string;\n  ariaLabel?: string;\n  selected?: boolean;\n  label?: string;\n  onClick?: () => void;\n}\nconst FilterButton = (props: FilterButtonProps, context: ProviderContext) => {\n  const {dataName, ariaLabel, selected, label, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: selected ? primarySkinColor : COLORS.cm_grey_150,\n      color: selected ? COLORS.white : COLORS.cm_grey_500,\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    label,\n    onClick,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\nFilterButton.propTypes = {\n  dataName: PropTypes.string,\n  ariaLabel: PropTypes.string,\n  selected: PropTypes.bool,\n  label: PropTypes.string,\n  onClick: PropTypes.func\n};\n\nconst AllCourses = (\n  props: {\n    dataName?: string;\n    ariaLabel?: string;\n    selected?: boolean;\n    label?: string;\n    content: {\n      list: CardsGridProps['list'];\n      loading?: boolean;\n    };\n    totalContents?: number;\n    search: {\n      oldValue: string;\n      onChange: (value: string) => void;\n    };\n    bannerMicrolearning?: {\n      type: 'skill' | 'playlist';\n      action: () => void;\n      oldSwitchValue: boolean;\n    };\n    filters: {\n      onChange?: (value: string) => void;\n      options?: unknown[];\n    };\n    sorting?: unknown;\n  },\n  context: ProviderContext\n) => {\n  const {translate} = context;\n  const {\n    content,\n    filters,\n    sorting,\n    totalContents,\n    bannerMicrolearning = undefined,\n    search: {oldValue: oldSearchValue, onChange: handleSearch}\n  } = props;\n  const {options, onChange} = filters;\n  const {list, loading} = content;\n  const bannerMessageType = bannerMicrolearning?.type;\n  const bannerAction = bannerMicrolearning?.action;\n  const oldSwitchValue = bannerMicrolearning?.oldSwitchValue;\n\n  const [showCompleted, setShowCompleted] = useState(true);\n  const [searchValue, setSearchValue] = useState(oldSearchValue || '');\n\n  const sortView =\n    sorting !== undefined ? (\n      <div data-name=\"choice\">\n        <Select {...sorting} aria-label=\"All courses sort\" />\n      </div>\n    ) : null;\n\n  const filteredContent = useMemo(() => {\n    return showCompleted ? list : filter(course => course.progress < 1, list);\n  }, [list, showCompleted]);\n\n  const debounceHandleSearch = useMemo(() => {\n    return debounce(800, value => {\n      handleSearch(value);\n    });\n  }, [handleSearch]);\n\n  const onSearchChange = useCallback(\n    value => {\n      setSearchValue(value);\n      debounceHandleSearch(value);\n    },\n    [debounceHandleSearch]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    debounceHandleSearch('');\n  }, [debounceHandleSearch]);\n\n  const handleShowCompletedToggle = useCallback(() => {\n    setShowCompleted(prevShowCompleted => !prevShowCompleted);\n  }, []);\n\n  return (\n    <>\n      <div className={style.continueLearningWrapper}>\n        <span className={style.continueLearningTitle}>{translate('all_content')}</span>\n        <span className={style.continueLearningNumber}>\n          {isNil(totalContents) ? size(filteredContent) : totalContents}\n        </span>\n      </div>\n      <div className={style.searchAndSortSection}>\n        <div className={style.searchWrapper}>\n          <SearchForm\n            search={{\n              placeholder: translate('search_place_holder'),\n              value: searchValue,\n              onChange: onSearchChange\n            }}\n            onReset={handleSearchReset}\n            dataTestId=\"all-courses-search-input\"\n          />\n        </div>\n        <div className={style.sortSection}>\n          <InputSwitch\n            id={'show-completed-courses-switch'}\n            name={translate('show_completed')}\n            title={translate('show_completed')}\n            theme=\"default\"\n            aria-label={'Show completed courses aria label'}\n            value={showCompleted}\n            onChange={handleShowCompletedToggle}\n          />\n          {sortView ? (\n            <div className={style.sortWrapper}>\n              {translate('sort_by')}\n              {sortView}\n            </div>\n          ) : null}\n        </div>\n      </div>\n      {!isEmpty(bannerMicrolearning) ? (\n        <div className={style.bannerWrapper}>\n          <Banner\n            type=\"info\"\n            message={\n              bannerMessageType === 'skill'\n                ? translate('banner_microlearning_rule_message_skill')\n                : translate('banner_microlearning_rule_message')\n            }\n            cta={[\n              {\n                type: 'switch',\n                label: translate('banner_microlearning_rule_label'),\n                action: bannerAction,\n                oldSwitchValue\n              }\n            ]}\n          />\n        </div>\n      ) : null}\n\n      <div className={style.filterWrapper}>\n        {size(options) > 2\n          ? uncappedMap((filterProps: FilterOption, index: number) => {\n              const {name, value, selected} = filterProps;\n\n              function handleFilterChange() {\n                onChange && onChange(value);\n              }\n\n              return (\n                <div key={index} className={style.filterButtonWrapper}>\n                  <FilterButton\n                    dataName={`filter-button-${value}`}\n                    ariaLabel={`Filter by ${name}`}\n                    selected={selected}\n                    label={name}\n                    onClick={handleFilterChange}\n                  />\n                  {value === 'ALL' ? <div className={style.divider} /> : null}\n                </div>\n              );\n            }, options)\n          : null}\n      </div>\n      <div>\n        {size(filteredContent) ? (\n          <CardsGrid\n            list={filteredContent}\n            loading={loading}\n            customStyle={{justifyContent: 'left'}}\n          />\n        ) : (\n          <div className={style.emptySearchResultContainer}>\n            <div className={style.emptySearchResultTitle}>\n              {translate('empty_search_result_title', {searchValue})}\n            </div>\n            <div className={style.emptySearchResultDescription}>\n              {translate('empty_search_result_description')}\n            </div>\n            <div className={style.emptySearchResultClearSearch} onClick={handleSearchReset}>\n              {translate('empty_search_result_clear_search')}\n            </div>\n          </div>\n        )}\n      </div>\n    </>\n  );\n};\n\nAllCourses.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nAllCourses.propTypes = {\n  content: PropTypes.shape(CardsGrid.propTypes),\n  totalContents: PropTypes.number,\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n  }),\n  sorting: PropTypes.shape(Select.propTypes),\n  bannerMicrolearning: PropTypes.shape({\n    type: PropTypes.oneOf(['skill', 'playlist']),\n    action: PropTypes.func,\n    oldSwitchValue: PropTypes.bool\n  }),\n  search: PropTypes.shape({\n    oldValue: PropTypes.string,\n    onChange: PropTypes.func\n  })\n};\n\nexport default AllCourses;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"all-courses.js","names":["React","useState","useCallback","useMemo","PropTypes","Provider","SelectOptionPropTypes","ButtonLink","SearchForm","CardsGrid","InputSwitch","Banner","COLORS","style","uncappedMap","_map","convert","cap","FilterButton","props","context","dataName","ariaLabel","selected","label","onClick","skin","primarySkinColor","_get","buttonProps","customStyle","backgroundColor","cm_grey_150","color","white","cm_grey_500","transition","width","createElement","contextTypes","childContextTypes","translate","propTypes","process","env","NODE_ENV","string","bool","func","AllCourses","content","filters","totalContents","bannerMicrolearning","undefined","search","oldValue","oldSearchValue","onChange","handleSearch","options","list","loading","bannerMessageType","type","bannerAction","action","oldSwitchValue","showCompleted","setShowCompleted","searchValue","setSearchValue","filteredContent","_filter","course","progress","debounceHandleSearch","_debounce","value","onSearchChange","handleSearchReset","handleShowCompletedToggle","prevShowCompleted","Fragment","className","continueLearningWrapper","continueLearningTitle","continueLearningNumber","_isNil","_size","searchAndSortSection","searchWrapper","placeholder","onReset","dataTestId","sortSection","id","name","title","theme","_isEmpty","bannerWrapper","message","cta","filterWrapper","filterProps","index","handleFilterChange","key","filterButtonWrapper","divider","justifyContent","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","shape","number","arrayOf","oneOf"],"sources":["../../../src/template/skill-detail/all-courses.tsx"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, filter, map, size, isNil, isEmpty, debounce} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport SearchForm from '../../molecule/search-form';\nimport CardsGrid, {CardsGridProps} from '../../organism/cards-grid';\nimport InputSwitch from '../../atom/input-switch';\nimport Banner from '../../molecule/banner';\nimport {COLORS} from '../../variables/colors';\nimport style from './all-courses.css';\n\n// @ts-expect-error convert untypped\nconst uncappedMap = map.convert({cap: false});\ninterface ProviderContext {\n  skin: {\n    common: {\n      primary: string;\n      secondary: string;\n    };\n  };\n  translate: (key: string, options?: any) => string;\n}\n\ninterface FilterOption {\n  name: string;\n  value: string;\n  selected: boolean;\n}\n\ninterface FilterButtonProps {\n  dataName?: string;\n  ariaLabel?: string;\n  selected?: boolean;\n  label?: string;\n  onClick?: () => void;\n}\nconst FilterButton = (props: FilterButtonProps, context: ProviderContext) => {\n  const {dataName, ariaLabel, selected, label, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: selected ? primarySkinColor : COLORS.cm_grey_150,\n      color: selected ? COLORS.white : COLORS.cm_grey_500,\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    label,\n    onClick,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\nFilterButton.propTypes = {\n  dataName: PropTypes.string,\n  ariaLabel: PropTypes.string,\n  selected: PropTypes.bool,\n  label: PropTypes.string,\n  onClick: PropTypes.func\n};\n\nconst AllCourses = (\n  props: {\n    dataName?: string;\n    ariaLabel?: string;\n    selected?: boolean;\n    label?: string;\n    content: {\n      list: CardsGridProps['list'];\n      loading?: boolean;\n    };\n    totalContents?: number;\n    search: {\n      oldValue: string;\n      onChange: (value: string) => void;\n    };\n    bannerMicrolearning?: {\n      type: 'skill' | 'playlist';\n      action: () => void;\n      oldSwitchValue: boolean;\n    };\n    filters: {\n      onChange?: (value: string) => void;\n      options?: unknown[];\n    };\n  },\n  context: ProviderContext\n) => {\n  const {translate} = context;\n  const {\n    content,\n    filters,\n    totalContents,\n    bannerMicrolearning = undefined,\n    search: {oldValue: oldSearchValue, onChange: handleSearch}\n  } = props;\n  const {options, onChange} = filters;\n  const {list, loading} = content;\n  const bannerMessageType = bannerMicrolearning?.type;\n  const bannerAction = bannerMicrolearning?.action;\n  const oldSwitchValue = bannerMicrolearning?.oldSwitchValue;\n\n  const [showCompleted, setShowCompleted] = useState(true);\n  const [searchValue, setSearchValue] = useState(oldSearchValue || '');\n\n  const filteredContent = useMemo(() => {\n    return showCompleted ? list : filter(course => course.progress < 1, list);\n  }, [list, showCompleted]);\n\n  const debounceHandleSearch = useMemo(() => {\n    return debounce(800, value => {\n      handleSearch(value);\n    });\n  }, [handleSearch]);\n\n  const onSearchChange = useCallback(\n    value => {\n      setSearchValue(value);\n      debounceHandleSearch(value);\n    },\n    [debounceHandleSearch]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    debounceHandleSearch('');\n  }, [debounceHandleSearch]);\n\n  const handleShowCompletedToggle = useCallback(() => {\n    setShowCompleted(prevShowCompleted => !prevShowCompleted);\n  }, []);\n\n  return (\n    <>\n      <div className={style.continueLearningWrapper}>\n        <span className={style.continueLearningTitle}>{translate('all_content')}</span>\n        <span className={style.continueLearningNumber}>\n          {isNil(totalContents) ? size(filteredContent) : totalContents}\n        </span>\n      </div>\n      <div className={style.searchAndSortSection}>\n        <div className={style.searchWrapper}>\n          <SearchForm\n            search={{\n              placeholder: translate('search_place_holder'),\n              value: searchValue,\n              onChange: onSearchChange\n            }}\n            onReset={handleSearchReset}\n            dataTestId=\"all-courses-search-input\"\n          />\n        </div>\n        <div className={style.sortSection}>\n          <InputSwitch\n            id={'show-completed-courses-switch'}\n            name={translate('show_completed')}\n            title={translate('show_completed')}\n            theme=\"default\"\n            aria-label={'Show completed courses aria label'}\n            value={showCompleted}\n            onChange={handleShowCompletedToggle}\n          />\n        </div>\n      </div>\n      {!isEmpty(bannerMicrolearning) ? (\n        <div className={style.bannerWrapper}>\n          <Banner\n            type=\"info\"\n            message={\n              bannerMessageType === 'skill'\n                ? translate('banner_microlearning_rule_message_skill')\n                : translate('banner_microlearning_rule_message')\n            }\n            cta={[\n              {\n                type: 'switch',\n                label: translate('banner_microlearning_rule_label'),\n                action: bannerAction,\n                oldSwitchValue\n              }\n            ]}\n          />\n        </div>\n      ) : null}\n\n      <div className={style.filterWrapper}>\n        {size(options) > 2\n          ? uncappedMap((filterProps: FilterOption, index: number) => {\n              const {name, value, selected} = filterProps;\n\n              function handleFilterChange() {\n                onChange && onChange(value);\n              }\n\n              return (\n                <div key={index} className={style.filterButtonWrapper}>\n                  <FilterButton\n                    dataName={`filter-button-${value}`}\n                    ariaLabel={`Filter by ${name}`}\n                    selected={selected}\n                    label={name}\n                    onClick={handleFilterChange}\n                  />\n                  {value === 'ALL' ? <div className={style.divider} /> : null}\n                </div>\n              );\n            }, options)\n          : null}\n      </div>\n      <div>\n        {size(filteredContent) ? (\n          <CardsGrid\n            list={filteredContent}\n            loading={loading}\n            customStyle={{justifyContent: 'left'}}\n          />\n        ) : (\n          <div className={style.emptySearchResultContainer}>\n            <div className={style.emptySearchResultTitle}>\n              {translate('empty_search_result_title', {searchValue})}\n            </div>\n            <div className={style.emptySearchResultDescription}>\n              {translate('empty_search_result_description')}\n            </div>\n            <div className={style.emptySearchResultClearSearch} onClick={handleSearchReset}>\n              {translate('empty_search_result_clear_search')}\n            </div>\n          </div>\n        )}\n      </div>\n    </>\n  );\n};\n\nAllCourses.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nAllCourses.propTypes = {\n  content: PropTypes.shape(CardsGrid.propTypes),\n  totalContents: PropTypes.number,\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n  }),\n  bannerMicrolearning: PropTypes.shape({\n    type: PropTypes.oneOf(['skill', 'playlist']),\n    action: PropTypes.func,\n    oldSwitchValue: PropTypes.bool\n  }),\n  search: PropTypes.shape({\n    oldValue: PropTypes.string,\n    onChange: PropTypes.func\n  })\n};\n\nexport default AllCourses;\n"],"mappings":"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","ignoreList":[]}

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

@@ -71,7 +71,6 @@ interface SkillDetailProps {
         onChange?: () => void;
         options?: unknown[];
     };
-    sorting?: () => void;
     onBackClick?: () => void;
     onReviewClick?: () => void;
     onContinueLearningClick?: () => void;
@@ -139,37 +138,6 @@ declare const SkillDetail: {
                 validOption: PropTypes.Requireable<boolean>;
             }> | null | undefined)[]>;
         }>>;
-        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>;
-        }>>;
         onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
         onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
         onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;

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

@@ -1 +1 @@
-{"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,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC;IACpC,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,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6MrE,CAAC;AA0CF,eAAe,WAAW,CAAC"}
+{"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,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC;IACpC,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2MrE,CAAC;AAyCF,eAAe,WAAW,CAAC"}

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

@@ -12,7 +12,7 @@ import IconPreview from '../../molecule/icon-preview';
 import ButtonLink from '../../atom/button-link';
 import CardsGrid from '../../organism/cards-grid';
 import { COLORS } from '../../variables/colors';
-import Select, { SelectOptionPropTypes } from '../../atom/select';
+import { SelectOptionPropTypes } from '../../atom/select';
 import AllCourses from './all-courses';
 import style from './style.css';
 export const ContinueLearningButton = (props, context) => {
@@ -69,7 +69,6 @@ const SkillDetail = (props, context) => {
     ongoingCoursesAvailable,
     skillIncludedCourses,
     filters,
-    sorting,
     onBackClick,
     onReviewClick,
     onContinueLearningClick,
@@ -221,7 +220,6 @@ const SkillDetail = (props, context) => {
   })))), /*#__PURE__*/React.createElement(AllCourses, {
     content: skillIncludedCourses,
     filters: filters,
-    sorting: sorting,
     totalContents: totalContents,
     bannerMicrolearning: bannerMicrolearning && bannerMicrolearningAction ? {
       type: 'skill',
@@ -256,7 +254,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","classnames","Markdown","convert","Provider","ButtonLinkIcon","Icon","IconPreview","ButtonLink","CardsGrid","COLORS","Select","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","iconColor","iconName","skillRef","description","metrics","focused","availableForReview","skillIncludedCourses","filters","sorting","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","gap","padding","rightSide","skillFocusBadge","purple_100","faSize","wrapperSize","skillBadge","cm_grey_100","Fragment","showMoreWrapper","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 Select, {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  icon: {name: string; color: 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  sorting?: () => void;\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    icon: {color: iconColor, name: iconName},\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\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: iconName,\n                color: iconColor\n              }}\n              title={title}\n              customStyle={{gap: 24, padding: '50px 49px 50px 50px'}}\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.cm_grey_100}\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          sorting={sorting}\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  icon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string\n  }).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","iconColor","iconName","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","gap","padding","rightSide","skillFocusBadge","purple_100","faSize","wrapperSize","skillBadge","cm_grey_100","Fragment","showMoreWrapper","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 Select, {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  icon: {name: string; color: 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    icon: {color: iconColor, name: iconName},\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: iconName,\n                color: iconColor\n              }}\n              title={title}\n              customStyle={{gap: 24, padding: '50px 49px 50px 50px'}}\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.cm_grey_100}\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  icon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string\n  }).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":[]}

package/es/template/skill-detail/style.css

@@ -206,7 +206,7 @@
   }
 
   .leftSide {
-    width: 342px;
+    width: 343px;
     height: 228px;
     display: flex;
     flex-direction: column;
@@ -265,12 +265,16 @@
   .topSection {
     flex-direction: row;
     align-items: center; 
+    gap: 16px;
   }
 
   .leftSide {
-    width: 343px;
     border-radius: 16px;
-    padding: 4px 32px 32px 0px;
+    padding: 16px 32px 32px 0px;
+  }
+
+  .backButton {
+    margin-bottom: 0;
   }
 
   .rightSide {

package/lib/molecule/icon-preview/style.css

@@ -7,7 +7,6 @@
 
 .iconPreview {
     display: flex;
-    padding: 72px 48px 64px 48px;
     flex-direction: column;
     text-align: center; 
     align-items: center;

package/lib/template/skill-detail/all-courses.d.ts

@@ -34,7 +34,6 @@ declare const AllCourses: {
             onChange?: ((value: string) => void) | undefined;
             options?: unknown[] | undefined;
         };
-        sorting?: unknown;
     }, context: ProviderContext): JSX.Element;
     contextTypes: {
         skin: PropTypes.Requireable<PropTypes.InferProps<{
@@ -78,37 +77,6 @@ declare const AllCourses: {
                 validOption: PropTypes.Requireable<boolean>;
             }> | null | undefined)[]>;
         }>>;
-        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>;
-        }>>;
         bannerMicrolearning: PropTypes.Requireable<PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
             action: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/template/skill-detail/all-courses.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"all-courses.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/all-courses.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAMnC,OAAkB,EAAC,cAAc,EAAC,MAAM,2BAA2B,CAAC;AAQpE,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,EAAE,OAAO,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;CACnD;AAgDD,QAAA,MAAM,UAAU;;;;;;iBAMH;YACP,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;YAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;SACnB;;;sBAGW,MAAM;8BACE,MAAM,KAAK,IAAI;;;kBAG3B,OAAO,GAAG,UAAU;oBAClB,MAAM,IAAI;4BACF,OAAO;;;gCAGJ,MAAM,KAAK,IAAI;;;kBAG1B,OAAO;gBAEV,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgKzB,CAAC;AA0BF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"all-courses.d.ts","sourceRoot":"","sources":["../../../src/template/skill-detail/all-courses.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAMnC,OAAkB,EAAC,cAAc,EAAC,MAAM,2BAA2B,CAAC;AAQpE,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,EAAE,OAAO,CAAC,EAAE,GAAG,KAAK,MAAM,CAAC;CACnD;AAgDD,QAAA,MAAM,UAAU;;;;;;iBAMH;YACP,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;YAC7B,OAAO,CAAC,EAAE,OAAO,CAAC;SACnB;;;sBAGW,MAAM;8BACE,MAAM,KAAK,IAAI;;;kBAG3B,OAAO,GAAG,UAAU;oBAClB,MAAM,IAAI;4BACF,OAAO;;;gCAGJ,MAAM,KAAK,IAAI;;;gBAI7B,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkJzB,CAAC;AAyBF,eAAe,UAAU,CAAC"}

package/lib/template/skill-detail/all-courses.js

@@ -12,7 +12,7 @@ var _get2 = _interopRequireDefault(require("lodash/fp/get"));
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _provider = _interopRequireDefault(require("../../atom/provider"));
-var _select = _interopRequireWildcard(require("../../atom/select"));
+var _select = require("../../atom/select");
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 var _searchForm = _interopRequireDefault(require("../../molecule/search-form"));
 var _cardsGrid = _interopRequireDefault(require("../../organism/cards-grid"));
@@ -23,7 +23,6 @@ var _allCourses = _interopRequireDefault(require("./all-courses.css"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 // @ts-expect-error convert untypped
 const uncappedMap = _map2.default.convert({
   cap: false
@@ -72,7 +71,6 @@ const AllCourses = (props, context) => {
   const {
     content,
     filters,
-    sorting,
     totalContents,
     bannerMicrolearning = undefined,
     search: {
@@ -93,11 +91,6 @@ const AllCourses = (props, context) => {
   const oldSwitchValue = bannerMicrolearning?.oldSwitchValue;
   const [showCompleted, setShowCompleted] = (0, _react.useState)(true);
   const [searchValue, setSearchValue] = (0, _react.useState)(oldSearchValue || '');
-  const sortView = sorting !== undefined ? /*#__PURE__*/_react.default.createElement("div", {
-    "data-name": "choice"
-  }, /*#__PURE__*/_react.default.createElement(_select.default, _extends({}, sorting, {
-    "aria-label": "All courses sort"
-  }))) : null;
   const filteredContent = (0, _react.useMemo)(() => {
     return showCompleted ? list : (0, _filter2.default)(course => course.progress < 1, list);
   }, [list, showCompleted]);
@@ -145,9 +138,7 @@ const AllCourses = (props, context) => {
     "aria-label": 'Show completed courses aria label',
     value: showCompleted,
     onChange: handleShowCompletedToggle
-  }), sortView ? /*#__PURE__*/_react.default.createElement("div", {
-    className: _allCourses.default.sortWrapper
-  }, translate('sort_by'), sortView) : null)), !(0, _isEmpty2.default)(bannerMicrolearning) ? /*#__PURE__*/_react.default.createElement("div", {
+  }))), !(0, _isEmpty2.default)(bannerMicrolearning) ? /*#__PURE__*/_react.default.createElement("div", {
     className: _allCourses.default.bannerWrapper
   }, /*#__PURE__*/_react.default.createElement(_banner.default, {
     type: "info",
@@ -211,7 +202,6 @@ AllCourses.propTypes = process.env.NODE_ENV !== "production" ? {
     onChange: _propTypes.default.func,
     options: _propTypes.default.arrayOf(_propTypes.default.shape(_select.SelectOptionPropTypes))
   }),
-  sorting: _propTypes.default.shape(_select.default.propTypes),
   bannerMicrolearning: _propTypes.default.shape({
     type: _propTypes.default.oneOf(['skill', 'playlist']),
     action: _propTypes.default.func,

package/lib/template/skill-detail/all-courses.js.map

@@ -1 +1 @@
-{"version":3,"file":"all-courses.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_provider","_select","_buttonLink","_searchForm","_cardsGrid","_inputSwitch","_banner","_colors","_allCourses","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","uncappedMap","_map2","convert","cap","FilterButton","props","context","dataName","ariaLabel","selected","label","onClick","skin","primarySkinColor","_get2","buttonProps","customStyle","backgroundColor","COLORS","cm_grey_150","color","white","cm_grey_500","transition","width","createElement","contextTypes","Provider","childContextTypes","translate","propTypes","process","env","NODE_ENV","PropTypes","string","bool","func","AllCourses","content","filters","sorting","totalContents","bannerMicrolearning","undefined","search","oldValue","oldSearchValue","onChange","handleSearch","options","list","loading","bannerMessageType","type","bannerAction","action","oldSwitchValue","showCompleted","setShowCompleted","useState","searchValue","setSearchValue","sortView","filteredContent","useMemo","_filter2","course","progress","debounceHandleSearch","_debounce2","value","onSearchChange","useCallback","handleSearchReset","handleShowCompletedToggle","prevShowCompleted","Fragment","className","style","continueLearningWrapper","continueLearningTitle","continueLearningNumber","_isNil2","_size2","searchAndSortSection","searchWrapper","placeholder","onReset","dataTestId","sortSection","id","name","title","theme","sortWrapper","_isEmpty2","bannerWrapper","message","cta","filterWrapper","filterProps","index","handleFilterChange","key","filterButtonWrapper","divider","justifyContent","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","shape","CardsGrid","number","arrayOf","SelectOptionPropTypes","Select","oneOf","_default","exports"],"sources":["../../../src/template/skill-detail/all-courses.tsx"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, filter, map, size, isNil, isEmpty, debounce} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Select, {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport SearchForm from '../../molecule/search-form';\nimport CardsGrid, {CardsGridProps} from '../../organism/cards-grid';\nimport InputSwitch from '../../atom/input-switch';\nimport Banner from '../../molecule/banner';\nimport {COLORS} from '../../variables/colors';\nimport style from './all-courses.css';\n\n// @ts-expect-error convert untypped\nconst uncappedMap = map.convert({cap: false});\ninterface ProviderContext {\n  skin: {\n    common: {\n      primary: string;\n      secondary: string;\n    };\n  };\n  translate: (key: string, options?: any) => string;\n}\n\ninterface FilterOption {\n  name: string;\n  value: string;\n  selected: boolean;\n}\n\ninterface FilterButtonProps {\n  dataName?: string;\n  ariaLabel?: string;\n  selected?: boolean;\n  label?: string;\n  onClick?: () => void;\n}\nconst FilterButton = (props: FilterButtonProps, context: ProviderContext) => {\n  const {dataName, ariaLabel, selected, label, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: selected ? primarySkinColor : COLORS.cm_grey_150,\n      color: selected ? COLORS.white : COLORS.cm_grey_500,\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    label,\n    onClick,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\nFilterButton.propTypes = {\n  dataName: PropTypes.string,\n  ariaLabel: PropTypes.string,\n  selected: PropTypes.bool,\n  label: PropTypes.string,\n  onClick: PropTypes.func\n};\n\nconst AllCourses = (\n  props: {\n    dataName?: string;\n    ariaLabel?: string;\n    selected?: boolean;\n    label?: string;\n    content: {\n      list: CardsGridProps['list'];\n      loading?: boolean;\n    };\n    totalContents?: number;\n    search: {\n      oldValue: string;\n      onChange: (value: string) => void;\n    };\n    bannerMicrolearning?: {\n      type: 'skill' | 'playlist';\n      action: () => void;\n      oldSwitchValue: boolean;\n    };\n    filters: {\n      onChange?: (value: string) => void;\n      options?: unknown[];\n    };\n    sorting?: unknown;\n  },\n  context: ProviderContext\n) => {\n  const {translate} = context;\n  const {\n    content,\n    filters,\n    sorting,\n    totalContents,\n    bannerMicrolearning = undefined,\n    search: {oldValue: oldSearchValue, onChange: handleSearch}\n  } = props;\n  const {options, onChange} = filters;\n  const {list, loading} = content;\n  const bannerMessageType = bannerMicrolearning?.type;\n  const bannerAction = bannerMicrolearning?.action;\n  const oldSwitchValue = bannerMicrolearning?.oldSwitchValue;\n\n  const [showCompleted, setShowCompleted] = useState(true);\n  const [searchValue, setSearchValue] = useState(oldSearchValue || '');\n\n  const sortView =\n    sorting !== undefined ? (\n      <div data-name=\"choice\">\n        <Select {...sorting} aria-label=\"All courses sort\" />\n      </div>\n    ) : null;\n\n  const filteredContent = useMemo(() => {\n    return showCompleted ? list : filter(course => course.progress < 1, list);\n  }, [list, showCompleted]);\n\n  const debounceHandleSearch = useMemo(() => {\n    return debounce(800, value => {\n      handleSearch(value);\n    });\n  }, [handleSearch]);\n\n  const onSearchChange = useCallback(\n    value => {\n      setSearchValue(value);\n      debounceHandleSearch(value);\n    },\n    [debounceHandleSearch]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    debounceHandleSearch('');\n  }, [debounceHandleSearch]);\n\n  const handleShowCompletedToggle = useCallback(() => {\n    setShowCompleted(prevShowCompleted => !prevShowCompleted);\n  }, []);\n\n  return (\n    <>\n      <div className={style.continueLearningWrapper}>\n        <span className={style.continueLearningTitle}>{translate('all_content')}</span>\n        <span className={style.continueLearningNumber}>\n          {isNil(totalContents) ? size(filteredContent) : totalContents}\n        </span>\n      </div>\n      <div className={style.searchAndSortSection}>\n        <div className={style.searchWrapper}>\n          <SearchForm\n            search={{\n              placeholder: translate('search_place_holder'),\n              value: searchValue,\n              onChange: onSearchChange\n            }}\n            onReset={handleSearchReset}\n            dataTestId=\"all-courses-search-input\"\n          />\n        </div>\n        <div className={style.sortSection}>\n          <InputSwitch\n            id={'show-completed-courses-switch'}\n            name={translate('show_completed')}\n            title={translate('show_completed')}\n            theme=\"default\"\n            aria-label={'Show completed courses aria label'}\n            value={showCompleted}\n            onChange={handleShowCompletedToggle}\n          />\n          {sortView ? (\n            <div className={style.sortWrapper}>\n              {translate('sort_by')}\n              {sortView}\n            </div>\n          ) : null}\n        </div>\n      </div>\n      {!isEmpty(bannerMicrolearning) ? (\n        <div className={style.bannerWrapper}>\n          <Banner\n            type=\"info\"\n            message={\n              bannerMessageType === 'skill'\n                ? translate('banner_microlearning_rule_message_skill')\n                : translate('banner_microlearning_rule_message')\n            }\n            cta={[\n              {\n                type: 'switch',\n                label: translate('banner_microlearning_rule_label'),\n                action: bannerAction,\n                oldSwitchValue\n              }\n            ]}\n          />\n        </div>\n      ) : null}\n\n      <div className={style.filterWrapper}>\n        {size(options) > 2\n          ? uncappedMap((filterProps: FilterOption, index: number) => {\n              const {name, value, selected} = filterProps;\n\n              function handleFilterChange() {\n                onChange && onChange(value);\n              }\n\n              return (\n                <div key={index} className={style.filterButtonWrapper}>\n                  <FilterButton\n                    dataName={`filter-button-${value}`}\n                    ariaLabel={`Filter by ${name}`}\n                    selected={selected}\n                    label={name}\n                    onClick={handleFilterChange}\n                  />\n                  {value === 'ALL' ? <div className={style.divider} /> : null}\n                </div>\n              );\n            }, options)\n          : null}\n      </div>\n      <div>\n        {size(filteredContent) ? (\n          <CardsGrid\n            list={filteredContent}\n            loading={loading}\n            customStyle={{justifyContent: 'left'}}\n          />\n        ) : (\n          <div className={style.emptySearchResultContainer}>\n            <div className={style.emptySearchResultTitle}>\n              {translate('empty_search_result_title', {searchValue})}\n            </div>\n            <div className={style.emptySearchResultDescription}>\n              {translate('empty_search_result_description')}\n            </div>\n            <div className={style.emptySearchResultClearSearch} onClick={handleSearchReset}>\n              {translate('empty_search_result_clear_search')}\n            </div>\n          </div>\n        )}\n      </div>\n    </>\n  );\n};\n\nAllCourses.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nAllCourses.propTypes = {\n  content: PropTypes.shape(CardsGrid.propTypes),\n  totalContents: PropTypes.number,\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n  }),\n  sorting: PropTypes.shape(Select.propTypes),\n  bannerMicrolearning: PropTypes.shape({\n    type: PropTypes.oneOf(['skill', 'playlist']),\n    action: PropTypes.func,\n    oldSwitchValue: PropTypes.bool\n  }),\n  search: PropTypes.shape({\n    oldValue: PropTypes.string,\n    onChange: PropTypes.func\n  })\n};\n\nexport default AllCourses;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"all-courses.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_provider","_select","_buttonLink","_searchForm","_cardsGrid","_inputSwitch","_banner","_colors","_allCourses","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","uncappedMap","_map2","convert","cap","FilterButton","props","context","dataName","ariaLabel","selected","label","onClick","skin","primarySkinColor","_get2","buttonProps","customStyle","backgroundColor","COLORS","cm_grey_150","color","white","cm_grey_500","transition","width","createElement","contextTypes","Provider","childContextTypes","translate","propTypes","process","env","NODE_ENV","PropTypes","string","bool","func","AllCourses","content","filters","totalContents","bannerMicrolearning","undefined","search","oldValue","oldSearchValue","onChange","handleSearch","options","list","loading","bannerMessageType","type","bannerAction","action","oldSwitchValue","showCompleted","setShowCompleted","useState","searchValue","setSearchValue","filteredContent","useMemo","_filter2","course","progress","debounceHandleSearch","_debounce2","value","onSearchChange","useCallback","handleSearchReset","handleShowCompletedToggle","prevShowCompleted","Fragment","className","style","continueLearningWrapper","continueLearningTitle","continueLearningNumber","_isNil2","_size2","searchAndSortSection","searchWrapper","placeholder","onReset","dataTestId","sortSection","id","name","title","theme","_isEmpty2","bannerWrapper","message","cta","filterWrapper","filterProps","index","handleFilterChange","key","filterButtonWrapper","divider","justifyContent","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","shape","CardsGrid","number","arrayOf","SelectOptionPropTypes","oneOf","_default","exports"],"sources":["../../../src/template/skill-detail/all-courses.tsx"],"sourcesContent":["import React, {useState, useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, filter, map, size, isNil, isEmpty, debounce} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport ButtonLink from '../../atom/button-link';\nimport SearchForm from '../../molecule/search-form';\nimport CardsGrid, {CardsGridProps} from '../../organism/cards-grid';\nimport InputSwitch from '../../atom/input-switch';\nimport Banner from '../../molecule/banner';\nimport {COLORS} from '../../variables/colors';\nimport style from './all-courses.css';\n\n// @ts-expect-error convert untypped\nconst uncappedMap = map.convert({cap: false});\ninterface ProviderContext {\n  skin: {\n    common: {\n      primary: string;\n      secondary: string;\n    };\n  };\n  translate: (key: string, options?: any) => string;\n}\n\ninterface FilterOption {\n  name: string;\n  value: string;\n  selected: boolean;\n}\n\ninterface FilterButtonProps {\n  dataName?: string;\n  ariaLabel?: string;\n  selected?: boolean;\n  label?: string;\n  onClick?: () => void;\n}\nconst FilterButton = (props: FilterButtonProps, context: ProviderContext) => {\n  const {dataName, ariaLabel, selected, label, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: selected ? primarySkinColor : COLORS.cm_grey_150,\n      color: selected ? COLORS.white : COLORS.cm_grey_500,\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    label,\n    onClick,\n    'data-name': dataName,\n    'aria-label': ariaLabel\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\nFilterButton.propTypes = {\n  dataName: PropTypes.string,\n  ariaLabel: PropTypes.string,\n  selected: PropTypes.bool,\n  label: PropTypes.string,\n  onClick: PropTypes.func\n};\n\nconst AllCourses = (\n  props: {\n    dataName?: string;\n    ariaLabel?: string;\n    selected?: boolean;\n    label?: string;\n    content: {\n      list: CardsGridProps['list'];\n      loading?: boolean;\n    };\n    totalContents?: number;\n    search: {\n      oldValue: string;\n      onChange: (value: string) => void;\n    };\n    bannerMicrolearning?: {\n      type: 'skill' | 'playlist';\n      action: () => void;\n      oldSwitchValue: boolean;\n    };\n    filters: {\n      onChange?: (value: string) => void;\n      options?: unknown[];\n    };\n  },\n  context: ProviderContext\n) => {\n  const {translate} = context;\n  const {\n    content,\n    filters,\n    totalContents,\n    bannerMicrolearning = undefined,\n    search: {oldValue: oldSearchValue, onChange: handleSearch}\n  } = props;\n  const {options, onChange} = filters;\n  const {list, loading} = content;\n  const bannerMessageType = bannerMicrolearning?.type;\n  const bannerAction = bannerMicrolearning?.action;\n  const oldSwitchValue = bannerMicrolearning?.oldSwitchValue;\n\n  const [showCompleted, setShowCompleted] = useState(true);\n  const [searchValue, setSearchValue] = useState(oldSearchValue || '');\n\n  const filteredContent = useMemo(() => {\n    return showCompleted ? list : filter(course => course.progress < 1, list);\n  }, [list, showCompleted]);\n\n  const debounceHandleSearch = useMemo(() => {\n    return debounce(800, value => {\n      handleSearch(value);\n    });\n  }, [handleSearch]);\n\n  const onSearchChange = useCallback(\n    value => {\n      setSearchValue(value);\n      debounceHandleSearch(value);\n    },\n    [debounceHandleSearch]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    debounceHandleSearch('');\n  }, [debounceHandleSearch]);\n\n  const handleShowCompletedToggle = useCallback(() => {\n    setShowCompleted(prevShowCompleted => !prevShowCompleted);\n  }, []);\n\n  return (\n    <>\n      <div className={style.continueLearningWrapper}>\n        <span className={style.continueLearningTitle}>{translate('all_content')}</span>\n        <span className={style.continueLearningNumber}>\n          {isNil(totalContents) ? size(filteredContent) : totalContents}\n        </span>\n      </div>\n      <div className={style.searchAndSortSection}>\n        <div className={style.searchWrapper}>\n          <SearchForm\n            search={{\n              placeholder: translate('search_place_holder'),\n              value: searchValue,\n              onChange: onSearchChange\n            }}\n            onReset={handleSearchReset}\n            dataTestId=\"all-courses-search-input\"\n          />\n        </div>\n        <div className={style.sortSection}>\n          <InputSwitch\n            id={'show-completed-courses-switch'}\n            name={translate('show_completed')}\n            title={translate('show_completed')}\n            theme=\"default\"\n            aria-label={'Show completed courses aria label'}\n            value={showCompleted}\n            onChange={handleShowCompletedToggle}\n          />\n        </div>\n      </div>\n      {!isEmpty(bannerMicrolearning) ? (\n        <div className={style.bannerWrapper}>\n          <Banner\n            type=\"info\"\n            message={\n              bannerMessageType === 'skill'\n                ? translate('banner_microlearning_rule_message_skill')\n                : translate('banner_microlearning_rule_message')\n            }\n            cta={[\n              {\n                type: 'switch',\n                label: translate('banner_microlearning_rule_label'),\n                action: bannerAction,\n                oldSwitchValue\n              }\n            ]}\n          />\n        </div>\n      ) : null}\n\n      <div className={style.filterWrapper}>\n        {size(options) > 2\n          ? uncappedMap((filterProps: FilterOption, index: number) => {\n              const {name, value, selected} = filterProps;\n\n              function handleFilterChange() {\n                onChange && onChange(value);\n              }\n\n              return (\n                <div key={index} className={style.filterButtonWrapper}>\n                  <FilterButton\n                    dataName={`filter-button-${value}`}\n                    ariaLabel={`Filter by ${name}`}\n                    selected={selected}\n                    label={name}\n                    onClick={handleFilterChange}\n                  />\n                  {value === 'ALL' ? <div className={style.divider} /> : null}\n                </div>\n              );\n            }, options)\n          : null}\n      </div>\n      <div>\n        {size(filteredContent) ? (\n          <CardsGrid\n            list={filteredContent}\n            loading={loading}\n            customStyle={{justifyContent: 'left'}}\n          />\n        ) : (\n          <div className={style.emptySearchResultContainer}>\n            <div className={style.emptySearchResultTitle}>\n              {translate('empty_search_result_title', {searchValue})}\n            </div>\n            <div className={style.emptySearchResultDescription}>\n              {translate('empty_search_result_description')}\n            </div>\n            <div className={style.emptySearchResultClearSearch} onClick={handleSearchReset}>\n              {translate('empty_search_result_clear_search')}\n            </div>\n          </div>\n        )}\n      </div>\n    </>\n  );\n};\n\nAllCourses.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nAllCourses.propTypes = {\n  content: PropTypes.shape(CardsGrid.propTypes),\n  totalContents: PropTypes.number,\n  filters: PropTypes.shape({\n    onChange: PropTypes.func,\n    options: PropTypes.arrayOf(PropTypes.shape(SelectOptionPropTypes))\n  }),\n  bannerMicrolearning: PropTypes.shape({\n    type: PropTypes.oneOf(['skill', 'playlist']),\n    action: PropTypes.func,\n    oldSwitchValue: PropTypes.bool\n  }),\n  search: PropTypes.shape({\n    oldValue: PropTypes.string,\n    onChange: PropTypes.func\n  })\n};\n\nexport default AllCourses;\n"],"mappings":"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","ignoreList":[]}

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

@@ -71,7 +71,6 @@ interface SkillDetailProps {
         onChange?: () => void;
         options?: unknown[];
     };
-    sorting?: () => void;
     onBackClick?: () => void;
     onReviewClick?: () => void;
     onContinueLearningClick?: () => void;
@@ -139,37 +138,6 @@ declare const SkillDetail: {
                 validOption: PropTypes.Requireable<boolean>;
             }> | null | undefined)[]>;
         }>>;
-        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>;
-        }>>;
         onBackClick: PropTypes.Requireable<(...args: any[]) => any>;
         onReviewClick: PropTypes.Requireable<(...args: any[]) => any>;
         onContinueLearningClick: PropTypes.Requireable<(...args: any[]) => any>;

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

@@ -1 +1 @@
-{"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,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC;IACpC,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,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6MrE,CAAC;AA0CF,eAAe,WAAW,CAAC"}
+{"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,IAAI,EAAE;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAC;IACpC,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2MrE,CAAC;AAyCF,eAAe,WAAW,CAAC"}

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

@@ -16,7 +16,7 @@ var _iconPreview = _interopRequireDefault(require("../../molecule/icon-preview")
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 var _cardsGrid = _interopRequireDefault(require("../../organism/cards-grid"));
 var _colors = require("../../variables/colors");
-var _select = _interopRequireWildcard(require("../../atom/select"));
+var _select = require("../../atom/select");
 var _allCourses = _interopRequireDefault(require("./all-courses"));
 var _style = _interopRequireDefault(require("./style.css"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -77,7 +77,6 @@ const SkillDetail = (props, context) => {
     ongoingCoursesAvailable,
     skillIncludedCourses,
     filters,
-    sorting,
     onBackClick,
     onReviewClick,
     onContinueLearningClick,
@@ -229,7 +228,6 @@ const SkillDetail = (props, context) => {
   })))), /*#__PURE__*/_react.default.createElement(_allCourses.default, {
     content: skillIncludedCourses,
     filters: filters,
-    sorting: sorting,
     totalContents: totalContents,
     bannerMicrolearning: bannerMicrolearning && bannerMicrolearningAction ? {
       type: 'skill',
@@ -264,7 +262,6 @@ SkillDetail.propTypes = process.env.NODE_ENV !== "production" ? {
     onChange: _propTypes.default.func,
     options: _propTypes.default.arrayOf(_propTypes.default.shape(_select.SelectOptionPropTypes))
   }),
-  sorting: _propTypes.default.shape(_select.default.propTypes),
   onBackClick: _propTypes.default.func,
   onReviewClick: _propTypes.default.func,
   onContinueLearningClick: _propTypes.default.func,

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_classnames","_markdownToJsx","_cssColorFunction","_provider","_buttonLinkIcon","_icon","_iconPreview","_buttonLink","_cardsGrid","_colors","_select","_allCourses","_style","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","_get2","createElement","label","type","customStyle","width","borderRadius","backgroundColor","hoverBackgroundColor","convert","hoverColor","COLORS","white","icon","position","faIcon","name","color","size","exports","contextTypes","Provider","childContextTypes","propTypes","process","env","NODE_ENV","PropTypes","bool","func","SkillDetail","title","iconColor","iconName","skillRef","description","metrics","focused","availableForReview","skillIncludedCourses","filters","sorting","onBackClick","onReviewClick","onContinueLearningClick","search","bannerMicrolearning","score","questionsToReview","totalContents","bannerMicrolearningAction","action","descriptionRef","useRef","isDescriptionTruncated","setIsDescriptionTruncated","useState","showMore","setShowMore","handleShowMore","useCallback","useEffect","current","clientHeight","scrollHeight","Description","ref","className","classnames","style","truncate","ProgressBar","progressBarColor","cm_positive_500","inlineProgressStyle","progressBarRow","progressBarWrapper","progress","role","progressInformationNumber","toFixed","hasDescription","Boolean","trim","length","backgroundContainer","container","topSection","_isNil2","backButton","tooltipPlacement","mainSection","leftSide","gap","padding","rightSide","skillFocusBadge","purple_100","faSize","wrapperSize","skillBadge","cm_grey_100","Fragment","showMoreWrapper","skillInformation","progressContainer","noDescriptionSpacing","ctaWrapper","disabled","cm_grey_700","content","oldSwitchValue","undefined","string","isRequired","shape","number","CardsGrid","onChange","options","arrayOf","SelectOptionPropTypes","Select","oldValue","_default"],"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 Select, {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  icon: {name: string; color: 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  sorting?: () => void;\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    icon: {color: iconColor, name: iconName},\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\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: iconName,\n                color: iconColor\n              }}\n              title={title}\n              customStyle={{gap: 24, padding: '50px 49px 50px 50px'}}\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.cm_grey_100}\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          sorting={sorting}\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  icon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string\n  }).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","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_classnames","_markdownToJsx","_cssColorFunction","_provider","_buttonLinkIcon","_icon","_iconPreview","_buttonLink","_cardsGrid","_colors","_select","_allCourses","_style","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ContinueLearningButton","props","context","ongoingCoursesAvailable","onClick","skin","translate","primarySkinColor","_get2","createElement","label","type","customStyle","width","borderRadius","backgroundColor","hoverBackgroundColor","convert","hoverColor","COLORS","white","icon","position","faIcon","name","color","size","exports","contextTypes","Provider","childContextTypes","propTypes","process","env","NODE_ENV","PropTypes","bool","func","SkillDetail","title","iconColor","iconName","skillRef","description","metrics","focused","availableForReview","skillIncludedCourses","filters","onBackClick","onReviewClick","onContinueLearningClick","search","bannerMicrolearning","score","questionsToReview","totalContents","bannerMicrolearningAction","action","descriptionRef","useRef","isDescriptionTruncated","setIsDescriptionTruncated","useState","showMore","setShowMore","handleShowMore","useCallback","useEffect","current","clientHeight","scrollHeight","Description","ref","className","classnames","style","truncate","ProgressBar","progressBarColor","cm_positive_500","inlineProgressStyle","progressBarRow","progressBarWrapper","progress","role","progressInformationNumber","toFixed","hasDescription","Boolean","trim","length","backgroundContainer","container","topSection","_isNil2","backButton","tooltipPlacement","mainSection","leftSide","gap","padding","rightSide","skillFocusBadge","purple_100","faSize","wrapperSize","skillBadge","cm_grey_100","Fragment","showMoreWrapper","skillInformation","progressContainer","noDescriptionSpacing","ctaWrapper","disabled","cm_grey_700","content","oldSwitchValue","undefined","string","isRequired","shape","number","CardsGrid","onChange","options","arrayOf","SelectOptionPropTypes","oldValue","_default"],"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 Select, {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  icon: {name: string; color: 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    icon: {color: iconColor, name: iconName},\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: iconName,\n                color: iconColor\n              }}\n              title={title}\n              customStyle={{gap: 24, padding: '50px 49px 50px 50px'}}\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.cm_grey_100}\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  icon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string\n  }).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":[]}

package/lib/template/skill-detail/style.css

@@ -206,7 +206,7 @@
   }
 
   .leftSide {
-    width: 342px;
+    width: 343px;
     height: 228px;
     display: flex;
     flex-direction: column;
@@ -265,12 +265,16 @@
   .topSection {
     flex-direction: row;
     align-items: center; 
+    gap: 16px;
   }
 
   .leftSide {
-    width: 343px;
     border-radius: 16px;
-    padding: 4px 32px 32px 0px;
+    padding: 16px 32px 32px 0px;
+  }
+
+  .backButton {
+    margin-bottom: 0;
   }
 
   .rightSide {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "11.35.3-forcedeploy5.4+9ed6ff1e8",
+  "version": "11.35.3-forcedeploy7.4+77d688638",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -165,5 +165,5 @@
     "last 2 versions",
     "IE 11"
   ],
-  "gitHead": "9ed6ff1e8c9cae648a7d3e92c84809df050ff066"
+  "gitHead": "77d688638848a0418ecab89541ff0d8eb5ddbf8b"
 }