@coorpacademy/components 11.32.21 → 11.32.23

package/lib/molecule/learning-priority-modal/index.js

@@ -0,0 +1,265 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _pick2 = _interopRequireDefault(require("lodash/fp/pick"));
+
+var _assign2 = _interopRequireDefault(require("lodash/fp/assign"));
+
+var _get2 = _interopRequireDefault(require("lodash/fp/get"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _cssColorFunction = require("css-color-function");
+
+var _baseModal = _interopRequireDefault(require("../base-modal"));
+
+var _listItem = _interopRequireDefault(require("../../organism/list-item"));
+
+var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
+
+var _loader = _interopRequireDefault(require("../../atom/loader"));
+
+var _provider = _interopRequireDefault(require("../../atom/provider"));
+
+var _select = require("../../atom/select");
+
+var _searchForm = _interopRequireDefault(require("../search-form"));
+
+var _searchValueIncluded = _interopRequireDefault(require("../../util/search-value-included"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const FilterButton = (props, context) => {
+  const {
+    active,
+    filter,
+    itemTotal,
+    onClick
+  } = props;
+  const {
+    skin
+  } = context;
+  const primarySkinColor = (0, _get2.default)('common.primary', skin);
+  const Content = (0, _react.useCallback)(() => /*#__PURE__*/_react.default.createElement("div", null, filter, /*#__PURE__*/_react.default.createElement("span", {
+    className: active ? _style.default.skillFilterNumber : _style.default.skillFilterNumberInActive,
+    style: {
+      backgroundColor: active ? (0, _cssColorFunction.convert)(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',
+      color: active ? primarySkinColor : '#515161'
+    }
+  }, itemTotal)), [filter, itemTotal, active, primarySkinColor]);
+  const buttonProps = {
+    customStyle: {
+      backgroundColor: active ? (0, _cssColorFunction.convert)(`color(${primarySkinColor} a(0.07))`) : 'transparent',
+      color: active ? primarySkinColor : '#9999A8',
+      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',
+      width: 'fit-content'
+    },
+    onClick,
+    content: /*#__PURE__*/_react.default.createElement(Content, null),
+    'data-name': 'change-skill-focus-button'
+  };
+  return /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonProps);
+};
+
+FilterButton.contextTypes = {
+  skin: _provider.default.childContextTypes.skin,
+  translate: _provider.default.childContextTypes.translate
+};
+FilterButton.propTypes = process.env.NODE_ENV !== "production" ? {
+  active: _propTypes.default.bool,
+  filter: _propTypes.default.string,
+  itemTotal: _propTypes.default.number,
+  onClick: _propTypes.default.func
+} : {};
+
+const LearningPriorityModal = (props, context) => {
+  const {
+    priorities,
+    preselected,
+    isOpen,
+    isLoading,
+    filters,
+    onCancel,
+    onAdd,
+    onClose
+  } = props;
+  const {
+    translate
+  } = context;
+  const [selectedPriority, setSelectedPriority] = (0, _react.useState)('');
+  const [selectedPriorityType, setSelectedPriorityType] = (0, _react.useState)('');
+  const [searchValue, setSearchValue] = (0, _react.useState)('');
+  const [filterValue, setFilterValue] = (0, _react.useState)('all');
+  const [searchResults, setSearchResults] = (0, _react.useState)(priorities);
+  const handleCancel = (0, _react.useCallback)(() => {
+    setSelectedPriority('');
+    setSelectedPriorityType('');
+    onCancel();
+  }, [setSelectedPriority, setSelectedPriorityType, onCancel]);
+  const handleClose = (0, _react.useCallback)(() => {
+    setSelectedPriority('');
+    setSelectedPriorityType('');
+    onClose();
+  }, [setSelectedPriority, setSelectedPriorityType, onClose]);
+  const handleSearch = (0, _react.useCallback)(value => {
+    setSearchValue(value);
+    setSearchResults(priorities.filter(priority => (0, _searchValueIncluded.default)(priority.title, value)));
+  }, [priorities, setSearchValue, setSearchResults]);
+  const handleSearchReset = (0, _react.useCallback)(() => {
+    setSearchValue('');
+    setSearchResults(priorities);
+  }, [priorities, setSearchValue, setSearchResults]);
+  (0, _react.useEffect)(() => {
+    setSearchResults(priorities);
+  }, [priorities]);
+  const priorityList = (0, _react.useMemo)(() => {
+    return searchResults.map(priority => {
+      const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);
+      return (0, _assign2.default)({
+        selected: isPreSelectedPriority,
+        disabled: isPreSelectedPriority
+      }, (0, _pick2.default)(['title', 'priorityRef', 'type', 'courses'], priority));
+    });
+  }, [searchResults, preselected]);
+  const footer = (0, _react.useMemo)(() => {
+    return {
+      cancelButton: {
+        onCancel: handleCancel,
+        label: translate('cancel')
+      },
+      confirmButton: {
+        onConfirm: () => {
+          onAdd(selectedPriority, selectedPriorityType);
+          setSelectedPriority('');
+          setSelectedPriorityType('');
+          onClose();
+        },
+        label: translate('add'),
+        iconName: 'plus',
+        disabled: isLoading || !selectedPriority
+      }
+    };
+  }, [handleCancel, setSelectedPriority, setSelectedPriorityType, onAdd, translate, selectedPriority, selectedPriorityType, isLoading]);
+  if (!isLoading && !priorities || !isOpen) return null;
+  return /*#__PURE__*/_react.default.createElement(_baseModal.default, {
+    title: translate('learning_priority_modal_title'),
+    description: translate('learning_priority_modal_description'),
+    isOpen: isOpen,
+    onClose: handleClose,
+    footer: footer
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.LearningPriorityContainer
+  }, isLoading ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.loaderContainer
+  }, /*#__PURE__*/_react.default.createElement(_loader.default, {
+    className: _style.default.loader,
+    theme: "coorpmanager"
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.searchWrapper
+  }, /*#__PURE__*/_react.default.createElement(_searchForm.default, {
+    search: {
+      placeholder: translate('search_priority_place_holder'),
+      value: searchValue,
+      onChange: handleSearch
+    },
+    onReset: handleSearchReset
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.filterWrapper
+  }, searchResults.length > 0 ? filters.map((filter, index) => {
+    const {
+      name,
+      value,
+      count
+    } = filter;
+
+    function handleChange() {
+      setFilterValue(value);
+      handleSearchReset();
+    }
+
+    if (count === 0) return null;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: index,
+      className: _style.default.filterButtonWrapper
+    }, /*#__PURE__*/_react.default.createElement(FilterButton, {
+      active: filterValue === value,
+      filter: name,
+      onClick: handleChange,
+      itemTotal: count
+    }));
+  }) : null), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.priorityListWrapper
+  }, priorityList.map(priority => {
+    const {
+      title,
+      priorityRef,
+      courses = null,
+      type,
+      selected,
+      disabled
+    } = priority;
+
+    function handlePriorityClick() {
+      if (selectedPriority === priorityRef) {
+        setSelectedPriority('');
+        setSelectedPriorityType('');
+        return;
+      }
+
+      setSelectedPriority(priorityRef);
+      setSelectedPriorityType(type);
+    }
+
+    if (filterValue !== 'all' && type !== filterValue) return null;
+    return /*#__PURE__*/_react.default.createElement(_listItem.default, _extends({}, courses !== null ? {
+      subtitle: `${courses} ${translate('courses')}`
+    } : {}, {
+      title: title,
+      selected: selected || selectedPriority === priorityRef,
+      disabled: disabled,
+      onClick: handlePriorityClick,
+      tags: [{
+        label: type,
+        type: 'default'
+      }],
+      key: priorityRef,
+      backgroundColor: "skin"
+    }));
+  })))));
+};
+
+LearningPriorityModal.contextTypes = {
+  translate: _provider.default.childContextTypes.translate
+};
+LearningPriorityModal.propTypes = process.env.NODE_ENV !== "production" ? {
+  priorities: _propTypes.default.arrayOf(_propTypes.default.shape({
+    priorityRef: _propTypes.default.string,
+    title: _propTypes.default.string,
+    courses: _propTypes.default.number,
+    type: _propTypes.default.oneOf(['skill', 'playlist', 'certificate'])
+  })),
+  preselected: _propTypes.default.arrayOf(_propTypes.default.string),
+  isOpen: _propTypes.default.bool,
+  isLoading: _propTypes.default.bool,
+  filters: _propTypes.default.arrayOf(_propTypes.default.shape(_extends({}, _select.SelectOptionPropTypes, {
+    count: _propTypes.default.number
+  }))),
+  onCancel: _propTypes.default.func,
+  onAdd: _propTypes.default.func,
+  onClose: _propTypes.default.func
+} : {};
+var _default = LearningPriorityModal;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/molecule/learning-priority-modal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["FilterButton","props","context","active","filter","itemTotal","onClick","skin","primarySkinColor","Content","useCallback","style","skillFilterNumber","skillFilterNumberInActive","backgroundColor","convert","color","buttonProps","customStyle","transition","width","content","contextTypes","Provider","childContextTypes","translate","propTypes","PropTypes","bool","string","number","func","LearningPriorityModal","priorities","preselected","isOpen","isLoading","filters","onCancel","onAdd","onClose","selectedPriority","setSelectedPriority","useState","selectedPriorityType","setSelectedPriorityType","searchValue","setSearchValue","filterValue","setFilterValue","searchResults","setSearchResults","handleCancel","handleClose","handleSearch","value","priority","searchValueIncluded","title","handleSearchReset","useEffect","priorityList","useMemo","map","isPreSelectedPriority","some","selected","priorityRef","disabled","footer","cancelButton","label","confirmButton","onConfirm","iconName","LearningPriorityContainer","loaderContainer","loader","searchWrapper","placeholder","onChange","filterWrapper","length","index","name","count","handleChange","filterButtonWrapper","priorityListWrapper","courses","type","handlePriorityClick","subtitle","arrayOf","shape","oneOf","SelectOptionPropTypes"],"sources":["../../../src/molecule/learning-priority-modal/index.js"],"sourcesContent":["import React, {useEffect, useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {get, assign, pick} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport BaseModal from '../base-modal';\nimport ListItem from '../../organism/list-item';\nimport ButtonLink from '../../atom/button-link';\nimport Loader from '../../atom/loader';\nimport Provider from '../../atom/provider';\nimport {SelectOptionPropTypes} from '../../atom/select';\nimport SearchForm from '../search-form';\nimport searchValueIncluded from '../../util/search-value-included';\nimport style from './style.css';\n\nconst FilterButton = (props, context) => {\n  const {active, filter, itemTotal, onClick} = props;\n  const {skin} = context;\n  const primarySkinColor = get('common.primary', skin);\n\n  const Content = useCallback(\n    () => (\n      <div>\n        {filter}\n        <span\n          className={active ? style.skillFilterNumber : style.skillFilterNumberInActive}\n          style={{\n            backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : '#EAEAEB',\n            color: active ? primarySkinColor : '#515161'\n          }}\n        >\n          {itemTotal}\n        </span>\n      </div>\n    ),\n    [filter, itemTotal, active, primarySkinColor]\n  );\n\n  const buttonProps = {\n    customStyle: {\n      backgroundColor: active ? convert(`color(${primarySkinColor} a(0.07))`) : 'transparent',\n      color: active ? primarySkinColor : '#9999A8',\n      transition: 'background-color 0.15s ease-in-out, color 0.15s ease-in-out',\n      width: 'fit-content'\n    },\n    onClick,\n    content: <Content />,\n    'data-name': 'change-skill-focus-button'\n  };\n\n  return <ButtonLink {...buttonProps} />;\n};\n\nFilterButton.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nFilterButton.propTypes = {\n  active: PropTypes.bool,\n  filter: PropTypes.string,\n  itemTotal: PropTypes.number,\n  onClick: PropTypes.func\n};\n\nconst LearningPriorityModal = (props, context) => {\n  const {priorities, preselected, isOpen, isLoading, filters, onCancel, onAdd, onClose} = props;\n  const {translate} = context;\n\n  const [selectedPriority, setSelectedPriority] = useState('');\n  const [selectedPriorityType, setSelectedPriorityType] = useState('');\n  const [searchValue, setSearchValue] = useState('');\n  const [filterValue, setFilterValue] = useState('all');\n  const [searchResults, setSearchResults] = useState(priorities);\n\n  const handleCancel = useCallback(() => {\n    setSelectedPriority('');\n    setSelectedPriorityType('');\n    onCancel();\n  }, [setSelectedPriority, setSelectedPriorityType, onCancel]);\n\n  const handleClose = useCallback(() => {\n    setSelectedPriority('');\n    setSelectedPriorityType('');\n    onClose();\n  }, [setSelectedPriority, setSelectedPriorityType, onClose]);\n\n  const handleSearch = useCallback(\n    value => {\n      setSearchValue(value);\n      setSearchResults(priorities.filter(priority => searchValueIncluded(priority.title, value)));\n    },\n    [priorities, setSearchValue, setSearchResults]\n  );\n\n  const handleSearchReset = useCallback(() => {\n    setSearchValue('');\n    setSearchResults(priorities);\n  }, [priorities, setSearchValue, setSearchResults]);\n\n  useEffect(() => {\n    setSearchResults(priorities);\n  }, [priorities]);\n\n  const priorityList = useMemo(() => {\n    return searchResults.map(priority => {\n      const isPreSelectedPriority = preselected.some(selected => selected === priority.priorityRef);\n      return assign(\n        {\n          selected: isPreSelectedPriority,\n          disabled: isPreSelectedPriority\n        },\n        pick(['title', 'priorityRef', 'type', 'courses'], priority)\n      );\n    });\n  }, [searchResults, preselected]);\n\n  const footer = useMemo(() => {\n    return {\n      cancelButton: {\n        onCancel: handleCancel,\n        label: translate('cancel')\n      },\n      confirmButton: {\n        onConfirm: () => {\n          onAdd(selectedPriority, selectedPriorityType);\n          setSelectedPriority('');\n          setSelectedPriorityType('');\n          onClose();\n        },\n        label: translate('add'),\n        iconName: 'plus',\n        disabled: isLoading || !selectedPriority\n      }\n    };\n  }, [\n    handleCancel,\n    setSelectedPriority,\n    setSelectedPriorityType,\n    onAdd,\n    translate,\n    selectedPriority,\n    selectedPriorityType,\n    isLoading\n  ]);\n\n  if ((!isLoading && !priorities) || !isOpen) return null;\n\n  return (\n    <BaseModal\n      title={translate('learning_priority_modal_title')}\n      description={translate('learning_priority_modal_description')}\n      isOpen={isOpen}\n      onClose={handleClose}\n      footer={footer}\n    >\n      <div className={style.LearningPriorityContainer}>\n        {isLoading ? (\n          <div className={style.loaderContainer}>\n            <Loader className={style.loader} theme=\"coorpmanager\" />\n          </div>\n        ) : (\n          <>\n            <div className={style.searchWrapper}>\n              <SearchForm\n                search={{\n                  placeholder: translate('search_priority_place_holder'),\n                  value: searchValue,\n                  onChange: handleSearch\n                }}\n                onReset={handleSearchReset}\n              />\n            </div>\n            <div className={style.filterWrapper}>\n              {searchResults.length > 0\n                ? filters.map((filter, index) => {\n                    const {name, value, count} = filter;\n\n                    function handleChange() {\n                      setFilterValue(value);\n                      handleSearchReset();\n                    }\n\n                    if (count === 0) return null;\n\n                    return (\n                      <div key={index} className={style.filterButtonWrapper}>\n                        <FilterButton\n                          active={filterValue === value}\n                          filter={name}\n                          onClick={handleChange}\n                          itemTotal={count}\n                        />\n                      </div>\n                    );\n                  })\n                : null}\n            </div>\n            <div className={style.priorityListWrapper}>\n              {priorityList.map(priority => {\n                const {title, priorityRef, courses = null, type, selected, disabled} = priority;\n                function handlePriorityClick() {\n                  if (selectedPriority === priorityRef) {\n                    setSelectedPriority('');\n                    setSelectedPriorityType('');\n                    return;\n                  }\n                  setSelectedPriority(priorityRef);\n                  setSelectedPriorityType(type);\n                }\n\n                if (filterValue !== 'all' && type !== filterValue) return null;\n\n                return (\n                  <ListItem\n                    {...(courses !== null ? {subtitle: `${courses} ${translate('courses')}`} : {})}\n                    title={title}\n                    selected={selected || selectedPriority === priorityRef}\n                    disabled={disabled}\n                    onClick={handlePriorityClick}\n                    tags={[{label: type, type: 'default'}]}\n                    key={priorityRef}\n                    backgroundColor=\"skin\"\n                  />\n                );\n              })}\n            </div>\n          </>\n        )}\n      </div>\n    </BaseModal>\n  );\n};\n\nLearningPriorityModal.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nLearningPriorityModal.propTypes = {\n  priorities: PropTypes.arrayOf(\n    PropTypes.shape({\n      priorityRef: PropTypes.string,\n      title: PropTypes.string,\n      courses: PropTypes.number,\n      type: PropTypes.oneOf(['skill', 'playlist', 'certificate'])\n    })\n  ),\n  preselected: PropTypes.arrayOf(PropTypes.string),\n  isOpen: PropTypes.bool,\n  isLoading: PropTypes.bool,\n  filters: PropTypes.arrayOf(\n    PropTypes.shape({\n      ...SelectOptionPropTypes,\n      count: PropTypes.number\n    })\n  ),\n  onCancel: PropTypes.func,\n  onAdd: PropTypes.func,\n  onClose: PropTypes.func\n};\n\nexport default LearningPriorityModal;\n"],"mappings":"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"}

