@coorpacademy/components 11.40.1-alpha.6 → 11.40.1-alpha.8

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,6 +1,6 @@
1
1
  import React, { useCallback } from 'react';
2
2
  import PropTypes from 'prop-types';
3
- import classnames from 'classnames';
3
+ // import classnames from 'classnames';
4
4
  import FaIcon from '../icon';
5
5
  import { COLORS } from '../../variables/colors';
6
6
  // eslint-disable-next-line css-modules/no-unused-class
@@ -43,20 +43,21 @@ const SelectIcon = props => {
43
43
  onClick,
44
44
  options = {}
45
45
  } = props;
46
- const {
47
- isSelected = false
48
- } = options;
46
+
47
+ // const {isSelected = false} = options;
48
+
49
49
  const contentView = getButtonContent(faIcon, options);
50
- const styleButton = classnames(style.defaultStyle, isSelected && style.selected);
50
+ // const styleButton = classnames(style.defaultStyle, isSelected && style.selected);
51
51
  const handleOnClick = useCallback(() => onClick(), [onClick]);
52
52
  const IconButton = useCallback(() => /*#__PURE__*/React.createElement("button", {
53
53
  type: "button",
54
54
  "aria-label": ariaLabel,
55
55
  "data-name": dataName,
56
- "data-testid": `button-${dataName}`,
57
- className: styleButton,
56
+ "data-testid": `button-${dataName}`
57
+ // className={styleButton}
58
+ ,
58
59
  onClick: handleOnClick
59
- }, contentView), [ariaLabel, contentView, dataName, handleOnClick, styleButton]);
60
+ }, contentView), [ariaLabel, contentView, dataName, handleOnClick]);
60
61
  return /*#__PURE__*/React.createElement(IconButton, null);
61
62
  };
