@coorpacademy/components 11.12.3-alpha.4 → 11.12.3-alpha.5

package/lib/molecule/card/favorite.js

@@ -7,6 +7,8 @@ var _noop2 = _interopRequireDefault(require("lodash/fp/noop"));
 
 var _isEmpty2 = _interopRequireDefault(require("lodash/fp/isEmpty"));
 
+var _has2 = _interopRequireDefault(require("lodash/fp/has"));
+
 var _get2 = _interopRequireDefault(require("lodash/fp/get"));
 
 var _react = _interopRequireWildcard(require("react"));
@@ -15,10 +17,14 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+var _uuid = require("uuid");
+
 var _novaIcons = require("@coorpacademy/nova-icons");
 
 var _provider = _interopRequireWildcard(require("../../atom/provider"));
 
+var _tooltip = _interopRequireWildcard(require("../../atom/tooltip"));
+
 var _favorite = _interopRequireDefault(require("./favorite.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); }
@@ -37,6 +43,7 @@ const Favorite = ({
   disabled
 }, legacyContext) => {
   const skin = (0, _provider.GetSkinFromContext)(legacyContext);
+  const translate = (0, _provider.GetTranslateFromContext)(legacyContext);
   const handleFavoriteClick = (0, _react.useCallback)(e => {
     e.stopPropagation();
     e.preventDefault();
@@ -45,26 +52,43 @@ const Favorite = ({
   const primaryColor = (0, _get2.default)('common.primary', skin);
   const darkColor = (0, _get2.default)('common.dark', skin);
   const brandColor = (0, _get2.default)('common.brand', skin);
-  const toolTipView = (0, _react.useMemo)(() => !(0, _isEmpty2.default)(removeFavoriteToolTip) && !(0, _isEmpty2.default)(addFavoriteToolTip) ? /*#__PURE__*/_react.default.createElement("div", {
-    className: _favorite.default.showToolTip
-  }, /*#__PURE__*/_react.default.createElement("span", null, favorite ? removeFavoriteToolTip : addFavoriteToolTip)) : null, [addFavoriteToolTip, favorite, removeFavoriteToolTip]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: _favorite.default.blocFavorite
-  }, toolTipView, /*#__PURE__*/_react.default.createElement("div", {
-    "data-name": "favorite",
-    "aria-label": ariaLabel.favorite,
-    className: (0, _classnames.default)(_favorite.default.favorite, className, favorite && _favorite.default.selected),
-    onClick: handleFavoriteClick,
-    style: {
-      color: primaryColor
-    }
-  }, favorite ? /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyCheck, {
+  const buttonRef = (0, _react.useRef)(null);
+  const allowToolTip = (0, _react.useMemo)(() => !(0, _isEmpty2.default)(removeFavoriteToolTip) && !(0, _isEmpty2.default)(addFavoriteToolTip), [addFavoriteToolTip, removeFavoriteToolTip]); // to be replaced by useId when React17 is bumped to React18
+
+  const [favoriteButtonAnchorId] = (0, _react.useState)(allowToolTip ? (0, _uuid.v5)('engaged-battle-', _uuid.v5.URL) : undefined);
+  const toolTipContent = (0, _react.useMemo)( // eslint-disable-next-line no-nested-ternary
+  () => allowToolTip ? favorite ? removeFavoriteToolTip : addFavoriteToolTip : null, [addFavoriteToolTip, favorite, removeFavoriteToolTip, allowToolTip]);
+  const [mouseLeaveTimer, setMouseLeaveTimer] = (0, _react.useState)(undefined);
+  const [toolTipIsVisible, setToolTipIsVisible] = (0, _react.useState)(false);
+  const handleMouseOver = (0, _react.useCallback)(() => {
+    mouseLeaveTimer && clearTimeout(mouseLeaveTimer);
+    /* istanbul ignore next */
+
+    (0, _has2.default)(['current', 'focus'], buttonRef) && buttonRef.current.focus();
+    setToolTipIsVisible(true);
+  }, [mouseLeaveTimer]);
+  const handleMouseLeave = (0, _react.useCallback)(() => {
+    setMouseLeaveTimer(setTimeout(() => {
+      setToolTipIsVisible(false); // @ts-expect-error (error: blur does not exists on type never)
+
+      /* istanbul ignore next */
+
+      (0, _has2.default)(['current', 'blur'], buttonRef) && buttonRef.current.blur();
+    }, 500));
+  }, []);
+  const handleKeyPress = (0, _react.useCallback)(event => {
+    (0, _tooltip.toggleStateOnKeyPress)(toolTipIsVisible, setToolTipIsVisible, buttonRef)(event);
+  }, [toolTipIsVisible]);
+  const iconWrapperClassName = (0, _react.useMemo)(() => (0, _classnames.default)(_favorite.default.favorite, className, favorite && _favorite.default.selected), [className, favorite]);
+  const icon = (0, _react.useMemo)(() => favorite ? /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyCheck // eslint-disable-next-line css-modules/no-undef-class
+  , {
     className: _favorite.default.checkIcon,
     style: {
       color: brandColor
     },
     width: 13,
     height: 13,
+    "data-testid": "favorite-check-icon",
     "aria-label": ariaLabel.removeFromFavorite
   }) : /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionNavigationMore, {
     className: _favorite.default.moreIcon,
@@ -73,8 +97,38 @@ const Favorite = ({
     },
     width: 13,
     height: 13,
+    "data-testid": "favorite-add-icon",
     "aria-label": ariaLabel.addToFavorite
-  })));
+  }), [ariaLabel.addToFavorite, ariaLabel.removeFromFavorite, brandColor, darkColor, favorite]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _favorite.default.favoriteWrapper,
+    "data-testid": "favorite-wrapper"
+  }, /*#__PURE__*/_react.default.createElement("button", {
+    ref: buttonRef,
+    type: "button",
+    "data-for": favoriteButtonAnchorId,
+    "data-tooltip-place": "left",
+    "data-tip": allowToolTip,
+    "data-name": "favorite",
+    "data-testid": "favorite-button",
+    "aria-label": ariaLabel.favorite,
+    className: iconWrapperClassName,
+    onClick: handleFavoriteClick,
+    style: {
+      color: primaryColor
+    },
+    onKeyDown: handleKeyPress,
+    onMouseLeave: handleMouseLeave,
+    onMouseOver: handleMouseOver,
+    tabIndex: 0
+  }, icon), /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+    fontSize: 12,
+    anchorId: favoriteButtonAnchorId,
+    toolTipIsVisible: toolTipIsVisible,
+    TooltipContent: toolTipContent,
+    closeToolTipInformationTextAriaLabel: translate('Press the escape key to close the information text'),
+    stickyOnKeyboardNavigation: true
+  }));
 };
 
 Favorite.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -91,7 +145,8 @@ Favorite.propTypes = process.env.NODE_ENV !== "production" ? {
   })
 } : {};
 Favorite.contextTypes = {
-  skin: _provider.default.childContextTypes.skin
+  skin: _provider.default.childContextTypes.skin,
+  translate: _provider.default.childContextTypes.translate
 };
 var _default = Favorite;
 exports.default = _default;

package/lib/molecule/card/favorite.js.map