package/lib/molecule/learning-priority-modal/style.css

@@ -0,0 +1,70 @@
+@value colors: "../../variables/colors.css";
+@value cm_grey_100 from colors;
+
+.LearningPriorityContainer {
+  height: 485px;
+  width: calc(71vw - 68px);
+  max-width: 660px;
+  overflow-y: auto;
+}
+
+.loaderContainer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  width: 100%;
+}
+
+.loader {
+  width: 40px; 
+  height: 40px;
+}
+
+.searchWrapper {
+  border-radius: 12px;
+  width: 300px;
+  background-color: cm_grey_100;
+  margin-bottom: 20px;
+}
+
+.filterWrapper {
+  display: flex;
+  gap: 12px;
+  margin-bottom: 32px;
+  overflow-x: auto;
+}
+
+.filterButtonWrapper {
+  display: flex;
+  align-items: center;
+}
+
+.skillFilterNumber,
+.skillFilterNumberInActive {
+  border-radius: 50%;
+  background-color: #D6E6FF;
+  color: #0061FF;
+  padding: 2px 4px;
+  margin-left: 8px;
+  font-size: 10px;
+  font-weight: 600;
+  line-height: 12px;
+}
+
+.skillFilterNumberInActive {
+  background-color: #EAEAEB;
+  color: #515161;
+}
+
+.priorityListWrapper {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+
+@media mobile {
+  .LearningPriorityContainer {
+    width: 100%;
+  }
+}

package/lib/molecule/learning-priority-setup-item/index.d.ts

@@ -0,0 +1,18 @@
+export default LearningPrioritySetupItem;
+declare function LearningPrioritySetupItem(props: any, context: any): JSX.Element;
+declare namespace LearningPrioritySetupItem {
+    namespace contextTypes {
+        const translate: PropTypes.Requireable<(...args: any[]) => any>;
+    }
+    const propTypes: {
+        'aria-label': PropTypes.Requireable<string>;
+        id: PropTypes.Requireable<string>;
+        priorityRef: PropTypes.Requireable<string>;
+        title: PropTypes.Requireable<string>;
+        courses: PropTypes.Requireable<number>;
+        type: PropTypes.Requireable<string>;
+        onRemove: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+}
+import PropTypes from "prop-types";
+//# sourceMappingURL=index.d.ts.map

package/lib/molecule/learning-priority-setup-item/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/learning-priority-setup-item/index.js"],"names":[],"mappings":";AAOA,kFAsDC"}

package/lib/molecule/learning-priority-setup-item/index.js

@@ -0,0 +1,100 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _provider = _interopRequireDefault(require("../../atom/provider"));
+
+var _tag = _interopRequireDefault(require("../../atom/tag"));
+
+var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const LearningPrioritySetupItem = (props, context) => {
+  const {
+    priorityRef,
+    id,
+    title,
+    courses = null,
+    type,
+    'aria-label': ariaLabel,
+    onRemove
+  } = props;
+  const {
+    translate
+  } = context;
+  const handleRemovePriority = (0, _react.useCallback)(() => onRemove(priorityRef, type), [priorityRef, type]);
+
+  const handleTypeTranslate = itemType => {
+    switch (itemType) {
+      case 'skill':
+        return translate('skill');
+
+      case 'playlist':
+        return translate('playlist');
+
+      case 'certificate':
+        return translate('certificate');
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.container,
+    "aria-label": ariaLabel,
+    "data-name": `learning-priority-setup-item-${id}`
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.containerInfos
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.titleWrapper
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.title
+  }, title), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_tag.default, {
+    label: handleTypeTranslate(type),
+    size: 'S'
+  }))), courses !== null ? /*#__PURE__*/_react.default.createElement("span", {
+    className: _style.default.courses
+  }, `${courses} ${translate('courses')}`) : null), /*#__PURE__*/_react.default.createElement(_buttonLink.default, {
+    type: "primary",
+    customStyle: {
+      width: 'fit-content',
+      backgroundColor: 'transparent'
+    },
+    hoverBackgroundColor: "#EAEAEB",
+    icon: {
+      position: 'left',
+      faIcon: {
+        name: 'trash',
+        color: '#515161',
+        size: 16
+      }
+    },
+    onClick: handleRemovePriority
+  }));
+};
+
+LearningPrioritySetupItem.contextTypes = {
+  translate: _provider.default.childContextTypes.translate
+};
+LearningPrioritySetupItem.propTypes = process.env.NODE_ENV !== "production" ? {
+  'aria-label': _propTypes.default.string,
+  id: _propTypes.default.string,
+  priorityRef: _propTypes.default.string,
+  title: _propTypes.default.string,
+  courses: _propTypes.default.number,
+  type: _propTypes.default.oneOf(['skill', 'playlist', 'certificate']),
+  onRemove: _propTypes.default.func
+} : {};
+var _default = LearningPrioritySetupItem;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/molecule/learning-priority-setup-item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["LearningPrioritySetupItem","props","context","priorityRef","id","title","courses","type","ariaLabel","onRemove","translate","handleRemovePriority","useCallback","handleTypeTranslate","itemType","style","container","containerInfos","titleWrapper","width","backgroundColor","position","faIcon","name","color","size","contextTypes","Provider","childContextTypes","propTypes","PropTypes","string","number","oneOf","func"],"sources":["../../../src/molecule/learning-priority-setup-item/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Provider from '../../atom/provider';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst LearningPrioritySetupItem = (props, context) => {\n  const {priorityRef, id, title, courses = null, type, 'aria-label': ariaLabel, onRemove} = props;\n\n  const {translate} = context;\n\n  const handleRemovePriority = useCallback(() => onRemove(priorityRef, type), [priorityRef, type]);\n\n  const handleTypeTranslate = itemType => {\n    switch (itemType) {\n      case 'skill':\n        return translate('skill');\n      case 'playlist':\n        return translate('playlist');\n      case 'certificate':\n        return translate('certificate');\n    }\n  };\n\n  return (\n    <div\n      className={style.container}\n      aria-label={ariaLabel}\n      data-name={`learning-priority-setup-item-${id}`}\n    >\n      <div className={style.containerInfos}>\n        <div className={style.titleWrapper}>\n          <div className={style.title}>{title}</div>\n          <div>\n            <Tag label={handleTypeTranslate(type)} size={'S'} />\n          </div>\n        </div>\n        {courses !== null ? (\n          <span className={style.courses}>{`${courses} ${translate('courses')}`}</span>\n        ) : null}\n      </div>\n      <ButtonLink\n        type=\"primary\"\n        customStyle={{\n          width: 'fit-content',\n          backgroundColor: 'transparent'\n        }}\n        hoverBackgroundColor=\"#EAEAEB\"\n        icon={{\n          position: 'left',\n          faIcon: {\n            name: 'trash',\n            color: '#515161',\n            size: 16\n          }\n        }}\n        onClick={handleRemovePriority}\n      />\n    </div>\n  );\n};\n\nLearningPrioritySetupItem.contextTypes = {\n  translate: Provider.childContextTypes.translate\n};\n\nLearningPrioritySetupItem.propTypes = {\n  'aria-label': PropTypes.string,\n  id: PropTypes.string,\n  priorityRef: PropTypes.string,\n  title: PropTypes.string,\n  courses: PropTypes.number,\n  type: PropTypes.oneOf(['skill', 'playlist', 'certificate']),\n  onRemove: PropTypes.func\n};\n\nexport default LearningPrioritySetupItem;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;AAEA,MAAMA,yBAAyB,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EACpD,MAAM;IAACC,WAAD;IAAcC,EAAd;IAAkBC,KAAlB;IAAyBC,OAAO,GAAG,IAAnC;IAAyCC,IAAzC;IAA+C,cAAcC,SAA7D;IAAwEC;EAAxE,IAAoFR,KAA1F;EAEA,MAAM;IAACS;EAAD,IAAcR,OAApB;EAEA,MAAMS,oBAAoB,GAAG,IAAAC,kBAAA,EAAY,MAAMH,QAAQ,CAACN,WAAD,EAAcI,IAAd,CAA1B,EAA+C,CAACJ,WAAD,EAAcI,IAAd,CAA/C,CAA7B;;EAEA,MAAMM,mBAAmB,GAAGC,QAAQ,IAAI;IACtC,QAAQA,QAAR;MACE,KAAK,OAAL;QACE,OAAOJ,SAAS,CAAC,OAAD,CAAhB;;MACF,KAAK,UAAL;QACE,OAAOA,SAAS,CAAC,UAAD,CAAhB;;MACF,KAAK,aAAL;QACE,OAAOA,SAAS,CAAC,aAAD,CAAhB;IANJ;EAQD,CATD;;EAWA,oBACE;IACE,SAAS,EAAEK,cAAA,CAAMC,SADnB;IAEE,cAAYR,SAFd;IAGE,aAAY,gCAA+BJ,EAAG;EAHhD,gBAKE;IAAK,SAAS,EAAEW,cAAA,CAAME;EAAtB,gBACE;IAAK,SAAS,EAAEF,cAAA,CAAMG;EAAtB,gBACE;IAAK,SAAS,EAAEH,cAAA,CAAMV;EAAtB,GAA8BA,KAA9B,CADF,eAEE,uDACE,6BAAC,YAAD;IAAK,KAAK,EAAEQ,mBAAmB,CAACN,IAAD,CAA/B;IAAuC,IAAI,EAAE;EAA7C,EADF,CAFF,CADF,EAOGD,OAAO,KAAK,IAAZ,gBACC;IAAM,SAAS,EAAES,cAAA,CAAMT;EAAvB,GAAkC,GAAEA,OAAQ,IAAGI,SAAS,CAAC,SAAD,CAAY,EAApE,CADD,GAEG,IATN,CALF,eAgBE,6BAAC,mBAAD;IACE,IAAI,EAAC,SADP;IAEE,WAAW,EAAE;MACXS,KAAK,EAAE,aADI;MAEXC,eAAe,EAAE;IAFN,CAFf;IAME,oBAAoB,EAAC,SANvB;IAOE,IAAI,EAAE;MACJC,QAAQ,EAAE,MADN;MAEJC,MAAM,EAAE;QACNC,IAAI,EAAE,OADA;QAENC,KAAK,EAAE,SAFD;QAGNC,IAAI,EAAE;MAHA;IAFJ,CAPR;IAeE,OAAO,EAAEd;EAfX,EAhBF,CADF;AAoCD,CAtDD;;AAwDAX,yBAAyB,CAAC0B,YAA1B,GAAyC;EACvChB,SAAS,EAAEiB,iBAAA,CAASC,iBAAT,CAA2BlB;AADC,CAAzC;AAIAV,yBAAyB,CAAC6B,SAA1B,2CAAsC;EACpC,cAAcC,kBAAA,CAAUC,MADY;EAEpC3B,EAAE,EAAE0B,kBAAA,CAAUC,MAFsB;EAGpC5B,WAAW,EAAE2B,kBAAA,CAAUC,MAHa;EAIpC1B,KAAK,EAAEyB,kBAAA,CAAUC,MAJmB;EAKpCzB,OAAO,EAAEwB,kBAAA,CAAUE,MALiB;EAMpCzB,IAAI,EAAEuB,kBAAA,CAAUG,KAAV,CAAgB,CAAC,OAAD,EAAU,UAAV,EAAsB,aAAtB,CAAhB,CAN8B;EAOpCxB,QAAQ,EAAEqB,kBAAA,CAAUI;AAPgB,CAAtC;eAUelC,yB"}