62
63
  SelectIcon.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","useCallback","PropTypes","classnames","FaIcon","COLORS","style","ICON_COLOR","cm_primary_blue","getButtonContent","faIcon","options","isSelected","iconColor","createElement","className","contentWrapper","iconWrapper","icon","iconName","size","faSize","wrapperSize","iconText","SelectIcon","props","dataName","ariaLabel","onClick","contentView","styleButton","defaultStyle","selected","handleOnClick","IconButton","type","propTypes","process","env","NODE_ENV","string","func","shape","selectionMode","oneOf","bool"],"sources":["../../../src/atom/select-icon/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport FaIcon from '../icon';\n\nimport {COLORS} from '../../variables/colors';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst ICON_COLOR = COLORS.cm_primary_blue;\n// const BACKGROUND_COLOR = COLORS.white;\n// const CHECK_ICON_NAME_MAP = {\n// single: 'circle-check',\n// multi: 'square-check'\n// };\n\nconst getButtonContent = (faIcon, options = {}) => {\n const {\n // selectionMode = 'single',\n isSelected = false,\n iconColor = ICON_COLOR\n } = options;\n\n return (\n <div className={style.contentWrapper}>\n {/* {isSelected ? (\n <div className={style.checkIcon}>\n <FaIcon\n iconName={CHECK_ICON_NAME_MAP[selectionMode]}\n iconColor={iconColor}\n backgroundColor={BACKGROUND_COLOR}\n size={{faSize: 16, wrapperSize: 16}}\n />\n </div>\n ) : null} */}\n\n <div className={style.iconWrapper}>\n <div className={style.icon}>\n <FaIcon\n iconName={faIcon}\n iconColor={isSelected ? iconColor : ''}\n size={{faSize: 32, wrapperSize: 32}}\n />\n </div>\n <div className={style.iconText}>{faIcon}</div>\n </div>\n </div>\n );\n};\n\nconst SelectIcon = props => {\n const {faIcon, 'data-name': dataName, 'aria-label': ariaLabel, onClick, options = {}} = props;\n\n const {isSelected = false} = options;\n\n const contentView = getButtonContent(faIcon, options);\n const styleButton = classnames(style.defaultStyle, isSelected && style.selected);\n const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n const IconButton = useCallback(\n () => (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n data-name={dataName}\n data-testid={`button-${dataName}`}\n className={styleButton}\n onClick={handleOnClick}\n >\n {contentView}\n </button>\n ),\n [ariaLabel, contentView, dataName, handleOnClick, styleButton]\n );\n\n return <IconButton />;\n};\n\nSelectIcon.propTypes = {\n 'aria-label': PropTypes.string,\n 'data-name': PropTypes.string,\n faIcon: PropTypes.string,\n onClick: PropTypes.func,\n options: PropTypes.shape({\n selectionMode: PropTypes.oneOf(['single', 'multi']),\n isSelected: PropTypes.bool,\n iconColor: PropTypes.string\n })\n};\n\nexport default SelectIcon;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["React","useCallback","PropTypes","FaIcon","COLORS","style","ICON_COLOR","cm_primary_blue","getButtonContent","faIcon","options","isSelected","iconColor","createElement","className","contentWrapper","iconWrapper","icon","iconName","size","faSize","wrapperSize","iconText","SelectIcon","props","dataName","ariaLabel","onClick","contentView","handleOnClick","IconButton","type","propTypes","process","env","NODE_ENV","string","func","shape","selectionMode","oneOf","bool"],"sources":["../../../src/atom/select-icon/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\n// import classnames from 'classnames';\nimport FaIcon from '../icon';\n\nimport {COLORS} from '../../variables/colors';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst ICON_COLOR = COLORS.cm_primary_blue;\n// const BACKGROUND_COLOR = COLORS.white;\n// const CHECK_ICON_NAME_MAP = {\n// single: 'circle-check',\n// multi: 'square-check'\n// };\n\nconst getButtonContent = (faIcon, options = {}) => {\n const {\n // selectionMode = 'single',\n isSelected = false,\n iconColor = ICON_COLOR\n } = options;\n\n return (\n <div className={style.contentWrapper}>\n {/* {isSelected ? (\n <div className={style.checkIcon}>\n <FaIcon\n iconName={CHECK_ICON_NAME_MAP[selectionMode]}\n iconColor={iconColor}\n backgroundColor={BACKGROUND_COLOR}\n size={{faSize: 16, wrapperSize: 16}}\n />\n </div>\n ) : null} */}\n\n <div className={style.iconWrapper}>\n <div className={style.icon}>\n <FaIcon\n iconName={faIcon}\n iconColor={isSelected ? iconColor : ''}\n size={{faSize: 32, wrapperSize: 32}}\n />\n </div>\n <div className={style.iconText}>{faIcon}</div>\n </div>\n </div>\n );\n};\n\nconst SelectIcon = props => {\n const {faIcon, 'data-name': dataName, 'aria-label': ariaLabel, onClick, options = {}} = props;\n\n // const {isSelected = false} = options;\n\n const contentView = getButtonContent(faIcon, options);\n // const styleButton = classnames(style.defaultStyle, isSelected && style.selected);\n const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n const IconButton = useCallback(\n () => (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n data-name={dataName}\n data-testid={`button-${dataName}`}\n // className={styleButton}\n onClick={handleOnClick}\n >\n {contentView}\n </button>\n ),\n [ariaLabel, contentView, dataName, handleOnClick]\n );\n\n return <IconButton />;\n};\n\nSelectIcon.propTypes = {\n 'aria-label': PropTypes.string,\n 'data-name': PropTypes.string,\n faIcon: PropTypes.string,\n onClick: PropTypes.func,\n options: PropTypes.shape({\n selectionMode: PropTypes.oneOf(['single', 'multi']),\n isSelected: PropTypes.bool,\n iconColor: PropTypes.string\n })\n};\n\nexport default SelectIcon;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAGC,WAAW,QAAO,OAAO;AACxC,OAAOC,SAAS,MAAM,YAAY;AAClC;AACA,OAAOC,MAAM,MAAM,SAAS;AAE5B,SAAQC,MAAM,QAAO,wBAAwB;AAC7C;AACA,OAAOC,KAAK,MAAM,aAAa;AAE/B,MAAMC,UAAU,GAAGF,MAAM,CAACG,eAAe;AACzC;AACA;AACA;AACA;AACA;;AAEA,MAAMC,gBAAgB,GAAGA,CAACC,MAAM,EAAEC,OAAO,GAAG,CAAC,CAAC,KAAK;EACjD,MAAM;IACJ;IACAC,UAAU,GAAG,KAAK;IAClBC,SAAS,GAAGN;EACd,CAAC,GAAGI,OAAO;EAEX,oBACEV,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAET,KAAK,CAACU;EAAe,gBAYnCf,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAET,KAAK,CAACW;EAAY,gBAChChB,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAET,KAAK,CAACY;EAAK,gBACzBjB,KAAA,CAAAa,aAAA,CAACV,MAAM;IACLe,QAAQ,EAAET,MAAO;IACjBG,SAAS,EAAED,UAAU,GAAGC,SAAS,GAAG,EAAG;IACvCO,IAAI,EAAE;MAACC,MAAM,EAAE,EAAE;MAAEC,WAAW,EAAE;IAAE;EAAE,CACrC,CACE,CAAC,eACNrB,KAAA,CAAAa,aAAA;IAAKC,SAAS,EAAET,KAAK,CAACiB;EAAS,GAAEb,MAAY,CAC1C,CACF,CAAC;AAEV,CAAC;AAED,MAAMc,UAAU,GAAGC,KAAK,IAAI;EAC1B,MAAM;IAACf,MAAM;IAAE,WAAW,EAAEgB,QAAQ;IAAE,YAAY,EAAEC,SAAS;IAAEC,OAAO;IAAEjB,OAAO,GAAG,CAAC;EAAC,CAAC,GAAGc,KAAK;;EAE7F;;EAEA,MAAMI,WAAW,GAAGpB,gBAAgB,CAACC,MAAM,EAAEC,OAAO,CAAC;EACrD;EACA,MAAMmB,aAAa,GAAG5B,WAAW,CAAC,MAAM0B,OAAO,CAAC,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAE7D,MAAMG,UAAU,GAAG7B,WAAW,CAC5B,mBACED,KAAA,CAAAa,aAAA;IACEkB,IAAI,EAAC,QAAQ;IACb,cAAYL,SAAU;IACtB,aAAWD,QAAS;IACpB,eAAa,UAAUA,QAAQ;IAC/B;IAAA;IACAE,OAAO,EAAEE;EAAc,GAEtBD,WACK,CACT,EACD,CAACF,SAAS,EAAEE,WAAW,EAAEH,QAAQ,EAAEI,aAAa,CAClD,CAAC;EAED,oBAAO7B,KAAA,CAAAa,aAAA,CAACiB,UAAU,MAAE,CAAC;AACvB,CAAC;AAEDP,UAAU,CAACS,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAG;EACrB,YAAY,EAAEjC,SAAS,CAACkC,MAAM;EAC9B,WAAW,EAAElC,SAAS,CAACkC,MAAM;EAC7B3B,MAAM,EAAEP,SAAS,CAACkC,MAAM;EACxBT,OAAO,EAAEzB,SAAS,CAACmC,IAAI;EACvB3B,OAAO,EAAER,SAAS,CAACoC,KAAK,CAAC;IACvBC,aAAa,EAAErC,SAAS,CAACsC,KAAK,CAAC,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnD7B,UAAU,EAAET,SAAS,CAACuC,IAAI;IAC1B7B,SAAS,EAAEV,SAAS,CAACkC;EACvB,CAAC;AACH,CAAC;AAED,eAAeb,UAAU","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAwIC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAsIC"}
