@coorpacademy/components 11.40.1-alpha.11 → 11.40.1-alpha.13

package/es/molecule/base-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AAUA,yEA8LC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AAWA,yEAyLC"}

package/es/molecule/base-modal/index.js

@@ -1,14 +1,14 @@
-import _debounce from "lodash/fp/debounce";
 import _get from "lodash/fp/get";
 import _isEmpty from "lodash/fp/isEmpty";
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
 import { convert } from 'css-color-function';
 import Provider from '../../atom/provider';
 import Icon from '../../atom/icon';
 import ButtonLink from '../../atom/button-link';
 import { COLORS } from '../../variables/colors';
+// eslint-disable-next-line css-modules/no-unused-class
 import style from './style.css';
 const BaseModal = (props, context) => {
   const {
@@ -27,44 +27,49 @@ const BaseModal = (props, context) => {
     skin
   } = context;
   const bodyRef = useRef(null);
-  const [isScrollbarVisible, setIsScrollbarVisible] = useState(!detectScrollbar);
-  const checkScrollbar = () => {
-    const bodyElement = bodyRef.current;
-    if (bodyElement) {
-      setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);
-    }
-  };
-  useEffect(() => {
-    if (!detectScrollbar) return;
-    const bodyElement = bodyRef.current;
-    if (!bodyElement) return;
-    const debouncedCheckScrollbar = _debounce(100, () => {
-      checkScrollbar();
-    });
+  // const [isScrollbarVisible, setIsScrollbarVisible] = useState(!detectScrollbar);
 
-    // Observer of the body content
-    const mutationObserver = new MutationObserver(() => {
-      debouncedCheckScrollbar();
-    });
-    mutationObserver.observe(bodyElement, {
-      childList: true,
-      subtree: true
-    });
+  // const checkScrollbar = () => {
+  //   const bodyElement = bodyRef.current;
+  //   if (bodyElement) {
+  //     setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);
+  //   }
+  // };
 
-    // Observer of the body size
-    const resizeObserver = new ResizeObserver(() => {
-      debouncedCheckScrollbar();
-    });
-    if (bodyRef.current) {
-      resizeObserver.observe(bodyRef.current);
-    }
-    checkScrollbar();
-    return () => {
-      mutationObserver.disconnect();
-      resizeObserver.disconnect();
-      debouncedCheckScrollbar.cancel();
-    };
-  }, [children, detectScrollbar]);
+  // useEffect(() => {
+  //   if (!detectScrollbar) return;
+  //   const bodyElement = bodyRef.current;
+
+  //   if (!bodyElement) return;
+
+  //   const debouncedCheckScrollbar = debounce(100, () => {
+  //     checkScrollbar();
+  //   });
+
+  //   // Observer of the body content
+  //   const mutationObserver = new MutationObserver(() => {
+  //     debouncedCheckScrollbar();
+  //   });
+
+  //   mutationObserver.observe(bodyElement, {childList: true, subtree: true});
+
+  //   // Observer of the body size
+  //   const resizeObserver = new ResizeObserver(() => {
+  //     debouncedCheckScrollbar();
+  //   });
+
+  //   if (bodyRef.current) {
+  //     resizeObserver.observe(bodyRef.current);
+  //   }
+
+  //   checkScrollbar();
+
+  //   return () => {
+  //     mutationObserver.disconnect();
+  //     resizeObserver.disconnect();
+  //     debouncedCheckScrollbar.cancel();
+  //   };
+  // }, [children, detectScrollbar]);
 
   // Handle escape key press
   useEffect(() => {
@@ -184,8 +189,7 @@ const BaseModal = (props, context) => {
     }
   }))), /*#__PURE__*/React.createElement("div", {
     ref: bodyRef,
-    className: isScrollbarVisible ? style.body : style.bodyWithoutScrollbar,
-    onScroll: onScroll,
+    className: style.body,
     "data-testid": "modal-body"
   }, children), /*#__PURE__*/React.createElement(Footer, null)));
 };

