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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/es/atom/battle-opponent/index.d.ts.map +1 -1
  2. package/es/atom/battle-opponent/index.js +4 -2
  3. package/es/atom/battle-opponent/index.js.map +1 -1
  4. package/es/atom/battle-opponent/style.css +12 -0
  5. package/es/atom/button/index.d.ts +14 -3
  6. package/es/atom/button/index.d.ts.map +1 -1
  7. package/es/atom/button/index.js +60 -27
  8. package/es/atom/button/index.js.map +1 -1
  9. package/es/atom/tooltip/index.d.ts.map +1 -1
  10. package/es/atom/tooltip/index.js +2 -1
  11. package/es/atom/tooltip/index.js.map +1 -1
  12. package/es/molecule/brand-form-group/index.d.ts +14 -3
  13. package/es/molecule/card/customer.js +1 -1
  14. package/es/molecule/card/customer.js.map +1 -1
  15. package/es/molecule/card/favorite.css +15 -35
  16. package/es/molecule/card/favorite.d.ts +1 -0
  17. package/es/molecule/card/favorite.d.ts.map +1 -1
  18. package/es/molecule/card/favorite.js +73 -18
  19. package/es/molecule/card/favorite.js.map +1 -1
  20. package/es/molecule/card/selectable.js +1 -1
  21. package/es/molecule/card/selectable.js.map +1 -1
  22. package/es/molecule/course-section/style.css +6 -4
  23. package/es/molecule/draggable/style.css +5 -9
  24. package/es/molecule/draggable-list/index.d.ts +2 -50
  25. package/es/molecule/draggable-list/index.d.ts.map +1 -1
  26. package/es/molecule/draggable-list/index.js +2 -4
  27. package/es/molecule/draggable-list/index.js.map +1 -1
  28. package/es/organism/brand-form/index.d.ts +14 -3
  29. package/es/organism/list-item/index.d.ts +0 -1
  30. package/es/organism/list-item/index.js +1 -2
  31. package/es/organism/list-item/index.js.map +1 -1
  32. package/es/organism/list-item/style.css +4 -6
  33. package/es/organism/list-items/index.d.ts +1 -4
  34. package/es/organism/list-items/index.d.ts.map +1 -1
  35. package/es/organism/list-items/index.js +13 -31
  36. package/es/organism/list-items/index.js.map +1 -1
  37. package/es/organism/wizard-contents/index.d.ts +14 -3
  38. package/es/template/back-office/brand-update/index.d.ts +28 -8
  39. package/es/template/common/search-page/index.d.ts +14 -3
  40. package/lib/atom/battle-opponent/index.d.ts.map +1 -1
  41. package/lib/atom/battle-opponent/index.js +4 -2
  42. package/lib/atom/battle-opponent/index.js.map +1 -1
  43. package/lib/atom/battle-opponent/style.css +12 -0
  44. package/lib/atom/button/index.d.ts +14 -3
  45. package/lib/atom/button/index.d.ts.map +1 -1
  46. package/lib/atom/button/index.js +65 -27
  47. package/lib/atom/button/index.js.map +1 -1
  48. package/lib/atom/tooltip/index.d.ts.map +1 -1
  49. package/lib/atom/tooltip/index.js +2 -1
  50. package/lib/atom/tooltip/index.js.map +1 -1
  51. package/lib/molecule/brand-form-group/index.d.ts +14 -3
  52. package/lib/molecule/card/customer.js +1 -1
  53. package/lib/molecule/card/customer.js.map +1 -1
  54. package/lib/molecule/card/favorite.css +15 -35
  55. package/lib/molecule/card/favorite.d.ts +1 -0
  56. package/lib/molecule/card/favorite.d.ts.map +1 -1
  57. package/lib/molecule/card/favorite.js +75 -16
  58. package/lib/molecule/card/favorite.js.map +1 -1
  59. package/lib/molecule/card/selectable.js +1 -1
  60. package/lib/molecule/card/selectable.js.map +1 -1
  61. package/lib/molecule/course-section/style.css +6 -4
  62. package/lib/molecule/draggable/style.css +5 -9
  63. package/lib/molecule/draggable-list/index.d.ts +2 -50
  64. package/lib/molecule/draggable-list/index.d.ts.map +1 -1
  65. package/lib/molecule/draggable-list/index.js +2 -5
  66. package/lib/molecule/draggable-list/index.js.map +1 -1
  67. package/lib/organism/brand-form/index.d.ts +14 -3
  68. package/lib/organism/list-item/index.d.ts +0 -1
  69. package/lib/organism/list-item/index.js +1 -2
  70. package/lib/organism/list-item/index.js.map +1 -1
  71. package/lib/organism/list-item/style.css +4 -6
  72. package/lib/organism/list-items/index.d.ts +1 -4
  73. package/lib/organism/list-items/index.d.ts.map +1 -1
  74. package/lib/organism/list-items/index.js +13 -33
  75. package/lib/organism/list-items/index.js.map +1 -1
  76. package/lib/organism/wizard-contents/index.d.ts +14 -3
  77. package/lib/template/back-office/brand-update/index.d.ts +28 -8
  78. package/lib/template/common/search-page/index.d.ts +14 -3
  79. package/package.json +2 -2
@@ -1,11 +1,15 @@
1
1
  import _noop from "lodash/fp/noop";
2
2
  import _isEmpty from "lodash/fp/isEmpty";
3
+ import _has from "lodash/fp/has";
3
4
  import _get from "lodash/fp/get";
4
- import React, { useCallback, useMemo } from 'react';
5
+ import React, { useCallback, useMemo, useRef, useState } from 'react';
5
6
  import PropTypes from 'prop-types';
6
7
  import classnames from 'classnames';
