@coorpacademy/components 11.40.1-alpha.15 → 11.40.1-alpha.16

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.
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAuHC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAgHC"}
@@ -28,8 +28,9 @@ const IconPickerModal = (props, context) => {
28
28
  translate
29
29
  } = context;
30
30
  const allIcons = useMemo(() => _pipe(_values, _map(_get('iconName')), _uniq)(fas), []);
31
- const [selectedIcon, setSelectedIcon] = useState(null);
32
- const [displayedIcons, setDisplayedIcons] = useState(_slice(0, ICONS_PER_LOAD, allIcons));
31
+ const [selectedIcon, setSelectedIcon] = useState(false);
32
+ // const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));
33
+
33
34
  const {
34
35
  searchValue,
35
36
  searchResults,
@@ -42,29 +43,24 @@ const IconPickerModal = (props, context) => {
42
43
  const handleClose = useCallback(() => {
43
44
  onClose();
44
45
  }, [onClose]);
45
- const handleIconClick = useCallback(iconName => e => {
46
- e.preventDefault();
47
- e.stopPropagation();
48
- console.log('in handleIconClick ----->');
49
- setSelectedIcon(prevSelectedIcon => {
50
- console.log('TCL ------> ~ IconPickerModal ~ prevSelectedIcon:', prevSelectedIcon);
51
- return prevSelectedIcon === iconName ? null : iconName;
52
- });
46
+ const handleOnClick = useCallback(iconName => () => {
47
+ console.log('TCL ------> ~ IconPickerModal ~ iconName:', iconName);
48
+ setSelectedIcon(iconName);
53
49
  }, []);
54
50
  const icons = useMemo(() => _pipe(_entries, _map(([index, iconName]) => {
55
- console.log('in icons ---->');
51
+ console.log('in icons ---->', selectedIcon);
56
52
  return /*#__PURE__*/React.createElement(SelectIcon, {
57
53
  key: iconName,
58
54
  size: "responsive",
59
55
  "data-name": iconName,
60
56
  "aria-label": iconName,
61
57
  faIcon: iconName,
62
- onClick: handleIconClick(iconName),
58
+ onClick: handleOnClick(iconName),
63
59
  options: {
64
60
  isSelected: selectedIcon === iconName
65
61
  }
66
62
  });
67
- }))(displayedIcons), [displayedIcons, selectedIcon, handleIconClick]);
63
+ }))(_slice(0, ICONS_PER_LOAD, allIcons)), [allIcons, handleOnClick, selectedIcon]);
68
64
  const footer = useMemo(() => {
69
65
  return {
70
66
  cancelButton: {
@@ -73,17 +69,16 @@ const IconPickerModal = (props, context) => {
73
69
  },
74
70
  confirmButton: {
75
71
  onConfirm: () => {
76
- onConfirm(selectedIcon);
77
- setSelectedIcon(null);
72
+ onConfirm();
78
73
  onClose();
79
74
  },
80
75
  label: translate('confirm'),
81
76
  iconName: 'plus',
82
- disabled: selectedIcon === null,
77
+ disabled: false,
83
78
  color: COLORS.cm_primary_blue
84
79
  }
85
80
  };
86
- }, [handleCancel, onConfirm, onClose, translate, selectedIcon]);
81
+ }, [handleCancel, onConfirm, onClose, translate]);
87
82
  if (!isOpen) return null;