package/lib/molecule/learning-priority-setup-item/style.css

@@ -0,0 +1,47 @@
+@value colors: "../../variables/colors.css";
+@value cm_grey_50 from colors;
+@value cm_grey_700 from colors;
+@value cm_grey_500 from colors;
+@value cm_grey_400 from colors;
+
+.container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background-color: cm_grey_50;
+    font-size: 14px;
+    margin-top: 8px;
+    padding: 8px 16px;
+    border-radius: 7px;
+}
+
+.containerInfos {
+    margin-left: 32px;
+    overflow: hidden;
+    flex-grow: 1;
+}
+
+.titleWrapper {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.title {
+    color: cm_grey_700;
+    line-height: 22px;
+    font-family: Gilroy;
+    font-size: 16px;
+    font-weight: bold;
+    overflow: hidden;
+    white-space: nowrap;
+    display: inline-block;
+    text-overflow: ellipsis;
+}
+
+.courses {
+    color: cm_grey_500;
+    display: block;
+    font-family: Gilroy;
+    line-height: 20px;
+}

package/lib/molecule/title-and-checkbox-wrapper/index.d.ts

@@ -23,6 +23,9 @@ declare namespace TitleAndCheckBoxWrapper {
                 label: PropTypes.Requireable<string>;
                 type: PropTypes.Requireable<string>;
                 size: PropTypes.Requireable<string>;
+                customStyle: PropTypes.Requireable<{
+                    [x: string]: string | null | undefined;
+                }>;
             }>>;
         }>>;
         const child: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{

package/lib/molecule/title-radio-wrapper/index.d.ts

@@ -16,6 +16,9 @@ declare const TitleRadioWrapper: {
                     label: import("prop-types").Requireable<string>;
                     type: import("prop-types").Requireable<string>;
                     size: import("prop-types").Requireable<string>;
+                    customStyle: import("prop-types").Requireable<{
+                        [x: string]: string | null | undefined;
+                    }>;
                 }>>;
             }>>>;
             name: import("prop-types").Requireable<string>;