8
+ import { v5 as uuidV5 } from 'uuid';
7
9
  import { NovaCompositionNavigationMore as MoreIcon, NovaCompositionCoorpacademyCheck as CheckIcon } from '@coorpacademy/nova-icons';
8
- import Provider, { GetSkinFromContext } from '../../atom/provider';
10
+ import Provider, { GetSkinFromContext, GetTranslateFromContext } from '../../atom/provider';
11
+ import ToolTip, { toggleStateOnKeyPress } from '../../atom/tooltip';
12
+ import Button from '../../atom/button';
9
13
  import style from './favorite.css';
10
14
 
11
15
  const Favorite = ({
@@ -18,6 +22,7 @@ const Favorite = ({
18
22
  disabled
19
23
  }, legacyContext) => {
20
24
  const skin = GetSkinFromContext(legacyContext);
25
+ const translate = GetTranslateFromContext(legacyContext);
21
26
  const handleFavoriteClick = useCallback(e => {
22
27
  e.stopPropagation();
23
28
  e.preventDefault();
@@ -30,26 +35,43 @@ const Favorite = ({
30
35
 
31
36
  const brandColor = _get('common.brand', skin);
32
37
 
33
- const toolTipView = useMemo(() => !_isEmpty(removeFavoriteToolTip) && !_isEmpty(addFavoriteToolTip) ? /*#__PURE__*/React.createElement("div", {
34
- className: style.showToolTip
35
- }, /*#__PURE__*/React.createElement("span", null, favorite ? removeFavoriteToolTip : addFavoriteToolTip)) : null, [addFavoriteToolTip, favorite, removeFavoriteToolTip]);
36
- return /*#__PURE__*/React.createElement("div", {
37
- className: style.blocFavorite
38
- }, toolTipView, /*#__PURE__*/React.createElement("div", {
39
- "data-name": "favorite",
40
- "aria-label": ariaLabel.favorite,
41
- className: classnames(style.favorite, className, favorite && style.selected),
42
- onClick: handleFavoriteClick,
43
- style: {
44
- color: primaryColor
45
- }
46
- }, favorite ? /*#__PURE__*/React.createElement(CheckIcon, {
38
+ const buttonRef = useRef(null);
39
+ const allowToolTip = useMemo(() => !_isEmpty(removeFavoriteToolTip) && !_isEmpty(addFavoriteToolTip), [addFavoriteToolTip, removeFavoriteToolTip]); // to be replaced by useId when React17 is bumped to React18
40
+
41
+ const [favoriteButtonAnchorId] = useState(allowToolTip ? uuidV5('engaged-battle-', uuidV5.URL) : undefined);
42
+ const toolTipContent = useMemo( // eslint-disable-next-line no-nested-ternary
43
+ () => allowToolTip ? favorite ? removeFavoriteToolTip : addFavoriteToolTip : null, [addFavoriteToolTip, favorite, removeFavoriteToolTip, allowToolTip]);
44
+ const [mouseLeaveTimer, setMouseLeaveTimer] = useState(undefined);
45
+ const [toolTipIsVisible, setToolTipIsVisible] = useState(false);
46
+ const handleMouseOver = useCallback(() => {
47
+ mouseLeaveTimer && clearTimeout(mouseLeaveTimer);
48
+ /* istanbul ignore next */
49
+
50
+ _has(['current', 'focus'], buttonRef) && buttonRef.current.focus();
51
+ setToolTipIsVisible(true);
52
+ }, [mouseLeaveTimer]);
53
+ const handleMouseLeave = useCallback(() => {
54
+ setMouseLeaveTimer(setTimeout(() => {
55
+ setToolTipIsVisible(false); // @ts-expect-error (error: blur does not exists on type never)
56
+
57
+ /* istanbul ignore next */
58
+
59
+ _has(['current', 'blur'], buttonRef) && buttonRef.current.blur();
60
+ }, 500));
61
+ }, []);
62
+ const handleKeyPress = useCallback(event => {
63
+ toggleStateOnKeyPress(toolTipIsVisible, setToolTipIsVisible, buttonRef)(event);
64
+ }, [toolTipIsVisible]);
65
+ const iconWrapperClassName = useMemo(() => classnames(style.favorite, className, favorite && style.selected), [className, favorite]);
66
+ const icon = useMemo(() => favorite ? /*#__PURE__*/React.createElement(CheckIcon // eslint-disable-next-line css-modules/no-undef-class
67
+ , {
47
68
  className: style.checkIcon,
48
69
  style: {
49
70
  color: brandColor
50
71
  },
51
72
  width: 13,
52
73
  height: 13,
74
+ "data-testid": "favorite-check-icon",
53
75
  "aria-label": ariaLabel.removeFromFavorite
54
76
  }) : /*#__PURE__*/React.createElement(MoreIcon, {
55
77
  className: style.moreIcon,
@@ -58,8 +80,40 @@ const Favorite = ({
58
80
  },
59
81
  width: 13,
60
82
  height: 13,
83
+ "data-testid": "favorite-add-icon",
61
84
  "aria-label": ariaLabel.addToFavorite
62
- })));
85
+ }), [ariaLabel.addToFavorite, ariaLabel.removeFromFavorite, brandColor, darkColor, favorite]);
86
+ return /*#__PURE__*/React.createElement("div", {
87
+ className: style.favoriteWrapper,
88
+ "data-testid": "favorite-wrapper"
89
+ }, /*#__PURE__*/React.createElement(Button, {
90
+ buttonRef: buttonRef,
91
+ type: "button",
92
+ "data-for": favoriteButtonAnchorId,
93
+ "data-tooltip-place": "left",
94
+ "data-tip": allowToolTip,
95
+ "data-name": "favorite",
96
+ "data-testid": "favorite-button",
97
+ "aria-label": ariaLabel.favorite,
98
+ buttonContentClassName: iconWrapperClassName,
99
+ onClick: handleFavoriteClick,
100
+ style: {
101
+ color: primaryColor
102
+ },
103
+ onKeyDown: handleKeyPress,
104
+ onMouseLeave: handleMouseLeave,
105
+ onMouseOver: handleMouseOver,
106
+ tabIndex: 0,
107
+ useButtonTag: true,
108
+ useWrapper: false
109
+ }, icon), /*#__PURE__*/React.createElement(ToolTip, {
110
+ fontSize: 12,
111
+ anchorId: favoriteButtonAnchorId,
112
+ toolTipIsVisible: toolTipIsVisible,
113
+ TooltipContent: toolTipContent,
114
+ closeToolTipInformationTextAriaLabel: translate('Press the escape key to close the information text'),
115
+ stickyOnKeyboardNavigation: true
116
+ }));
63
117
  };
64
118
 
65
119
  Favorite.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -76,7 +130,8 @@ Favorite.propTypes = process.env.NODE_ENV !== "production" ? {
76
130
  })
77
131
  } : {};
78
132
  Favorite.contextTypes = {
79
- skin: Provider.childContextTypes.skin
133
+ skin: Provider.childContextTypes.skin,
134
+ translate: Provider.childContextTypes.translate
80
135
  };
81
136
  export default Favorite;
82
137
  //# sourceMappingURL=favorite.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"favorite.js","names":["React","useCallback","useMemo","PropTypes","classnames","NovaCompositionNavigationMore","MoreIcon","NovaCompositionCoorpacademyCheck","CheckIcon","Provider","GetSkinFromContext","style","Favorite","favorite","addFavoriteToolTip","removeFavoriteToolTip","className","ariaLabel","onFavoriteClick","disabled","legacyContext","skin","handleFavoriteClick","e","stopPropagation","preventDefault","primaryColor","darkColor","brandColor","toolTipView","showToolTip","blocFavorite","selected","color","checkIcon","removeFromFavorite","moreIcon","addToFavorite","propTypes","string","bool","func","shape","contextTypes","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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"}
1
+ {"version":3,"file":"favorite.js","names":["React","useCallback","useMemo","useRef","useState","PropTypes","classnames","v5","uuidV5","NovaCompositionNavigationMore","MoreIcon","NovaCompositionCoorpacademyCheck","CheckIcon","Provider","GetSkinFromContext","GetTranslateFromContext","ToolTip","toggleStateOnKeyPress","Button","style","Favorite","favorite","addFavoriteToolTip","removeFavoriteToolTip","className","ariaLabel","onFavoriteClick","disabled","legacyContext","skin","translate","handleFavoriteClick","e","stopPropagation","preventDefault","primaryColor","darkColor","brandColor","buttonRef","allowToolTip","favoriteButtonAnchorId","URL","undefined","toolTipContent","mouseLeaveTimer","setMouseLeaveTimer","toolTipIsVisible","setToolTipIsVisible","handleMouseOver","clearTimeout","current","focus","handleMouseLeave","setTimeout","blur","handleKeyPress","event","iconWrapperClassName","selected","icon","checkIcon","color","removeFromFavorite","moreIcon","addToFavorite","favoriteWrapper","propTypes","string","bool","func","shape","contextTypes","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 Button from '../../atom/button';\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 buttonRef={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 buttonContentClassName={iconWrapperClassName}\n onClick={handleFavoriteClick}\n style={{\n color: primaryColor\n }}\n onKeyDown={handleKeyPress}\n onMouseLeave={handleMouseLeave}\n onMouseOver={handleMouseOver}\n tabIndex={0}\n useButtonTag\n useWrapper={false}\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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"}
@@ -8,7 +8,7 @@ import style from './selectable.css';
8
8
  const Selectable = props => {
9
9
  const {
10
10
  isSelected,
11
- hidden = false,
11
+ hidden,
12
12
  'aria-label': ariaLabel = {}
13
13
  } = props;
14
14
  if (_isUndefined(isSelected)) return null;
@@ -1 +1 @@
1
- {"version":3,"file":"selectable.js","names":["React","PropTypes","classnames","NovaSolidStatusCheckCircle2","CheckIcon","NovaSolidRemoveAddAddCircle1","AddIcon","NovaLineContentEditionHide","HideIcon","NovaCompositionCoorpacademyEye","ShowIcon","style","Selectable","props","isSelected","hidden","ariaLabel","selectable","selected","circle","iconWrapper","addIcon","select","checkIcon","unSelect","hideIcon","hide","showIcon","show","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SACEC,2BAA2B,IAAIC,SADjC,EAEEC,4BAA4B,IAAIC,OAFlC,EAGEC,0BAA0B,IAAIC,QAHhC,EAIEC,8BAA8B,IAAIC,QAJpC,QAKO,0BALP;AAMA,OAAOC,KAAP,MAAkB,kBAAlB;;AAEA,MAAMC,UAAU,GAAGC,KAAK,IAAI;EAC1B,MAAM;IAACC,UAAD;IAAaC,MAAM,GAAG,KAAtB;IAA6B,cAAcC,SAAS,GAAG;EAAvD,IAA6DH,KAAnE;EAEA,IAAI,aAAYC,UAAZ,CAAJ,EAA6B,OAAO,IAAP;EAE7B,oBACE;IACE,SAAS,EAAEZ,UAAU,CAACS,KAAK,CAACM,UAAP,EAAmBH,UAAU,IAAIH,KAAK,CAACO,QAAvC,EAAiDH,MAAM,IAAIJ,KAAK,CAACI,MAAjE;EADvB,gBAGE;IAAK,SAAS,EAAEJ,KAAK,CAACQ;EAAtB,EAHF,eAIE;IAAK,SAAS,EAAER,KAAK,CAACS;EAAtB,gBACE,oBAAC,OAAD;IAAS,SAAS,EAAET,KAAK,CAACU,OAA1B;IAAmC,cAAYL,SAAS,CAACM;EAAzD,EADF,eAEE,oBAAC,SAAD;IAAW,SAAS,EAAEX,KAAK,CAACY,SAA5B;IAAuC,cAAYP,SAAS,CAACQ;EAA7D,EAFF,eAGE,oBAAC,QAAD;IAAU,SAAS,EAAEb,KAAK,CAACc,QAA3B;IAAqC,cAAYT,SAAS,CAACU;EAA3D,EAHF,eAIE,oBAAC,QAAD;IAAU,SAAS,EAAEf,KAAK,CAACgB,QAA3B;IAAqC,cAAYX,SAAS,CAACY;EAA3D,EAJF,CAJF,CADF;AAaD,CAlBD;;AAoBAhB,UAAU,CAACiB,SAAX,2CAAuB;EACrBf,UAAU,EAAEb,SAAS,CAAC6B,IADD;EAErBf,MAAM,EAAEd,SAAS,CAAC6B,IAFG;EAGrB,cAAc7B,SAAS,CAAC8B,KAAV,CAAgB;IAC5BT,MAAM,EAAErB,SAAS,CAAC+B,MADU;IAE5BR,QAAQ,EAAEvB,SAAS,CAAC+B;EAFQ,CAAhB;AAHO,CAAvB;AASA,eAAepB,UAAf"}
1
+ {"version":3,"file":"selectable.js","names":["React","PropTypes","classnames","NovaSolidStatusCheckCircle2","CheckIcon","NovaSolidRemoveAddAddCircle1","AddIcon","NovaLineContentEditionHide","HideIcon","NovaCompositionCoorpacademyEye","ShowIcon","style","Selectable","props","isSelected","hidden","ariaLabel","selectable","selected","circle","iconWrapper","addIcon","select","checkIcon","unSelect","hideIcon","hide","showIcon","show","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SACEC,2BAA2B,IAAIC,SADjC,EAEEC,4BAA4B,IAAIC,OAFlC,EAGEC,0BAA0B,IAAIC,QAHhC,EAIEC,8BAA8B,IAAIC,QAJpC,QAKO,0BALP;AAMA,OAAOC,KAAP,MAAkB,kBAAlB;;AAEA,MAAMC,UAAU,GAAGC,KAAK,IAAI;EAC1B,MAAM;IAACC,UAAD;IAAaC,MAAb;IAAqB,cAAcC,SAAS,GAAG;EAA/C,IAAqDH,KAA3D;EAEA,IAAI,aAAYC,UAAZ,CAAJ,EAA6B,OAAO,IAAP;EAE7B,oBACE;IACE,SAAS,EAAEZ,UAAU,CAACS,KAAK,CAACM,UAAP,EAAmBH,UAAU,IAAIH,KAAK,CAACO,QAAvC,EAAiDH,MAAM,IAAIJ,KAAK,CAACI,MAAjE;EADvB,gBAGE;IAAK,SAAS,EAAEJ,KAAK,CAACQ;EAAtB,EAHF,eAIE;IAAK,SAAS,EAAER,KAAK,CAACS;EAAtB,gBACE,oBAAC,OAAD;IAAS,SAAS,EAAET,KAAK,CAACU,OAA1B;IAAmC,cAAYL,SAAS,CAACM;EAAzD,EADF,eAEE,oBAAC,SAAD;IAAW,SAAS,EAAEX,KAAK,CAACY,SAA5B;IAAuC,cAAYP,SAAS,CAACQ;EAA7D,EAFF,eAGE,oBAAC,QAAD;IAAU,SAAS,EAAEb,KAAK,CAACc,QAA3B;IAAqC,cAAYT,SAAS,CAACU;EAA3D,EAHF,eAIE,oBAAC,QAAD;IAAU,SAAS,EAAEf,KAAK,CAACgB,QAA3B;IAAqC,cAAYX,SAAS,CAACY;EAA3D,EAJF,CAJF,CADF;AAaD,CAlBD;;AAoBAhB,UAAU,CAACiB,SAAX,2CAAuB;EACrBf,UAAU,EAAEb,SAAS,CAAC6B,IADD;EAErBf,MAAM,EAAEd,SAAS,CAAC6B,IAFG;EAGrB,cAAc7B,SAAS,CAAC8B,KAAV,CAAgB;IAC5BT,MAAM,EAAErB,SAAS,CAAC+B,MADU;IAE5BR,QAAQ,EAAEvB,SAAS,CAAC+B;EAFQ,CAAhB;AAHO,CAAvB;AASA,eAAepB,UAAf"}
@@ -33,10 +33,10 @@
33
33
  font-family: Gilroy;
34
34
  font-size: 16px;
35
35
  font-weight: bold;
36
- overflow: hidden;
37
- white-space: nowrap;
38
- display: inline-block;
39
- text-overflow: ellipsis;
36
+ overflow:hidden;
37
+ white-space:nowrap;
38
+ display:inline-block;
39
+ text-overflow:ellipsis;
40
40
  width: 100%;
41
41
  }
42
42
 
@@ -59,3 +59,5 @@
59
59
  min-height: 56px;
60
60
  min-width: 56px;
61
61
  }
62
+
63
+
@@ -13,18 +13,15 @@
13
13
  background: transparent;
14
14
  margin: 8px 0;
15
15
  border-radius: 7px;
16
- transform: translate(0, 0);
16
+ transform:translate(0,0);
17
17
  z-index: 0;
18
18
  }
19
-
20
- .draggable:hover {
19
+ .draggable:hover{
21
20
  background: rgba(0, 0, 0, 0.3);
22
21
  }
23
-
24
- .draggable:active {
22
+ .draggable:active{
25
23
  background: transparent;
26
24
  }
27
-
28
25
  .draggable:before {
29
26
  content: '.';
30
27
  position: absolute;
@@ -35,10 +32,9 @@
35
32
  font-size: 25px;
36
33
  color: medium;
37
34
  pointer-events: none;
38
- text-shadow: 0 0 medium, 0 5px medium, 0 10px medium, 0 15px medium,
39
- 5px 0 medium, 5px 5px medium, 5px 10px medium, 5px 15px medium;
35
+ text-shadow: 0 0 medium, 0 5px medium, 0 10px medium, 0 15px medium,
36
+ 5px 0 medium , 5px 5px medium, 5px 10px medium, 5px 15px medium;
40
37
  }
41
-
42
38
  .dragging {
43
39
  background: rgba(0, 0, 0, 0.1);
44
40
  }
@@ -6,7 +6,7 @@ declare function DraggableList({ items, onDrop, itemType }: {
6
6
  }): JSX.Element;
7
7
  declare namespace DraggableList {
8
8
  namespace propTypes {
9
- const items: PropTypes.Requireable<(NonNullable<PropTypes.InferProps<{
9
+ const items: PropTypes.Requireable<(PropTypes.InferProps<{
10
10
  title: PropTypes.Validator<string>;
11
11
  onUp: PropTypes.Requireable<(...args: any[]) => any>;
12
12
  onDown: PropTypes.Requireable<(...args: any[]) => any>;
@@ -43,55 +43,7 @@ declare namespace DraggableList {
43
43
  }> | null | undefined)[]>;
44
44
  onChange: PropTypes.Requireable<(...args: any[]) => any>;
45
45
  }>>;
46
- }> | PropTypes.InferProps<{
47
- 'aria-label': PropTypes.Requireable<PropTypes.InferProps<{
48
- title: PropTypes.Requireable<string>;
49
- author: PropTypes.Requireable<string>;
50
- modules: PropTypes.Requireable<string>;
51
- position: PropTypes.Requireable<string>;
52
- }>>;
53
- image: PropTypes.Requireable<string>;
54
- badgeList: PropTypes.Requireable<(PropTypes.InferProps<{
55
- category: PropTypes.Requireable<string>;
56
- label: PropTypes.Requireable<string>;
57
- }> | null | undefined)[]>;
58
- title: PropTypes.Requireable<string>;
59
- author: PropTypes.Requireable<string>;
60
- position: PropTypes.Requireable<number>;
61
- id: PropTypes.Requireable<string>;
62
- }> | PropTypes.InferProps<{
63
- bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
64
- buttonAriaLabel: PropTypes.Requireable<string>;
65
- menuAriaLabel: PropTypes.Requireable<string>;
66
- buttons: PropTypes.Requireable<(PropTypes.InferProps<{
67
- 'data-name': PropTypes.Requireable<string>;
68
- label: PropTypes.Requireable<string>;
69
- type: PropTypes.Requireable<string>;
70
- onClick: PropTypes.Requireable<(...args: any[]) => any>;
71
- }> | null | undefined)[]>;
72
- onClick: PropTypes.Requireable<(...args: any[]) => any>;
73
- }>>;
74
- buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
75
- type: PropTypes.Requireable<string>;
76
- label: PropTypes.Requireable<string>;
77
- ariaLabel: PropTypes.Requireable<string>;
78
- dataName: PropTypes.Requireable<string>;
79
- icon: PropTypes.Requireable<PropTypes.InferProps<{
80
- position: PropTypes.Requireable<string>;
81
- type: PropTypes.Requireable<string>;
82
- }>>;
83
- onClick: PropTypes.Requireable<(...args: any[]) => any>;
84
- }>>;
85
- tags: PropTypes.Requireable<(PropTypes.InferProps<{
86
- label: PropTypes.Requireable<string>;
87
- type: PropTypes.Requireable<string>;
88
- }> | null | undefined)[]>;
89
- title: PropTypes.Validator<string>;
90
- order: PropTypes.Requireable<number>;
91
- 'aria-label': PropTypes.Requireable<string>;
92
- contentType: PropTypes.Requireable<string>;
93
- id: PropTypes.Requireable<string>;
94
- }> | null | undefined> | null | undefined)[]>;
46
+ }> | null | undefined)[]>;
95
47
  const onDrop: PropTypes.Requireable<(...args: any[]) => any>;
96
48
  const itemType: PropTypes.Requireable<string>;
97
49
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/draggable-list/index.js"],"names":[],"mappings":";AAaA;;;;gBAmDC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/draggable-list/index.js"],"names":[],"mappings":";AAQA;;;;gBAmDC"}
@@ -5,11 +5,9 @@ import PropTypes from 'prop-types';
5
5
  import Draggable from '../draggable';
6
6
  import SetupSection from '../setup-section';
7
7
  import CourseSection from '../course-section';
8
- import ListItem from '../../organism/list-item';
9
8
  const ITEMS = {
10
9
  'setup-section': SetupSection,
11
- 'course-section': CourseSection,
12
- 'list-item': ListItem
10
+ 'course-section': CourseSection
13
11
  };
14
12
 
15
13
  const DraggableList = ({
@@ -50,7 +48,7 @@ const DraggableList = ({
50
48
  };
51
49
 
52
50
  DraggableList.propTypes = process.env.NODE_ENV !== "production" ? {
53
- items: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.shape(SetupSection.propTypes), PropTypes.shape(CourseSection.propTypes), PropTypes.shape(ListItem.propTypes)])),
51
+ items: PropTypes.arrayOf(PropTypes.shape(SetupSection.propTypes)),
54
52
  onDrop: PropTypes.func,
55
53
  itemType: PropTypes.string
56
54
  } : {};
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","useState","useCallback","PropTypes","Draggable","SetupSection","CourseSection","ListItem","ITEMS","DraggableList","items","onDrop","itemType","dragTo","setDragTo","dragFrom","setDragFrom","dragStartHandler","id","dragOverHandler","dragLeaveHandler","dropHandler","Item","itemsView","map","item","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,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,WAAzB,QAA2C,OAA3C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,QAAP,MAAqB,0BAArB;AAEA,MAAMC,KAAK,GAAG;EACZ,iBAAiBH,YADL;EAEZ,kBAAkBC,aAFN;EAGZ,aAAaC;AAHD,CAAd;;AAMA,MAAME,aAAa,GAAG,CAAC;EAACC,KAAD;EAAQC,MAAR;EAAgBC;AAAhB,CAAD,KAA+B;EACnD,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBb,QAAQ,CAAC,IAAD,CAApC;EACA,MAAM,CAACc,QAAD,EAAWC,WAAX,IAA0Bf,QAAQ,CAAC,IAAD,CAAxC;EAEA,MAAMgB,gBAAgB,GAAGf,WAAW,CAClCgB,EAAE,IAAI;IACJF,WAAW,CAACE,EAAD,CAAX;EACD,CAHiC,EAIlC,CAACF,WAAD,CAJkC,CAApC;EAOA,MAAMG,eAAe,GAAGjB,WAAW,CACjCgB,EAAE,IAAI;IACJ,IAAIL,MAAM,KAAKK,EAAf,EAAmB;IACnBJ,SAAS,CAACI,EAAD,CAAT;EACD,CAJgC,EAKjC,CAACL,MAAD,EAASC,SAAT,CALiC,CAAnC;EAQA,MAAMM,gBAAgB,GAAGlB,WAAW,CAClCgB,EAAE,IAAI;IACJJ,SAAS,CAAC,IAAD,CAAT;EACD,CAHiC,EAIlC,CAACA,SAAD,CAJkC,CAApC;EAOA,MAAMO,WAAW,GAAGnB,WAAW,CAC7BgB,EAAE,IAAI;IACJ,IAAIP,MAAM,IAAII,QAAd,EAAwBJ,MAAM,CAACI,QAAD,EAAWG,EAAX,CAAN;IAExBJ,SAAS,CAAC,IAAD,CAAT;IACAE,WAAW,CAAC,IAAD,CAAX;EACD,CAN4B,EAO7B,CAACL,MAAD,EAASG,SAAT,EAAoBE,WAApB,EAAiCD,QAAjC,CAP6B,CAA/B;EAUA,MAAMO,IAAI,GAAGd,KAAK,CAACI,QAAD,CAAlB;EACA,MAAMW,SAAS,GAAGb,KAAK,CAACc,GAAN,CAAUC,IAAI,iBAC9B,oBAAC,SAAD;IACE,GAAG,EAAEA,IAAI,CAACP,EADZ;IAEE,EAAE,EAAEO,IAAI,CAACP,EAFX;IAGE,QAAQ,EAAEL,MAAM,KAAKY,IAAI,CAACP,EAH5B;IAIE,WAAW,EAAED,gBAJf;IAKE,UAAU,EAAEE,eALd;IAME,WAAW,EAAEC,gBANf;IAOE,MAAM,EAAEC;EAPV,gBASE,oBAAC,IAAD,eAAUI,IAAV;IAAgB,GAAG,EAAEA,IAAI,CAACP;EAA1B,GATF,CADgB,CAAlB;EAaA,oBAAO,iCAAMK,SAAN,CAAP;AACD,CAnDD;;AAqDAd,aAAa,CAACiB,SAAd,2CAA0B;EACxBhB,KAAK,EAAEP,SAAS,CAACwB,OAAV,CACLxB,SAAS,CAACyB,SAAV,CAAoB,CAClBzB,SAAS,CAAC0B,KAAV,CAAgBxB,YAAY,CAACqB,SAA7B,CADkB,EAElBvB,SAAS,CAAC0B,KAAV,CAAgBvB,aAAa,CAACoB,SAA9B,CAFkB,EAGlBvB,SAAS,CAAC0B,KAAV,CAAgBtB,QAAQ,CAACmB,SAAzB,CAHkB,CAApB,CADK,CADiB;EAQxBf,MAAM,EAAER,SAAS,CAAC2B,IARM;EASxBlB,QAAQ,EAAET,SAAS,CAAC4B;AATI,CAA1B;AAYA,eAAetB,aAAf"}
1
+ {"version":3,"file":"index.js","names":["React","useState","useCallback","PropTypes","Draggable","SetupSection","CourseSection","ITEMS","DraggableList","items","onDrop","itemType","dragTo","setDragTo","dragFrom","setDragFrom","dragStartHandler","id","dragOverHandler","dragLeaveHandler","dropHandler","Item","itemsView","map","item","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,OAAOA,KAAP,IAAeC,QAAf,EAAyBC,WAAzB,QAA2C,OAA3C;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,SAAP,MAAsB,cAAtB;AACA,OAAOC,YAAP,MAAyB,kBAAzB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AAEA,MAAMC,KAAK,GAAG;EAAC,iBAAiBF,YAAlB;EAAgC,kBAAkBC;AAAlD,CAAd;;AAEA,MAAME,aAAa,GAAG,CAAC;EAACC,KAAD;EAAQC,MAAR;EAAgBC;AAAhB,CAAD,KAA+B;EACnD,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBZ,QAAQ,CAAC,IAAD,CAApC;EACA,MAAM,CAACa,QAAD,EAAWC,WAAX,IAA0Bd,QAAQ,CAAC,IAAD,CAAxC;EAEA,MAAMe,gBAAgB,GAAGd,WAAW,CAClCe,EAAE,IAAI;IACJF,WAAW,CAACE,EAAD,CAAX;EACD,CAHiC,EAIlC,CAACF,WAAD,CAJkC,CAApC;EAOA,MAAMG,eAAe,GAAGhB,WAAW,CACjCe,EAAE,IAAI;IACJ,IAAIL,MAAM,KAAKK,EAAf,EAAmB;IACnBJ,SAAS,CAACI,EAAD,CAAT;EACD,CAJgC,EAKjC,CAACL,MAAD,EAASC,SAAT,CALiC,CAAnC;EAQA,MAAMM,gBAAgB,GAAGjB,WAAW,CAClCe,EAAE,IAAI;IACJJ,SAAS,CAAC,IAAD,CAAT;EACD,CAHiC,EAIlC,CAACA,SAAD,CAJkC,CAApC;EAOA,MAAMO,WAAW,GAAGlB,WAAW,CAC7Be,EAAE,IAAI;IACJ,IAAIP,MAAM,IAAII,QAAd,EAAwBJ,MAAM,CAACI,QAAD,EAAWG,EAAX,CAAN;IAExBJ,SAAS,CAAC,IAAD,CAAT;IACAE,WAAW,CAAC,IAAD,CAAX;EACD,CAN4B,EAO7B,CAACL,MAAD,EAASG,SAAT,EAAoBE,WAApB,EAAiCD,QAAjC,CAP6B,CAA/B;EAUA,MAAMO,IAAI,GAAGd,KAAK,CAACI,QAAD,CAAlB;EACA,MAAMW,SAAS,GAAGb,KAAK,CAACc,GAAN,CAAUC,IAAI,iBAC9B,oBAAC,SAAD;IACE,GAAG,EAAEA,IAAI,CAACP,EADZ;IAEE,EAAE,EAAEO,IAAI,CAACP,EAFX;IAGE,QAAQ,EAAEL,MAAM,KAAKY,IAAI,CAACP,EAH5B;IAIE,WAAW,EAAED,gBAJf;IAKE,UAAU,EAAEE,eALd;IAME,WAAW,EAAEC,gBANf;IAOE,MAAM,EAAEC;EAPV,gBASE,oBAAC,IAAD,eAAUI,IAAV;IAAgB,GAAG,EAAEA,IAAI,CAACP;EAA1B,GATF,CADgB,CAAlB;EAaA,oBAAO,iCAAMK,SAAN,CAAP;AACD,CAnDD;;AAqDAd,aAAa,CAACiB,SAAd,2CAA0B;EACxBhB,KAAK,EAAEN,SAAS,CAACuB,OAAV,CAAkBvB,SAAS,CAACwB,KAAV,CAAgBtB,YAAY,CAACoB,SAA7B,CAAlB,CADiB;EAExBf,MAAM,EAAEP,SAAS,CAACyB,IAFM;EAGxBjB,QAAQ,EAAER,SAAS,CAAC0B;AAHI,CAA1B;AAMA,eAAerB,aAAf"}
@@ -416,16 +416,27 @@ declare namespace BrandForm {
416
416
  color: any;
417
417
  submitValue: PropTypes.Requireable<string>;
418
418
  disabled: PropTypes.Requireable<boolean>;
419
- isLinkDisabled: PropTypes.Requireable<boolean>;
420
419
  href: PropTypes.Requireable<string>;
421
420
  download: PropTypes.Requireable<boolean>;
422
421
  target: PropTypes.Requireable<string>;
423
- onClick: PropTypes.Requireable<(...args: any[]) => any>;
424
422
  children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
425
423
  className: PropTypes.Requireable<string>;
426
- buttonContentClassName: PropTypes.Requireable<string>;
427
424
  style: PropTypes.Requireable<PropTypes.InferProps<{}>>;
428
425
  'data-name': PropTypes.Requireable<string>;
426
+ 'aria-label': PropTypes.Requireable<string>;
427
+ 'data-testid': PropTypes.Requireable<string>;
428
+ useButtonTag: PropTypes.Requireable<boolean>;
429
+ onClick: PropTypes.Requireable<(...args: any[]) => any>;
430
+ onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
431
+ onMouseLeave: PropTypes.Requireable<(...args: any[]) => any>;
432
+ onMouseOver: PropTypes.Requireable<(...args: any[]) => any>;
433
+ buttonRef: PropTypes.Requireable<string>;
434
+ 'data-for': PropTypes.Requireable<string>;
435
+ 'data-tooltip-place': PropTypes.Requireable<string>;
436
+ 'data-tip': PropTypes.Requireable<boolean>;
437
+ isLinkDisabled: PropTypes.Requireable<boolean>;
438
+ useWrapper: PropTypes.Requireable<boolean>;
439
+ buttonContentClassName: PropTypes.Requireable<string>;
429
440
  }> | PropTypes.InferProps<{
430
441
  buttonType: PropTypes.Requireable<string>;
431
442
  type: PropTypes.Requireable<string>;
@@ -32,7 +32,6 @@ declare namespace ListItem {
32
32
  order: PropTypes.Requireable<number>;
33
33
  'aria-label': PropTypes.Requireable<string>;
34
34
  contentType: PropTypes.Requireable<string>;
35
- id: PropTypes.Requireable<string>;
36
35
  };
37
36
  }
38
37
  import PropTypes from "prop-types";
@@ -78,8 +78,7 @@ ListItem.propTypes = process.env.NODE_ENV !== "production" ? {
78
78
  title: PropTypes.string.isRequired,
79
79
  order: PropTypes.number,
80
80
  'aria-label': PropTypes.string,
81
- contentType: PropTypes.string,
82
- id: PropTypes.string
81
+ contentType: PropTypes.string
83
82
  } : {};
84
83
  export default ListItem;
85
84
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","PropTypes","Tag","ButtonLink","BulletPointMenuButton","style","ListItem","props","isPublished","bulletPointMenuButton","buttonLink","tags","title","order","ariaLabel","contentType","tagsView","convert","cap","tag","index","type","wrapper","orderWrapper","settings","edit","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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"}
1
+ {"version":3,"file":"index.js","names":["React","PropTypes","Tag","ButtonLink","BulletPointMenuButton","style","ListItem","props","isPublished","bulletPointMenuButton","buttonLink","tags","title","order","ariaLabel","contentType","tagsView","convert","cap","tag","index","type","wrapper","orderWrapper","settings","edit","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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"}
@@ -33,17 +33,17 @@
33
33
  text-align: left;
34
34
  text-overflow: ellipsis;
35
35
  white-space: nowrap;
36
-
36
+
37
37
  }
38
38
 
39
39
  .settings {
40
40
  align-items: center;
41
41
  display: flex;
42
- height: 100%;
42
+ height: 100%;
43
43
  }
44
44
 
45
45
  .tag {
46
- margin: 0 16px 0 0;
46
+ margin: 0 16px 0 0;
47
47
  text-overflow: ellipsis;
48
48
  white-space: nowrap;
49
49
  }
@@ -64,10 +64,8 @@
64
64
  color: cm_grey_400;
65
65
  margin: 0 16px 0 0;
66
66
  }
67
-
68
67
  .orderWrapper {
69
68
  align-items: center;
70
69
  display: flex;
71
70
  width: 100%;
72
- margin-left: 24px;
73
- }
71
+ }
@@ -1,11 +1,10 @@
1
1
  export default ListItems;
2
- declare function ListItems({ title, buttonLink, items, "aria-label": ariaLabel, contentType, onDrop }: {
2
+ declare function ListItems({ title, buttonLink, items, "aria-label": ariaLabel, contentType }: {
3
3
  title: any;
4
4
  buttonLink: any;
5
5
  items: any;
6
6
  "aria-label": any;
7
7
  contentType: any;
8
- onDrop: any;
9
8
  }): JSX.Element;
10
9
  declare namespace ListItems {
11
10
  const propTypes: {
@@ -61,11 +60,9 @@ declare namespace ListItems {
61
60
  order: PropTypes.Requireable<number>;
62
61
  'aria-label': PropTypes.Requireable<string>;
63
62
  contentType: PropTypes.Requireable<string>;
64
- id: PropTypes.Requireable<string>;
65
63
  }> | null | undefined)[]>;
66
64
  title: PropTypes.Requireable<string>;
67
65
  contentType: PropTypes.Requireable<string>;
68
- onDrop: PropTypes.Requireable<(...args: any[]) => any>;
69
66
  };
70
67
  }
71
68
  import PropTypes from "prop-types";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AAkCA;;;;;;;gBAcC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AAOA;;;;;;gBAsBC"}
@@ -1,25 +1,19 @@
1
1
  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); }
2
2
 
3
3
  import React from 'react';
4
- import findIndex from 'lodash/fp/findIndex';
5
4
  import PropTypes from 'prop-types';
6
5
  import ListItem from '../list-item';
7
- import DraggableList from '../../molecule/draggable-list';
8
6
  import Title from '../../atom/title';
9
7
  import ButtonLink from '../../atom/button-link';
10
8
  import style from './style.css';
11
9
 
12
- const buildItemsView = (items, contentType, onDrop, ariaLabel) => {
13
- const isPublished = findIndex({
14
- type: 'published'
15
- }, items[0]?.tags) !== -1;
16
- if (isPublished && contentType === 'certification') return /*#__PURE__*/React.createElement(DraggableList, {
17
- items: items.map(item => _extends({}, item, {
18
- contentType
19
- })),
20
- itemType: "list-item",
21
- onDrop: onDrop
22
- });
10
+ const ListItems = ({
11
+ title,
12
+ buttonLink,
13
+ items,
14
+ 'aria-label': ariaLabel,
15
+ contentType
16
+ }) => {
23
17
  const itemsView = items.map((item, index) => /*#__PURE__*/React.createElement("li", {
24
18
  key: item.id,
25
19
  className: style.item,
@@ -28,21 +22,6 @@ const buildItemsView = (items, contentType, onDrop, ariaLabel) => {
28
22
  order: index,
29
23
  contentType: contentType
30
24
  }))));
31
- return /*#__PURE__*/React.createElement("ul", {
32
- className: style.list,
33
- "aria-label": ariaLabel,
34
- "data-name": 'content-list'
35
- }, itemsView);
36
- };
37
-
38
- const ListItems = ({
39
- title,
40
- buttonLink,
41
- items,
42
- 'aria-label': ariaLabel,
43
- contentType,
44
- onDrop
45
- }) => {
46
25
  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
47
26
  className: style.header
48
27
  }, /*#__PURE__*/React.createElement("div", {
@@ -53,7 +32,11 @@ const ListItems = ({
53
32
  "data-name": 'list-title'
54
33
  })), /*#__PURE__*/React.createElement("div", {
55
34
  className: style.buttonCreate
56
- }, /*#__PURE__*/React.createElement(ButtonLink, buttonLink))), buildItemsView(items, contentType, onDrop, ariaLabel));
35
+ }, /*#__PURE__*/React.createElement(ButtonLink, buttonLink))), /*#__PURE__*/React.createElement("ul", {
36
+ className: style.list,
37
+ "aria-label": ariaLabel,
38
+ "data-name": 'content-list'
39
+ }, itemsView));
57
40
  };
58
41
 
59
42
  ListItems.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -61,8 +44,7 @@ ListItems.propTypes = process.env.NODE_ENV !== "production" ? {
61
44
  buttonLink: PropTypes.shape(ButtonLink.propTypes),
62
45
  items: PropTypes.arrayOf(PropTypes.shape(ListItem.propTypes)),
63
46
  title: PropTypes.string,
64
- contentType: PropTypes.string,
65
- onDrop: PropTypes.func
47
+ contentType: PropTypes.string
66
48
  } : {};
67
49
  export default ListItems;
68
50
  //# sourceMappingURL=index.js.map