@@ -1 +1 @@
-{"version":3,"file":"favorite.js","names":["Favorite","favorite","addFavoriteToolTip","removeFavoriteToolTip","className","ariaLabel","onFavoriteClick","disabled","legacyContext","skin","GetSkinFromContext","handleFavoriteClick","useCallback","e","stopPropagation","preventDefault","primaryColor","darkColor","brandColor","toolTipView","useMemo","style","showToolTip","blocFavorite","classnames","selected","color","checkIcon","removeFromFavorite","moreIcon","addToFavorite","propTypes","PropTypes","string","bool","func","shape","contextTypes","Provider","childContextTypes"],"sources":["../../../src/molecule/card/favorite.js"],"sourcesContent":["import React, {useCallback, useMemo} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {get, isEmpty, noop} from 'lodash/fp';\nimport {\n  NovaCompositionNavigationMore as MoreIcon,\n  NovaCompositionCoorpacademyCheck as CheckIcon\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext} from '../../atom/provider';\nimport style from './favorite.css';\n\nconst Favorite = (\n  {\n    favorite,\n    addFavoriteToolTip,\n    removeFavoriteToolTip,\n    className,\n    'aria-label': ariaLabel = {},\n    onFavoriteClick = noop,\n    disabled\n  },\n  legacyContext\n) => {\n  const skin = GetSkinFromContext(legacyContext);\n  const handleFavoriteClick = useCallback(\n    e => {\n      e.stopPropagation();\n      e.preventDefault();\n      if (!disabled) onFavoriteClick(e);\n    },\n    [disabled, onFavoriteClick]\n  );\n\n  const primaryColor = get('common.primary', skin);\n  const darkColor = get('common.dark', skin);\n  const brandColor = get('common.brand', skin);\n\n  const toolTipView = useMemo(\n    () =>\n      !isEmpty(removeFavoriteToolTip) && !isEmpty(addFavoriteToolTip) ? (\n        <div className={style.showToolTip}>\n          <span>{favorite ? removeFavoriteToolTip : addFavoriteToolTip}</span>\n        </div>\n      ) : null,\n    [addFavoriteToolTip, favorite, removeFavoriteToolTip]\n  );\n\n  return (\n    <div className={style.blocFavorite}>\n      {toolTipView}\n      <div\n        data-name=\"favorite\"\n        aria-label={ariaLabel.favorite}\n        className={classnames(style.favorite, className, favorite && style.selected)}\n        onClick={handleFavoriteClick}\n        style={{\n          color: primaryColor\n        }}\n      >\n        {favorite ? (\n          <CheckIcon\n            className={style.checkIcon}\n            style={{color: brandColor}}\n            width={13}\n            height={13}\n            aria-label={ariaLabel.removeFromFavorite}\n          />\n        ) : (\n          <MoreIcon\n            className={style.moreIcon}\n            style={{color: darkColor}}\n            width={13}\n            height={13}\n            aria-label={ariaLabel.addToFavorite}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n\nFavorite.propTypes = {\n  className: PropTypes.string,\n  favorite: PropTypes.bool,\n  disabled: PropTypes.bool,\n  addFavoriteToolTip: PropTypes.string,\n  removeFavoriteToolTip: PropTypes.string,\n  onFavoriteClick: PropTypes.func,\n  'aria-label': PropTypes.shape({\n    favorite: PropTypes.string,\n    addToFavorite: PropTypes.string,\n    removeFromFavorite: PropTypes.string\n  })\n};\n\nFavorite.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nexport default Favorite;\n"],"mappings":"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"}
+{"version":3,"file":"favorite.js","names":["Favorite","favorite","addFavoriteToolTip","removeFavoriteToolTip","className","ariaLabel","onFavoriteClick","disabled","legacyContext","skin","GetSkinFromContext","translate","GetTranslateFromContext","handleFavoriteClick","useCallback","e","stopPropagation","preventDefault","primaryColor","darkColor","brandColor","buttonRef","useRef","allowToolTip","useMemo","favoriteButtonAnchorId","useState","uuidV5","URL","undefined","toolTipContent","mouseLeaveTimer","setMouseLeaveTimer","toolTipIsVisible","setToolTipIsVisible","handleMouseOver","clearTimeout","current","focus","handleMouseLeave","setTimeout","blur","handleKeyPress","event","toggleStateOnKeyPress","iconWrapperClassName","classnames","style","selected","icon","checkIcon","color","removeFromFavorite","moreIcon","addToFavorite","favoriteWrapper","propTypes","PropTypes","string","bool","func","shape","contextTypes","Provider","childContextTypes"],"sources":["../../../src/molecule/card/favorite.js"],"sourcesContent":["import React, {useCallback, useMemo, useRef, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {v5 as uuidV5} from 'uuid';\nimport {get, has, isEmpty, noop} from 'lodash/fp';\nimport {\n  NovaCompositionNavigationMore as MoreIcon,\n  NovaCompositionCoorpacademyCheck as CheckIcon\n} from '@coorpacademy/nova-icons';\nimport Provider, {GetSkinFromContext, GetTranslateFromContext} from '../../atom/provider';\nimport ToolTip, {toggleStateOnKeyPress} from '../../atom/tooltip';\nimport style from './favorite.css';\n\nconst Favorite = (\n  {\n    favorite,\n    addFavoriteToolTip,\n    removeFavoriteToolTip,\n    className,\n    'aria-label': ariaLabel = {},\n    onFavoriteClick = noop,\n    disabled\n  },\n  legacyContext\n) => {\n  const skin = GetSkinFromContext(legacyContext);\n  const translate = GetTranslateFromContext(legacyContext);\n  const handleFavoriteClick = useCallback(\n    e => {\n      e.stopPropagation();\n      e.preventDefault();\n      if (!disabled) onFavoriteClick(e);\n    },\n    [disabled, onFavoriteClick]\n  );\n\n  const primaryColor = get('common.primary', skin);\n  const darkColor = get('common.dark', skin);\n  const brandColor = get('common.brand', skin);\n\n  const buttonRef = useRef(null);\n\n  const allowToolTip = useMemo(\n    () => !isEmpty(removeFavoriteToolTip) && !isEmpty(addFavoriteToolTip),\n    [addFavoriteToolTip, removeFavoriteToolTip]\n  );\n\n  // to be replaced by useId when React17 is bumped to React18\n  const [favoriteButtonAnchorId] = useState(\n    allowToolTip ? uuidV5('engaged-battle-', uuidV5.URL) : undefined\n  );\n\n  const toolTipContent = useMemo(\n    // eslint-disable-next-line no-nested-ternary\n    () => (allowToolTip ? (favorite ? removeFavoriteToolTip : addFavoriteToolTip) : null),\n    [addFavoriteToolTip, favorite, removeFavoriteToolTip, allowToolTip]\n  );\n\n  const [mouseLeaveTimer, setMouseLeaveTimer] = useState(undefined);\n\n  const [toolTipIsVisible, setToolTipIsVisible] = useState(false);\n\n  const handleMouseOver = useCallback(() => {\n    mouseLeaveTimer && clearTimeout(mouseLeaveTimer);\n    /* istanbul ignore next */ has(['current', 'focus'], buttonRef) && buttonRef.current.focus();\n    setToolTipIsVisible(true);\n  }, [mouseLeaveTimer]);\n\n  const handleMouseLeave = useCallback(() => {\n    setMouseLeaveTimer(\n      setTimeout(() => {\n        setToolTipIsVisible(false);\n        // @ts-expect-error (error: blur does not exists on type never)\n        /* istanbul ignore next */ has(['current', 'blur'], buttonRef) && buttonRef.current.blur();\n      }, 500)\n    );\n  }, []);\n\n  const handleKeyPress = useCallback(\n    event => {\n      toggleStateOnKeyPress(toolTipIsVisible, setToolTipIsVisible, buttonRef)(event);\n    },\n    [toolTipIsVisible]\n  );\n\n  const iconWrapperClassName = useMemo(\n    () => classnames(style.favorite, className, favorite && style.selected),\n    [className, favorite]\n  );\n  const icon = useMemo(\n    () =>\n      favorite ? (\n        <CheckIcon\n          // eslint-disable-next-line css-modules/no-undef-class\n          className={style.checkIcon}\n          style={{color: brandColor}}\n          width={13}\n          height={13}\n          data-testid=\"favorite-check-icon\"\n          aria-label={ariaLabel.removeFromFavorite}\n        />\n      ) : (\n        <MoreIcon\n          className={style.moreIcon}\n          style={{color: darkColor}}\n          width={13}\n          height={13}\n          data-testid=\"favorite-add-icon\"\n          aria-label={ariaLabel.addToFavorite}\n        />\n      ),\n    [ariaLabel.addToFavorite, ariaLabel.removeFromFavorite, brandColor, darkColor, favorite]\n  );\n\n  return (\n    <div className={style.favoriteWrapper} data-testid=\"favorite-wrapper\">\n      <button\n        ref={buttonRef}\n        type=\"button\"\n        data-for={favoriteButtonAnchorId}\n        data-tooltip-place=\"left\"\n        data-tip={allowToolTip}\n        data-name=\"favorite\"\n        data-testid=\"favorite-button\"\n        aria-label={ariaLabel.favorite}\n        className={iconWrapperClassName}\n        onClick={handleFavoriteClick}\n        style={{\n          color: primaryColor\n        }}\n        onKeyDown={handleKeyPress}\n        onMouseLeave={handleMouseLeave}\n        onMouseOver={handleMouseOver}\n        tabIndex={0}\n      >\n        {icon}\n      </button>\n      <ToolTip\n        fontSize={12}\n        anchorId={favoriteButtonAnchorId}\n        toolTipIsVisible={toolTipIsVisible}\n        TooltipContent={toolTipContent}\n        closeToolTipInformationTextAriaLabel={translate(\n          'Press the escape key to close the information text'\n        )}\n        stickyOnKeyboardNavigation\n      />\n    </div>\n  );\n};\n\nFavorite.propTypes = {\n  className: PropTypes.string,\n  favorite: PropTypes.bool,\n  disabled: PropTypes.bool,\n  addFavoriteToolTip: PropTypes.string,\n  removeFavoriteToolTip: PropTypes.string,\n  onFavoriteClick: PropTypes.func,\n  'aria-label': PropTypes.shape({\n    favorite: PropTypes.string,\n    addToFavorite: PropTypes.string,\n    removeFromFavorite: PropTypes.string\n  })\n};\n\nFavorite.contextTypes = {\n  skin: Provider.childContextTypes.skin,\n  translate: Provider.childContextTypes.translate\n};\n\nexport default Favorite;\n"],"mappings":"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"}

