{"ast":null,"code":"import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { Fragment as _Fragment } from \"react/jsx-runtime\";\nimport cn from 'classnames';\nimport BoxButton from 'components/gui/BoxButton';\nimport Button from 'components/gui/Button';\nimport CircleButton from 'components/gui/CircleButton';\nimport ListFilters from 'components/listFilters/ListFilters';\nimport SearchBox from 'components/searchBox/SearchBox';\nimport { useIsDesktop } from 'hooks/useIsDevice';\nimport { useEffect, useState } from 'react';\nimport styles from './List.module.scss';\n\nconst List = ({\n  classNameSearch,\n  classNameList,\n  items,\n  renderItem,\n  limit = 0,\n  searchFilter,\n  placeholder,\n  loadMore,\n  filters\n}) => {\n  const {\n    0: input,\n    1: setInput\n  } = useState('');\n  const {\n    0: showAll,\n    1: setShowAll\n  } = useState(true);\n\n  const onSearch = input => setInput(input);\n\n  const {\n    0: currentFilter,\n    1: setCurrentFilter\n  } = useState(filters && filters.length && filters[0]);\n\n  const onChangeFilter = label => {\n    setCurrentFilter(label);\n  };\n\n  const isDesktop = useIsDesktop();\n  useEffect(() => {\n    if (!isDesktop) setShowAll(false);\n  }, [isDesktop]);\n  let listedItems = items;\n  if (searchFilter && input != '') listedItems = listedItems.filter(item => searchFilter(item, input));\n\n  if (currentFilter) {\n    listedItems = listedItems.filter(currentFilter.filter);\n  }\n\n  const hasMoreToShow = limit > 0 && input == '' && !showAll && listedItems.length > limit;\n\n  if (hasMoreToShow) {\n    listedItems = listedItems.slice(0, limit);\n  }\n\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [searchFilter && /*#__PURE__*/_jsx(SearchBox, {\n      className: cn(classNameSearch),\n      onSearch: onSearch,\n      placeholder: placeholder\n    }), filters && /*#__PURE__*/_jsx(ListFilters, {\n      title: 'Filtrer :',\n      onChange: onChangeFilter,\n      filteredList: items,\n      filters: filters\n    }), /*#__PURE__*/_jsx(\"div\", {\n      className: styles.listCont,\n      children: /*#__PURE__*/_jsx(\"ul\", {\n        className: cn(styles.list, classNameList),\n        children: listedItems.map(item => renderItem(item))\n      })\n    }), hasMoreToShow && /*#__PURE__*/_jsxs(Button, {\n      className: cn(styles.button),\n      onClick: () => setShowAll(true),\n      children: [/*#__PURE__*/_jsx(CircleButton, {\n        color: \"white\",\n        icon: \"plus\"\n      }), /*#__PURE__*/_jsx(\"p\", {\n        className: cn('p--m'),\n        children: loadMore\n      })]\n    })]\n  });\n};\n\nexport default List;","map":null,"metadata":{},"sourceType":"module"}