package/lib/molecule/title-radio-wrapper/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/index.tsx"],"names":[],"mappings":";AAKA,OAAkB,EAAC,sBAAsB,EAAC,MAAM,SAAS,CAAC;AAqB1D,QAAA,MAAM,iBAAiB;YAAW,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQvD,CAAC;AAIF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/index.tsx"],"names":[],"mappings":";AAKA,OAAkB,EAAC,sBAAsB,EAAC,MAAM,SAAS,CAAC;AAqB1D,QAAA,MAAM,iBAAiB;YAAW,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQvD,CAAC;AAIF,eAAe,iBAAiB,CAAC"}

package/lib/molecule/title-radio-wrapper/types.d.ts

@@ -16,6 +16,9 @@ declare const propTypes: {
                 label: PropTypes.Requireable<string>;
                 type: PropTypes.Requireable<string>;
                 size: PropTypes.Requireable<string>;
+                customStyle: PropTypes.Requireable<{
+                    [x: string]: string | null | undefined;
+                }>;
             }>>;
         }>>>;
         name: PropTypes.Requireable<string>;

package/lib/molecule/title-radio-wrapper/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,kBAAkB,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAC,mBAAmB,EAAC,MAAM,mCAAmC,CAAC;AACtE,OAAO,cAAc,MAAM,oBAAoB,CAAC;AAEhD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOd,CAAC;AAEF,oBAAY,sBAAsB,GAAG;IACnC,cAAc,EAAE,mBAAmB,CAAC;IACpC,KAAK,EAAE,OAAO,cAAc,CAAC,SAAS,GAAG,OAAO,kBAAkB,CAAC,SAAS,CAAC;IAC7E,SAAS,EAAE,iBAAiB,GAAG,gBAAgB,CAAC;CACjD,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/title-radio-wrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,kBAAkB,MAAM,iCAAiC,CAAC;AAEjE,OAAO,EAAC,mBAAmB,EAAC,MAAM,mCAAmC,CAAC;AACtE,OAAO,cAAc,MAAM,oBAAoB,CAAC;AAEhD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOd,CAAC;AAEF,oBAAY,sBAAsB,GAAG;IACnC,cAAc,EAAE,mBAAmB,CAAC;IACpC,KAAK,EAAE,OAAO,cAAc,CAAC,SAAS,GAAG,OAAO,kBAAkB,CAAC,SAAS,CAAC;IAC7E,SAAS,EAAE,iBAAiB,GAAG,gBAAgB,CAAC;CACjD,CAAC;AAEF,eAAe,SAAS,CAAC"}