package/lib/molecule/card/selectable.js

@@ -20,7 +20,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 const Selectable = props => {
   const {
     isSelected,
-    hidden = false,
+    hidden,
     'aria-label': ariaLabel = {}
   } = props;
   if ((0, _isUndefined2.default)(isSelected)) return null;

package/lib/molecule/card/selectable.js.map

@@ -1 +1 @@
-{"version":3,"file":"selectable.js","names":["Selectable","props","isSelected","hidden","ariaLabel","classnames","style","selectable","selected","circle","iconWrapper","addIcon","select","checkIcon","unSelect","hideIcon","hide","showIcon","show","propTypes","PropTypes","bool","shape","string"],"sources":["../../../src/molecule/card/selectable.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {isUndefined} from 'lodash/fp';\nimport {\n  NovaSolidStatusCheckCircle2 as CheckIcon,\n  NovaSolidRemoveAddAddCircle1 as AddIcon,\n  NovaLineContentEditionHide as HideIcon,\n  NovaCompositionCoorpacademyEye as ShowIcon\n} from '@coorpacademy/nova-icons';\nimport style from './selectable.css';\n\nconst Selectable = props => {\n  const {isSelected, hidden = false, 'aria-label': ariaLabel = {}} = props;\n\n  if (isUndefined(isSelected)) return null;\n\n  return (\n    <div\n      className={classnames(style.selectable, isSelected && style.selected, hidden && style.hidden)}\n    >\n      <div className={style.circle} />\n      <div className={style.iconWrapper}>\n        <AddIcon className={style.addIcon} aria-label={ariaLabel.select} />\n        <CheckIcon className={style.checkIcon} aria-label={ariaLabel.unSelect} />\n        <HideIcon className={style.hideIcon} aria-label={ariaLabel.hide} />\n        <ShowIcon className={style.showIcon} aria-label={ariaLabel.show} />\n      </div>\n    </div>\n  );\n};\n\nSelectable.propTypes = {\n  isSelected: PropTypes.bool,\n  hidden: PropTypes.bool,\n  'aria-label': PropTypes.shape({\n    select: PropTypes.string,\n    unSelect: PropTypes.string\n  })\n};\n\nexport default Selectable;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAMA;;;;AAEA,MAAMA,UAAU,GAAGC,KAAK,IAAI;EAC1B,MAAM;IAACC,UAAD;IAAaC,MAAM,GAAG,KAAtB;IAA6B,cAAcC,SAAS,GAAG;EAAvD,IAA6DH,KAAnE;EAEA,IAAI,2BAAYC,UAAZ,CAAJ,EAA6B,OAAO,IAAP;EAE7B,oBACE;IACE,SAAS,EAAE,IAAAG,mBAAA,EAAWC,mBAAA,CAAMC,UAAjB,EAA6BL,UAAU,IAAII,mBAAA,CAAME,QAAjD,EAA2DL,MAAM,IAAIG,mBAAA,CAAMH,MAA3E;EADb,gBAGE;IAAK,SAAS,EAAEG,mBAAA,CAAMG;EAAtB,EAHF,eAIE;IAAK,SAAS,EAAEH,mBAAA,CAAMI;EAAtB,gBACE,6BAAC,uCAAD;IAAS,SAAS,EAAEJ,mBAAA,CAAMK,OAA1B;IAAmC,cAAYP,SAAS,CAACQ;EAAzD,EADF,eAEE,6BAAC,sCAAD;IAAW,SAAS,EAAEN,mBAAA,CAAMO,SAA5B;IAAuC,cAAYT,SAAS,CAACU;EAA7D,EAFF,eAGE,6BAAC,qCAAD;IAAU,SAAS,EAAER,mBAAA,CAAMS,QAA3B;IAAqC,cAAYX,SAAS,CAACY;EAA3D,EAHF,eAIE,6BAAC,yCAAD;IAAU,SAAS,EAAEV,mBAAA,CAAMW,QAA3B;IAAqC,cAAYb,SAAS,CAACc;EAA3D,EAJF,CAJF,CADF;AAaD,CAlBD;;AAoBAlB,UAAU,CAACmB,SAAX,2CAAuB;EACrBjB,UAAU,EAAEkB,kBAAA,CAAUC,IADD;EAErBlB,MAAM,EAAEiB,kBAAA,CAAUC,IAFG;EAGrB,cAAcD,kBAAA,CAAUE,KAAV,CAAgB;IAC5BV,MAAM,EAAEQ,kBAAA,CAAUG,MADU;IAE5BT,QAAQ,EAAEM,kBAAA,CAAUG;EAFQ,CAAhB;AAHO,CAAvB;eASevB,U"}
+{"version":3,"file":"selectable.js","names":["Selectable","props","isSelected","hidden","ariaLabel","classnames","style","selectable","selected","circle","iconWrapper","addIcon","select","checkIcon","unSelect","hideIcon","hide","showIcon","show","propTypes","PropTypes","bool","shape","string"],"sources":["../../../src/molecule/card/selectable.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {isUndefined} from 'lodash/fp';\nimport {\n  NovaSolidStatusCheckCircle2 as CheckIcon,\n  NovaSolidRemoveAddAddCircle1 as AddIcon,\n  NovaLineContentEditionHide as HideIcon,\n  NovaCompositionCoorpacademyEye as ShowIcon\n} from '@coorpacademy/nova-icons';\nimport style from './selectable.css';\n\nconst Selectable = props => {\n  const {isSelected, hidden, 'aria-label': ariaLabel = {}} = props;\n\n  if (isUndefined(isSelected)) return null;\n\n  return (\n    <div\n      className={classnames(style.selectable, isSelected && style.selected, hidden && style.hidden)}\n    >\n      <div className={style.circle} />\n      <div className={style.iconWrapper}>\n        <AddIcon className={style.addIcon} aria-label={ariaLabel.select} />\n        <CheckIcon className={style.checkIcon} aria-label={ariaLabel.unSelect} />\n        <HideIcon className={style.hideIcon} aria-label={ariaLabel.hide} />\n        <ShowIcon className={style.showIcon} aria-label={ariaLabel.show} />\n      </div>\n    </div>\n  );\n};\n\nSelectable.propTypes = {\n  isSelected: PropTypes.bool,\n  hidden: PropTypes.bool,\n  'aria-label': PropTypes.shape({\n    select: PropTypes.string,\n    unSelect: PropTypes.string\n  })\n};\n\nexport default Selectable;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAMA;;;;AAEA,MAAMA,UAAU,GAAGC,KAAK,IAAI;EAC1B,MAAM;IAACC,UAAD;IAAaC,MAAb;IAAqB,cAAcC,SAAS,GAAG;EAA/C,IAAqDH,KAA3D;EAEA,IAAI,2BAAYC,UAAZ,CAAJ,EAA6B,OAAO,IAAP;EAE7B,oBACE;IACE,SAAS,EAAE,IAAAG,mBAAA,EAAWC,mBAAA,CAAMC,UAAjB,EAA6BL,UAAU,IAAII,mBAAA,CAAME,QAAjD,EAA2DL,MAAM,IAAIG,mBAAA,CAAMH,MAA3E;EADb,gBAGE;IAAK,SAAS,EAAEG,mBAAA,CAAMG;EAAtB,EAHF,eAIE;IAAK,SAAS,EAAEH,mBAAA,CAAMI;EAAtB,gBACE,6BAAC,uCAAD;IAAS,SAAS,EAAEJ,mBAAA,CAAMK,OAA1B;IAAmC,cAAYP,SAAS,CAACQ;EAAzD,EADF,eAEE,6BAAC,sCAAD;IAAW,SAAS,EAAEN,mBAAA,CAAMO,SAA5B;IAAuC,cAAYT,SAAS,CAACU;EAA7D,EAFF,eAGE,6BAAC,qCAAD;IAAU,SAAS,EAAER,mBAAA,CAAMS,QAA3B;IAAqC,cAAYX,SAAS,CAACY;EAA3D,EAHF,eAIE,6BAAC,yCAAD;IAAU,SAAS,EAAEV,mBAAA,CAAMW,QAA3B;IAAqC,cAAYb,SAAS,CAACc;EAA3D,EAJF,CAJF,CADF;AAaD,CAlBD;;AAoBAlB,UAAU,CAACmB,SAAX,2CAAuB;EACrBjB,UAAU,EAAEkB,kBAAA,CAAUC,IADD;EAErBlB,MAAM,EAAEiB,kBAAA,CAAUC,IAFG;EAGrB,cAAcD,kBAAA,CAAUE,KAAV,CAAgB;IAC5BV,MAAM,EAAEQ,kBAAA,CAAUG,MADU;IAE5BT,QAAQ,EAAEM,kBAAA,CAAUG;EAFQ,CAAhB;AAHO,CAAvB;eASevB,U"}

package/lib/molecule/course-section/style.css

@@ -33,10 +33,10 @@
     font-family: Gilroy;
     font-size: 16px;
     font-weight: bold;
-    overflow: hidden;
-    white-space: nowrap;
-    display: inline-block;
-    text-overflow: ellipsis;
+    overflow:hidden;
+    white-space:nowrap;
+    display:inline-block;
+    text-overflow:ellipsis;
     width: 100%;
 }
 
@@ -59,3 +59,5 @@
     min-height: 56px;
     min-width: 56px;
 }
+
+

package/lib/molecule/draggable/style.css

@@ -13,18 +13,15 @@
   background: transparent;
   margin: 8px 0;
   border-radius: 7px;
-  transform: translate(0, 0);
+  transform:translate(0,0);
   z-index: 0;
 }
