\r\n {iconLeft && (\r\n \r\n )}\r\n {label}\r\n {iconRight && (\r\n \r\n )}\r\n
\r\n \r\n );\r\n};\r\n\r\nButton.propTypes = {\r\n label: PropTypes.string.isRequired,\r\n theme: PropTypes.string.isRequired,\r\n clickAction: PropTypes.func.isRequired,\r\n onDarkBg: PropTypes.bool,\r\n small: PropTypes.bool,\r\n iconLeft: PropTypes.string,\r\n iconRight: PropTypes.string\r\n};\r\n\r\nexport default Button;\r\n","import { useEffect } from 'react'\r\nimport { close, open } from '../index'\r\n\r\nconst useExpandCollapse = (display, trigger, container) => {\r\n useEffect(() => {\r\n if (display) {\r\n trigger.current.setAttribute('aria-expanded', true);\r\n container.current.style.visibility = 'visible';\r\n trigger.current.parentNode.classList.add('accordion__item--expanded');\r\n trigger.current.parentNode.classList.remove('accordion__item--collapsed');\r\n open({\r\n element: container.current,\r\n onComplete: () => {\r\n container.current.setAttribute('aria-hidden', false);\r\n container.current.style.height = 'auto';\r\n }\r\n });\r\n\r\n } else {\r\n trigger.current.setAttribute('aria-expanded', false);\r\n trigger.current.parentNode.classList.remove('accordion__item--expanded');\r\n trigger.current.parentNode.classList.add('accordion__item--collapsed');\r\n close({\r\n element: container.current,\r\n onComplete: () => {\r\n container.current.setAttribute('aria-hidden', true);\r\n container.current.style.visibility = 'hidden';\r\n }\r\n });\r\n }\r\n }, [display]);\r\n};\r\n\r\nexport default useExpandCollapse;\r\n","import React, { useEffect, useRef, useState } from 'react'\r\nimport PropTypes from 'prop-types';\r\nimport { debounce } from '../../../helpers'\r\nimport useExpandCollapse from '../../../helpers/reactHooks/useExpandCollapse'\r\n\r\nconst FilterItem = ({\r\n filter,\r\n selected,\r\n onFilterChange\r\n}) => {\r\n const breakpoint = window.matchMedia('(max-width: 1280px)');\r\n const { keyword, name } = filter;\r\n const [display, setDisplay] = useState(!breakpoint.matches);\r\n const listRef = useRef(null);\r\n const triggerRef = useRef(null);\r\n const [selectedCount, setSelectedCount] = useState(0);\r\n\r\n useExpandCollapse(display, triggerRef, listRef);\r\n\r\n const handleSelect = value => {\r\n const selectedClone = [...selected];\r\n\r\n if (selectedClone.includes(value)) {\r\n selectedClone.splice(selectedClone.indexOf(value), 1);\r\n } else {\r\n selectedClone.push(value);\r\n }\r\n\r\n const filterItems = {\r\n name: keyword,\r\n options: selectedClone\r\n };\r\n\r\n onFilterChange(filterItems);\r\n };\r\n\r\n useEffect(() => {\r\n if (filter) {\r\n let count = 0;\r\n filter.options.forEach(opt => {\r\n if (opt.selected) {\r\n count += 1;\r\n }\r\n })\r\n setSelectedCount(count)\r\n }\r\n }, [filter]);\r\n\r\n useEffect(() => {\r\n const listener = () => {\r\n if (breakpoint.matches) {\r\n setDisplay(false);\r\n } else {\r\n setDisplay(true);\r\n }\r\n };\r\n\r\n debounce(window.addEventListener('resize', listener), 500);\r\n return () => window.removeEventListener('resize', listener);\r\n }, []);\r\n\r\n return (\r\n \r\n setDisplay(!display)}\r\n >\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nFilterItem.propTypes = {\r\n filter: PropTypes.object,\r\n selected: PropTypes.array,\r\n onFilterChange: PropTypes.func\r\n};\r\n\r\nexport default FilterItem;\r\n","import React, { useEffect, useRef, useState } from 'react'\r\nimport PropTypes from 'prop-types';\r\nimport { debounce } from '../../../helpers/index'\r\nimport Button from '../Button'\r\nimport FilterItem from './FilterItem'\r\nimport useExpandCollapse from '../../../helpers/reactHooks/useExpandCollapse'\r\n\r\nconst FilterList = ({\r\n filters,\r\n selectedFilters,\r\n onFiltersChange,\r\n onResetFilters,\r\n resetBtnLabel,\r\n loading,\r\n filterHeading\r\n}) => {\r\n const breakpoint = window.matchMedia('(min-width: 1280px)');\r\n const filterListTrigger = useRef(null);\r\n const filterLists = useRef(null);\r\n const [displayFilters, setDisplayFilters] = useState(breakpoint.matches);\r\n\r\n useExpandCollapse(displayFilters, filterListTrigger, filterLists);\r\n\r\n useEffect(() => {\r\n const listener = () => {\r\n if (breakpoint.matches) {\r\n setDisplayFilters(true);\r\n } else {\r\n setDisplayFilters(false);\r\n }\r\n };\r\n\r\n debounce(window.addEventListener('resize', listener), 500);\r\n return () => window.removeEventListener('resize', listener);\r\n }, []);\r\n\r\n const onCleanFilters = () => {\r\n onResetFilters();\r\n };\r\n\r\n return (\r\n \r\n {name}\r\n {selectedCount > 0 && ( ({selectedCount}))}\r\n
\r\n \r\n \r\n \r\n \r\n\r\n \r\n {filter.options.map((option, i) => (\r\n
\r\n \r\n \r\n
\r\n ))}\r\n \r\n {loading && }\r\n\r\n {filterHeading &&
\r\n )}\r\n \r\n );\r\n};\r\n\r\nFilterList.propTypes = {\r\n filters: PropTypes.array,\r\n selectedFilters: PropTypes.object,\r\n onFiltersChange: PropTypes.func,\r\n onResetFilters: PropTypes.func,\r\n resetBtnLabel: PropTypes.string\r\n};\r\n\r\nexport default FilterList;\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport parse from 'html-react-parser'\r\nimport { CARD_TYPE } from '../CardListing';\r\n\r\nconst ClientCard = ({ cardData, cardType }) => {\r\n const {\r\n headline,\r\n imageAlt,\r\n imageUrl,\r\n isExternal,\r\n subHeadline, // CARD_TYPE.client\r\n title, // CARD_TYPE.leader\r\n location, // CARD_TYPE.event\r\n date, // CARD_TYPE.event\r\n url\r\n } = cardData;\r\n\r\n return (\r\n \r\n {imageUrl && (\r\n {filterHeading}
}\r\n\r\n {Object.keys(selectedFilters).length ? (\r\n\r\n
\r\n ) : (\r\n ''\r\n )}\r\n\r\n {filters && (\r\n \r\n setDisplayFilters(!displayFilters)}\r\n >\r\n \r\n
\r\n {displayFilters ? 'Hide Filters' : 'Show Filters'}
\r\n \r\n \r\n \r\n \r\n\r\n \r\n
\r\n \r\n
\r\n \r\n {filters.map((filter, index) => (\r\n
\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nClientCard.propTypes = {\r\n cardData: PropTypes.object.isRequired\r\n};\r\n\r\nexport default ClientCard;\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport parse from 'html-react-parser';\r\n\r\nconst ResourceCard = ({ cardData }) => {\r\n const {\r\n headline,\r\n description,\r\n isExternal,\r\n url,\r\n trackId,\r\n hitId,\r\n hitType\r\n } = cardData;\r\n\r\n const trackClick = () => {\r\n console.log('Clicked!');\r\n fetch(`/SiteSearchApi/Track/?query=${window.location.href.slice(window.location.href.indexOf('=') + 1).split('&')[0]}&hitId=${hitType}/${hitId}&trackId=${trackId}`, { method: 'GET' });\r\n }\r\n\r\n return (\r\n trackClick(e)} className=\"resource-card\">\r\n \r\n
\r\n {parse(headline)}
\r\n \r\n \r\n \r\n\r\n
\r\n \r\n {subHeadline && parse(subHeadline)}\r\n {title && parse(title)}\r\n {date && parse(date)}\r\n {date && location &&
}\r\n {location && parse(location)}\r\n
\r\n
\r\n {description && (\r\n {parse(headline)}
\r\n \r\n \r\n \r\n\r\n
\r\n )}\r\n \r\n );\r\n};\r\n\r\nResourceCard.propTypes = {\r\n cardData: PropTypes.object.isRequired\r\n};\r\n\r\nexport default ResourceCard;\r\n","import React, { useEffect, useRef, useState } from 'react'\r\nimport PropTypes from 'prop-types';\r\nimport { useFetch, useParams } from '../../helpers/reactHooks'\r\nimport SearchBar from './SearchBar'\r\nimport Pagination from './Pagination'\r\nimport FilterList from './filters/FilterList'\r\nimport Dropdown from './Dropdown'\r\nimport ClientCard from './card-listing/ClientCard'\r\nimport ResourceCard from './card-listing/ResourceCard'\r\n\r\nexport const CARD_TYPE = {\r\n client: 'client',\r\n resource: 'resource',\r\n leader: 'leader',\r\n event: 'event'\r\n};\r\n\r\nconst CardListing = ({\r\n endpoint,\r\n language,\r\n suggestionLabel,\r\n searchLabel,\r\n noResultsLabel,\r\n subTitle,\r\n resetBtnLabel,\r\n currentContent,\r\n endpointSuggestions,\r\n cardType,\r\n hasFilters,\r\n hasSearchBar,\r\n hasSortBy\r\n}) => {\r\n const [initialLoad, setInitialLoad] = useState(true);\r\n\r\n const cardTypeName = CARD_TYPE[cardType] || CARD_TYPE.resource;\r\n\r\n const [\r\n { query, page, sort, filters },\r\n setQuery,\r\n setPage,\r\n setSort,\r\n setFilters\r\n ] = useParams();\r\n\r\n const { results, loading } = useFetch(endpoint, {\r\n query,\r\n page,\r\n sort,\r\n filters,\r\n currentContent,\r\n language\r\n });\r\n\r\n const {\r\n facets,\r\n featuredLinks,\r\n resultListing,\r\n resultsInfo,\r\n sortOptions,\r\n totalResults,\r\n resultsPerPage,\r\n resultsSummary,\r\n didYouMean\r\n } = results;\r\n\r\n const anchorRef = useRef();\r\n\r\n const handleReset = () => {\r\n setFilters({});\r\n };\r\n\r\n const handlePaginate = page => {\r\n setPage(page);\r\n if (anchorRef?.current) {\r\n anchorRef?.current.scrollIntoView();\r\n }\r\n };\r\n\r\n const handleFilters = filter => {\r\n const selectedFilters = { ...filters };\r\n selectedFilters[filter.name] = filter.options;\r\n\r\n setFilters(selectedFilters);\r\n };\r\n\r\n const handleQuery = query => {\r\n setQuery(query);\r\n };\r\n\r\n const getCardComponent = (item, i) => {\r\n switch (cardTypeName) {\r\n case CARD_TYPE.resource:\r\n return ({parse(description)}
\r\n\r\n {!initialLoad && <>\r\n {hasSearchBar === 'true' && (\r\n
\r\n );\r\n};\r\n\r\nCardListing.prototype = {\r\n endpoint: PropTypes.string.isRequired,\r\n language: PropTypes.string.isRequired,\r\n title: PropTypes.string.isRequired,\r\n subTitle: PropTypes.string.isRequired,\r\n noResultsLabel: PropTypes.string.isRequired\r\n};\r\n\r\nexport default React.memo(CardListing);\r\n"],"sourceRoot":""}\r\n {!!resultsSummary && (\r\n setQuery('')}\r\n onSearch={handleQuery}\r\n searchLabel={searchLabel}\r\n language={language}\r\n initialQuery={query && query}\r\n endpointSuggestions={endpointSuggestions}\r\n />\r\n
\r\n )}\r\n\r\n \r\n {resultsSummary} \r\n {!!didYouMean && didYouMean.length > 0 && (\r\n \r\n {suggestionLabel}\r\n {didYouMean.map((keyword, index) => (\r\n { setQuery(keyword) }}\r\n key={`suggestion-link-${index}`}\r\n >\r\n {keyword}\r\n \r\n ))}\r\n \r\n )}\r\n
\r\n )}\r\n \r\n
\r\n }\r\n \r\n {featuredLinks && (\r\n
\r\n\r\n {!!resultListing && resultListing.length ? (\r\n \r\n {featuredLinks.map((link, i) => (\r\n \r\n {link.text}\r\n \r\n \r\n ))}\r\n
\r\n )}\r\n\r\n {hasFilters === 'true' && (\r\n \r\n {Object.keys(results).length ? (\r\n
\r\n )}\r\n \r\n
\r\n ) : (\r\n \r\n
\r\n\r\n {resultsInfo}
\r\n\r\n {hasSortBy === 'true' && (\r\n \r\n {sortOptions && (\r\n opt.selected)\r\n ? sortOptions.find(opt => opt.selected)\r\n : sortOptions[0]\r\n }\r\n onChange={sort => setSort(sort.value)}\r\n />\r\n )}\r\n
\r\n )}\r\n \r\n {loading && }\r\n {!loading && resultListing.map((item, i) => getCardComponent(item, i))}\r\n
\r\n\r\n {!loading && !!page && (\r\n \r\n handlePaginate(page)}\r\n resultsPerPage={resultsPerPage}\r\n />\r\n
\r\n )}\r\n \r\n {noResultsLabel}\r\n
\r\n )}\r\n