@@ -58,7 +58,6 @@ const IconPickerModal = (props, context) => {
58
58
  setCurrentIndex(ICONS_PER_LOAD);
59
59
  }, [searchResults]);
60
60
  const handleScroll = useCallback(event => {
61
- console.log('in handleScroll --->', event.currentTarget);
62
61
  const {
63
62
  scrollTop,
64
63
  clientHeight,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","useMemo","useState","useCallback","useEffect","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","currentIndex","setCurrentIndex","searchValue","searchResults","handleSearch","handleReset","handleCancel","handleClose","handleIconClick","iconName","console","log","prevSelectedIcon","loadMoreIcons","nextIndex","newIcons","prevIcons","handleScroll","event","currentTarget","scrollTop","clientHeight","scrollHeight","icons","_entries","index","createElement","key","size","faIcon","onClick","options","isSelected","footer","cancelButton","label","confirmButton","disabled","color","cm_primary_blue","title","description","onScroll","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(null);\n const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n const [currentIndex, setCurrentIndex] = useState(ICONS_PER_LOAD);\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 => () => {\n console.log('in handleIconClick');\n setSelectedIcon(prevSelectedIcon => (prevSelectedIcon === iconName ? null : iconName));\n },\n []\n );\n\n const loadMoreIcons = useCallback(() => {\n const nextIndex = currentIndex + ICONS_PER_LOAD;\n const newIcons = slice(currentIndex, nextIndex, searchResults);\n setDisplayedIcons(prevIcons => [...prevIcons, ...newIcons]);\n setCurrentIndex(nextIndex);\n }, [currentIndex, searchResults]);\n\n useEffect(() => {\n setDisplayedIcons(() => slice(0, ICONS_PER_LOAD, searchResults));\n setCurrentIndex(ICONS_PER_LOAD);\n }, [searchResults]);\n\n const handleScroll = useCallback(\n event => {\n console.log('in handleScroll --->', event.currentTarget);\n\n const {scrollTop, clientHeight, scrollHeight} = event.currentTarget;\n if (scrollHeight - scrollTop <= clientHeight + 1) {\n loadMoreIcons();\n }\n },\n [loadMoreIcons]\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => (\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 )(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 onScroll={handleScroll}\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","useEffect","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","currentIndex","setCurrentIndex","searchValue","searchResults","handleSearch","handleReset","handleCancel","handleClose","handleIconClick","iconName","console","log","prevSelectedIcon","loadMoreIcons","nextIndex","newIcons","prevIcons","handleScroll","event","scrollTop","clientHeight","scrollHeight","currentTarget","icons","_entries","index","createElement","key","size","faIcon","onClick","options","isSelected","footer","cancelButton","label","confirmButton","disabled","color","cm_primary_blue","title","description","onScroll","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(null);\n const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n const [currentIndex, setCurrentIndex] = useState(ICONS_PER_LOAD);\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 => () => {\n console.log('in handleIconClick');\n setSelectedIcon(prevSelectedIcon => (prevSelectedIcon === iconName ? null : iconName));\n },\n []\n );\n\n const loadMoreIcons = useCallback(() => {\n const nextIndex = currentIndex + ICONS_PER_LOAD;\n const newIcons = slice(currentIndex, nextIndex, searchResults);\n setDisplayedIcons(prevIcons => [...prevIcons, ...newIcons]);\n setCurrentIndex(nextIndex);\n }, [currentIndex, searchResults]);\n\n useEffect(() => {\n setDisplayedIcons(() => slice(0, ICONS_PER_LOAD, searchResults));\n setCurrentIndex(ICONS_PER_LOAD);\n }, [searchResults]);\n\n const handleScroll = useCallback(\n event => {\n const {scrollTop, clientHeight, scrollHeight} = event.currentTarget;\n if (scrollHeight - scrollTop <= clientHeight + 1) {\n loadMoreIcons();\n }\n },\n [loadMoreIcons]\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => (\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 )(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 onScroll={handleScroll}\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":[]}
@@ -4,13 +4,14 @@ exports.__esModule = true;
4
4
  exports.default = void 0;
5
5
  var _react = _interopRequireWildcard(require("react"));
6
6
  var _propTypes = _interopRequireDefault(require("prop-types"));
7
- var _classnames = _interopRequireDefault(require("classnames"));
8
7
  var _icon = _interopRequireDefault(require("../icon"));
9
8
  var _colors = require("../../variables/colors");
10
9
  var _style = _interopRequireDefault(require("./style.css"));
11
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
11
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
13
12
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
13
+ // import classnames from 'classnames';
14
+
14
15
  // eslint-disable-next-line css-modules/no-unused-class
15
16
 
16
17
  const ICON_COLOR = _colors.COLORS.cm_primary_blue;
@@ -51,20 +52,21 @@ const SelectIcon = props => {
51
52
  onClick,
52
53
  options = {}
53
54
  } = props;
54
- const {
55
- isSelected = false
56
- } = options;
55
+
56
+ // const {isSelected = false} = options;
57
+
57
58
  const contentView = getButtonContent(faIcon, options);
58
- const styleButton = (0, _classnames.default)(_style.default.defaultStyle, isSelected && _style.default.selected);
59
+ // const styleButton = classnames(style.defaultStyle, isSelected && style.selected);
59
60
  const handleOnClick = (0, _react.useCallback)(() => onClick(), [onClick]);
60
61
  const IconButton = (0, _react.useCallback)(() => /*#__PURE__*/_react.default.createElement("button", {
61
62
  type: "button",
62
63
  "aria-label": ariaLabel,
63
64
  "data-name": dataName,
64
- "data-testid": `button-${dataName}`,
65
- className: styleButton,
65
+ "data-testid": `button-${dataName}`
66
+ // className={styleButton}
67
+ ,
66
68
  onClick: handleOnClick
67
- }, contentView), [ariaLabel, contentView, dataName, handleOnClick, styleButton]);
69
+ }, contentView), [ariaLabel, contentView, dataName, handleOnClick]);
68
70
  return /*#__PURE__*/_react.default.createElement(IconButton, null);
69
71
  };
70
72
  SelectIcon.propTypes = process.env.NODE_ENV !== "production" ? {
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_classnames","_icon","_colors","_style","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ICON_COLOR","COLORS","cm_primary_blue","getButtonContent","faIcon","options","isSelected","iconColor","createElement","className","style","contentWrapper","iconWrapper","icon","iconName","size","faSize","wrapperSize","iconText","SelectIcon","props","dataName","ariaLabel","onClick","contentView","styleButton","classnames","defaultStyle","selected","handleOnClick","useCallback","IconButton","type","propTypes","process","env","NODE_ENV","PropTypes","string","func","shape","selectionMode","oneOf","bool","_default","exports"],"sources":["../../../src/atom/select-icon/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport FaIcon from '../icon';\n\nimport {COLORS} from '../../variables/colors';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst ICON_COLOR = COLORS.cm_primary_blue;\n// const BACKGROUND_COLOR = COLORS.white;\n// const CHECK_ICON_NAME_MAP = {\n// single: 'circle-check',\n// multi: 'square-check'\n// };\n\nconst getButtonContent = (faIcon, options = {}) => {\n const {\n // selectionMode = 'single',\n isSelected = false,\n iconColor = ICON_COLOR\n } = options;\n\n return (\n <div className={style.contentWrapper}>\n {/* {isSelected ? (\n <div className={style.checkIcon}>\n <FaIcon\n iconName={CHECK_ICON_NAME_MAP[selectionMode]}\n iconColor={iconColor}\n backgroundColor={BACKGROUND_COLOR}\n size={{faSize: 16, wrapperSize: 16}}\n />\n </div>\n ) : null} */}\n\n <div className={style.iconWrapper}>\n <div className={style.icon}>\n <FaIcon\n iconName={faIcon}\n iconColor={isSelected ? iconColor : ''}\n size={{faSize: 32, wrapperSize: 32}}\n />\n </div>\n <div className={style.iconText}>{faIcon}</div>\n </div>\n </div>\n );\n};\n\nconst SelectIcon = props => {\n const {faIcon, 'data-name': dataName, 'aria-label': ariaLabel, onClick, options = {}} = props;\n\n const {isSelected = false} = options;\n\n const contentView = getButtonContent(faIcon, options);\n const styleButton = classnames(style.defaultStyle, isSelected && style.selected);\n const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n const IconButton = useCallback(\n () => (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n data-name={dataName}\n data-testid={`button-${dataName}`}\n className={styleButton}\n onClick={handleOnClick}\n >\n {contentView}\n </button>\n ),\n [ariaLabel, contentView, dataName, handleOnClick, styleButton]\n );\n\n return <IconButton />;\n};\n\nSelectIcon.propTypes = {\n 'aria-label': PropTypes.string,\n 'data-name': PropTypes.string,\n faIcon: PropTypes.string,\n onClick: PropTypes.func,\n options: PropTypes.shape({\n selectionMode: PropTypes.oneOf(['single', 'multi']),\n isSelected: PropTypes.bool,\n iconColor: PropTypes.string\n })\n};\n\nexport default SelectIcon;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_icon","_colors","_style","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ICON_COLOR","COLORS","cm_primary_blue","getButtonContent","faIcon","options","isSelected","iconColor","createElement","className","style","contentWrapper","iconWrapper","icon","iconName","size","faSize","wrapperSize","iconText","SelectIcon","props","dataName","ariaLabel","onClick","contentView","handleOnClick","useCallback","IconButton","type","propTypes","process","env","NODE_ENV","PropTypes","string","func","shape","selectionMode","oneOf","bool","_default","exports"],"sources":["../../../src/atom/select-icon/index.js"],"sourcesContent":["import React, {useCallback} from 'react';\nimport PropTypes from 'prop-types';\n// import classnames from 'classnames';\nimport FaIcon from '../icon';\n\nimport {COLORS} from '../../variables/colors';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst ICON_COLOR = COLORS.cm_primary_blue;\n// const BACKGROUND_COLOR = COLORS.white;\n// const CHECK_ICON_NAME_MAP = {\n// single: 'circle-check',\n// multi: 'square-check'\n// };\n\nconst getButtonContent = (faIcon, options = {}) => {\n const {\n // selectionMode = 'single',\n isSelected = false,\n iconColor = ICON_COLOR\n } = options;\n\n return (\n <div className={style.contentWrapper}>\n {/* {isSelected ? (\n <div className={style.checkIcon}>\n <FaIcon\n iconName={CHECK_ICON_NAME_MAP[selectionMode]}\n iconColor={iconColor}\n backgroundColor={BACKGROUND_COLOR}\n size={{faSize: 16, wrapperSize: 16}}\n />\n </div>\n ) : null} */}\n\n <div className={style.iconWrapper}>\n <div className={style.icon}>\n <FaIcon\n iconName={faIcon}\n iconColor={isSelected ? iconColor : ''}\n size={{faSize: 32, wrapperSize: 32}}\n />\n </div>\n <div className={style.iconText}>{faIcon}</div>\n </div>\n </div>\n );\n};\n\nconst SelectIcon = props => {\n const {faIcon, 'data-name': dataName, 'aria-label': ariaLabel, onClick, options = {}} = props;\n\n // const {isSelected = false} = options;\n\n const contentView = getButtonContent(faIcon, options);\n // const styleButton = classnames(style.defaultStyle, isSelected && style.selected);\n const handleOnClick = useCallback(() => onClick(), [onClick]);\n\n const IconButton = useCallback(\n () => (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n data-name={dataName}\n data-testid={`button-${dataName}`}\n // className={styleButton}\n onClick={handleOnClick}\n >\n {contentView}\n </button>\n ),\n [ariaLabel, contentView, dataName, handleOnClick]\n );\n\n return <IconButton />;\n};\n\nSelectIcon.propTypes = {\n 'aria-label': PropTypes.string,\n 'data-name': PropTypes.string,\n faIcon: PropTypes.string,\n onClick: PropTypes.func,\n options: PropTypes.shape({\n selectionMode: PropTypes.oneOf(['single', 'multi']),\n isSelected: PropTypes.bool,\n iconColor: PropTypes.string\n })\n};\n\nexport default SelectIcon;\n"],"mappings":";;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,KAAA,GAAAD,sBAAA,CAAAF,OAAA;AAEA,IAAAI,OAAA,GAAAJ,OAAA;AAEA,IAAAK,MAAA,GAAAH,sBAAA,CAAAF,OAAA;AAAgC,SAAAE,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,yBAAAH,CAAA,6BAAAI,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAD,wBAAA,YAAAA,CAAAH,CAAA,WAAAA,CAAA,GAAAM,CAAA,GAAAD,CAAA,KAAAL,CAAA;AAAA,SAAAP,wBAAAO,CAAA,EAAAK,CAAA,SAAAA,CAAA,IAAAL,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAE,OAAA,EAAAF,CAAA,QAAAM,CAAA,GAAAH,wBAAA,CAAAE,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAP,CAAA,UAAAM,CAAA,CAAAE,GAAA,CAAAR,CAAA,OAAAS,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAf,CAAA,oBAAAe,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAe,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAd,CAAA,EAAAe,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAf,CAAA,CAAAe,CAAA,YAAAN,CAAA,CAAAP,OAAA,GAAAF,CAAA,EAAAM,CAAA,IAAAA,CAAA,CAAAa,GAAA,CAAAnB,CAAA,EAAAS,CAAA,GAAAA,CAAA;AALhC;;AAIA;;AAGA,MAAMW,UAAU,GAAGC,cAAM,CAACC,eAAe;AACzC;AACA;AACA;AACA;AACA;;AAEA,MAAMC,gBAAgB,GAAGA,CAACC,MAAM,EAAEC,OAAO,GAAG,CAAC,CAAC,KAAK;EACjD,MAAM;IACJ;IACAC,UAAU,GAAG,KAAK;IAClBC,SAAS,GAAGP;EACd,CAAC,GAAGK,OAAO;EAEX,oBACEjC,MAAA,CAAAU,OAAA,CAAA0B,aAAA;IAAKC,SAAS,EAAEC,cAAK,CAACC;EAAe,gBAYnCvC,MAAA,CAAAU,OAAA,CAAA0B,aAAA;IAAKC,SAAS,EAAEC,cAAK,CAACE;EAAY,gBAChCxC,MAAA,CAAAU,OAAA,CAAA0B,aAAA;IAAKC,SAAS,EAAEC,cAAK,CAACG;EAAK,gBACzBzC,MAAA,CAAAU,OAAA,CAAA0B,aAAA,CAAC/B,KAAA,CAAAK,OAAM;IACLgC,QAAQ,EAAEV,MAAO;IACjBG,SAAS,EAAED,UAAU,GAAGC,SAAS,GAAG,EAAG;IACvCQ,IAAI,EAAE;MAACC,MAAM,EAAE,EAAE;MAAEC,WAAW,EAAE;IAAE;EAAE,CACrC,CACE,CAAC,eACN7C,MAAA,CAAAU,OAAA,CAAA0B,aAAA;IAAKC,SAAS,EAAEC,cAAK,CAACQ;EAAS,GAAEd,MAAY,CAC1C,CACF,CAAC;AAEV,CAAC;AAED,MAAMe,UAAU,GAAGC,KAAK,IAAI;EAC1B,MAAM;IAAChB,MAAM;IAAE,WAAW,EAAEiB,QAAQ;IAAE,YAAY,EAAEC,SAAS;IAAEC,OAAO;IAAElB,OAAO,GAAG,CAAC;EAAC,CAAC,GAAGe,KAAK;;EAE7F;;EAEA,MAAMI,WAAW,GAAGrB,gBAAgB,CAACC,MAAM,EAAEC,OAAO,CAAC;EACrD;EACA,MAAMoB,aAAa,GAAG,IAAAC,kBAAW,EAAC,MAAMH,OAAO,CAAC,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAE7D,MAAMI,UAAU,GAAG,IAAAD,kBAAW,EAC5B,mBACEtD,MAAA,CAAAU,OAAA,CAAA0B,aAAA;IACEoB,IAAI,EAAC,QAAQ;IACb,cAAYN,SAAU;IACtB,aAAWD,QAAS;IACpB,eAAa,UAAUA,QAAQ;IAC/B;IAAA;IACAE,OAAO,EAAEE;EAAc,GAEtBD,WACK,CACT,EACD,CAACF,SAAS,EAAEE,WAAW,EAAEH,QAAQ,EAAEI,aAAa,CAClD,CAAC;EAED,oBAAOrD,MAAA,CAAAU,OAAA,CAAA0B,aAAA,CAACmB,UAAU,MAAE,CAAC;AACvB,CAAC;AAEDR,UAAU,CAACU,SAAS,GAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAAG;EACrB,YAAY,EAAEC,kBAAS,CAACC,MAAM;EAC9B,WAAW,EAAED,kBAAS,CAACC,MAAM;EAC7B9B,MAAM,EAAE6B,kBAAS,CAACC,MAAM;EACxBX,OAAO,EAAEU,kBAAS,CAACE,IAAI;EACvB9B,OAAO,EAAE4B,kBAAS,CAACG,KAAK,CAAC;IACvBC,aAAa,EAAEJ,kBAAS,CAACK,KAAK,CAAC,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACnDhC,UAAU,EAAE2B,kBAAS,CAACM,IAAI;IAC1BhC,SAAS,EAAE0B,kBAAS,CAACC;EACvB,CAAC;AACH,CAAC;AAAC,IAAAM,QAAA,GAAAC,OAAA,CAAA3D,OAAA,GAEaqC,UAAU","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAwIC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAsIC"}
@@ -65,7 +65,6 @@ const IconPickerModal = (props, context) => {
65
65
  setCurrentIndex(ICONS_PER_LOAD);
66
66
  }, [searchResults]);
67
67
  const handleScroll = (0, _react.useCallback)(event => {
68
- console.log('in handleScroll --->', event.currentTarget);
69
68
  const {
70
69
  scrollTop,
71
70
  clientHeight,
@@ -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","currentIndex","setCurrentIndex","searchValue","searchResults","handleSearch","handleReset","useIconSearch","handleCancel","useCallback","handleClose","handleIconClick","iconName","console","log","prevSelectedIcon","loadMoreIcons","nextIndex","newIcons","prevIcons","useEffect","handleScroll","event","currentTarget","scrollTop","clientHeight","scrollHeight","icons","_entries2","index","createElement","key","size","faIcon","onClick","options","isSelected","footer","cancelButton","label","confirmButton","disabled","color","COLORS","cm_primary_blue","title","description","onScroll","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(null);\n const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n const [currentIndex, setCurrentIndex] = useState(ICONS_PER_LOAD);\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 => () => {\n console.log('in handleIconClick');\n setSelectedIcon(prevSelectedIcon => (prevSelectedIcon === iconName ? null : iconName));\n },\n []\n );\n\n const loadMoreIcons = useCallback(() => {\n const nextIndex = currentIndex + ICONS_PER_LOAD;\n const newIcons = slice(currentIndex, nextIndex, searchResults);\n setDisplayedIcons(prevIcons => [...prevIcons, ...newIcons]);\n setCurrentIndex(nextIndex);\n }, [currentIndex, searchResults]);\n\n useEffect(() => {\n setDisplayedIcons(() => slice(0, ICONS_PER_LOAD, searchResults));\n setCurrentIndex(ICONS_PER_LOAD);\n }, [searchResults]);\n\n const handleScroll = useCallback(\n event => {\n console.log('in handleScroll --->', event.currentTarget);\n\n const {scrollTop, clientHeight, scrollHeight} = event.currentTarget;\n if (scrollHeight - scrollTop <= clientHeight + 1) {\n loadMoreIcons();\n }\n },\n [loadMoreIcons]\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => (\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 )(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 onScroll={handleScroll}\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","displayedIcons","setDisplayedIcons","_slice2","currentIndex","setCurrentIndex","searchValue","searchResults","handleSearch","handleReset","useIconSearch","handleCancel","useCallback","handleClose","handleIconClick","iconName","console","log","prevSelectedIcon","loadMoreIcons","nextIndex","newIcons","prevIcons","useEffect","handleScroll","event","scrollTop","clientHeight","scrollHeight","currentTarget","icons","_entries2","index","createElement","key","size","faIcon","onClick","options","isSelected","footer","cancelButton","label","confirmButton","disabled","color","COLORS","cm_primary_blue","title","description","onScroll","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(null);\n const [displayedIcons, setDisplayedIcons] = useState(slice(0, ICONS_PER_LOAD, allIcons));\n const [currentIndex, setCurrentIndex] = useState(ICONS_PER_LOAD);\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 => () => {\n console.log('in handleIconClick');\n setSelectedIcon(prevSelectedIcon => (prevSelectedIcon === iconName ? null : iconName));\n },\n []\n );\n\n const loadMoreIcons = useCallback(() => {\n const nextIndex = currentIndex + ICONS_PER_LOAD;\n const newIcons = slice(currentIndex, nextIndex, searchResults);\n setDisplayedIcons(prevIcons => [...prevIcons, ...newIcons]);\n setCurrentIndex(nextIndex);\n }, [currentIndex, searchResults]);\n\n useEffect(() => {\n setDisplayedIcons(() => slice(0, ICONS_PER_LOAD, searchResults));\n setCurrentIndex(ICONS_PER_LOAD);\n }, [searchResults]);\n\n const handleScroll = useCallback(\n event => {\n const {scrollTop, clientHeight, scrollHeight} = event.currentTarget;\n if (scrollHeight - scrollTop <= clientHeight + 1) {\n loadMoreIcons();\n }\n },\n [loadMoreIcons]\n );\n\n const icons = useMemo(\n () =>\n pipe(\n entries,\n map(([index, iconName]) => (\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 )(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 onScroll={handleScroll}\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.6+24eb5a9b7",
3
+ "version": "11.40.1-alpha.8+2972711a0",
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": "24eb5a9b787179a5c00a20ce581c331db13840fa"
169
+ "gitHead": "2972711a033d90839163376dbce1b5cefea1b0da"
170
170
  }