-
-.draggable:hover {
+.draggable:hover{
   background: rgba(0, 0, 0, 0.3);
 }
-
-.draggable:active {
+.draggable:active{
   background: transparent;
 }
-
 .draggable:before {
   content: '.';
   position: absolute;
@@ -35,10 +32,9 @@
   font-size: 25px;
   color: medium;
   pointer-events: none;
-  text-shadow: 0 0 medium, 0 5px medium, 0 10px medium, 0 15px medium,
-    5px 0 medium, 5px 5px medium, 5px 10px medium, 5px 15px medium;
+  text-shadow: 0 0 medium,    0 5px medium,    0 10px medium,    0 15px medium,
+            5px 0 medium ,   5px 5px medium,  5px 10px medium,  5px 15px medium;
 }
-
 .dragging {
   background: rgba(0, 0, 0, 0.1);
 }

package/lib/molecule/draggable-list/index.d.ts

@@ -6,7 +6,7 @@ declare function DraggableList({ items, onDrop, itemType }: {
 }): JSX.Element;
 declare namespace DraggableList {
     namespace propTypes {
-        const items: PropTypes.Requireable<(NonNullable<PropTypes.InferProps<{
+        const items: PropTypes.Requireable<(PropTypes.InferProps<{
             title: PropTypes.Validator<string>;
             onUp: PropTypes.Requireable<(...args: any[]) => any>;
             onDown: PropTypes.Requireable<(...args: any[]) => any>;
@@ -43,55 +43,7 @@ declare namespace DraggableList {
                 }> | null | undefined)[]>;
                 onChange: PropTypes.Requireable<(...args: any[]) => any>;
             }>>;
-        }> | PropTypes.InferProps<{
-            'aria-label': PropTypes.Requireable<PropTypes.InferProps<{
-                title: PropTypes.Requireable<string>;
-                author: PropTypes.Requireable<string>;
-                modules: PropTypes.Requireable<string>;
-                position: PropTypes.Requireable<string>;
-            }>>;
-            image: PropTypes.Requireable<string>;
-            badgeList: PropTypes.Requireable<(PropTypes.InferProps<{
-                category: PropTypes.Requireable<string>;
-                label: PropTypes.Requireable<string>;
-            }> | null | undefined)[]>;
-            title: PropTypes.Requireable<string>;
-            author: PropTypes.Requireable<string>;
-            position: PropTypes.Requireable<number>;
-            id: PropTypes.Requireable<string>;
-        }> | PropTypes.InferProps<{
-            bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
-                buttonAriaLabel: PropTypes.Requireable<string>;
-                menuAriaLabel: PropTypes.Requireable<string>;
-                buttons: PropTypes.Requireable<(PropTypes.InferProps<{
-                    'data-name': PropTypes.Requireable<string>;
-                    label: PropTypes.Requireable<string>;
-                    type: PropTypes.Requireable<string>;
-                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
-                }> | null | undefined)[]>;
-                onClick: PropTypes.Requireable<(...args: any[]) => any>;
-            }>>;
-            buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
-                type: PropTypes.Requireable<string>;
-                label: PropTypes.Requireable<string>;
-                ariaLabel: PropTypes.Requireable<string>;
-                dataName: PropTypes.Requireable<string>;
-                icon: PropTypes.Requireable<PropTypes.InferProps<{
-                    position: PropTypes.Requireable<string>;
-                    type: PropTypes.Requireable<string>;
-                }>>;
-                onClick: PropTypes.Requireable<(...args: any[]) => any>;
-            }>>;
-            tags: PropTypes.Requireable<(PropTypes.InferProps<{
-                label: PropTypes.Requireable<string>;
-                type: PropTypes.Requireable<string>;
-            }> | null | undefined)[]>;
-            title: PropTypes.Validator<string>;
-            order: PropTypes.Requireable<number>;
-            'aria-label': PropTypes.Requireable<string>;
-            contentType: PropTypes.Requireable<string>;
-            id: PropTypes.Requireable<string>;
-        }> | null | undefined> | null | undefined)[]>;
+        }> | null | undefined)[]>;
         const onDrop: PropTypes.Requireable<(...args: any[]) => any>;
         const itemType: PropTypes.Requireable<string>;
     }

package/lib/molecule/draggable-list/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/draggable-list/index.js"],"names":[],"mappings":";AAaA;;;;gBAmDC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/draggable-list/index.js"],"names":[],"mappings":";AAQA;;;;gBAmDC"}

package/lib/molecule/draggable-list/index.js

@@ -13,8 +13,6 @@ var _setupSection = _interopRequireDefault(require("../setup-section"));
 
 var _courseSection = _interopRequireDefault(require("../course-section"));
 
-var _listItem = _interopRequireDefault(require("../../organism/list-item"));
-
 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); }
@@ -25,8 +23,7 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
 
 const ITEMS = {
   'setup-section': _setupSection.default,
-  'course-section': _courseSection.default,
-  'list-item': _listItem.default
+  'course-section': _courseSection.default
 };
 
 const DraggableList = ({
@@ -67,7 +64,7 @@ const DraggableList = ({
 };
 
 DraggableList.propTypes = process.env.NODE_ENV !== "production" ? {
-  items: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.shape(_setupSection.default.propTypes), _propTypes.default.shape(_courseSection.default.propTypes), _propTypes.default.shape(_listItem.default.propTypes)])),
+  items: _propTypes.default.arrayOf(_propTypes.default.shape(_setupSection.default.propTypes)),
   onDrop: _propTypes.default.func,
   itemType: _propTypes.default.string
 } : {};