88
83
  return /*#__PURE__*/React.createElement(BaseModal, {
89
84
  title: translate('icon_picker_title'),
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","useMemo","useState","useCallback","PropTypes","fas","BaseModal","SelectIcon","Provider","SearchForm","COLORS","style","useIconSearch","ICONS_PER_LOAD","IconPickerModal","props","context","isOpen","onCancel","onConfirm","onClose","translate","allIcons","_pipe","_values","_map","_get","_uniq","selectedIcon","setSelectedIcon","displayedIcons","setDisplayedIcons","_slice","searchValue","searchResults","handleSearch","handleReset","handleCancel","handleClose","handleIconClick","iconName","e","preventDefault","stopPropagation","console","log","prevSelectedIcon","icons","_entries","index","createElement","key","size","faIcon","onClick","options","isSelected","footer","cancelButton","label","confirmButton","disabled","color","cm_primary_blue","title","description","headerIcon","name","backgroundColor","className","iconPicker","searchWrapper","search","placeholder","value","onChange","onReset","dataTestId","_size","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","iconsListWrapper","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","bool","func"],"sources":["../../../src/molecule/icon-picker-modal/index.js"],"sourcesContent":["import React, {useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {entries, map, pipe, get, values, slice, size, uniq} from 'lodash/fp';\nimport BaseModal from '../base-modal';\nimport SelectIcon from '../../atom/select-icon';\nimport Provider from '../../atom/provider';\nimport SearchForm from '../search-form';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\nimport useIconSearch from './use-icon-search';\n\nconst ICONS_PER_LOAD = 48;\n\nconst IconPickerModal = (props, context) => {\n const {isOpen, onCancel, onConfirm, onClose} = props;\n const {translate} = context;\n\n const allIcons = useMemo(() => pipe(values, map(get('iconName')), uniq)(fas), []);\n\n const [selectedIcon, setSelectedIcon] = useState(null);\n const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n\n const {searchValue, searchResults, handleSearch, handleReset} = useIconSearch(allIcons);\n\n const handleCancel = useCallback(() => {\n onCancel();\n }, [onCancel]);\n\n const handleClose = useCallback(() => {\n onClose();\n }, [onClose]);\n\n const handleIconClick = useCallback(\n iconName => e => {\n e.preventDefault();\n e.stopPropagation();\n console.log('in handleIconClick ----->');\n setSelectedIcon(prevSelectedIcon => {\n console.log('TCL ------> ~ IconPickerModal ~ prevSelectedIcon:', prevSelectedIcon);\n\n return prevSelectedIcon === iconName ? null : iconName;\n });\n },\n []\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => {\n console.log('in icons ---->');\n return (\n <SelectIcon\n key={iconName}\n size=\"responsive\"\n data-name={iconName}\n aria-label={iconName}\n faIcon={iconName}\n onClick={handleIconClick(iconName)}\n options={{isSelected: selectedIcon === iconName}}\n />\n );\n })\n )(displayedIcons),\n [displayedIcons, selectedIcon, handleIconClick]\n );\n\n const footer = useMemo(() => {\n return {\n cancelButton: {\n onCancel: handleCancel,\n label: translate('cancel')\n },\n confirmButton: {\n onConfirm: () => {\n onConfirm(selectedIcon);\n setSelectedIcon(null);\n onClose();\n },\n label: translate('confirm'),\n iconName: 'plus',\n disabled: selectedIcon === null,\n color: COLORS.cm_primary_blue\n }\n };\n }, [handleCancel, onConfirm, onClose, translate, selectedIcon]);\n\n if (!isOpen) return null;\n\n return (\n <BaseModal\n title={translate('icon_picker_title')}\n description={translate('icon_picker_description')}\n isOpen={isOpen}\n onClose={handleClose}\n footer={footer}\n headerIcon={{\n name: 'arrows-rotate',\n backgroundColor: '#D6E6FF'\n }}\n >\n <div className={style.iconPicker}>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleReset}\n dataTestId=\"search-input\"\n />\n </div>\n {searchValue && size(searchResults) === 0 ? (\n <div className={style.emptySearchResultContainer}>\n <div className={style.emptySearchResultTitle}>\n {translate('empty_search_result_title', {searchValue})}\n </div>\n <div className={style.emptySearchResultDescription}>\n {translate('empty_search_result_description')}\n </div>\n <div className={style.emptySearchResultClearSearch} onClick={handleReset}>\n {translate('empty_search_result_clear_search')}\n </div>\n </div>\n ) : (\n <div className={style.iconsListWrapper}>{icons}</div>\n )}\n </div>\n </BaseModal>\n );\n};\n\nIconPickerModal.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nIconPickerModal.propTypes = {\n isOpen: PropTypes.bool,\n onCancel: PropTypes.func,\n onConfirm: PropTypes.func,\n onClose: PropTypes.func\n};\n\nexport default IconPickerModal;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["React","useMemo","useState","useCallback","PropTypes","fas","BaseModal","SelectIcon","Provider","SearchForm","COLORS","style","useIconSearch","ICONS_PER_LOAD","IconPickerModal","props","context","isOpen","onCancel","onConfirm","onClose","translate","allIcons","_pipe","_values","_map","_get","_uniq","selectedIcon","setSelectedIcon","searchValue","searchResults","handleSearch","handleReset","handleCancel","handleClose","handleOnClick","iconName","console","log","icons","_entries","index","createElement","key","size","faIcon","onClick","options","isSelected","_slice","footer","cancelButton","label","confirmButton","disabled","color","cm_primary_blue","title","description","headerIcon","name","backgroundColor","className","iconPicker","searchWrapper","search","placeholder","value","onChange","onReset","dataTestId","_size","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","iconsListWrapper","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","bool","func"],"sources":["../../../src/molecule/icon-picker-modal/index.js"],"sourcesContent":["import React, {useMemo, useState, useCallback, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {entries, map, pipe, get, values, slice, size, uniq} from 'lodash/fp';\nimport BaseModal from '../base-modal';\nimport SelectIcon from '../../atom/select-icon';\nimport Provider from '../../atom/provider';\nimport SearchForm from '../search-form';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\nimport useIconSearch from './use-icon-search';\n\nconst ICONS_PER_LOAD = 48;\n\nconst IconPickerModal = (props, context) => {\n const {isOpen, onCancel, onConfirm, onClose} = props;\n const {translate} = context;\n\n const allIcons = useMemo(() => pipe(values, map(get('iconName')), uniq)(fas), []);\n\n const [selectedIcon, setSelectedIcon] = useState(false);\n // const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n\n const {searchValue, searchResults, handleSearch, handleReset} = useIconSearch(allIcons);\n\n const handleCancel = useCallback(() => {\n onCancel();\n }, [onCancel]);\n\n const handleClose = useCallback(() => {\n onClose();\n }, [onClose]);\n\n const handleOnClick = useCallback(\n iconName => () => {\n console.log('TCL ------> ~ IconPickerModal ~ iconName:', iconName);\n setSelectedIcon(iconName);\n },\n []\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => {\n console.log('in icons ---->', selectedIcon);\n return (\n <SelectIcon\n key={iconName}\n size=\"responsive\"\n data-name={iconName}\n aria-label={iconName}\n faIcon={iconName}\n onClick={handleOnClick(iconName)}\n options={{isSelected: selectedIcon === iconName}}\n />\n );\n })\n )(slice(0, ICONS_PER_LOAD, allIcons)),\n [allIcons, handleOnClick, selectedIcon]\n );\n\n const footer = useMemo(() => {\n return {\n cancelButton: {\n onCancel: handleCancel,\n label: translate('cancel')\n },\n confirmButton: {\n onConfirm: () => {\n onConfirm();\n onClose();\n },\n label: translate('confirm'),\n iconName: 'plus',\n disabled: false,\n color: COLORS.cm_primary_blue\n }\n };\n }, [handleCancel, onConfirm, onClose, translate]);\n\n if (!isOpen) return null;\n\n return (\n <BaseModal\n title={translate('icon_picker_title')}\n description={translate('icon_picker_description')}\n isOpen={isOpen}\n onClose={handleClose}\n footer={footer}\n headerIcon={{\n name: 'arrows-rotate',\n backgroundColor: '#D6E6FF'\n }}\n >\n <div className={style.iconPicker}>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleReset}\n dataTestId=\"search-input\"\n />\n </div>\n {searchValue && size(searchResults) === 0 ? (\n <div className={style.emptySearchResultContainer}>\n <div className={style.emptySearchResultTitle}>\n {translate('empty_search_result_title', {searchValue})}\n </div>\n <div className={style.emptySearchResultDescription}>\n {translate('empty_search_result_description')}\n </div>\n <div className={style.emptySearchResultClearSearch} onClick={handleReset}>\n {translate('empty_search_result_clear_search')}\n </div>\n </div>\n ) : (\n <div className={style.iconsListWrapper}>{icons}</div>\n )}\n </div>\n </BaseModal>\n );\n};\n\nIconPickerModal.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nIconPickerModal.propTypes = {\n isOpen: PropTypes.bool,\n onCancel: PropTypes.func,\n onConfirm: PropTypes.func,\n onClose: PropTypes.func\n};\n\nexport default IconPickerModal;\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAuHC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAgHC"}
@@ -35,8 +35,9 @@ const IconPickerModal = (props, context) => {
35
35
  translate
36
36
  } = context;
37
37
  const allIcons = (0, _react.useMemo)(() => (0, _pipe2.default)(_values2.default, (0, _map2.default)((0, _get2.default)('iconName')), _uniq2.default)(_proSolidSvgIcons.fas), []);
38
- const [selectedIcon, setSelectedIcon] = (0, _react.useState)(null);
39
- const [displayedIcons, setDisplayedIcons] = (0, _react.useState)((0, _slice2.default)(0, ICONS_PER_LOAD, allIcons));
38
+ const [selectedIcon, setSelectedIcon] = (0, _react.useState)(false);
39
+ // const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));
40
+
40
41
  const {
41
42
  searchValue,
42
43
  searchResults,
@@ -49,29 +50,24 @@ const IconPickerModal = (props, context) => {
49
50
  const handleClose = (0, _react.useCallback)(() => {
50
51
  onClose();
51
52
  }, [onClose]);
52
- const handleIconClick = (0, _react.useCallback)(iconName => e => {
53
- e.preventDefault();
54
- e.stopPropagation();
55
- console.log('in handleIconClick ----->');
56
- setSelectedIcon(prevSelectedIcon => {
57
- console.log('TCL ------> ~ IconPickerModal ~ prevSelectedIcon:', prevSelectedIcon);
58
- return prevSelectedIcon === iconName ? null : iconName;
59
- });
53
+ const handleOnClick = (0, _react.useCallback)(iconName => () => {
54
+ console.log('TCL ------> ~ IconPickerModal ~ iconName:', iconName);
55
+ setSelectedIcon(iconName);
60
56
  }, []);
61
57
  const icons = (0, _react.useMemo)(() => (0, _pipe2.default)(_entries2.default, (0, _map2.default)(([index, iconName]) => {
62
- console.log('in icons ---->');
58
+ console.log('in icons ---->', selectedIcon);
63
59
  return /*#__PURE__*/_react.default.createElement(_selectIcon.default, {
64
60
  key: iconName,
65
61
  size: "responsive",
66
62
  "data-name": iconName,
67
63
  "aria-label": iconName,
68
64
  faIcon: iconName,
69
- onClick: handleIconClick(iconName),
65
+ onClick: handleOnClick(iconName),
70
66
  options: {
71
67
  isSelected: selectedIcon === iconName
72
68
  }
73
69
  });
74
- }))(displayedIcons), [displayedIcons, selectedIcon, handleIconClick]);
70
+ }))((0, _slice2.default)(0, ICONS_PER_LOAD, allIcons)), [allIcons, handleOnClick, selectedIcon]);
75
71
  const footer = (0, _react.useMemo)(() => {
76
72
  return {
77
73
  cancelButton: {
@@ -80,17 +76,16 @@ const IconPickerModal = (props, context) => {
80
76
  },
81
77
  confirmButton: {
82
78
  onConfirm: () => {
83
- onConfirm(selectedIcon);
84
- setSelectedIcon(null);
79
+ onConfirm();
85
80
  onClose();
86
81
  },
87
82
  label: translate('confirm'),
88
83
  iconName: 'plus',
89
- disabled: selectedIcon === null,
84
+ disabled: false,
90
85
  color: _colors.COLORS.cm_primary_blue
91
86
  }
92
87
  };
93
- }, [handleCancel, onConfirm, onClose, translate, selectedIcon]);
88
+ }, [handleCancel, onConfirm, onClose, translate]);
94
89
  if (!isOpen) return null;
95
90
  return /*#__PURE__*/_react.default.createElement(_baseModal.default, {
96
91
  title: translate('icon_picker_title'),
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_proSolidSvgIcons","_baseModal","_selectIcon","_provider","_searchForm","_colors","_style","_useIconSearch","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ICONS_PER_LOAD","IconPickerModal","props","context","isOpen","onCancel","onConfirm","onClose","translate","allIcons","useMemo","_pipe2","_values2","_map2","_get2","_uniq2","fas","selectedIcon","setSelectedIcon","useState","displayedIcons","setDisplayedIcons","_slice2","searchValue","searchResults","handleSearch","handleReset","useIconSearch","handleCancel","useCallback","handleClose","handleIconClick","iconName","preventDefault","stopPropagation","console","log","prevSelectedIcon","icons","_entries2","index","createElement","key","size","faIcon","onClick","options","isSelected","footer","cancelButton","label","confirmButton","disabled","color","COLORS","cm_primary_blue","title","description","headerIcon","name","backgroundColor","className","style","iconPicker","searchWrapper","search","placeholder","value","onChange","onReset","dataTestId","_size2","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","iconsListWrapper","contextTypes","Provider","childContextTypes","propTypes","process","env","NODE_ENV","PropTypes","bool","func","_default","exports"],"sources":["../../../src/molecule/icon-picker-modal/index.js"],"sourcesContent":["import React, {useMemo, useState, useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {entries, map, pipe, get, values, slice, size, uniq} from 'lodash/fp';\nimport BaseModal from '../base-modal';\nimport SelectIcon from '../../atom/select-icon';\nimport Provider from '../../atom/provider';\nimport SearchForm from '../search-form';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\nimport useIconSearch from './use-icon-search';\n\nconst ICONS_PER_LOAD = 48;\n\nconst IconPickerModal = (props, context) => {\n const {isOpen, onCancel, onConfirm, onClose} = props;\n const {translate} = context;\n\n const allIcons = useMemo(() => pipe(values, map(get('iconName')), uniq)(fas), []);\n\n const [selectedIcon, setSelectedIcon] = useState(null);\n const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n\n const {searchValue, searchResults, handleSearch, handleReset} = useIconSearch(allIcons);\n\n const handleCancel = useCallback(() => {\n onCancel();\n }, [onCancel]);\n\n const handleClose = useCallback(() => {\n onClose();\n }, [onClose]);\n\n const handleIconClick = useCallback(\n iconName => e => {\n e.preventDefault();\n e.stopPropagation();\n console.log('in handleIconClick ----->');\n setSelectedIcon(prevSelectedIcon => {\n console.log('TCL ------> ~ IconPickerModal ~ prevSelectedIcon:', prevSelectedIcon);\n\n return prevSelectedIcon === iconName ? null : iconName;\n });\n },\n []\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => {\n console.log('in icons ---->');\n return (\n <SelectIcon\n key={iconName}\n size=\"responsive\"\n data-name={iconName}\n aria-label={iconName}\n faIcon={iconName}\n onClick={handleIconClick(iconName)}\n options={{isSelected: selectedIcon === iconName}}\n />\n );\n })\n )(displayedIcons),\n [displayedIcons, selectedIcon, handleIconClick]\n );\n\n const footer = useMemo(() => {\n return {\n cancelButton: {\n onCancel: handleCancel,\n label: translate('cancel')\n },\n confirmButton: {\n onConfirm: () => {\n onConfirm(selectedIcon);\n setSelectedIcon(null);\n onClose();\n },\n label: translate('confirm'),\n iconName: 'plus',\n disabled: selectedIcon === null,\n color: COLORS.cm_primary_blue\n }\n };\n }, [handleCancel, onConfirm, onClose, translate, selectedIcon]);\n\n if (!isOpen) return null;\n\n return (\n <BaseModal\n title={translate('icon_picker_title')}\n description={translate('icon_picker_description')}\n isOpen={isOpen}\n onClose={handleClose}\n footer={footer}\n headerIcon={{\n name: 'arrows-rotate',\n backgroundColor: '#D6E6FF'\n }}\n >\n <div className={style.iconPicker}>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleReset}\n dataTestId=\"search-input\"\n />\n </div>\n {searchValue && size(searchResults) === 0 ? (\n <div className={style.emptySearchResultContainer}>\n <div className={style.emptySearchResultTitle}>\n {translate('empty_search_result_title', {searchValue})}\n </div>\n <div className={style.emptySearchResultDescription}>\n {translate('empty_search_result_description')}\n </div>\n <div className={style.emptySearchResultClearSearch} onClick={handleReset}>\n {translate('empty_search_result_clear_search')}\n </div>\n </div>\n ) : (\n <div className={style.iconsListWrapper}>{icons}</div>\n )}\n </div>\n </BaseModal>\n );\n};\n\nIconPickerModal.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nIconPickerModal.propTypes = {\n isOpen: PropTypes.bool,\n onCancel: PropTypes.func,\n onConfirm: PropTypes.func,\n onClose: PropTypes.func\n};\n\nexport default IconPickerModal;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_proSolidSvgIcons","_baseModal","_selectIcon","_provider","_searchForm","_colors","_style","_useIconSearch","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ICONS_PER_LOAD","IconPickerModal","props","context","isOpen","onCancel","onConfirm","onClose","translate","allIcons","useMemo","_pipe2","_values2","_map2","_get2","_uniq2","fas","selectedIcon","setSelectedIcon","useState","searchValue","searchResults","handleSearch","handleReset","useIconSearch","handleCancel","useCallback","handleClose","handleOnClick","iconName","console","log","icons","_entries2","index","createElement","key","size","faIcon","onClick","options","isSelected","_slice2","footer","cancelButton","label","confirmButton","disabled","color","COLORS","cm_primary_blue","title","description","headerIcon","name","backgroundColor","className","style","iconPicker","searchWrapper","search","placeholder","value","onChange","onReset","dataTestId","_size2","emptySearchResultContainer","emptySearchResultTitle","emptySearchResultDescription","emptySearchResultClearSearch","iconsListWrapper","contextTypes","Provider","childContextTypes","propTypes","process","env","NODE_ENV","PropTypes","bool","func","_default","exports"],"sources":["../../../src/molecule/icon-picker-modal/index.js"],"sourcesContent":["import React, {useMemo, useState, useCallback, useEffect} from 'react';\nimport PropTypes from 'prop-types';\nimport {fas} from '@fortawesome/pro-solid-svg-icons';\nimport {entries, map, pipe, get, values, slice, size, uniq} from 'lodash/fp';\nimport BaseModal from '../base-modal';\nimport SelectIcon from '../../atom/select-icon';\nimport Provider from '../../atom/provider';\nimport SearchForm from '../search-form';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\nimport useIconSearch from './use-icon-search';\n\nconst ICONS_PER_LOAD = 48;\n\nconst IconPickerModal = (props, context) => {\n const {isOpen, onCancel, onConfirm, onClose} = props;\n const {translate} = context;\n\n const allIcons = useMemo(() => pipe(values, map(get('iconName')), uniq)(fas), []);\n\n const [selectedIcon, setSelectedIcon] = useState(false);\n // const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n\n const {searchValue, searchResults, handleSearch, handleReset} = useIconSearch(allIcons);\n\n const handleCancel = useCallback(() => {\n onCancel();\n }, [onCancel]);\n\n const handleClose = useCallback(() => {\n onClose();\n }, [onClose]);\n\n const handleOnClick = useCallback(\n iconName => () => {\n console.log('TCL ------> ~ IconPickerModal ~ iconName:', iconName);\n setSelectedIcon(iconName);\n },\n []\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => {\n console.log('in icons ---->', selectedIcon);\n return (\n <SelectIcon\n key={iconName}\n size=\"responsive\"\n data-name={iconName}\n aria-label={iconName}\n faIcon={iconName}\n onClick={handleOnClick(iconName)}\n options={{isSelected: selectedIcon === iconName}}\n />\n );\n })\n )(slice(0, ICONS_PER_LOAD, allIcons)),\n [allIcons, handleOnClick, selectedIcon]\n );\n\n const footer = useMemo(() => {\n return {\n cancelButton: {\n onCancel: handleCancel,\n label: translate('cancel')\n },\n confirmButton: {\n onConfirm: () => {\n onConfirm();\n onClose();\n },\n label: translate('confirm'),\n iconName: 'plus',\n disabled: false,\n color: COLORS.cm_primary_blue\n }\n };\n }, [handleCancel, onConfirm, onClose, translate]);\n\n if (!isOpen) return null;\n\n return (\n <BaseModal\n title={translate('icon_picker_title')}\n description={translate('icon_picker_description')}\n isOpen={isOpen}\n onClose={handleClose}\n footer={footer}\n headerIcon={{\n name: 'arrows-rotate',\n backgroundColor: '#D6E6FF'\n }}\n >\n <div className={style.iconPicker}>\n <div className={style.searchWrapper}>\n <SearchForm\n search={{\n placeholder: translate('search_place_holder'),\n value: searchValue,\n onChange: handleSearch\n }}\n onReset={handleReset}\n dataTestId=\"search-input\"\n />\n </div>\n {searchValue && size(searchResults) === 0 ? (\n <div className={style.emptySearchResultContainer}>\n <div className={style.emptySearchResultTitle}>\n {translate('empty_search_result_title', {searchValue})}\n </div>\n <div className={style.emptySearchResultDescription}>\n {translate('empty_search_result_description')}\n </div>\n <div className={style.emptySearchResultClearSearch} onClick={handleReset}>\n {translate('empty_search_result_clear_search')}\n </div>\n </div>\n ) : (\n <div className={style.iconsListWrapper}>{icons}</div>\n )}\n </div>\n </BaseModal>\n );\n};\n\nIconPickerModal.contextTypes = {\n translate: Provider.childContextTypes.translate\n};\n\nIconPickerModal.propTypes = {\n isOpen: PropTypes.bool,\n onCancel: PropTypes.func,\n onConfirm: PropTypes.func,\n onClose: PropTypes.func\n};\n\nexport default IconPickerModal;\n"],"mappings":"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","ignoreList":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@coorpacademy/components",
3
- "version": "11.40.1-alpha.15+d7be3c652",
3
+ "version": "11.40.1-alpha.16+a61d2e69b",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "module": "es/index.js",
@@ -166,5 +166,5 @@
166
166
  "last 2 versions",
167
167
  "IE 11"
168
168
  ],
169
- "gitHead": "d7be3c652edd234ca1fffac6f55347667c0182ed"
169
+ "gitHead": "a61d2e69b30c5b08b1174df8ae5f30fcf1794e3a"
170
170
  }