@coorpacademy/components 11.40.15 → 11.40.16

package/es/atom/button/style.css

@@ -3,7 +3,7 @@
 @value xtraLightGrey from colors;
 @value light from colors;
 @value white from colors;
-@value lightMediumGray from colors;
+@value lightMediumGrey from colors;
 
 .button {
   composes: hoverFill from './hover-fill.css';
@@ -41,7 +41,7 @@
 }
 
 .disabledAnchor {
-  background-color: lightMediumGray;
+  background-color: lightMediumGrey;
   min-width: 200px;
   text-transform: inherit;
   border-radius: 2px;

package/es/atom/button-menu/utils.d.ts

@@ -2,7 +2,7 @@ export declare const DEFAULT_ICON_STYLE: {
     position: "left";
     faIcon: {
         size: number;
-        color: "#9999A8";
+        color: "#515161";
         customStyle: {
             padding: number;
         };

package/es/atom/checkbox-with-title/index.d.ts

@@ -1,7 +1,8 @@
 export default CheckboxWithTitle;
-declare function CheckboxWithTitle(props: any): JSX.Element;
+declare function CheckboxWithTitle(props: any, context: any): JSX.Element;
 declare namespace CheckboxWithTitle {
     const propTypes: {
+        value: PropTypes.Requireable<string>;
         title: PropTypes.Requireable<string>;
         name: PropTypes.Requireable<string>;
         checked: PropTypes.Requireable<boolean>;
@@ -17,6 +18,29 @@ declare namespace CheckboxWithTitle {
             [x: string]: NonNullable<string | number | null | undefined> | null | undefined;
         }>;
     };
+    namespace contextTypes {
+        const skin: PropTypes.Requireable<PropTypes.InferProps<{
+            common: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            images: PropTypes.Requireable<PropTypes.InferProps<{
+                'logo-mobile': PropTypes.Requireable<any>;
+                logo: PropTypes.Requireable<any>;
+                'logo-email': PropTypes.Requireable<any>;
+                login: PropTypes.Requireable<any>;
+            }>>;
+            icons: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            mod: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            courses: PropTypes.Requireable<any[]>;
+            texts: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+        }>>;
+    }
 }
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

package/es/atom/checkbox-with-title/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/checkbox-with-title/index.js"],"names":[],"mappings":";AAQA,4DA0DC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/checkbox-with-title/index.js"],"names":[],"mappings":";AAUA,0EAiEC"}

package/es/atom/checkbox-with-title/index.js

@@ -1,16 +1,20 @@
 import _uniqueId from "lodash/fp/uniqueId";
 import _noop from "lodash/fp/noop";
+import _getOr from "lodash/fp/getOr";
 import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import FaIcon from '../icon';
+import { COLORS } from '../../variables/colors';
+import Provider from '../provider';
 import style from './style.css';
 const DEFAULT_ICON_STYLE = {
   padding: '0',
   width: '20px',
   height: '20px'
 };
-const CheckboxWithTitle = props => {
+const CheckboxWithTitle = (props, context) => {
   const {
+    value,
     title,
     name,
     checked,
@@ -24,6 +28,10 @@ const CheckboxWithTitle = props => {
     },
     customStyle = {}
   } = props;
+  const {
+    skin
+  } = context;
+  const primaryColor = _getOr(COLORS.cm_primary_blue, 'common.primary', skin);
   const {
     iconName,
     iconColor,
@@ -40,6 +48,7 @@ const CheckboxWithTitle = props => {
     htmlFor: idCheckbox
   }, /*#__PURE__*/React.createElement("input", {
     type: "checkbox",
+    "data-value": value,
     id: idCheckbox,
     name: name,
     onChange: handleChange,
@@ -48,7 +57,11 @@ const CheckboxWithTitle = props => {
     "data-name": dataName,
     "aria-label": ariaLabel
   }), /*#__PURE__*/React.createElement("div", {
-    className: style.label
+    className: style.label,
+    style: checked ? {
+      background: primaryColor,
+      borderColor: primaryColor
+    } : null
   }, checked ? /*#__PURE__*/React.createElement(FaIcon, {
     className: style.icon,
     iconName: iconName,
@@ -69,6 +82,7 @@ const CheckboxWithTitle = props => {
   }) : null);
 };
 CheckboxWithTitle.propTypes = process.env.NODE_ENV !== "production" ? {
+  value: PropTypes.string,
   title: PropTypes.string,
   name: PropTypes.string,
   checked: PropTypes.bool,
@@ -82,5 +96,8 @@ CheckboxWithTitle.propTypes = process.env.NODE_ENV !== "production" ? {
   }),
   customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))
 } : {};
+CheckboxWithTitle.contextTypes = {
+  skin: Provider.childContextTypes.skin
+};
 export default CheckboxWithTitle;
 //# sourceMappingURL=index.js.map

package/es/atom/checkbox-with-title/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","FaIcon","style","DEFAULT_ICON_STYLE","padding","width","height","CheckboxWithTitle","props","title","name","checked","onChange","_noop","dataName","ariaLabel","icon","iconName","iconColor","preset","customStyle","idCheckbox","_uniqueId","handleChange","e","target","createElement","className","container","htmlFor","type","id","checkbox","label","dangerouslySetInnerHTML","__html","propTypes","process","env","NODE_ENV","string","bool","func","shape","objectOf","oneOfType","number"],"sources":["../../../src/atom/checkbox-with-title/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport FaIcon from '../icon';\nimport style from './style.css';\n\nconst DEFAULT_ICON_STYLE = {padding: '0', width: '20px', height: '20px'};\n\nconst CheckboxWithTitle = props => {\n  const {\n    title,\n    name,\n    checked,\n    onChange = noop,\n    'data-name': dataName,\n    'aria-label': ariaLabel,\n    icon = {iconName: 'check', iconColor: 'white', preset: 's'},\n    customStyle = {}\n  } = props;\n  const {iconName, iconColor, preset} = icon;\n  const idCheckbox = useMemo(() => uniqueId('input-checkbox-'), []);\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  return (\n    <div className={style.container} style={{...customStyle}}>\n      {onChange !== noop ? (\n        <label htmlFor={idCheckbox}>\n          <input\n            type=\"checkbox\"\n            id={idCheckbox}\n            name={name}\n            onChange={handleChange}\n            checked={checked}\n            className={style.checkbox}\n            data-name={dataName}\n            aria-label={ariaLabel}\n          />\n          <div className={style.label}>\n            {checked ? (\n              <FaIcon\n                className={style.icon}\n                iconName={iconName}\n                iconColor={iconColor}\n                preset={preset}\n                customStyle={DEFAULT_ICON_STYLE}\n              />\n            ) : (\n              <FaIcon\n                className={style.icon}\n                iconName={'square'}\n                iconColor={'transparent'}\n                preset=\"s\"\n                customStyle={DEFAULT_ICON_STYLE}\n              />\n            )}\n          </div>\n        </label>\n      ) : null}\n      {title ? (\n        <span\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: title}}\n        />\n      ) : null}\n    </div>\n  );\n};\n\nCheckboxWithTitle.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  checked: PropTypes.bool,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\n  icon: PropTypes.shape({\n    iconName: PropTypes.string,\n    iconColor: PropTypes.string,\n    preset: PropTypes.string\n  }),\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\nexport default CheckboxWithTitle;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","FaIcon","COLORS","Provider","style","DEFAULT_ICON_STYLE","padding","width","height","CheckboxWithTitle","props","context","value","title","name","checked","onChange","_noop","dataName","ariaLabel","icon","iconName","iconColor","preset","customStyle","skin","primaryColor","_getOr","cm_primary_blue","idCheckbox","_uniqueId","handleChange","e","target","createElement","className","container","htmlFor","type","id","checkbox","label","background","borderColor","dangerouslySetInnerHTML","__html","propTypes","process","env","NODE_ENV","string","bool","func","shape","objectOf","oneOfType","number","contextTypes","childContextTypes"],"sources":["../../../src/atom/checkbox-with-title/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr, noop, uniqueId} from 'lodash/fp';\nimport FaIcon from '../icon';\nimport {COLORS} from '../../variables/colors';\nimport Provider from '../provider';\nimport style from './style.css';\n\nconst DEFAULT_ICON_STYLE = {padding: '0', width: '20px', height: '20px'};\n\nconst CheckboxWithTitle = (props, context) => {\n  const {\n    value,\n    title,\n    name,\n    checked,\n    onChange = noop,\n    'data-name': dataName,\n    'aria-label': ariaLabel,\n    icon = {iconName: 'check', iconColor: 'white', preset: 's'},\n    customStyle = {}\n  } = props;\n  const {skin} = context;\n  const primaryColor = getOr(COLORS.cm_primary_blue, 'common.primary', skin);\n  const {iconName, iconColor, preset} = icon;\n  const idCheckbox = useMemo(() => uniqueId('input-checkbox-'), []);\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n\n  return (\n    <div className={style.container} style={{...customStyle}}>\n      {onChange !== noop ? (\n        <label htmlFor={idCheckbox}>\n          <input\n            type=\"checkbox\"\n            data-value={value}\n            id={idCheckbox}\n            name={name}\n            onChange={handleChange}\n            checked={checked}\n            className={style.checkbox}\n            data-name={dataName}\n            aria-label={ariaLabel}\n          />\n          <div\n            className={style.label}\n            style={checked ? {background: primaryColor, borderColor: primaryColor} : null}\n          >\n            {checked ? (\n              <FaIcon\n                className={style.icon}\n                iconName={iconName}\n                iconColor={iconColor}\n                preset={preset}\n                customStyle={DEFAULT_ICON_STYLE}\n              />\n            ) : (\n              <FaIcon\n                className={style.icon}\n                iconName={'square'}\n                iconColor={'transparent'}\n                preset=\"s\"\n                customStyle={DEFAULT_ICON_STYLE}\n              />\n            )}\n          </div>\n        </label>\n      ) : null}\n      {title ? (\n        <span\n          // eslint-disable-next-line react/no-danger\n          dangerouslySetInnerHTML={{__html: title}}\n        />\n      ) : null}\n    </div>\n  );\n};\n\nCheckboxWithTitle.propTypes = {\n  value: PropTypes.string,\n  title: PropTypes.string,\n  name: PropTypes.string,\n  checked: PropTypes.bool,\n  onChange: PropTypes.func,\n  'aria-label': PropTypes.string,\n  'data-name': PropTypes.string,\n  icon: PropTypes.shape({\n    iconName: PropTypes.string,\n    iconColor: PropTypes.string,\n    preset: PropTypes.string\n  }),\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nCheckboxWithTitle.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\nexport default CheckboxWithTitle;\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAGC,OAAO,QAAO,OAAO;AACpC,OAAOC,SAAS,MAAM,YAAY;AAElC,OAAOC,MAAM,MAAM,SAAS;AAC5B,SAAQC,MAAM,QAAO,wBAAwB;AAC7C,OAAOC,QAAQ,MAAM,aAAa;AAClC,OAAOC,KAAK,MAAM,aAAa;AAE/B,MAAMC,kBAAkB,GAAG;EAACC,OAAO,EAAE,GAAG;EAAEC,KAAK,EAAE,MAAM;EAAEC,MAAM,EAAE;AAAM,CAAC;AAExE,MAAMC,iBAAiB,GAAGA,CAACC,KAAK,EAAEC,OAAO,KAAK;EAC5C,MAAM;IACJC,KAAK;IACLC,KAAK;IACLC,IAAI;IACJC,OAAO;IACPC,QAAQ,GAAAC,KAAO;IACf,WAAW,EAAEC,QAAQ;IACrB,YAAY,EAAEC,SAAS;IACvBC,IAAI,GAAG;MAACC,QAAQ,EAAE,OAAO;MAAEC,SAAS,EAAE,OAAO;MAAEC,MAAM,EAAE;IAAG,CAAC;IAC3DC,WAAW,GAAG,CAAC;EACjB,CAAC,GAAGd,KAAK;EACT,MAAM;IAACe;EAAI,CAAC,GAAGd,OAAO;EACtB,MAAMe,YAAY,GAAGC,MAAA,CAAMzB,MAAM,CAAC0B,eAAe,EAAE,gBAAgB,EAAEH,IAAI,CAAC;EAC1E,MAAM;IAACJ,QAAQ;IAAEC,SAAS;IAAEC;EAAM,CAAC,GAAGH,IAAI;EAC1C,MAAMS,UAAU,GAAG9B,OAAO,CAAC,MAAM+B,SAAA,CAAS,iBAAiB,CAAC,EAAE,EAAE,CAAC;EACjE,MAAMC,YAAY,GAAGhC,OAAO,CAAC,MAAMiC,CAAC,IAAIhB,QAAQ,CAACgB,CAAC,CAACC,MAAM,CAAClB,OAAO,CAAC,EAAE,CAACC,QAAQ,CAAC,CAAC;EAE/E,oBACElB,KAAA,CAAAoC,aAAA;IAAKC,SAAS,EAAE/B,KAAK,CAACgC,SAAU;IAAChC,KAAK,EAAE;MAAC,GAAGoB;IAAW;EAAE,GACtDR,QAAQ,KAAAC,KAAS,gBAChBnB,KAAA,CAAAoC,aAAA;IAAOG,OAAO,EAAER;EAAW,gBACzB/B,KAAA,CAAAoC,aAAA;IACEI,IAAI,EAAC,UAAU;IACf,cAAY1B,KAAM;IAClB2B,EAAE,EAAEV,UAAW;IACff,IAAI,EAAEA,IAAK;IACXE,QAAQ,EAAEe,YAAa;IACvBhB,OAAO,EAAEA,OAAQ;IACjBoB,SAAS,EAAE/B,KAAK,CAACoC,QAAS;IAC1B,aAAWtB,QAAS;IACpB,cAAYC;EAAU,CACvB,CAAC,eACFrB,KAAA,CAAAoC,aAAA;IACEC,SAAS,EAAE/B,KAAK,CAACqC,KAAM;IACvBrC,KAAK,EAAEW,OAAO,GAAG;MAAC2B,UAAU,EAAEhB,YAAY;MAAEiB,WAAW,EAAEjB;IAAY,CAAC,GAAG;EAAK,GAE7EX,OAAO,gBACNjB,KAAA,CAAAoC,aAAA,CAACjC,MAAM;IACLkC,SAAS,EAAE/B,KAAK,CAACgB,IAAK;IACtBC,QAAQ,EAAEA,QAAS;IACnBC,SAAS,EAAEA,SAAU;IACrBC,MAAM,EAAEA,MAAO;IACfC,WAAW,EAAEnB;EAAmB,CACjC,CAAC,gBAEFP,KAAA,CAAAoC,aAAA,CAACjC,MAAM;IACLkC,SAAS,EAAE/B,KAAK,CAACgB,IAAK;IACtBC,QAAQ,EAAE,QAAS;IACnBC,SAAS,EAAE,aAAc;IACzBC,MAAM,EAAC,GAAG;IACVC,WAAW,EAAEnB;EAAmB,CACjC,CAEA,CACA,CAAC,GACN,IAAI,EACPQ,KAAK,gBACJf,KAAA,CAAAoC,aAAA;IACE;IACAU,uBAAuB,EAAE;MAACC,MAAM,EAAEhC;IAAK;EAAE,CAC1C,CAAC,GACA,IACD,CAAC;AAEV,CAAC;AAEDJ,iBAAiB,CAACqC,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAG;EAC5BrC,KAAK,EAAEZ,SAAS,CAACkD,MAAM;EACvBrC,KAAK,EAAEb,SAAS,CAACkD,MAAM;EACvBpC,IAAI,EAAEd,SAAS,CAACkD,MAAM;EACtBnC,OAAO,EAAEf,SAAS,CAACmD,IAAI;EACvBnC,QAAQ,EAAEhB,SAAS,CAACoD,IAAI;EACxB,YAAY,EAAEpD,SAAS,CAACkD,MAAM;EAC9B,WAAW,EAAElD,SAAS,CAACkD,MAAM;EAC7B9B,IAAI,EAAEpB,SAAS,CAACqD,KAAK,CAAC;IACpBhC,QAAQ,EAAErB,SAAS,CAACkD,MAAM;IAC1B5B,SAAS,EAAEtB,SAAS,CAACkD,MAAM;IAC3B3B,MAAM,EAAEvB,SAAS,CAACkD;EACpB,CAAC,CAAC;EACF1B,WAAW,EAAExB,SAAS,CAACsD,QAAQ,CAACtD,SAAS,CAACuD,SAAS,CAAC,CAACvD,SAAS,CAACkD,MAAM,EAAElD,SAAS,CAACwD,MAAM,CAAC,CAAC;AAC3F,CAAC;AAED/C,iBAAiB,CAACgD,YAAY,GAAG;EAC/BhC,IAAI,EAAEtB,QAAQ,CAACuD,iBAAiB,CAACjC;AACnC,CAAC;AACD,eAAehB,iBAAiB","ignoreList":[]}

package/es/atom/chip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/chip/index.js"],"names":[],"mappings":"AAmBO,qGAG0E;;AAGjF,6DAuEC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/chip/index.js"],"names":[],"mappings":"AAmBO,qGAG0E;;AAGjF,6DA0EC"}

package/es/atom/chip/index.js

@@ -1,7 +1,7 @@
 import React, { useMemo, useState, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
-import get from 'lodash/fp/get';
+import getOr from 'lodash/fp/getOr';
 import { convert } from 'css-color-function';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { fas } from '@fortawesome/pro-solid-svg-icons';
@@ -27,14 +27,14 @@ const Chip = (props, context) => {
     customIcon,
     onClick,
     leftIcon,
-    backgroundColor = DEFAULT_BACKGROUND_COLOR,
+    backgroundColor,
     customStyle
   } = props;
   const {
     skin
   } = context;
-  const skinColor = get('common.primary', skin);
-  const selectedBgColor = backgroundColor === 'skin' && skinColor ? skinColor : backgroundColor;
+  const skinColor = getOr(DEFAULT_BACKGROUND_COLOR, 'common.primary', skin);
+  const selectedBgColor = backgroundColor === 'skin' && skinColor ? skinColor : backgroundColor || DEFAULT_BACKGROUND_COLOR;
   const hoveredSelectedBgColor = calculateHoveredSelectedBgColor(selectedBgColor);
   const [isHovered, setIsHovered] = useState(false);
   const handleClick = useMemo(() => onClick, [onClick]);

package/es/atom/chip/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useMemo","useState","useCallback","PropTypes","classnames","get","convert","FontAwesomeIcon","fas","library","Provider","COLORS","style","add","LUMINOSITY_DELTA","cm_primary_blue","DEFAULT_BACKGROUND_COLOR","ICON_SIZE","calculateHoveredSelectedBgColor","selectedBgColor","luminosityDelta","Chip","props","context","text","subText","textColor","cm_grey_700","selected","customIcon","onClick","leftIcon","backgroundColor","customStyle","skin","skinColor","hoveredSelectedBgColor","isHovered","setIsHovered","handleClick","handleMouseEnter","handleMouseLeave","hoverStyle","defaultIcon","showIcon","color","white","createElement","className","container","unselected","onMouseEnter","onMouseLeave","left","icon","fontSize","title","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","string","bool","func","objectOf","oneOfType","number"],"sources":["../../../src/atom/chip/index.js"],"sourcesContent":["import React, {useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\n\nimport get from 'lodash/fp/get';\nimport {convert} from 'css-color-function';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {library} from '@fortawesome/fontawesome-svg-core';\nimport Provider from '../provider';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\n\nlibrary.add(fas);\n\nconst LUMINOSITY_DELTA = 0.08;\nconst {cm_primary_blue: DEFAULT_BACKGROUND_COLOR} = COLORS;\nconst ICON_SIZE = '12px';\n\nexport const calculateHoveredSelectedBgColor = (\n  selectedBgColor,\n  luminosityDelta = LUMINOSITY_DELTA\n) => convert(`hsl(from ${selectedBgColor} h s calc(l*(1 - ${luminosityDelta})))`);\n// note: luminosity decrease is relative to the selected color\n\nconst Chip = (props, context) => {\n  const {\n    text,\n    subText,\n    textColor = COLORS.cm_grey_700,\n    selected = false,\n    customIcon,\n    onClick,\n    leftIcon,\n    backgroundColor = DEFAULT_BACKGROUND_COLOR,\n    customStyle\n  } = props;\n  const {skin} = context;\n  const skinColor = get('common.primary', skin);\n  const selectedBgColor = backgroundColor === 'skin' && skinColor ? skinColor : backgroundColor;\n  const hoveredSelectedBgColor = calculateHoveredSelectedBgColor(selectedBgColor);\n\n  const [isHovered, setIsHovered] = useState(false);\n\n  const handleClick = useMemo(() => onClick, [onClick]);\n\n  const handleMouseEnter = useCallback(() => {\n    setIsHovered(true);\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    setIsHovered(false);\n  }, []);\n\n  const hoverStyle = isHovered ? {backgroundColor: hoveredSelectedBgColor} : {};\n\n  const defaultIcon = selected ? 'fa-check' : 'fa-plus';\n  const showIcon = customIcon !== 'none';\n  const color = selected ? COLORS.white : textColor;\n\n  return (\n    <div\n      className={classnames(style.container, !selected && style.unselected)}\n      style={{\n        ...(selected && selectedBgColor ? {backgroundColor: selectedBgColor} : {}),\n        ...(selected && hoverStyle),\n        ...customStyle\n      }}\n      onClick={handleClick}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      aria-label={text}\n      data-name={`chip-${text}`}\n    >\n      <div className={style.left}>\n        {leftIcon ? <FontAwesomeIcon style={{color}} icon={leftIcon} fontSize={ICON_SIZE} /> : null}\n        <div title={text}>\n          <span className={style.text} style={{color}}>\n            {text}\n          </span>\n          {subText ? (\n            <span className={style.subText} style={{color}}>\n              {subText}\n            </span>\n          ) : null}\n        </div>\n      </div>\n      {showIcon ? (\n        <FontAwesomeIcon\n          style={{color}}\n          icon={customIcon ? `fa-${customIcon}` : defaultIcon}\n          fontSize={ICON_SIZE}\n        />\n      ) : null}\n    </div>\n  );\n};\n\nChip.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nChip.propTypes = {\n  text: PropTypes.string,\n  subText: PropTypes.string,\n  textColor: PropTypes.string,\n  selected: PropTypes.bool,\n  customIcon: PropTypes.string,\n  backgroundColor: PropTypes.string,\n  onClick: PropTypes.func,\n  leftIcon: PropTypes.string,\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default Chip;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useMemo","useState","useCallback","PropTypes","classnames","getOr","convert","FontAwesomeIcon","fas","library","Provider","COLORS","style","add","LUMINOSITY_DELTA","cm_primary_blue","DEFAULT_BACKGROUND_COLOR","ICON_SIZE","calculateHoveredSelectedBgColor","selectedBgColor","luminosityDelta","Chip","props","context","text","subText","textColor","cm_grey_700","selected","customIcon","onClick","leftIcon","backgroundColor","customStyle","skin","skinColor","hoveredSelectedBgColor","isHovered","setIsHovered","handleClick","handleMouseEnter","handleMouseLeave","hoverStyle","defaultIcon","showIcon","color","white","createElement","className","container","unselected","onMouseEnter","onMouseLeave","left","icon","fontSize","title","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","string","bool","func","objectOf","oneOfType","number"],"sources":["../../../src/atom/chip/index.js"],"sourcesContent":["import React, {useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\n\nimport getOr from 'lodash/fp/getOr';\nimport {convert} from 'css-color-function';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {library} from '@fortawesome/fontawesome-svg-core';\nimport Provider from '../provider';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\n\nlibrary.add(fas);\n\nconst LUMINOSITY_DELTA = 0.08;\nconst {cm_primary_blue: DEFAULT_BACKGROUND_COLOR} = COLORS;\nconst ICON_SIZE = '12px';\n\nexport const calculateHoveredSelectedBgColor = (\n  selectedBgColor,\n  luminosityDelta = LUMINOSITY_DELTA\n) => convert(`hsl(from ${selectedBgColor} h s calc(l*(1 - ${luminosityDelta})))`);\n// note: luminosity decrease is relative to the selected color\n\nconst Chip = (props, context) => {\n  const {\n    text,\n    subText,\n    textColor = COLORS.cm_grey_700,\n    selected = false,\n    customIcon,\n    onClick,\n    leftIcon,\n    backgroundColor,\n    customStyle\n  } = props;\n  const {skin} = context;\n  const skinColor = getOr(DEFAULT_BACKGROUND_COLOR, 'common.primary', skin);\n  const selectedBgColor =\n    backgroundColor === 'skin' && skinColor\n      ? skinColor\n      : backgroundColor || DEFAULT_BACKGROUND_COLOR;\n  const hoveredSelectedBgColor = calculateHoveredSelectedBgColor(selectedBgColor);\n\n  const [isHovered, setIsHovered] = useState(false);\n\n  const handleClick = useMemo(() => onClick, [onClick]);\n\n  const handleMouseEnter = useCallback(() => {\n    setIsHovered(true);\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    setIsHovered(false);\n  }, []);\n\n  const hoverStyle = isHovered ? {backgroundColor: hoveredSelectedBgColor} : {};\n\n  const defaultIcon = selected ? 'fa-check' : 'fa-plus';\n  const showIcon = customIcon !== 'none';\n  const color = selected ? COLORS.white : textColor;\n\n  return (\n    <div\n      className={classnames(style.container, !selected && style.unselected)}\n      style={{\n        ...(selected && selectedBgColor ? {backgroundColor: selectedBgColor} : {}),\n        ...(selected && hoverStyle),\n        ...customStyle\n      }}\n      onClick={handleClick}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      aria-label={text}\n      data-name={`chip-${text}`}\n    >\n      <div className={style.left}>\n        {leftIcon ? <FontAwesomeIcon style={{color}} icon={leftIcon} fontSize={ICON_SIZE} /> : null}\n        <div title={text}>\n          <span className={style.text} style={{color}}>\n            {text}\n          </span>\n          {subText ? (\n            <span className={style.subText} style={{color}}>\n              {subText}\n            </span>\n          ) : null}\n        </div>\n      </div>\n      {showIcon ? (\n        <FontAwesomeIcon\n          style={{color}}\n          icon={customIcon ? `fa-${customIcon}` : defaultIcon}\n          fontSize={ICON_SIZE}\n        />\n      ) : null}\n    </div>\n  );\n};\n\nChip.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nChip.propTypes = {\n  text: PropTypes.string,\n  subText: PropTypes.string,\n  textColor: PropTypes.string,\n  selected: PropTypes.bool,\n  customIcon: PropTypes.string,\n  backgroundColor: PropTypes.string,\n  onClick: PropTypes.func,\n  leftIcon: PropTypes.string,\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default Chip;\n"],"mappings":"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","ignoreList":[]}

package/es/atom/content-badge/style.css

@@ -5,7 +5,7 @@
 @value cm_orange_200 from colors;
 @value lightBlack from colors;
 @value cm_yellow_scorm from colors;
-@value cm_bleu_article from colors;
+@value cm_blue_article from colors;
 @value cm_red_200 from colors;
 @value cm_red_video from colors;
 @value cm_violet_podcast from colors;
@@ -57,7 +57,7 @@
 
 .article {
   composes: level;
-  background-color: cm_bleu_article;
+  background-color: cm_blue_article;
 }
 
 .video {

package/es/atom/input-html/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/index.js"],"names":[],"mappings":";AAWA,wEA4DC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-html/index.js"],"names":[],"mappings":";AAYA,wEA4DC"}

package/es/atom/input-html/index.js

@@ -4,6 +4,7 @@ import React, { useCallback, useState } from 'react';
 import PropTypes from 'prop-types';
 import { NovaLineBusinessCircleView as PreviewIcon, NovaLineContentEditionPencil2 as PencilIcon } from '@coorpacademy/nova-icons';
 import Provider, { GetSkinFromContext } from '../provider';
+import { COLORS } from '../../variables/colors';
 import InputPreview from './input-preview';
 import style from './style.css';
 const InputHtml = (props, legacyContext) => {
@@ -23,7 +24,7 @@ const InputHtml = (props, legacyContext) => {
     setPreview(!preview);
   }, [preview, setPreview]);
   const skin = GetSkinFromContext(legacyContext);
-  const mediumColor = _getOr('#999999', 'common.medium', skin);
+  const mediumColor = _getOr(COLORS.cm_grey_400, 'common.medium', skin);
   const {
     title,
     placeholder,

package/es/atom/input-html/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","NovaLineBusinessCircleView","PreviewIcon","NovaLineContentEditionPencil2","PencilIcon","Provider","GetSkinFromContext","InputPreview","style","InputHtml","props","legacyContext","value","onChange","_noop","text","setText","preview","setPreview","handleChange","e","_value","target","handlePreview","preventDefault","skin","mediumColor","_getOr","title","placeholder","error","description","disabled","className","defaultStyle","iconContent","createElement","color","height","contentWrapper","input","toggle","onClick","propTypes","process","env","NODE_ENV","string","bool","func","contextTypes","childContextTypes"],"sources":["../../../src/atom/input-html/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr} from 'lodash/fp';\nimport {\n  NovaLineBusinessCircleView as PreviewIcon,\n  NovaLineContentEditionPencil2 as PencilIcon\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../provider';\nimport InputPreview from './input-preview';\nimport style from './style.css';\n\nconst InputHtml = (props, legacyContext) => {\n  const {value = '', onChange = noop} = props;\n  const [text, setText] = useState(value);\n  const [preview, setPreview] = useState(true);\n\n  const handleChange = useCallback(\n    e => {\n      const _value = e.target.value;\n      setText(_value);\n      onChange(_value);\n    },\n    [onChange]\n  );\n\n  const handlePreview = useCallback(\n    e => {\n      e.preventDefault();\n      setPreview(!preview);\n    },\n    [preview, setPreview]\n  );\n\n  const skin = GetSkinFromContext(legacyContext);\n  const mediumColor = getOr('#999999', 'common.medium', skin);\n\n  const {title, placeholder, error, description, disabled} = props;\n\n  const className = error ? style.error : style.defaultStyle;\n  const iconContent = !preview ? (\n    <PreviewIcon style={{color: mediumColor}} height={16} />\n  ) : (\n    <PencilIcon style={{color: mediumColor}} height={16} />\n  );\n\n  return (\n    <div className={className}>\n      <label>\n        <span className={style.title}>{`${title} `}</span>\n        <div className={style.contentWrapper}>\n          <InputPreview\n            title={title}\n            text={text}\n            placeholder={placeholder}\n            onChange={handleChange}\n            disabled={disabled}\n            preview={preview}\n            className={style.input}\n          />\n        </div>\n        <span\n          data-testid={preview ? 'pencil-icon' : 'preview-icon'}\n          className={style.toggle}\n          onClick={handlePreview}\n        >\n          {iconContent}\n        </span>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nInputHtml.propTypes = {\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  disabled: PropTypes.bool,\n  value: PropTypes.string,\n  error: PropTypes.string,\n  onChange: PropTypes.func,\n  description: PropTypes.string\n};\n\nInputHtml.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default InputHtml;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useCallback","useState","PropTypes","NovaLineBusinessCircleView","PreviewIcon","NovaLineContentEditionPencil2","PencilIcon","Provider","GetSkinFromContext","COLORS","InputPreview","style","InputHtml","props","legacyContext","value","onChange","_noop","text","setText","preview","setPreview","handleChange","e","_value","target","handlePreview","preventDefault","skin","mediumColor","_getOr","cm_grey_400","title","placeholder","error","description","disabled","className","defaultStyle","iconContent","createElement","color","height","contentWrapper","input","toggle","onClick","propTypes","process","env","NODE_ENV","string","bool","func","contextTypes","childContextTypes"],"sources":["../../../src/atom/input-html/index.js"],"sourcesContent":["import React, {useCallback, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, getOr} from 'lodash/fp';\nimport {\n  NovaLineBusinessCircleView as PreviewIcon,\n  NovaLineContentEditionPencil2 as PencilIcon\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../provider';\nimport {COLORS} from '../../variables/colors';\nimport InputPreview from './input-preview';\nimport style from './style.css';\n\nconst InputHtml = (props, legacyContext) => {\n  const {value = '', onChange = noop} = props;\n  const [text, setText] = useState(value);\n  const [preview, setPreview] = useState(true);\n\n  const handleChange = useCallback(\n    e => {\n      const _value = e.target.value;\n      setText(_value);\n      onChange(_value);\n    },\n    [onChange]\n  );\n\n  const handlePreview = useCallback(\n    e => {\n      e.preventDefault();\n      setPreview(!preview);\n    },\n    [preview, setPreview]\n  );\n\n  const skin = GetSkinFromContext(legacyContext);\n  const mediumColor = getOr(COLORS.cm_grey_400, 'common.medium', skin);\n\n  const {title, placeholder, error, description, disabled} = props;\n\n  const className = error ? style.error : style.defaultStyle;\n  const iconContent = !preview ? (\n    <PreviewIcon style={{color: mediumColor}} height={16} />\n  ) : (\n    <PencilIcon style={{color: mediumColor}} height={16} />\n  );\n\n  return (\n    <div className={className}>\n      <label>\n        <span className={style.title}>{`${title} `}</span>\n        <div className={style.contentWrapper}>\n          <InputPreview\n            title={title}\n            text={text}\n            placeholder={placeholder}\n            onChange={handleChange}\n            disabled={disabled}\n            preview={preview}\n            className={style.input}\n          />\n        </div>\n        <span\n          data-testid={preview ? 'pencil-icon' : 'preview-icon'}\n          className={style.toggle}\n          onClick={handlePreview}\n        >\n          {iconContent}\n        </span>\n      </label>\n      <div className={style.description}>{description}</div>\n    </div>\n  );\n};\n\nInputHtml.propTypes = {\n  title: PropTypes.string,\n  placeholder: PropTypes.string,\n  disabled: PropTypes.bool,\n  value: PropTypes.string,\n  error: PropTypes.string,\n  onChange: PropTypes.func,\n  description: PropTypes.string\n};\n\nInputHtml.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default InputHtml;\n"],"mappings":"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","ignoreList":[]}

package/es/atom/input-switch/index.d.ts

@@ -1,5 +1,5 @@
 export default InputSwitch;
-declare function InputSwitch(props: any): JSX.Element;
+declare function InputSwitch(props: any, context: any): JSX.Element;
 declare namespace InputSwitch {
     const propTypes: {
         title: PropTypes.Requireable<string>;
@@ -19,6 +19,29 @@ declare namespace InputSwitch {
         requiredSelection: PropTypes.Requireable<boolean>;
         icon: PropTypes.Requireable<string>;
     };
+    namespace contextTypes {
+        const skin: PropTypes.Requireable<PropTypes.InferProps<{
+            common: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            images: PropTypes.Requireable<PropTypes.InferProps<{
+                'logo-mobile': PropTypes.Requireable<any>;
+                logo: PropTypes.Requireable<any>;
+                'logo-email': PropTypes.Requireable<any>;
+                login: PropTypes.Requireable<any>;
+            }>>;
+            icons: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            mod: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            courses: PropTypes.Requireable<any[]>;
+            texts: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+        }>>;
+    }
 }
 import PropTypes from "prop-types";
 //# sourceMappingURL=index.d.ts.map

package/es/atom/input-switch/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-switch/index.js"],"names":[],"mappings":";AAQA,sDAmGC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/input-switch/index.js"],"names":[],"mappings":";AAUA,oEAwGC"}

package/es/atom/input-switch/index.js

@@ -1,13 +1,16 @@
 import _uniqueId from "lodash/fp/uniqueId";
 import _noop from "lodash/fp/noop";
+import _getOr from "lodash/fp/getOr";
 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, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import classNames from 'classnames';
 import getClassState from '../../util/get-class-state';
+import { COLORS } from '../../variables/colors';
+import Provider from '../provider';
 import style from './style.css';
-const InputSwitch = props => {
+const InputSwitch = (props, context) => {
   const {
     title,
     name,
@@ -26,6 +29,10 @@ const InputSwitch = props => {
     'aria-label': ariaLabel,
     icon
   } = props;
+  const {
+    skin
+  } = context;
+  const primaryColor = _getOr(COLORS.cm_primary_blue, 'common.primary', skin);
   const idSwitch = id || _uniqueId('input-switch-');
   const isDisabled = disabled ? 'disabled' : '';
   const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);
@@ -97,12 +104,16 @@ const InputSwitch = props => {
     "data-name": "input-switch-label",
     tabIndex: 0,
     "aria-label": ariaLabel,
-    title: ariaLabel
-  }))), /*#__PURE__*/React.createElement("div", {
+    title: ariaLabel,
+    style: value ? {
+      background: primaryColor,
+      borderColor: primaryColor
+    } : null
+  }))), details || titlePosition === 'right' ? /*#__PURE__*/React.createElement("div", {
     className: !details ? style.alignedTextContainer : null
   }, titlePosition === 'right' ? titleView : null, details ? /*#__PURE__*/React.createElement("div", {
     className: style.detailsTxt
-  }, details) : null), descriptionView);
+  }, details) : null) : null, descriptionView);
 };
 InputSwitch.propTypes = process.env.NODE_ENV !== "production" ? {
   title: PropTypes.string,
@@ -122,5 +133,8 @@ InputSwitch.propTypes = process.env.NODE_ENV !== "production" ? {
   requiredSelection: PropTypes.bool,
   icon: PropTypes.string
 } : {};
+InputSwitch.contextTypes = {
+  skin: Provider.childContextTypes.skin
+};
 export default InputSwitch;
 //# sourceMappingURL=index.js.map

package/es/atom/input-switch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","FontAwesomeIcon","classNames","getClassState","style","InputSwitch","props","title","name","id","value","disabled","onChange","_noop","description","modified","theme","titlePosition","details","requiredSelection","dataName","ariaLabelledBy","ariaLabel","icon","idSwitch","_uniqueId","isDisabled","handleChange","e","target","checked","titleView","createElement","className","titleContainer","newMoocTitleContainer","descriptionView","getClass","defaultClass","coorpmanager","modifiedClass","coorpmanagerModified","newMooc","newMoocModified","partielUncheck","defaultStyle","btnSwitchContainer","_extends","type","checkbox","htmlFor","tabIndex","alignedTextContainer","detailsTxt","propTypes","process","env","NODE_ENV","string","bool","func","oneOf"],"sources":["../../../src/atom/input-switch/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {noop, uniqueId} from 'lodash/fp';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport classNames from 'classnames';\nimport getClassState from '../../util/get-class-state';\nimport style from './style.css';\n\nconst InputSwitch = props => {\n  const {\n    title,\n    name,\n    id,\n    value,\n    disabled,\n    onChange = noop,\n    description,\n    modified = false,\n    theme = 'default',\n    titlePosition = 'left',\n    details = '',\n    requiredSelection = false,\n    'data-name': dataName,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-label': ariaLabel,\n    icon\n  } = props;\n\n  const idSwitch = id || uniqueId('input-switch-');\n  const isDisabled = disabled ? 'disabled' : '';\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n  const titleView = title ? (\n    <div\n      className={classNames(\n        icon ? style.titleContainer : null,\n        theme === 'newMooc' ? style.newMoocTitleContainer : null\n      )}\n    >\n      {icon ? <FontAwesomeIcon icon={icon} className={style.icon} /> : null}\n      <span id={`title-view-${dataName}`} className={style.title}>\n        {title}\n      </span>\n    </div>\n  ) : null;\n\n  const descriptionView = description ? (\n    <div className={style.description}>{description}</div>\n  ) : null;\n\n  const getClass = () => {\n    switch (theme) {\n      case 'coorpmanager':\n        return {\n          defaultClass: style.coorpmanager,\n          modifiedClass: style.coorpmanagerModified\n        };\n      case 'newMooc':\n        return {\n          defaultClass: style.newMooc,\n          modifiedClass: style.newMoocModified\n        };\n      case 'mooc':\n        return {\n          defaultClass: style.partielUncheck,\n          modifiedClass: style.coorpmanagerModified\n        };\n      default:\n        return {defaultClass: style.defaultStyle, modifiedClass: style.modified};\n    }\n  };\n  const {defaultClass, modifiedClass} = getClass();\n  const className = getClassState(defaultClass, modifiedClass, null, modified);\n\n  return (\n    <div className={className} data-name={`switch-input-${theme}${dataName}`}>\n      {titlePosition === 'left' ? titleView : null}\n      <div className={requiredSelection ? style.requiredSelection : null}>\n        <div className={style.btnSwitchContainer}>\n          <input\n            {...(ariaLabelledBy ? {'aria-labelledby': ariaLabelledBy} : {})}\n            {...(title ? {'aria-labelledby': `title-view-${dataName}`} : {})}\n            {...(ariaLabel && !ariaLabelledBy && !title ? {'aria-label': ariaLabel} : {})}\n            type=\"checkbox\"\n            id={idSwitch}\n            name={name}\n            onChange={handleChange}\n            checked={value}\n            disabled={isDisabled}\n            className={style.checkbox}\n            aria-labelledby={ariaLabelledBy}\n          />\n          <label\n            htmlFor={idSwitch}\n            data-name=\"input-switch-label\"\n            tabIndex={0}\n            aria-label={ariaLabel}\n            title={ariaLabel}\n          />\n        </div>\n      </div>\n      <div className={!details ? style.alignedTextContainer : null}>\n        {titlePosition === 'right' ? titleView : null}\n        {details ? <div className={style.detailsTxt}>{details}</div> : null}\n      </div>\n      {descriptionView}\n    </div>\n  );\n};\n\nInputSwitch.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  id: PropTypes.string,\n  value: PropTypes.bool,\n  disabled: PropTypes.bool,\n  onChange: PropTypes.func,\n  description: PropTypes.string,\n  'aria-labelledby': PropTypes.string,\n  'aria-label': PropTypes.string,\n  modified: PropTypes.bool,\n  titlePosition: PropTypes.oneOf(['right', 'left']),\n  theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc', 'newMooc']),\n  details: PropTypes.string,\n  'data-name': PropTypes.string,\n  requiredSelection: PropTypes.bool,\n  icon: PropTypes.string\n};\nexport default InputSwitch;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useMemo","PropTypes","FontAwesomeIcon","classNames","getClassState","COLORS","Provider","style","InputSwitch","props","context","title","name","id","value","disabled","onChange","_noop","description","modified","theme","titlePosition","details","requiredSelection","dataName","ariaLabelledBy","ariaLabel","icon","skin","primaryColor","_getOr","cm_primary_blue","idSwitch","_uniqueId","isDisabled","handleChange","e","target","checked","titleView","createElement","className","titleContainer","newMoocTitleContainer","descriptionView","getClass","defaultClass","coorpmanager","modifiedClass","coorpmanagerModified","newMooc","newMoocModified","partielUncheck","defaultStyle","btnSwitchContainer","_extends","type","checkbox","htmlFor","tabIndex","background","borderColor","alignedTextContainer","detailsTxt","propTypes","process","env","NODE_ENV","string","bool","func","oneOf","contextTypes","childContextTypes"],"sources":["../../../src/atom/input-switch/index.js"],"sourcesContent":["import React, {useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport {getOr, noop, uniqueId} from 'lodash/fp';\nimport {FontAwesomeIcon} from '@fortawesome/react-fontawesome';\nimport classNames from 'classnames';\nimport getClassState from '../../util/get-class-state';\nimport {COLORS} from '../../variables/colors';\nimport Provider from '../provider';\nimport style from './style.css';\n\nconst InputSwitch = (props, context) => {\n  const {\n    title,\n    name,\n    id,\n    value,\n    disabled,\n    onChange = noop,\n    description,\n    modified = false,\n    theme = 'default',\n    titlePosition = 'left',\n    details = '',\n    requiredSelection = false,\n    'data-name': dataName,\n    'aria-labelledby': ariaLabelledBy,\n    'aria-label': ariaLabel,\n    icon\n  } = props;\n  const {skin} = context;\n  const primaryColor = getOr(COLORS.cm_primary_blue, 'common.primary', skin);\n  const idSwitch = id || uniqueId('input-switch-');\n  const isDisabled = disabled ? 'disabled' : '';\n  const handleChange = useMemo(() => e => onChange(e.target.checked), [onChange]);\n  const titleView = title ? (\n    <div\n      className={classNames(\n        icon ? style.titleContainer : null,\n        theme === 'newMooc' ? style.newMoocTitleContainer : null\n      )}\n    >\n      {icon ? <FontAwesomeIcon icon={icon} className={style.icon} /> : null}\n      <span id={`title-view-${dataName}`} className={style.title}>\n        {title}\n      </span>\n    </div>\n  ) : null;\n\n  const descriptionView = description ? (\n    <div className={style.description}>{description}</div>\n  ) : null;\n\n  const getClass = () => {\n    switch (theme) {\n      case 'coorpmanager':\n        return {\n          defaultClass: style.coorpmanager,\n          modifiedClass: style.coorpmanagerModified\n        };\n      case 'newMooc':\n        return {\n          defaultClass: style.newMooc,\n          modifiedClass: style.newMoocModified\n        };\n      case 'mooc':\n        return {\n          defaultClass: style.partielUncheck,\n          modifiedClass: style.coorpmanagerModified\n        };\n      default:\n        return {defaultClass: style.defaultStyle, modifiedClass: style.modified};\n    }\n  };\n  const {defaultClass, modifiedClass} = getClass();\n  const className = getClassState(defaultClass, modifiedClass, null, modified);\n\n  return (\n    <div className={className} data-name={`switch-input-${theme}${dataName}`}>\n      {titlePosition === 'left' ? titleView : null}\n      <div className={requiredSelection ? style.requiredSelection : null}>\n        <div className={style.btnSwitchContainer}>\n          <input\n            {...(ariaLabelledBy ? {'aria-labelledby': ariaLabelledBy} : {})}\n            {...(title ? {'aria-labelledby': `title-view-${dataName}`} : {})}\n            {...(ariaLabel && !ariaLabelledBy && !title ? {'aria-label': ariaLabel} : {})}\n            type=\"checkbox\"\n            id={idSwitch}\n            name={name}\n            onChange={handleChange}\n            checked={value}\n            disabled={isDisabled}\n            className={style.checkbox}\n            aria-labelledby={ariaLabelledBy}\n          />\n          <label\n            htmlFor={idSwitch}\n            data-name=\"input-switch-label\"\n            tabIndex={0}\n            aria-label={ariaLabel}\n            title={ariaLabel}\n            style={value ? {background: primaryColor, borderColor: primaryColor} : null}\n          />\n        </div>\n      </div>\n      {details || titlePosition === 'right' ? (\n        <div className={!details ? style.alignedTextContainer : null}>\n          {titlePosition === 'right' ? titleView : null}\n          {details ? <div className={style.detailsTxt}>{details}</div> : null}\n        </div>\n      ) : null}\n\n      {descriptionView}\n    </div>\n  );\n};\n\nInputSwitch.propTypes = {\n  title: PropTypes.string,\n  name: PropTypes.string,\n  id: PropTypes.string,\n  value: PropTypes.bool,\n  disabled: PropTypes.bool,\n  onChange: PropTypes.func,\n  description: PropTypes.string,\n  'aria-labelledby': PropTypes.string,\n  'aria-label': PropTypes.string,\n  modified: PropTypes.bool,\n  titlePosition: PropTypes.oneOf(['right', 'left']),\n  theme: PropTypes.oneOf(['default', 'coorpmanager', 'mooc', 'newMooc']),\n  details: PropTypes.string,\n  'data-name': PropTypes.string,\n  requiredSelection: PropTypes.bool,\n  icon: PropTypes.string\n};\n\nInputSwitch.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default InputSwitch;\n"],"mappings":"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","ignoreList":[]}

package/es/atom/input-switch/style.css

@@ -215,6 +215,7 @@
 .newMooc {
   composes: defaultStyle;
   width: 100%;
+  gap: 16px;
 }
 
 .newMoocModified {
@@ -241,6 +242,8 @@
   font-weight: 600;
   line-height: 20px;
   color: cm_grey_700;
+  width: auto;
+  margin: 0px;
 }
 
 .newMooc .checkbox:checked ~ label {

package/es/atom/range/index.d.ts

@@ -4,6 +4,14 @@ declare class Range extends React.Component<any, any, any> {
         onChange: PropTypes.Requireable<(...args: any[]) => any>;
         onChangeEnd: PropTypes.Requireable<(...args: any[]) => any>;
         multi: PropTypes.Requireable<boolean>;
+        theme: PropTypes.Requireable<string>;
+        min: PropTypes.Requireable<number>;
+        max: PropTypes.Requireable<number>;
+        step: PropTypes.Requireable<number>;
+        minLabel: PropTypes.Requireable<string>;
+        maxLabel: PropTypes.Requireable<string>;
+        minValueLabel: PropTypes.Requireable<string>;
+        maxValueLabel: PropTypes.Requireable<string>;
         HammerForTestingMin: PropTypes.Requireable<PropTypes.InferProps<{
             on: PropTypes.Requireable<(...args: any[]) => any>;
             destroy: PropTypes.Requireable<(...args: any[]) => any>;
@@ -14,17 +22,39 @@ declare class Range extends React.Component<any, any, any> {
             destroy: PropTypes.Requireable<(...args: any[]) => any>;
             stop: PropTypes.Requireable<(...args: any[]) => any>;
         }>>;
-        value: PropTypes.Requireable<NonNullable<number | (number | null | undefined)[] | null | undefined>>;
+    };
+    static contextTypes: {
+        skin: PropTypes.Requireable<PropTypes.InferProps<{
+            common: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            images: PropTypes.Requireable<PropTypes.InferProps<{
+                'logo-mobile': PropTypes.Requireable<any>;
+                logo: PropTypes.Requireable<any>;
+                'logo-email': PropTypes.Requireable<any>;
+                login: PropTypes.Requireable<any>;
+            }>>;
+            icons: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            mod: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+            courses: PropTypes.Requireable<any[]>;
+            texts: PropTypes.Requireable<{
+                [x: string]: any;
+            }>;
+        }>>;
     };
     static getDerivedStateFromProps(props: any, state: any): {
         multi: any;
-        value: any;
+        value: number | (number | number[])[];
     } | null;
     constructor(props: any, context: any);
     state: {
         pending: boolean;
         multi: any;
-        value: any;
+        value: number | (number | number[])[];
     };
     handleClick(e: any): void;
     setRefTrack(track: any): void;
@@ -33,6 +63,8 @@ declare class Range extends React.Component<any, any, any> {
     handleMinChangeEnd(e: any): void;
     handleMaxChangeEnd(e: any): void;
     track: any;
+    normalizedToActual(normalizedValue: any): any;
+    roundToStep(value: any): number;
     handleChange(value: any, valueIndex: any, pending: any): void;
     triggerChange(newValues: any, pending: any): any;
     render(): JSX.Element;

package/es/atom/range/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/range/index.js"],"names":[],"mappings":";AA4EA;IACE;;;;;;;;;;;;;;;MAQE;IAEF;;;aAMC;IAED,sCAcC;IAXC;;;;MAGC;IAkEH,0BAmBC;IA3ED,8BAEC;IAED,8BAKC;IAED,8BAKC;IAED,iCAKC;IAED,iCAKC;IA7BC,WAAkB;IA+BpB,8DAcC;IAED,iDAMC;IAuBD,sBAyCC;CACF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/atom/range/index.js"],"names":[],"mappings":";AAyFA;IACE;;;;;;;;;;;;;;;;;;;;;;MAcE;IAEF;;;;;;;;;;;;;;;;;;;;;;MAEE;IAEF;;;aAIC;IAED,sCAYC;IAVC;;;;MAGC;IAwEH,0BAkBC;IAjFD,8BAEC;IAaD,8BAKC;IAED,8BAKC;IAED,iCAKC;IAED,iCAKC;IAxCC,WAAkB;IAGpB,8CAGC;IAED,gCAIC;IA8BD,8DAWC;IAED,iDAKC;IAsBD,sBA2FC;CACF"}