package/lib/molecule/draggable-list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ITEMS","SetupSection","CourseSection","ListItem","DraggableList","items","onDrop","itemType","dragTo","setDragTo","useState","dragFrom","setDragFrom","dragStartHandler","useCallback","id","dragOverHandler","dragLeaveHandler","dropHandler","Item","itemsView","map","item","propTypes","PropTypes","arrayOf","oneOfType","shape","func","string"],"sources":["../../../src/molecule/draggable-list/index.js"],"sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Draggable from '../draggable';\nimport SetupSection from '../setup-section';\nimport CourseSection from '../course-section';\nimport ListItem from '../../organism/list-item';\n\nconst ITEMS = {\n  'setup-section': SetupSection,\n  'course-section': CourseSection,\n  'list-item': ListItem\n};\n\nconst DraggableList = ({items, onDrop, itemType}) => {\n  const [dragTo, setDragTo] = useState(null);\n  const [dragFrom, setDragFrom] = useState(null);\n\n  const dragStartHandler = useCallback(\n    id => {\n      setDragFrom(id);\n    },\n    [setDragFrom]\n  );\n\n  const dragOverHandler = useCallback(\n    id => {\n      if (dragTo === id) return;\n      setDragTo(id);\n    },\n    [dragTo, setDragTo]\n  );\n\n  const dragLeaveHandler = useCallback(\n    id => {\n      setDragTo(null);\n    },\n    [setDragTo]\n  );\n\n  const dropHandler = useCallback(\n    id => {\n      if (onDrop && dragFrom) onDrop(dragFrom, id);\n\n      setDragTo(null);\n      setDragFrom(null);\n    },\n    [onDrop, setDragTo, setDragFrom, dragFrom]\n  );\n\n  const Item = ITEMS[itemType];\n  const itemsView = items.map(item => (\n    <Draggable\n      key={item.id}\n      id={item.id}\n      dragging={dragTo === item.id}\n      onDragStart={dragStartHandler}\n      onDragOver={dragOverHandler}\n      onDragLeave={dragLeaveHandler}\n      onDrop={dropHandler}\n    >\n      <Item {...item} key={item.id} />\n    </Draggable>\n  ));\n  return <div>{itemsView}</div>;\n};\n\nDraggableList.propTypes = {\n  items: PropTypes.arrayOf(\n    PropTypes.oneOfType([\n      PropTypes.shape(SetupSection.propTypes),\n      PropTypes.shape(CourseSection.propTypes),\n      PropTypes.shape(ListItem.propTypes)\n    ])\n  ),\n  onDrop: PropTypes.func,\n  itemType: PropTypes.string\n};\n\nexport default DraggableList;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,KAAK,GAAG;EACZ,iBAAiBC,qBADL;EAEZ,kBAAkBC,sBAFN;EAGZ,aAAaC;AAHD,CAAd;;AAMA,MAAMC,aAAa,GAAG,CAAC;EAACC,KAAD;EAAQC,MAAR;EAAgBC;AAAhB,CAAD,KAA+B;EACnD,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsB,IAAAC,eAAA,EAAS,IAAT,CAA5B;EACA,MAAM,CAACC,QAAD,EAAWC,WAAX,IAA0B,IAAAF,eAAA,EAAS,IAAT,CAAhC;EAEA,MAAMG,gBAAgB,GAAG,IAAAC,kBAAA,EACvBC,EAAE,IAAI;IACJH,WAAW,CAACG,EAAD,CAAX;EACD,CAHsB,EAIvB,CAACH,WAAD,CAJuB,CAAzB;EAOA,MAAMI,eAAe,GAAG,IAAAF,kBAAA,EACtBC,EAAE,IAAI;IACJ,IAAIP,MAAM,KAAKO,EAAf,EAAmB;IACnBN,SAAS,CAACM,EAAD,CAAT;EACD,CAJqB,EAKtB,CAACP,MAAD,EAASC,SAAT,CALsB,CAAxB;EAQA,MAAMQ,gBAAgB,GAAG,IAAAH,kBAAA,EACvBC,EAAE,IAAI;IACJN,SAAS,CAAC,IAAD,CAAT;EACD,CAHsB,EAIvB,CAACA,SAAD,CAJuB,CAAzB;EAOA,MAAMS,WAAW,GAAG,IAAAJ,kBAAA,EAClBC,EAAE,IAAI;IACJ,IAAIT,MAAM,IAAIK,QAAd,EAAwBL,MAAM,CAACK,QAAD,EAAWI,EAAX,CAAN;IAExBN,SAAS,CAAC,IAAD,CAAT;IACAG,WAAW,CAAC,IAAD,CAAX;EACD,CANiB,EAOlB,CAACN,MAAD,EAASG,SAAT,EAAoBG,WAApB,EAAiCD,QAAjC,CAPkB,CAApB;EAUA,MAAMQ,IAAI,GAAGnB,KAAK,CAACO,QAAD,CAAlB;EACA,MAAMa,SAAS,GAAGf,KAAK,CAACgB,GAAN,CAAUC,IAAI,iBAC9B,6BAAC,kBAAD;IACE,GAAG,EAAEA,IAAI,CAACP,EADZ;IAEE,EAAE,EAAEO,IAAI,CAACP,EAFX;IAGE,QAAQ,EAAEP,MAAM,KAAKc,IAAI,CAACP,EAH5B;IAIE,WAAW,EAAEF,gBAJf;IAKE,UAAU,EAAEG,eALd;IAME,WAAW,EAAEC,gBANf;IAOE,MAAM,EAAEC;EAPV,gBASE,6BAAC,IAAD,eAAUI,IAAV;IAAgB,GAAG,EAAEA,IAAI,CAACP;EAA1B,GATF,CADgB,CAAlB;EAaA,oBAAO,0CAAMK,SAAN,CAAP;AACD,CAnDD;;AAqDAhB,aAAa,CAACmB,SAAd,2CAA0B;EACxBlB,KAAK,EAAEmB,kBAAA,CAAUC,OAAV,CACLD,kBAAA,CAAUE,SAAV,CAAoB,CAClBF,kBAAA,CAAUG,KAAV,CAAgB1B,qBAAA,CAAasB,SAA7B,CADkB,EAElBC,kBAAA,CAAUG,KAAV,CAAgBzB,sBAAA,CAAcqB,SAA9B,CAFkB,EAGlBC,kBAAA,CAAUG,KAAV,CAAgBxB,iBAAA,CAASoB,SAAzB,CAHkB,CAApB,CADK,CADiB;EAQxBjB,MAAM,EAAEkB,kBAAA,CAAUI,IARM;EASxBrB,QAAQ,EAAEiB,kBAAA,CAAUK;AATI,CAA1B;eAYezB,a"}
+{"version":3,"file":"index.js","names":["ITEMS","SetupSection","CourseSection","DraggableList","items","onDrop","itemType","dragTo","setDragTo","useState","dragFrom","setDragFrom","dragStartHandler","useCallback","id","dragOverHandler","dragLeaveHandler","dropHandler","Item","itemsView","map","item","propTypes","PropTypes","arrayOf","shape","func","string"],"sources":["../../../src/molecule/draggable-list/index.js"],"sourcesContent":["import React, {useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport Draggable from '../draggable';\nimport SetupSection from '../setup-section';\nimport CourseSection from '../course-section';\n\nconst ITEMS = {'setup-section': SetupSection, 'course-section': CourseSection};\n\nconst DraggableList = ({items, onDrop, itemType}) => {\n  const [dragTo, setDragTo] = useState(null);\n  const [dragFrom, setDragFrom] = useState(null);\n\n  const dragStartHandler = useCallback(\n    id => {\n      setDragFrom(id);\n    },\n    [setDragFrom]\n  );\n\n  const dragOverHandler = useCallback(\n    id => {\n      if (dragTo === id) return;\n      setDragTo(id);\n    },\n    [dragTo, setDragTo]\n  );\n\n  const dragLeaveHandler = useCallback(\n    id => {\n      setDragTo(null);\n    },\n    [setDragTo]\n  );\n\n  const dropHandler = useCallback(\n    id => {\n      if (onDrop && dragFrom) onDrop(dragFrom, id);\n\n      setDragTo(null);\n      setDragFrom(null);\n    },\n    [onDrop, setDragTo, setDragFrom, dragFrom]\n  );\n\n  const Item = ITEMS[itemType];\n  const itemsView = items.map(item => (\n    <Draggable\n      key={item.id}\n      id={item.id}\n      dragging={dragTo === item.id}\n      onDragStart={dragStartHandler}\n      onDragOver={dragOverHandler}\n      onDragLeave={dragLeaveHandler}\n      onDrop={dropHandler}\n    >\n      <Item {...item} key={item.id} />\n    </Draggable>\n  ));\n  return <div>{itemsView}</div>;\n};\n\nDraggableList.propTypes = {\n  items: PropTypes.arrayOf(PropTypes.shape(SetupSection.propTypes)),\n  onDrop: PropTypes.func,\n  itemType: PropTypes.string\n};\n\nexport default DraggableList;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,KAAK,GAAG;EAAC,iBAAiBC,qBAAlB;EAAgC,kBAAkBC;AAAlD,CAAd;;AAEA,MAAMC,aAAa,GAAG,CAAC;EAACC,KAAD;EAAQC,MAAR;EAAgBC;AAAhB,CAAD,KAA+B;EACnD,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsB,IAAAC,eAAA,EAAS,IAAT,CAA5B;EACA,MAAM,CAACC,QAAD,EAAWC,WAAX,IAA0B,IAAAF,eAAA,EAAS,IAAT,CAAhC;EAEA,MAAMG,gBAAgB,GAAG,IAAAC,kBAAA,EACvBC,EAAE,IAAI;IACJH,WAAW,CAACG,EAAD,CAAX;EACD,CAHsB,EAIvB,CAACH,WAAD,CAJuB,CAAzB;EAOA,MAAMI,eAAe,GAAG,IAAAF,kBAAA,EACtBC,EAAE,IAAI;IACJ,IAAIP,MAAM,KAAKO,EAAf,EAAmB;IACnBN,SAAS,CAACM,EAAD,CAAT;EACD,CAJqB,EAKtB,CAACP,MAAD,EAASC,SAAT,CALsB,CAAxB;EAQA,MAAMQ,gBAAgB,GAAG,IAAAH,kBAAA,EACvBC,EAAE,IAAI;IACJN,SAAS,CAAC,IAAD,CAAT;EACD,CAHsB,EAIvB,CAACA,SAAD,CAJuB,CAAzB;EAOA,MAAMS,WAAW,GAAG,IAAAJ,kBAAA,EAClBC,EAAE,IAAI;IACJ,IAAIT,MAAM,IAAIK,QAAd,EAAwBL,MAAM,CAACK,QAAD,EAAWI,EAAX,CAAN;IAExBN,SAAS,CAAC,IAAD,CAAT;IACAG,WAAW,CAAC,IAAD,CAAX;EACD,CANiB,EAOlB,CAACN,MAAD,EAASG,SAAT,EAAoBG,WAApB,EAAiCD,QAAjC,CAPkB,CAApB;EAUA,MAAMQ,IAAI,GAAGlB,KAAK,CAACM,QAAD,CAAlB;EACA,MAAMa,SAAS,GAAGf,KAAK,CAACgB,GAAN,CAAUC,IAAI,iBAC9B,6BAAC,kBAAD;IACE,GAAG,EAAEA,IAAI,CAACP,EADZ;IAEE,EAAE,EAAEO,IAAI,CAACP,EAFX;IAGE,QAAQ,EAAEP,MAAM,KAAKc,IAAI,CAACP,EAH5B;IAIE,WAAW,EAAEF,gBAJf;IAKE,UAAU,EAAEG,eALd;IAME,WAAW,EAAEC,gBANf;IAOE,MAAM,EAAEC;EAPV,gBASE,6BAAC,IAAD,eAAUI,IAAV;IAAgB,GAAG,EAAEA,IAAI,CAACP;EAA1B,GATF,CADgB,CAAlB;EAaA,oBAAO,0CAAMK,SAAN,CAAP;AACD,CAnDD;;AAqDAhB,aAAa,CAACmB,SAAd,2CAA0B;EACxBlB,KAAK,EAAEmB,kBAAA,CAAUC,OAAV,CAAkBD,kBAAA,CAAUE,KAAV,CAAgBxB,qBAAA,CAAaqB,SAA7B,CAAlB,CADiB;EAExBjB,MAAM,EAAEkB,kBAAA,CAAUG,IAFM;EAGxBpB,QAAQ,EAAEiB,kBAAA,CAAUI;AAHI,CAA1B;eAMexB,a"}

package/lib/organism/list-item/index.d.ts

@@ -32,7 +32,6 @@ declare namespace ListItem {
         order: PropTypes.Requireable<number>;
         'aria-label': PropTypes.Requireable<string>;
         contentType: PropTypes.Requireable<string>;
-        id: PropTypes.Requireable<string>;
     };
 }
 import PropTypes from "prop-types";