package/es/molecule/base-modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useEffect","useRef","useState","PropTypes","convert","Provider","Icon","ButtonLink","COLORS","style","BaseModal","props","context","title","description","headerIcon","children","isOpen","footer","onClose","onScroll","detectScrollbar","customStyle","skin","bodyRef","isScrollbarVisible","setIsScrollbarVisible","checkScrollbar","bodyElement","current","scrollHeight","clientHeight","debouncedCheckScrollbar","_debounce","mutationObserver","MutationObserver","observe","childList","subtree","resizeObserver","ResizeObserver","disconnect","cancel","handleEscape","event","key","document","addEventListener","removeEventListener","Footer","_isEmpty","cancelButton","confirmButton","text","isError","label","cancelLabel","onCancel","disabled","cancelDisabled","confirmLabel","onConfirm","confirmDisabled","iconName","color","buttonConfirmColor","_get","createElement","className","footerCTAWrapper","button","type","onClick","_extends","backgroundColor","paddingLeft","hoverBackgroundColor","hoverColor","white","icon","position","faIcon","name","size","padding","footerDescription","footerDescriptionError","handleOnClose","e","stopPropagation","modalWrapper","modal","header","iconColor","faSize","wrapperSize","headerContent","headerTitle","headerDescription","headerCloseIcon","ref","body","bodyWithoutScrollbar","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","string","shape","node","bool","oneOfType","func","boolean","objectOf","number"],"sources":["../../../src/molecule/base-modal/index.js"],"sourcesContent":["import React, {useCallback, useEffect, useRef, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, get, debounce} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\n\nconst BaseModal = (props, context) => {\n  const {\n    title,\n    description,\n    headerIcon,\n    children,\n    isOpen,\n    footer,\n    onClose,\n    onScroll,\n    detectScrollbar = false,\n    customStyle\n  } = props;\n  const {skin} = context;\n  const bodyRef = useRef(null);\n  const [isScrollbarVisible, setIsScrollbarVisible] = useState(!detectScrollbar);\n\n  const checkScrollbar = () => {\n    const bodyElement = bodyRef.current;\n    if (bodyElement) {\n      setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);\n    }\n  };\n\n  useEffect(() => {\n    if (!detectScrollbar) return;\n    const bodyElement = bodyRef.current;\n\n    if (!bodyElement) return;\n\n    const debouncedCheckScrollbar = debounce(100, () => {\n      checkScrollbar();\n    });\n\n    // Observer of the body content\n    const mutationObserver = new MutationObserver(() => {\n      debouncedCheckScrollbar();\n    });\n\n    mutationObserver.observe(bodyElement, {childList: true, subtree: true});\n\n    // Observer of the body size\n    const resizeObserver = new ResizeObserver(() => {\n      debouncedCheckScrollbar();\n    });\n\n    if (bodyRef.current) {\n      resizeObserver.observe(bodyRef.current);\n    }\n\n    checkScrollbar();\n\n    return () => {\n      mutationObserver.disconnect();\n      resizeObserver.disconnect();\n      debouncedCheckScrollbar.cancel();\n    };\n  }, [children, detectScrollbar]);\n\n  // Handle escape key press\n  useEffect(() => {\n    if (!isOpen || !onClose) return;\n\n    const handleEscape = event => {\n      if (event.key === 'Escape') {\n        onClose();\n      }\n    };\n\n    document.addEventListener('keydown', handleEscape);\n    return () => {\n      document.removeEventListener('keydown', handleEscape);\n    };\n  }, [isOpen, onClose]);\n\n  const Footer = useCallback(() => {\n    if (isEmpty(footer)) return null;\n    if (typeof footer === 'function') return footer();\n\n    const {cancelButton, confirmButton, text, isError} = footer;\n    const {label: cancelLabel, onCancel, disabled: cancelDisabled} = cancelButton || {};\n    const {\n      label: confirmLabel,\n      onConfirm,\n      disabled: confirmDisabled,\n      iconName,\n      color\n    } = confirmButton || {};\n    const buttonConfirmColor = color || get('common.primary', skin);\n\n    return (\n      <div className={style.footer}>\n        <div className={style.footerCTAWrapper}>\n          {onCancel && cancelLabel ? (\n            <ButtonLink\n              {...{\n                className: style.button,\n                type: 'secondary',\n                onClick: onCancel,\n                label: cancelLabel,\n                disabled: cancelDisabled,\n                'data-testid': `button-link-${cancelLabel}`\n              }}\n            />\n          ) : null}\n          {onConfirm && confirmLabel ? (\n            <div>\n              <ButtonLink\n                {...{\n                  customStyle: {backgroundColor: buttonConfirmColor, paddingLeft: '16px'},\n                  hoverBackgroundColor: convert(\n                    `hsl(from ${buttonConfirmColor} h s calc(l*(1 - 0.08)))`\n                  ),\n                  hoverColor: COLORS.white,\n                  className: style.button,\n                  type: 'primary',\n                  onClick: onConfirm,\n                  label: confirmLabel,\n                  disabled: confirmDisabled,\n                  ...(iconName\n                    ? {\n                        icon: {\n                          position: 'left',\n                          faIcon: {\n                            name: iconName,\n                            color: COLORS.white,\n                            size: 14,\n                            customStyle: {padding: 0}\n                          }\n                        }\n                      }\n                    : {}),\n                  'data-testid': `button-link-${confirmLabel}`\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n        {text ? (\n          <div\n            className={`${style.footerDescription} ${isError ? style.footerDescriptionError : ''}`}\n          >\n            {text}\n          </div>\n        ) : null}\n      </div>\n    );\n  }, [footer, skin]);\n\n  if (!isOpen || !title || !children) return null;\n\n  function handleOnClose(e) {\n    e?.stopPropagation();\n    onClose();\n  }\n\n  return (\n    <div className={style.modalWrapper} data-testid=\"modal\">\n      <div className={style.modal} style={customStyle}>\n        <header className={style.header}>\n          {headerIcon?.name ? (\n            <div className={style.headerIcon}>\n              <Icon\n                iconName={headerIcon.name}\n                iconColor={headerIcon.color}\n                backgroundColor={headerIcon.backgroundColor}\n                size={{faSize: 20, wrapperSize: 48}}\n              />\n            </div>\n          ) : null}\n          <div className={style.headerContent}>\n            <div className={style.headerTitle}>{title}</div>\n            {description ? <div className={style.headerDescription}>{description}</div> : null}\n          </div>\n          <div className={style.headerCloseIcon} onClick={handleOnClose} data-testid=\"close-icon\">\n            <Icon iconName=\"close\" backgroundColor=\"#F4F4F5\" size={{faSize: 14, wrapperSize: 28}} />\n          </div>\n        </header>\n        <div\n          ref={bodyRef}\n          className={isScrollbarVisible ? style.body : style.bodyWithoutScrollbar}\n          onScroll={onScroll}\n          data-testid=\"modal-body\"\n        >\n          {children}\n        </div>\n        <Footer />\n      </div>\n    </div>\n  );\n};\n\nBaseModal.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBaseModal.propTypes = {\n  title: PropTypes.string,\n  headerIcon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string,\n    backgroundColor: PropTypes.string\n  }),\n  description: PropTypes.string,\n  children: PropTypes.node,\n  isOpen: PropTypes.bool,\n  footer: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.shape({\n      text: PropTypes.string,\n      isError: PropTypes.boolean,\n      cancelButton: PropTypes.shape({\n        label: PropTypes.string,\n        onCancel: PropTypes.func,\n        disabled: PropTypes.bool\n      }),\n      confirmButton: PropTypes.shape({\n        label: PropTypes.string,\n        onConfirm: PropTypes.func,\n        iconName: PropTypes.string,\n        disabled: PropTypes.bool,\n        color: PropTypes.string\n      })\n    })\n  ]),\n  onClose: PropTypes.func,\n  onScroll: PropTypes.func,\n  detectScrollbar: PropTypes.bool,\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default BaseModal;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useCallback","useEffect","useRef","PropTypes","convert","Provider","Icon","ButtonLink","COLORS","style","BaseModal","props","context","title","description","headerIcon","children","isOpen","footer","onClose","onScroll","detectScrollbar","customStyle","skin","bodyRef","handleEscape","event","key","document","addEventListener","removeEventListener","Footer","_isEmpty","cancelButton","confirmButton","text","isError","label","cancelLabel","onCancel","disabled","cancelDisabled","confirmLabel","onConfirm","confirmDisabled","iconName","color","buttonConfirmColor","_get","createElement","className","footerCTAWrapper","button","type","onClick","_extends","backgroundColor","paddingLeft","hoverBackgroundColor","hoverColor","white","icon","position","faIcon","name","size","padding","footerDescription","footerDescriptionError","handleOnClose","e","stopPropagation","modalWrapper","modal","header","iconColor","faSize","wrapperSize","headerContent","headerTitle","headerDescription","headerCloseIcon","ref","body","contextTypes","childContextTypes","propTypes","process","env","NODE_ENV","string","shape","node","bool","oneOfType","func","boolean","objectOf","number"],"sources":["../../../src/molecule/base-modal/index.js"],"sourcesContent":["import React, {useCallback, useEffect, useRef} from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, get} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport {COLORS} from '../../variables/colors';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst BaseModal = (props, context) => {\n  const {\n    title,\n    description,\n    headerIcon,\n    children,\n    isOpen,\n    footer,\n    onClose,\n    onScroll,\n    detectScrollbar = false,\n    customStyle\n  } = props;\n  const {skin} = context;\n  const bodyRef = useRef(null);\n  // const [isScrollbarVisible, setIsScrollbarVisible] = useState(!detectScrollbar);\n\n  // const checkScrollbar = () => {\n  //   const bodyElement = bodyRef.current;\n  //   if (bodyElement) {\n  //     setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);\n  //   }\n  // };\n\n  // useEffect(() => {\n  //   if (!detectScrollbar) return;\n  //   const bodyElement = bodyRef.current;\n\n  //   if (!bodyElement) return;\n\n  //   const debouncedCheckScrollbar = debounce(100, () => {\n  //     checkScrollbar();\n  //   });\n\n  //   // Observer of the body content\n  //   const mutationObserver = new MutationObserver(() => {\n  //     debouncedCheckScrollbar();\n  //   });\n\n  //   mutationObserver.observe(bodyElement, {childList: true, subtree: true});\n\n  //   // Observer of the body size\n  //   const resizeObserver = new ResizeObserver(() => {\n  //     debouncedCheckScrollbar();\n  //   });\n\n  //   if (bodyRef.current) {\n  //     resizeObserver.observe(bodyRef.current);\n  //   }\n\n  //   checkScrollbar();\n\n  //   return () => {\n  //     mutationObserver.disconnect();\n  //     resizeObserver.disconnect();\n  //     debouncedCheckScrollbar.cancel();\n  //   };\n  // }, [children, detectScrollbar]);\n\n  // Handle escape key press\n  useEffect(() => {\n    if (!isOpen || !onClose) return;\n\n    const handleEscape = event => {\n      if (event.key === 'Escape') {\n        onClose();\n      }\n    };\n\n    document.addEventListener('keydown', handleEscape);\n    return () => {\n      document.removeEventListener('keydown', handleEscape);\n    };\n  }, [isOpen, onClose]);\n\n  const Footer = useCallback(() => {\n    if (isEmpty(footer)) return null;\n    if (typeof footer === 'function') return footer();\n\n    const {cancelButton, confirmButton, text, isError} = footer;\n    const {label: cancelLabel, onCancel, disabled: cancelDisabled} = cancelButton || {};\n    const {\n      label: confirmLabel,\n      onConfirm,\n      disabled: confirmDisabled,\n      iconName,\n      color\n    } = confirmButton || {};\n    const buttonConfirmColor = color || get('common.primary', skin);\n\n    return (\n      <div className={style.footer}>\n        <div className={style.footerCTAWrapper}>\n          {onCancel && cancelLabel ? (\n            <ButtonLink\n              {...{\n                className: style.button,\n                type: 'secondary',\n                onClick: onCancel,\n                label: cancelLabel,\n                disabled: cancelDisabled,\n                'data-testid': `button-link-${cancelLabel}`\n              }}\n            />\n          ) : null}\n          {onConfirm && confirmLabel ? (\n            <div>\n              <ButtonLink\n                {...{\n                  customStyle: {backgroundColor: buttonConfirmColor, paddingLeft: '16px'},\n                  hoverBackgroundColor: convert(\n                    `hsl(from ${buttonConfirmColor} h s calc(l*(1 - 0.08)))`\n                  ),\n                  hoverColor: COLORS.white,\n                  className: style.button,\n                  type: 'primary',\n                  onClick: onConfirm,\n                  label: confirmLabel,\n                  disabled: confirmDisabled,\n                  ...(iconName\n                    ? {\n                        icon: {\n                          position: 'left',\n                          faIcon: {\n                            name: iconName,\n                            color: COLORS.white,\n                            size: 14,\n                            customStyle: {padding: 0}\n                          }\n                        }\n                      }\n                    : {}),\n                  'data-testid': `button-link-${confirmLabel}`\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n        {text ? (\n          <div\n            className={`${style.footerDescription} ${isError ? style.footerDescriptionError : ''}`}\n          >\n            {text}\n          </div>\n        ) : null}\n      </div>\n    );\n  }, [footer, skin]);\n\n  if (!isOpen || !title || !children) return null;\n\n  function handleOnClose(e) {\n    e?.stopPropagation();\n    onClose();\n  }\n\n  return (\n    <div className={style.modalWrapper} data-testid=\"modal\">\n      <div className={style.modal} style={customStyle}>\n        <header className={style.header}>\n          {headerIcon?.name ? (\n            <div className={style.headerIcon}>\n              <Icon\n                iconName={headerIcon.name}\n                iconColor={headerIcon.color}\n                backgroundColor={headerIcon.backgroundColor}\n                size={{faSize: 20, wrapperSize: 48}}\n              />\n            </div>\n          ) : null}\n          <div className={style.headerContent}>\n            <div className={style.headerTitle}>{title}</div>\n            {description ? <div className={style.headerDescription}>{description}</div> : null}\n          </div>\n          <div className={style.headerCloseIcon} onClick={handleOnClose} data-testid=\"close-icon\">\n            <Icon iconName=\"close\" backgroundColor=\"#F4F4F5\" size={{faSize: 14, wrapperSize: 28}} />\n          </div>\n        </header>\n        <div ref={bodyRef} className={style.body} data-testid=\"modal-body\">\n          {children}\n        </div>\n        <Footer />\n      </div>\n    </div>\n  );\n};\n\nBaseModal.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBaseModal.propTypes = {\n  title: PropTypes.string,\n  headerIcon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string,\n    backgroundColor: PropTypes.string\n  }),\n  description: PropTypes.string,\n  children: PropTypes.node,\n  isOpen: PropTypes.bool,\n  footer: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.shape({\n      text: PropTypes.string,\n      isError: PropTypes.boolean,\n      cancelButton: PropTypes.shape({\n        label: PropTypes.string,\n        onCancel: PropTypes.func,\n        disabled: PropTypes.bool\n      }),\n      confirmButton: PropTypes.shape({\n        label: PropTypes.string,\n        onConfirm: PropTypes.func,\n        iconName: PropTypes.string,\n        disabled: PropTypes.bool,\n        color: PropTypes.string\n      })\n    })\n  ]),\n  onClose: PropTypes.func,\n  onScroll: PropTypes.func,\n  detectScrollbar: PropTypes.bool,\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default BaseModal;\n"],"mappings":"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","ignoreList":[]}

package/es/molecule/icon-picker-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAyIC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAqHC"}

package/es/molecule/icon-picker-modal/index.js

@@ -30,8 +30,6 @@ const IconPickerModal = (props, context) => {
   const allIcons = useMemo(() => _pipe(_values, _map(_get('iconName')), _uniq)(fas), []);
   const [selectedIcon, setSelectedIcon] = useState(null);
   const [displayedIcons, setDisplayedIcons] = useState(_slice(0, ICONS_PER_LOAD, allIcons));
-  // const [currentIndex, setCurrentIndex] = useState(ICONS_PER_LOAD);
-
   const {
     searchValue,
     searchResults,
@@ -46,31 +44,11 @@ const IconPickerModal = (props, context) => {
   }, [onClose]);
   const handleIconClick = useCallback(iconName => () => {
     console.log('in handleIconClick ----->');
-    setSelectedIcon(prevSelectedIcon => prevSelectedIcon === iconName ? null : iconName);
+    setSelectedIcon(prevSelectedIcon => {
+      console.log('TCL ------>  ~ IconPickerModal ~ prevSelectedIcon:', prevSelectedIcon);
+      return prevSelectedIcon === iconName ? null : iconName;
+    });
   }, []);
-
-  // const loadMoreIcons = useCallback(() => {
-  //   const nextIndex = currentIndex + ICONS_PER_LOAD;
-  //   const newIcons = slice(currentIndex, nextIndex, searchResults);
-  //   setDisplayedIcons(prevIcons => [...prevIcons, ...newIcons]);
-  //   setCurrentIndex(nextIndex);
-  // }, [currentIndex, searchResults]);
-
-  // useEffect(() => {
-  // setDisplayedIcons(() => slice(0, ICONS_PER_LOAD, searchResults));
-  // setCurrentIndex(ICONS_PER_LOAD);
-  // }, [searchResults]);
-
-  // const handleScroll = useCallback(
-  //   event => {
-  //     const {scrollTop, clientHeight, scrollHeight} = event.currentTarget;
-  //     if (scrollHeight - scrollTop <= clientHeight + 1) {
-  //       loadMoreIcons();
-  //     }
-  //   },
-  //   [loadMoreIcons]
-  // );
-
   const icons = useMemo(() => _pipe(_entries, _map(([index, iconName]) => {
     console.log('in icons ---->');
     return /*#__PURE__*/React.createElement(SelectIcon, {
@@ -109,9 +87,7 @@ const IconPickerModal = (props, context) => {
     title: translate('icon_picker_title'),
     description: translate('icon_picker_description'),
     isOpen: isOpen,
-    onClose: handleClose
-    // onScroll={handleScroll}
-    ,
+    onClose: handleClose,
     footer: footer,
     headerIcon: {
       name: 'arrows-rotate',

package/es/molecule/icon-picker-modal/index.js.map

@@ -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","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, 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          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      // 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":[]}
+{"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","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 => () => {\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":[]}

package/lib/molecule/base-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AAUA,yEA8LC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/base-modal/index.js"],"names":[],"mappings":";AAWA,yEAyLC"}

package/lib/molecule/base-modal/index.js

@@ -2,7 +2,6 @@
 
 exports.__esModule = true;
 exports.default = void 0;
-var _debounce2 = _interopRequireDefault(require("lodash/fp/debounce"));
 var _get2 = _interopRequireDefault(require("lodash/fp/get"));
 var _isEmpty2 = _interopRequireDefault(require("lodash/fp/isEmpty"));
 var _react = _interopRequireWildcard(require("react"));
@@ -16,7 +15,7 @@ var _style = _interopRequireDefault(require("./style.css"));
 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); }
 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; }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } // eslint-disable-next-line css-modules/no-unused-class
 const BaseModal = (props, context) => {
   const {
     title,
@@ -34,44 +33,49 @@ const BaseModal = (props, context) => {
     skin
   } = context;
   const bodyRef = (0, _react.useRef)(null);
-  const [isScrollbarVisible, setIsScrollbarVisible] = (0, _react.useState)(!detectScrollbar);
-  const checkScrollbar = () => {
-    const bodyElement = bodyRef.current;
-    if (bodyElement) {
-      setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);
-    }
-  };
-  (0, _react.useEffect)(() => {
-    if (!detectScrollbar) return;
-    const bodyElement = bodyRef.current;
-    if (!bodyElement) return;
-    const debouncedCheckScrollbar = (0, _debounce2.default)(100, () => {
-      checkScrollbar();
-    });
+  // const [isScrollbarVisible, setIsScrollbarVisible] = useState(!detectScrollbar);
 
-    // Observer of the body content
-    const mutationObserver = new MutationObserver(() => {
-      debouncedCheckScrollbar();
-    });
-    mutationObserver.observe(bodyElement, {
-      childList: true,
-      subtree: true
-    });
+  // const checkScrollbar = () => {
+  //   const bodyElement = bodyRef.current;
+  //   if (bodyElement) {
+  //     setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);
+  //   }
+  // };
 
-    // Observer of the body size
-    const resizeObserver = new ResizeObserver(() => {
-      debouncedCheckScrollbar();
-    });
-    if (bodyRef.current) {
-      resizeObserver.observe(bodyRef.current);
-    }
-    checkScrollbar();
-    return () => {
-      mutationObserver.disconnect();
-      resizeObserver.disconnect();
-      debouncedCheckScrollbar.cancel();
-    };
-  }, [children, detectScrollbar]);
+  // useEffect(() => {
+  //   if (!detectScrollbar) return;
+  //   const bodyElement = bodyRef.current;
+
+  //   if (!bodyElement) return;
+
+  //   const debouncedCheckScrollbar = debounce(100, () => {
+  //     checkScrollbar();
+  //   });
+
+  //   // Observer of the body content
+  //   const mutationObserver = new MutationObserver(() => {
+  //     debouncedCheckScrollbar();
+  //   });
+
+  //   mutationObserver.observe(bodyElement, {childList: true, subtree: true});
+
+  //   // Observer of the body size
+  //   const resizeObserver = new ResizeObserver(() => {
+  //     debouncedCheckScrollbar();
+  //   });
+
+  //   if (bodyRef.current) {
+  //     resizeObserver.observe(bodyRef.current);
+  //   }
+
+  //   checkScrollbar();
+
+  //   return () => {
+  //     mutationObserver.disconnect();
+  //     resizeObserver.disconnect();
+  //     debouncedCheckScrollbar.cancel();
+  //   };
+  // }, [children, detectScrollbar]);
 
   // Handle escape key press
   (0, _react.useEffect)(() => {
@@ -191,8 +195,7 @@ const BaseModal = (props, context) => {
     }
   }))), /*#__PURE__*/_react.default.createElement("div", {
     ref: bodyRef,
-    className: isScrollbarVisible ? _style.default.body : _style.default.bodyWithoutScrollbar,
-    onScroll: onScroll,
+    className: _style.default.body,
     "data-testid": "modal-body"
   }, children), /*#__PURE__*/_react.default.createElement(Footer, null)));
 };

package/lib/molecule/base-modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_cssColorFunction","_provider","_icon","_buttonLink","_colors","_style","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","BaseModal","props","context","title","description","headerIcon","children","isOpen","footer","onClose","onScroll","detectScrollbar","customStyle","skin","bodyRef","useRef","isScrollbarVisible","setIsScrollbarVisible","useState","checkScrollbar","bodyElement","current","scrollHeight","clientHeight","useEffect","debouncedCheckScrollbar","_debounce2","mutationObserver","MutationObserver","observe","childList","subtree","resizeObserver","ResizeObserver","disconnect","cancel","handleEscape","event","key","document","addEventListener","removeEventListener","Footer","useCallback","_isEmpty2","cancelButton","confirmButton","text","isError","label","cancelLabel","onCancel","disabled","cancelDisabled","confirmLabel","onConfirm","confirmDisabled","iconName","color","buttonConfirmColor","_get2","createElement","className","style","footerCTAWrapper","button","type","onClick","backgroundColor","paddingLeft","hoverBackgroundColor","convert","hoverColor","COLORS","white","icon","position","faIcon","name","size","padding","footerDescription","footerDescriptionError","handleOnClose","stopPropagation","modalWrapper","modal","header","iconColor","faSize","wrapperSize","headerContent","headerTitle","headerDescription","headerCloseIcon","ref","body","bodyWithoutScrollbar","contextTypes","Provider","childContextTypes","propTypes","process","env","NODE_ENV","PropTypes","string","shape","node","bool","oneOfType","func","boolean","objectOf","number","_default","exports"],"sources":["../../../src/molecule/base-modal/index.js"],"sourcesContent":["import React, {useCallback, useEffect, useRef, useState} from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, get, debounce} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport {COLORS} from '../../variables/colors';\nimport style from './style.css';\n\nconst BaseModal = (props, context) => {\n  const {\n    title,\n    description,\n    headerIcon,\n    children,\n    isOpen,\n    footer,\n    onClose,\n    onScroll,\n    detectScrollbar = false,\n    customStyle\n  } = props;\n  const {skin} = context;\n  const bodyRef = useRef(null);\n  const [isScrollbarVisible, setIsScrollbarVisible] = useState(!detectScrollbar);\n\n  const checkScrollbar = () => {\n    const bodyElement = bodyRef.current;\n    if (bodyElement) {\n      setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);\n    }\n  };\n\n  useEffect(() => {\n    if (!detectScrollbar) return;\n    const bodyElement = bodyRef.current;\n\n    if (!bodyElement) return;\n\n    const debouncedCheckScrollbar = debounce(100, () => {\n      checkScrollbar();\n    });\n\n    // Observer of the body content\n    const mutationObserver = new MutationObserver(() => {\n      debouncedCheckScrollbar();\n    });\n\n    mutationObserver.observe(bodyElement, {childList: true, subtree: true});\n\n    // Observer of the body size\n    const resizeObserver = new ResizeObserver(() => {\n      debouncedCheckScrollbar();\n    });\n\n    if (bodyRef.current) {\n      resizeObserver.observe(bodyRef.current);\n    }\n\n    checkScrollbar();\n\n    return () => {\n      mutationObserver.disconnect();\n      resizeObserver.disconnect();\n      debouncedCheckScrollbar.cancel();\n    };\n  }, [children, detectScrollbar]);\n\n  // Handle escape key press\n  useEffect(() => {\n    if (!isOpen || !onClose) return;\n\n    const handleEscape = event => {\n      if (event.key === 'Escape') {\n        onClose();\n      }\n    };\n\n    document.addEventListener('keydown', handleEscape);\n    return () => {\n      document.removeEventListener('keydown', handleEscape);\n    };\n  }, [isOpen, onClose]);\n\n  const Footer = useCallback(() => {\n    if (isEmpty(footer)) return null;\n    if (typeof footer === 'function') return footer();\n\n    const {cancelButton, confirmButton, text, isError} = footer;\n    const {label: cancelLabel, onCancel, disabled: cancelDisabled} = cancelButton || {};\n    const {\n      label: confirmLabel,\n      onConfirm,\n      disabled: confirmDisabled,\n      iconName,\n      color\n    } = confirmButton || {};\n    const buttonConfirmColor = color || get('common.primary', skin);\n\n    return (\n      <div className={style.footer}>\n        <div className={style.footerCTAWrapper}>\n          {onCancel && cancelLabel ? (\n            <ButtonLink\n              {...{\n                className: style.button,\n                type: 'secondary',\n                onClick: onCancel,\n                label: cancelLabel,\n                disabled: cancelDisabled,\n                'data-testid': `button-link-${cancelLabel}`\n              }}\n            />\n          ) : null}\n          {onConfirm && confirmLabel ? (\n            <div>\n              <ButtonLink\n                {...{\n                  customStyle: {backgroundColor: buttonConfirmColor, paddingLeft: '16px'},\n                  hoverBackgroundColor: convert(\n                    `hsl(from ${buttonConfirmColor} h s calc(l*(1 - 0.08)))`\n                  ),\n                  hoverColor: COLORS.white,\n                  className: style.button,\n                  type: 'primary',\n                  onClick: onConfirm,\n                  label: confirmLabel,\n                  disabled: confirmDisabled,\n                  ...(iconName\n                    ? {\n                        icon: {\n                          position: 'left',\n                          faIcon: {\n                            name: iconName,\n                            color: COLORS.white,\n                            size: 14,\n                            customStyle: {padding: 0}\n                          }\n                        }\n                      }\n                    : {}),\n                  'data-testid': `button-link-${confirmLabel}`\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n        {text ? (\n          <div\n            className={`${style.footerDescription} ${isError ? style.footerDescriptionError : ''}`}\n          >\n            {text}\n          </div>\n        ) : null}\n      </div>\n    );\n  }, [footer, skin]);\n\n  if (!isOpen || !title || !children) return null;\n\n  function handleOnClose(e) {\n    e?.stopPropagation();\n    onClose();\n  }\n\n  return (\n    <div className={style.modalWrapper} data-testid=\"modal\">\n      <div className={style.modal} style={customStyle}>\n        <header className={style.header}>\n          {headerIcon?.name ? (\n            <div className={style.headerIcon}>\n              <Icon\n                iconName={headerIcon.name}\n                iconColor={headerIcon.color}\n                backgroundColor={headerIcon.backgroundColor}\n                size={{faSize: 20, wrapperSize: 48}}\n              />\n            </div>\n          ) : null}\n          <div className={style.headerContent}>\n            <div className={style.headerTitle}>{title}</div>\n            {description ? <div className={style.headerDescription}>{description}</div> : null}\n          </div>\n          <div className={style.headerCloseIcon} onClick={handleOnClose} data-testid=\"close-icon\">\n            <Icon iconName=\"close\" backgroundColor=\"#F4F4F5\" size={{faSize: 14, wrapperSize: 28}} />\n          </div>\n        </header>\n        <div\n          ref={bodyRef}\n          className={isScrollbarVisible ? style.body : style.bodyWithoutScrollbar}\n          onScroll={onScroll}\n          data-testid=\"modal-body\"\n        >\n          {children}\n        </div>\n        <Footer />\n      </div>\n    </div>\n  );\n};\n\nBaseModal.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBaseModal.propTypes = {\n  title: PropTypes.string,\n  headerIcon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string,\n    backgroundColor: PropTypes.string\n  }),\n  description: PropTypes.string,\n  children: PropTypes.node,\n  isOpen: PropTypes.bool,\n  footer: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.shape({\n      text: PropTypes.string,\n      isError: PropTypes.boolean,\n      cancelButton: PropTypes.shape({\n        label: PropTypes.string,\n        onCancel: PropTypes.func,\n        disabled: PropTypes.bool\n      }),\n      confirmButton: PropTypes.shape({\n        label: PropTypes.string,\n        onConfirm: PropTypes.func,\n        iconName: PropTypes.string,\n        disabled: PropTypes.bool,\n        color: PropTypes.string\n      })\n    })\n  ]),\n  onClose: PropTypes.func,\n  onScroll: PropTypes.func,\n  detectScrollbar: PropTypes.bool,\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default BaseModal;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_cssColorFunction","_provider","_icon","_buttonLink","_colors","_style","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","BaseModal","props","context","title","description","headerIcon","children","isOpen","footer","onClose","onScroll","detectScrollbar","customStyle","skin","bodyRef","useRef","useEffect","handleEscape","event","key","document","addEventListener","removeEventListener","Footer","useCallback","_isEmpty2","cancelButton","confirmButton","text","isError","label","cancelLabel","onCancel","disabled","cancelDisabled","confirmLabel","onConfirm","confirmDisabled","iconName","color","buttonConfirmColor","_get2","createElement","className","style","footerCTAWrapper","button","type","onClick","backgroundColor","paddingLeft","hoverBackgroundColor","convert","hoverColor","COLORS","white","icon","position","faIcon","name","size","padding","footerDescription","footerDescriptionError","handleOnClose","stopPropagation","modalWrapper","modal","header","iconColor","faSize","wrapperSize","headerContent","headerTitle","headerDescription","headerCloseIcon","ref","body","contextTypes","Provider","childContextTypes","propTypes","process","env","NODE_ENV","PropTypes","string","shape","node","bool","oneOfType","func","boolean","objectOf","number","_default","exports"],"sources":["../../../src/molecule/base-modal/index.js"],"sourcesContent":["import React, {useCallback, useEffect, useRef} from 'react';\nimport PropTypes from 'prop-types';\nimport {isEmpty, get} from 'lodash/fp';\nimport {convert} from 'css-color-function';\nimport Provider from '../../atom/provider';\nimport Icon from '../../atom/icon';\nimport ButtonLink from '../../atom/button-link';\nimport {COLORS} from '../../variables/colors';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst BaseModal = (props, context) => {\n  const {\n    title,\n    description,\n    headerIcon,\n    children,\n    isOpen,\n    footer,\n    onClose,\n    onScroll,\n    detectScrollbar = false,\n    customStyle\n  } = props;\n  const {skin} = context;\n  const bodyRef = useRef(null);\n  // const [isScrollbarVisible, setIsScrollbarVisible] = useState(!detectScrollbar);\n\n  // const checkScrollbar = () => {\n  //   const bodyElement = bodyRef.current;\n  //   if (bodyElement) {\n  //     setIsScrollbarVisible(bodyElement.scrollHeight > bodyElement.clientHeight);\n  //   }\n  // };\n\n  // useEffect(() => {\n  //   if (!detectScrollbar) return;\n  //   const bodyElement = bodyRef.current;\n\n  //   if (!bodyElement) return;\n\n  //   const debouncedCheckScrollbar = debounce(100, () => {\n  //     checkScrollbar();\n  //   });\n\n  //   // Observer of the body content\n  //   const mutationObserver = new MutationObserver(() => {\n  //     debouncedCheckScrollbar();\n  //   });\n\n  //   mutationObserver.observe(bodyElement, {childList: true, subtree: true});\n\n  //   // Observer of the body size\n  //   const resizeObserver = new ResizeObserver(() => {\n  //     debouncedCheckScrollbar();\n  //   });\n\n  //   if (bodyRef.current) {\n  //     resizeObserver.observe(bodyRef.current);\n  //   }\n\n  //   checkScrollbar();\n\n  //   return () => {\n  //     mutationObserver.disconnect();\n  //     resizeObserver.disconnect();\n  //     debouncedCheckScrollbar.cancel();\n  //   };\n  // }, [children, detectScrollbar]);\n\n  // Handle escape key press\n  useEffect(() => {\n    if (!isOpen || !onClose) return;\n\n    const handleEscape = event => {\n      if (event.key === 'Escape') {\n        onClose();\n      }\n    };\n\n    document.addEventListener('keydown', handleEscape);\n    return () => {\n      document.removeEventListener('keydown', handleEscape);\n    };\n  }, [isOpen, onClose]);\n\n  const Footer = useCallback(() => {\n    if (isEmpty(footer)) return null;\n    if (typeof footer === 'function') return footer();\n\n    const {cancelButton, confirmButton, text, isError} = footer;\n    const {label: cancelLabel, onCancel, disabled: cancelDisabled} = cancelButton || {};\n    const {\n      label: confirmLabel,\n      onConfirm,\n      disabled: confirmDisabled,\n      iconName,\n      color\n    } = confirmButton || {};\n    const buttonConfirmColor = color || get('common.primary', skin);\n\n    return (\n      <div className={style.footer}>\n        <div className={style.footerCTAWrapper}>\n          {onCancel && cancelLabel ? (\n            <ButtonLink\n              {...{\n                className: style.button,\n                type: 'secondary',\n                onClick: onCancel,\n                label: cancelLabel,\n                disabled: cancelDisabled,\n                'data-testid': `button-link-${cancelLabel}`\n              }}\n            />\n          ) : null}\n          {onConfirm && confirmLabel ? (\n            <div>\n              <ButtonLink\n                {...{\n                  customStyle: {backgroundColor: buttonConfirmColor, paddingLeft: '16px'},\n                  hoverBackgroundColor: convert(\n                    `hsl(from ${buttonConfirmColor} h s calc(l*(1 - 0.08)))`\n                  ),\n                  hoverColor: COLORS.white,\n                  className: style.button,\n                  type: 'primary',\n                  onClick: onConfirm,\n                  label: confirmLabel,\n                  disabled: confirmDisabled,\n                  ...(iconName\n                    ? {\n                        icon: {\n                          position: 'left',\n                          faIcon: {\n                            name: iconName,\n                            color: COLORS.white,\n                            size: 14,\n                            customStyle: {padding: 0}\n                          }\n                        }\n                      }\n                    : {}),\n                  'data-testid': `button-link-${confirmLabel}`\n                }}\n              />\n            </div>\n          ) : null}\n        </div>\n        {text ? (\n          <div\n            className={`${style.footerDescription} ${isError ? style.footerDescriptionError : ''}`}\n          >\n            {text}\n          </div>\n        ) : null}\n      </div>\n    );\n  }, [footer, skin]);\n\n  if (!isOpen || !title || !children) return null;\n\n  function handleOnClose(e) {\n    e?.stopPropagation();\n    onClose();\n  }\n\n  return (\n    <div className={style.modalWrapper} data-testid=\"modal\">\n      <div className={style.modal} style={customStyle}>\n        <header className={style.header}>\n          {headerIcon?.name ? (\n            <div className={style.headerIcon}>\n              <Icon\n                iconName={headerIcon.name}\n                iconColor={headerIcon.color}\n                backgroundColor={headerIcon.backgroundColor}\n                size={{faSize: 20, wrapperSize: 48}}\n              />\n            </div>\n          ) : null}\n          <div className={style.headerContent}>\n            <div className={style.headerTitle}>{title}</div>\n            {description ? <div className={style.headerDescription}>{description}</div> : null}\n          </div>\n          <div className={style.headerCloseIcon} onClick={handleOnClose} data-testid=\"close-icon\">\n            <Icon iconName=\"close\" backgroundColor=\"#F4F4F5\" size={{faSize: 14, wrapperSize: 28}} />\n          </div>\n        </header>\n        <div ref={bodyRef} className={style.body} data-testid=\"modal-body\">\n          {children}\n        </div>\n        <Footer />\n      </div>\n    </div>\n  );\n};\n\nBaseModal.contextTypes = {\n  skin: Provider.childContextTypes.skin\n};\n\nBaseModal.propTypes = {\n  title: PropTypes.string,\n  headerIcon: PropTypes.shape({\n    name: PropTypes.string,\n    color: PropTypes.string,\n    backgroundColor: PropTypes.string\n  }),\n  description: PropTypes.string,\n  children: PropTypes.node,\n  isOpen: PropTypes.bool,\n  footer: PropTypes.oneOfType([\n    PropTypes.func,\n    PropTypes.shape({\n      text: PropTypes.string,\n      isError: PropTypes.boolean,\n      cancelButton: PropTypes.shape({\n        label: PropTypes.string,\n        onCancel: PropTypes.func,\n        disabled: PropTypes.bool\n      }),\n      confirmButton: PropTypes.shape({\n        label: PropTypes.string,\n        onConfirm: PropTypes.func,\n        iconName: PropTypes.string,\n        disabled: PropTypes.bool,\n        color: PropTypes.string\n      })\n    })\n  ]),\n  onClose: PropTypes.func,\n  onScroll: PropTypes.func,\n  detectScrollbar: PropTypes.bool,\n  customStyle: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))\n};\n\nexport default BaseModal;\n"],"mappings":"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","ignoreList":[]}

package/lib/molecule/icon-picker-modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAyIC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/icon-picker-modal/index.js"],"names":[],"mappings":";AAcA,+EAqHC"}

package/lib/molecule/icon-picker-modal/index.js

@@ -37,8 +37,6 @@ const IconPickerModal = (props, context) => {
   const allIcons = (0, _react.useMemo)(() => (0, _pipe2.default)(_values2.default, (0, _map2.default)((0, _get2.default)('iconName')), _uniq2.default)(_proSolidSvgIcons.fas), []);
   const [selectedIcon, setSelectedIcon] = (0, _react.useState)(null);
   const [displayedIcons, setDisplayedIcons] = (0, _react.useState)((0, _slice2.default)(0, ICONS_PER_LOAD, allIcons));
-  // const [currentIndex, setCurrentIndex] = useState(ICONS_PER_LOAD);
-
   const {
     searchValue,
     searchResults,
@@ -53,31 +51,11 @@ const IconPickerModal = (props, context) => {
   }, [onClose]);
   const handleIconClick = (0, _react.useCallback)(iconName => () => {
     console.log('in handleIconClick ----->');
-    setSelectedIcon(prevSelectedIcon => prevSelectedIcon === iconName ? null : iconName);
+    setSelectedIcon(prevSelectedIcon => {
+      console.log('TCL ------>  ~ IconPickerModal ~ prevSelectedIcon:', prevSelectedIcon);
+      return prevSelectedIcon === iconName ? null : iconName;
+    });
   }, []);
-
-  // const loadMoreIcons = useCallback(() => {
-  //   const nextIndex = currentIndex + ICONS_PER_LOAD;
-  //   const newIcons = slice(currentIndex, nextIndex, searchResults);
-  //   setDisplayedIcons(prevIcons => [...prevIcons, ...newIcons]);
-  //   setCurrentIndex(nextIndex);
-  // }, [currentIndex, searchResults]);
-
-  // useEffect(() => {
-  // setDisplayedIcons(() => slice(0, ICONS_PER_LOAD, searchResults));
-  // setCurrentIndex(ICONS_PER_LOAD);
-  // }, [searchResults]);
-
-  // const handleScroll = useCallback(
-  //   event => {
-  //     const {scrollTop, clientHeight, scrollHeight} = event.currentTarget;
-  //     if (scrollHeight - scrollTop <= clientHeight + 1) {
-  //       loadMoreIcons();
-  //     }
-  //   },
-  //   [loadMoreIcons]
-  // );
-
   const icons = (0, _react.useMemo)(() => (0, _pipe2.default)(_entries2.default, (0, _map2.default)(([index, iconName]) => {
     console.log('in icons ---->');
     return /*#__PURE__*/_react.default.createElement(_selectIcon.default, {
@@ -116,9 +94,7 @@ const IconPickerModal = (props, context) => {
     title: translate('icon_picker_title'),
     description: translate('icon_picker_description'),
     isOpen: isOpen,
-    onClose: handleClose
-    // onScroll={handleScroll}
-    ,
+    onClose: handleClose,
     footer: footer,
     headerIcon: {
       name: 'arrows-rotate',

package/lib/molecule/icon-picker-modal/index.js.map

@@ -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","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, 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          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      // 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":[]}
+{"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","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 => () => {\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":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coorpacademy/components",
-  "version": "11.40.1-alpha.11+a11406e14",
+  "version": "11.40.1-alpha.13+0643a8fae",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -166,5 +166,5 @@
     "last 2 versions",
     "IE 11"
   ],
-  "gitHead": "a11406e143b36bb0c63acc794d9eb764eae5d3de"
+  "gitHead": "0643a8faed77acd70cabeeeb8fcaca48e56f1f4c"
 }