package/lib/organism/list-item/index.js

@@ -91,8 +91,7 @@ ListItem.propTypes = process.env.NODE_ENV !== "production" ? {
   title: _propTypes.default.string.isRequired,
   order: _propTypes.default.number,
   'aria-label': _propTypes.default.string,
-  contentType: _propTypes.default.string,
-  id: _propTypes.default.string
+  contentType: _propTypes.default.string
 } : {};
 var _default = ListItem;
 exports.default = _default;

package/lib/organism/list-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ListItem","props","isPublished","bulletPointMenuButton","buttonLink","tags","title","order","ariaLabel","contentType","tagsView","convert","cap","tag","index","type","style","wrapper","orderWrapper","settings","edit","propTypes","PropTypes","shape","buttonAriaLabel","string","menuAriaLabel","buttons","arrayOf","label","onClick","func","dataName","icon","position","oneOf","isRequired","number","id"],"sources":["../../../src/organism/list-item/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map} from 'lodash/fp';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport BulletPointMenuButton from '../../molecule/bullet-point-menu-button';\nimport style from './style.css';\n\nconst ListItem = props => {\n  let isPublished = false;\n  const {\n    bulletPointMenuButton,\n    buttonLink,\n    tags,\n    title,\n    order,\n    'aria-label': ariaLabel,\n    contentType\n  } = props;\n  const tagsView = map.convert({cap: false})((tag, index) => {\n    isPublished = tag.type === 'published';\n    return (\n      <div key={index} className={style.tag}>\n        <Tag {...tag} />\n      </div>\n    );\n  })(tags);\n  return (\n    <div className={style.wrapper}>\n      {isPublished && contentType === 'certification' ? (\n        <div className={style.orderWrapper}>\n          <div className={style.order} aria-label={ariaLabel}>\n            {order + 1}\n          </div>\n          <div className={style.title} title={title}>\n            {title}\n          </div>\n        </div>\n      ) : (\n        <div className={style.title} title={title}>\n          {title}\n        </div>\n      )}\n      <div className={style.settings}>\n        {tagsView}\n        <div className={style.edit}>\n          <ButtonLink {...buttonLink} />\n        </div>\n        <BulletPointMenuButton {...bulletPointMenuButton} />\n      </div>\n    </div>\n  );\n};\n\nListItem.propTypes = {\n  bulletPointMenuButton: PropTypes.shape({\n    buttonAriaLabel: PropTypes.string,\n    menuAriaLabel: PropTypes.string,\n    buttons: PropTypes.arrayOf(\n      PropTypes.shape({\n        'data-name': PropTypes.string,\n        label: PropTypes.string,\n        type: PropTypes.string,\n        onClick: PropTypes.func\n      })\n    ),\n    onClick: PropTypes.func\n  }),\n  buttonLink: PropTypes.shape({\n    type: PropTypes.string,\n    label: PropTypes.string,\n    ariaLabel: PropTypes.string,\n    dataName: PropTypes.string,\n    icon: PropTypes.shape({\n      position: PropTypes.string,\n      type: PropTypes.string\n    }),\n    onClick: PropTypes.func\n  }),\n  tags: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['published', 'draft', 'archived', 'revised', 'default'])\n    })\n  ),\n  title: PropTypes.string.isRequired,\n  order: PropTypes.number,\n  'aria-label': PropTypes.string,\n  contentType: PropTypes.string,\n  id: PropTypes.string\n};\n\nexport default ListItem;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ListItem","props","isPublished","bulletPointMenuButton","buttonLink","tags","title","order","ariaLabel","contentType","tagsView","convert","cap","tag","index","type","style","wrapper","orderWrapper","settings","edit","propTypes","PropTypes","shape","buttonAriaLabel","string","menuAriaLabel","buttons","arrayOf","label","onClick","func","dataName","icon","position","oneOf","isRequired","number"],"sources":["../../../src/organism/list-item/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map} from 'lodash/fp';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport BulletPointMenuButton from '../../molecule/bullet-point-menu-button';\nimport style from './style.css';\n\nconst ListItem = props => {\n  let isPublished = false;\n  const {\n    bulletPointMenuButton,\n    buttonLink,\n    tags,\n    title,\n    order,\n    'aria-label': ariaLabel,\n    contentType\n  } = props;\n  const tagsView = map.convert({cap: false})((tag, index) => {\n    isPublished = tag.type === 'published';\n    return (\n      <div key={index} className={style.tag}>\n        <Tag {...tag} />\n      </div>\n    );\n  })(tags);\n  return (\n    <div className={style.wrapper}>\n      {isPublished && contentType === 'certification' ? (\n        <div className={style.orderWrapper}>\n          <div className={style.order} aria-label={ariaLabel}>\n            {order + 1}\n          </div>\n          <div className={style.title} title={title}>\n            {title}\n          </div>\n        </div>\n      ) : (\n        <div className={style.title} title={title}>\n          {title}\n        </div>\n      )}\n      <div className={style.settings}>\n        {tagsView}\n        <div className={style.edit}>\n          <ButtonLink {...buttonLink} />\n        </div>\n        <BulletPointMenuButton {...bulletPointMenuButton} />\n      </div>\n    </div>\n  );\n};\n\nListItem.propTypes = {\n  bulletPointMenuButton: PropTypes.shape({\n    buttonAriaLabel: PropTypes.string,\n    menuAriaLabel: PropTypes.string,\n    buttons: PropTypes.arrayOf(\n      PropTypes.shape({\n        'data-name': PropTypes.string,\n        label: PropTypes.string,\n        type: PropTypes.string,\n        onClick: PropTypes.func\n      })\n    ),\n    onClick: PropTypes.func\n  }),\n  buttonLink: PropTypes.shape({\n    type: PropTypes.string,\n    label: PropTypes.string,\n    ariaLabel: PropTypes.string,\n    dataName: PropTypes.string,\n    icon: PropTypes.shape({\n      position: PropTypes.string,\n      type: PropTypes.string\n    }),\n    onClick: PropTypes.func\n  }),\n  tags: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['published', 'draft', 'archived', 'revised', 'default'])\n    })\n  ),\n  title: PropTypes.string.isRequired,\n  order: PropTypes.number,\n  'aria-label': PropTypes.string,\n  contentType: PropTypes.string\n};\n\nexport default ListItem;\n"],"mappings":"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"}

package/lib/organism/list-item/style.css

@@ -33,17 +33,17 @@
   text-align: left;
   text-overflow: ellipsis;
   white-space: nowrap;
-
+ 
 }
 
 .settings {
   align-items: center;
   display: flex;
-  height: 100%;
+  height: 100%; 
 }
 
 .tag {
-  margin: 0 16px 0 0;
+  margin: 0 16px 0 0; 
   text-overflow: ellipsis;
   white-space: nowrap;
 }
@@ -64,10 +64,8 @@
   color: cm_grey_400;
   margin: 0 16px 0 0;
 }
-
 .orderWrapper {
   align-items: center;
   display: flex;
   width: 100%;
-  margin-left: 24px;
-}
+}

package/lib/organism/list-items/index.d.ts

@@ -1,11 +1,10 @@
 export default ListItems;
-declare function ListItems({ title, buttonLink, items, "aria-label": ariaLabel, contentType, onDrop }: {
+declare function ListItems({ title, buttonLink, items, "aria-label": ariaLabel, contentType }: {
     title: any;
     buttonLink: any;
     items: any;
     "aria-label": any;
     contentType: any;
-    onDrop: any;
 }): JSX.Element;
 declare namespace ListItems {
     const propTypes: {
@@ -61,11 +60,9 @@ declare namespace ListItems {
             order: PropTypes.Requireable<number>;
             'aria-label': PropTypes.Requireable<string>;
             contentType: PropTypes.Requireable<string>;
-            id: PropTypes.Requireable<string>;
         }> | null | undefined)[]>;
         title: PropTypes.Requireable<string>;
         contentType: PropTypes.Requireable<string>;
-        onDrop: PropTypes.Requireable<(...args: any[]) => any>;
     };
 }
 import PropTypes from "prop-types";

package/lib/organism/list-items/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AAkCA;;;;;;;gBAcC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AAOA;;;;;;gBAsBC"}

package/lib/organism/list-items/index.js

@@ -5,14 +5,10 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _findIndex = _interopRequireDefault(require("lodash/fp/findIndex"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _listItem = _interopRequireDefault(require("../list-item"));
 
-var _draggableList = _interopRequireDefault(require("../../molecule/draggable-list"));
-
 var _title = _interopRequireDefault(require("../../atom/title"));
 
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
@@ -23,17 +19,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 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 buildItemsView = (items, contentType, onDrop, ariaLabel) => {
-  const isPublished = (0, _findIndex.default)({
-    type: 'published'
-  }, items[0]?.tags) !== -1;
-  if (isPublished && contentType === 'certification') return /*#__PURE__*/_react.default.createElement(_draggableList.default, {
-    items: items.map(item => _extends({}, item, {
-      contentType
-    })),
-    itemType: "list-item",
-    onDrop: onDrop
-  });
+const ListItems = ({
+  title,
+  buttonLink,
+  items,
+  'aria-label': ariaLabel,
+  contentType
+}) => {
   const itemsView = items.map((item, index) => /*#__PURE__*/_react.default.createElement("li", {
     key: item.id,
     className: _style.default.item,
@@ -42,21 +34,6 @@ const buildItemsView = (items, contentType, onDrop, ariaLabel) => {
     order: index,
     contentType: contentType
   }))));
-  return /*#__PURE__*/_react.default.createElement("ul", {
-    className: _style.default.list,
-    "aria-label": ariaLabel,
-    "data-name": 'content-list'
-  }, itemsView);
-};
-
-const ListItems = ({
-  title,
-  buttonLink,
-  items,
-  'aria-label': ariaLabel,
-  contentType,
-  onDrop
-}) => {
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.header
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -67,7 +44,11 @@ const ListItems = ({
     "data-name": 'list-title'
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.buttonCreate
-  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonLink))), buildItemsView(items, contentType, onDrop, ariaLabel));
+  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonLink))), /*#__PURE__*/_react.default.createElement("ul", {
+    className: _style.default.list,
+    "aria-label": ariaLabel,
+    "data-name": 'content-list'
+  }, itemsView));
 };
 
 ListItems.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -75,8 +56,7 @@ ListItems.propTypes = process.env.NODE_ENV !== "production" ? {
   buttonLink: _propTypes.default.shape(_buttonLink.default.propTypes),
   items: _propTypes.default.arrayOf(_propTypes.default.shape(_listItem.default.propTypes)),
   title: _propTypes.default.string,
-  contentType: _propTypes.default.string,
-  onDrop: _propTypes.default.func
+  contentType: _propTypes.default.string
 } : {};
 var _default = ListItems;
 exports.default = _default;

package/lib/organism/list-items/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["buildItemsView","items","contentType","onDrop","ariaLabel","isPublished","findIndex","type","tags","map","item","itemsView","index","id","style","list","ListItems","title","buttonLink","header","buttonCreate","propTypes","PropTypes","string","shape","ButtonLink","arrayOf","ListItem","func"],"sources":["../../../src/organism/list-items/index.js"],"sourcesContent":["import React from 'react';\nimport findIndex from 'lodash/fp/findIndex';\nimport PropTypes from 'prop-types';\nimport ListItem from '../list-item';\nimport DraggableList from '../../molecule/draggable-list';\nimport Title from '../../atom/title';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst buildItemsView = (items, contentType, onDrop, ariaLabel) => {\n  const isPublished = findIndex({type: 'published'}, items[0]?.tags) !== -1;\n\n  if (isPublished && contentType === 'certification')\n    return (\n      <DraggableList\n        items={items.map(item => ({...item, contentType}))}\n        itemType=\"list-item\"\n        onDrop={onDrop}\n      />\n    );\n\n  const itemsView = items.map((item, index) => (\n    <li key={item.id} className={style.item} data-name={`content-${index}`}>\n      <ListItem {...item} order={index} contentType={contentType} />\n    </li>\n  ));\n\n  return (\n    <ul className={style.list} aria-label={ariaLabel} data-name={'content-list'}>\n      {itemsView}\n    </ul>\n  );\n};\n\nconst ListItems = ({title, buttonLink, items, 'aria-label': ariaLabel, contentType, onDrop}) => {\n  return (\n    <div>\n      <div className={style.header}>\n        <div className={style.title}>\n          <Title title={title} type={'form-group'} data-name={'list-title'} />\n        </div>\n        <div className={style.buttonCreate}>\n          <ButtonLink {...buttonLink} />\n        </div>\n      </div>\n      {buildItemsView(items, contentType, onDrop, ariaLabel)}\n    </div>\n  );\n};\n\nListItems.propTypes = {\n  'aria-label': PropTypes.string,\n  buttonLink: PropTypes.shape(ButtonLink.propTypes),\n  items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n  title: PropTypes.string,\n  contentType: PropTypes.string,\n  onDrop: PropTypes.func\n};\n\nexport default ListItems;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,cAAc,GAAG,CAACC,KAAD,EAAQC,WAAR,EAAqBC,MAArB,EAA6BC,SAA7B,KAA2C;EAChE,MAAMC,WAAW,GAAG,IAAAC,kBAAA,EAAU;IAACC,IAAI,EAAE;EAAP,CAAV,EAA+BN,KAAK,CAAC,CAAD,CAAL,EAAUO,IAAzC,MAAmD,CAAC,CAAxE;EAEA,IAAIH,WAAW,IAAIH,WAAW,KAAK,eAAnC,EACE,oBACE,6BAAC,sBAAD;IACE,KAAK,EAAED,KAAK,CAACQ,GAAN,CAAUC,IAAI,iBAASA,IAAT;MAAeR;IAAf,EAAd,CADT;IAEE,QAAQ,EAAC,WAFX;IAGE,MAAM,EAAEC;EAHV,EADF;EAQF,MAAMQ,SAAS,GAAGV,KAAK,CAACQ,GAAN,CAAU,CAACC,IAAD,EAAOE,KAAP,kBAC1B;IAAI,GAAG,EAAEF,IAAI,CAACG,EAAd;IAAkB,SAAS,EAAEC,cAAA,CAAMJ,IAAnC;IAAyC,aAAY,WAAUE,KAAM;EAArE,gBACE,6BAAC,iBAAD,eAAcF,IAAd;IAAoB,KAAK,EAAEE,KAA3B;IAAkC,WAAW,EAAEV;EAA/C,GADF,CADgB,CAAlB;EAMA,oBACE;IAAI,SAAS,EAAEY,cAAA,CAAMC,IAArB;IAA2B,cAAYX,SAAvC;IAAkD,aAAW;EAA7D,GACGO,SADH,CADF;AAKD,CAvBD;;AAyBA,MAAMK,SAAS,GAAG,CAAC;EAACC,KAAD;EAAQC,UAAR;EAAoBjB,KAApB;EAA2B,cAAcG,SAAzC;EAAoDF,WAApD;EAAiEC;AAAjE,CAAD,KAA8E;EAC9F,oBACE,uDACE;IAAK,SAAS,EAAEW,cAAA,CAAMK;EAAtB,gBACE;IAAK,SAAS,EAAEL,cAAA,CAAMG;EAAtB,gBACE,6BAAC,cAAD;IAAO,KAAK,EAAEA,KAAd;IAAqB,IAAI,EAAE,YAA3B;IAAyC,aAAW;EAApD,EADF,CADF,eAIE;IAAK,SAAS,EAAEH,cAAA,CAAMM;EAAtB,gBACE,6BAAC,mBAAD,EAAgBF,UAAhB,CADF,CAJF,CADF,EASGlB,cAAc,CAACC,KAAD,EAAQC,WAAR,EAAqBC,MAArB,EAA6BC,SAA7B,CATjB,CADF;AAaD,CAdD;;AAgBAY,SAAS,CAACK,SAAV,2CAAsB;EACpB,cAAcC,kBAAA,CAAUC,MADJ;EAEpBL,UAAU,EAAEI,kBAAA,CAAUE,KAAV,CAAgBC,mBAAA,CAAWJ,SAA3B,CAFQ;EAGpBpB,KAAK,EAAEqB,kBAAA,CAAUI,OAAV,CAAkBJ,kBAAA,CAAUE,KAAV,CAAgBG,iBAAA,CAASN,SAAzB,CAAlB,CAHa;EAIpBJ,KAAK,EAAEK,kBAAA,CAAUC,MAJG;EAKpBrB,WAAW,EAAEoB,kBAAA,CAAUC,MALH;EAMpBpB,MAAM,EAAEmB,kBAAA,CAAUM;AANE,CAAtB;eASeZ,S"}
+{"version":3,"file":"index.js","names":["ListItems","title","buttonLink","items","ariaLabel","contentType","itemsView","map","item","index","id","style","header","buttonCreate","list","propTypes","PropTypes","string","shape","ButtonLink","arrayOf","ListItem"],"sources":["../../../src/organism/list-items/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ListItem from '../list-item';\nimport Title from '../../atom/title';\nimport ButtonLink from '../../atom/button-link';\nimport style from './style.css';\n\nconst ListItems = ({title, buttonLink, items, 'aria-label': ariaLabel, contentType}) => {\n  const itemsView = items.map((item, index) => (\n    <li key={item.id} className={style.item} data-name={`content-${index}`}>\n      <ListItem {...item} order={index} contentType={contentType} />\n    </li>\n  ));\n\n  return (\n    <div>\n      <div className={style.header}>\n        <div className={style.title}>\n          <Title title={title} type={'form-group'} data-name={'list-title'} />\n        </div>\n        <div className={style.buttonCreate}>\n          <ButtonLink {...buttonLink} />\n        </div>\n      </div>\n      <ul className={style.list} aria-label={ariaLabel} data-name={'content-list'}>\n        {itemsView}\n      </ul>\n    </div>\n  );\n};\n\nListItems.propTypes = {\n  'aria-label': PropTypes.string,\n  buttonLink: PropTypes.shape(ButtonLink.propTypes),\n  items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),\n  title: PropTypes.string,\n  contentType: PropTypes.string\n};\n\nexport default ListItems;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,SAAS,GAAG,CAAC;EAACC,KAAD;EAAQC,UAAR;EAAoBC,KAApB;EAA2B,cAAcC,SAAzC;EAAoDC;AAApD,CAAD,KAAsE;EACtF,MAAMC,SAAS,GAAGH,KAAK,CAACI,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,kBAC1B;IAAI,GAAG,EAAED,IAAI,CAACE,EAAd;IAAkB,SAAS,EAAEC,cAAA,CAAMH,IAAnC;IAAyC,aAAY,WAAUC,KAAM;EAArE,gBACE,6BAAC,iBAAD,eAAcD,IAAd;IAAoB,KAAK,EAAEC,KAA3B;IAAkC,WAAW,EAAEJ;EAA/C,GADF,CADgB,CAAlB;EAMA,oBACE,uDACE;IAAK,SAAS,EAAEM,cAAA,CAAMC;EAAtB,gBACE;IAAK,SAAS,EAAED,cAAA,CAAMV;EAAtB,gBACE,6BAAC,cAAD;IAAO,KAAK,EAAEA,KAAd;IAAqB,IAAI,EAAE,YAA3B;IAAyC,aAAW;EAApD,EADF,CADF,eAIE;IAAK,SAAS,EAAEU,cAAA,CAAME;EAAtB,gBACE,6BAAC,mBAAD,EAAgBX,UAAhB,CADF,CAJF,CADF,eASE;IAAI,SAAS,EAAES,cAAA,CAAMG,IAArB;IAA2B,cAAYV,SAAvC;IAAkD,aAAW;EAA7D,GACGE,SADH,CATF,CADF;AAeD,CAtBD;;AAwBAN,SAAS,CAACe,SAAV,2CAAsB;EACpB,cAAcC,kBAAA,CAAUC,MADJ;EAEpBf,UAAU,EAAEc,kBAAA,CAAUE,KAAV,CAAgBC,mBAAA,CAAWJ,SAA3B,CAFQ;EAGpBZ,KAAK,EAAEa,kBAAA,CAAUI,OAAV,CAAkBJ,kBAAA,CAAUE,KAAV,CAAgBG,iBAAA,CAASN,SAAzB,CAAlB,CAHa;EAIpBd,KAAK,EAAEe,kBAAA,CAAUC,MAJG;EAKpBZ,WAAW,EAAEW,kBAAA,CAAUC;AALH,CAAtB;eAQejB,S"}

package/lib/template/back-office/brand-update/index.d.ts

@@ -1522,10 +1522,8 @@ declare namespace BrandUpdate {
                 order: PropTypes.Requireable<number>;
                 'aria-label': PropTypes.Requireable<string>;
                 contentType: PropTypes.Requireable<string>;
-                id: PropTypes.Requireable<string>;
             }> | null | undefined)[]>;
             title: PropTypes.Requireable<string>;
-            onDrop: PropTypes.Requireable<(...args: any[]) => any>;
         }> | PropTypes.InferProps<{
             key: PropTypes.Requireable<string>;
             type: PropTypes.Requireable<string>;