{"version":3,"file":"673.min.js","mappings":"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","sources":["webpack://cne/./assets/js/frontend/components/SortDropDown.js","webpack://cne/./assets/js/frontend/components/Filters.js"],"sourcesContent":["/* global mainScript */\nimport React, { useState, useRef, useEffect } from \"react\";\nimport styled from \"@emotion/styled\";\nimport PropTypes from \"prop-types\";\n\n//style rules\nimport { Colors, Typography, Sizes } from \"../styles\";\n\nconst SortDropDown = ({ selectSortOption, selectedSortOption, isFood }) => {\n\tconst [openDropDown, setOpenDropDown] = useState(false);\n\n\tconst dropDownNode = useRef();\n\n\tconst handleOutsideClick = (e) => {\n\t\tif (dropDownNode.current && !dropDownNode.current.contains(e.target)) {\n\t\t\tsetOpenDropDown(!openDropDown);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tif (openDropDown) {\n\t\t\tdocument.addEventListener(\"mousedown\", handleOutsideClick);\n\t\t}\n\t\treturn () => {\n\t\t\tdocument.removeEventListener(\"mousedown\", handleOutsideClick);\n\t\t};\n\t}, [openDropDown]);\n\n\tconst toggleDropDown = () => {\n\t\tsetOpenDropDown((currentValue) => !currentValue);\n\t};\n\n\tconst sortOptions = isFood\n\t// adding conditional since food index does not sort by date\n\t\t? [\n\t\t\t{ name: \"A - Z\", slug: \"alphabetically\" },\n\t\t\t{ name: \"Z - A\", slug: \"alphabetically-reverse\" }]\n\t\t: [\n\t\t\t{ name: \"Date\", slug: \"date\" },\n\t\t\t{ name: \"A - Z\", slug: \"alphabetically\" },\n\t\t\t{ name: \"Z - A\", slug: \"alphabetically-reverse\" },];\n\n\tconst renderSortOptions = () => {\n\t\treturn (\n\t\t\tsortOptions &&\n\t\t\tsortOptions.length > 0 &&\n\t\t\tsortOptions.map((option) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropDownListItem\n\t\t\t\t\t\tkey={option.slug}\n\t\t\t\t\t\tonClick={() => selectSortOption(option.slug)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<CheckboxLabel>{option.name}</CheckboxLabel>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\ttype={\"checkbox\"}\n\t\t\t\t\t\t\tonChange={() => {}}\n\t\t\t\t\t\t\tchecked={selectedSortOption && selectedSortOption === option.slug}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</DropDownListItem>\n\t\t\t\t);\n\t\t\t})\n\t\t);\n\t};\n\n\treturn (\n\t\t<DropDownContainer ref={dropDownNode}>\n\t\t\t<DropDownTrigger onClick={toggleDropDown} onKeyPress={toggleDropDown}>\n\t\t\t\t{\"Sort by\"}\n\t\t\t</DropDownTrigger>\n\t\t\t{openDropDown && <DropDownList>{renderSortOptions()}</DropDownList>}\n\t\t</DropDownContainer>\n\t);\n};\n\nexport default SortDropDown;\n\nSortDropDown.propTypes = {\n\tDropDownLabel: PropTypes.string,\n\tselectSortOption: PropTypes.func,\n\tselectedSortOption: PropTypes.string,\n\tisFood: PropTypes.bool,\n};\n\n// fake centering using the top value\nconst DropDownContainer = styled.div`\n\tposition: relative;\n\ttop: 5px;\n\tpadding-top: 2rem;\n\n\t@media only screen and (min-width: ${Sizes.screens.large}) {\n\t\tpadding-top: 0;\n\t}\n`;\n\nconst DropDownTrigger = styled.button`\n\tpadding: 1.3rem 1.5rem;\n\ttext-transform: capitalize;\n\tborder: 1px solid ${Colors.base.black};\n\tfont-weight: 700;\n\tfont-size: 1.3rem;\n\tline-height: 1.6rem;\n\tborder-radius: 10px;\n\tcursor: pointer;\n\tdisplay: flex;\n\tgap: 1.1rem;\n\theight: unset;\n\tbackground: none;\n\ttransition: all 0.5s;\n\n\t&::after {\n\t\tcontent: url(${mainScript.assetPath +\n\t\t\"images/svg/icons/icon-down-arrow.svg\"});\n\t}\n`;\nconst DropDownList = styled.ul`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 1.6rem;\n\tmargin: 0;\n\tpadding: 1.6rem 1.5rem 2rem;\n\twidth: 100%;\n\tposition: absolute;\n\ttop: 72px;\n\tbackground-color: ${Colors.base.white};\n\tborder: 1px solid ${Colors.base.black};\n\tborder-radius: 10px;\n\tz-index: 1;\n\n\t@media only screen and (min-width: ${Sizes.screens.large}) {\n\t\ttop: 50px;\n\t}\n`;\n\nconst DropDownListItem = styled.li`\n\tmargin: 0;\n\tpadding: 0;\n\tlist-style: none;\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: space-between;\n\n\tinput[type=\"checkbox\"] {\n\t\tmin-width: 15px;\n\t\theight: 15px;\n\t\tmargin: 0;\n\t\tborder-radius: 3px;\n\n\t\t&:before {\n\t\t\tcontent: \"✓\";\n\t\t\tdisplay: block;\n\t\t\ttransform: translateX(-100%);\n\t\t}\n\n\t\t&:checked::before {\n\t\t\ttransform: translateY(-14%);\n\t\t}\n\t}\n`;\n\nconst CheckboxLabel = styled.label`\n\tfont-size: 1rem;\n\tline-height: 1.6rem;\n\tfont-weight: ${Typography.fontWeight.regular};\n`;\n","/* global mainScript */\nimport React, { useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport styled from \"@emotion/styled\";\nimport { motion } from \"framer-motion\";\n\nimport SortDropDown from \"./SortDropDown\";\n\n// style rules\nimport { Colors, Sizes, Animation } from \"../styles\";\n\nconst Filters = ({\n\tfilters,\n\tselectFilter,\n\tselectedFilter,\n\tisRides,\n\tselectSortOption,\n\tselectedSortOption,\n\tisFood\n}) => {\n\tconst [isViewMoreSelected, setIsViewMoreSelected] = useState(false);\n\n\tconst onViewMore = (e) => {\n\t\te.target.blur();\n\t\treturn setIsViewMoreSelected((currentValue) => !currentValue);\n\t};\n\n\t// we only display filters when theres more than 2, to avoid something like\n\t// All - Single Filter\n\tlet ShowFilters = filters && filters.length > 2;\n\n\t// only show the view more button when more than 5 filters are present on the page\n\tlet ShowViewMoreButton = filters && filters.length > 5;\n\n\tconst renderedFilters =\n\t\tShowFilters &&\n\t\tfilters.map((filter) => {\n\t\t\treturn (\n\t\t\t\t<Filter\n\t\t\t\t\tvariants={Animation.cards.opacityVariants}\n\t\t\t\t\tinitial={\"initial\"}\n\t\t\t\t\tanimate={\"animate\"}\n\t\t\t\t\tkey={filter.slug}\n\t\t\t\t\tactive={selectedFilter.slug == filter.slug}\n\t\t\t\t\tonClick={() => selectFilter(filter)}\n\t\t\t\t\tonKeyPress={() => selectFilter(filter)}\n\t\t\t\t\tisRides={isRides}\n\t\t\t\t\tisAll={filter.slug == \"all\"}\n\t\t\t\t>\n\t\t\t\t\t{filter.name}\n\t\t\t\t</Filter>\n\t\t\t);\n\t\t});\n\n\tconst renderViewMoreButton = ShowViewMoreButton && (\n\t\t<ViewMoreFilters\n\t\t\tvariants={Animation.cards.opacityVariants}\n\t\t\tinitial={\"initial\"}\n\t\t\tanimate={\"animate\"}\n\t\t\ttabIndex={0}\n\t\t\tonClick={onViewMore}\n\t\t\tonKeyPress={onViewMore}\n\t\t\tisRides={isRides}\n\t\t\ticon={\n\t\t\t\tisViewMoreSelected\n\t\t\t\t\t? mainScript.assetPath + \"images/svg/icons/minus.svg\"\n\t\t\t\t\t: mainScript.assetPath + \"images/svg/icons/plus2.svg\"\n\t\t\t}\n\t\t>\n\t\t\t{isViewMoreSelected ? \"view less\" : \"view more\"}\n\t\t</ViewMoreFilters>\n\t);\n\n\treturn (\n\t\t<FiltersContainer isRides={isRides}>\n\t\t\t{!isRides && ShowFilters && <Title>Filter by</Title>}\n\t\t\t<FiltersWrapper ShowFilters={ShowFilters}>\n\t\t\t\t<Row>\n\t\t\t\t\t{ShowViewMoreButton && !isViewMoreSelected\n\t\t\t\t\t\t? renderedFilters.splice(0, 4)\n\t\t\t\t\t\t: renderedFilters}\n\t\t\t\t\t{renderViewMoreButton}\n\t\t\t\t</Row>\n\t\t\t\t{!isRides && (\n\t\t\t\t\t<SortDropDown\n\t\t\t\t\t\tselectSortOption={selectSortOption}\n\t\t\t\t\t\tselectedSortOption={selectedSortOption}\n\t\t\t\t\t\tisFood={isFood}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</FiltersWrapper>\n\t\t</FiltersContainer>\n\t);\n};\n\nexport default Filters;\n\nconst FiltersContainer = styled.div`\n\tpadding-top: 5rem;\n\n\t@media only screen and (min-width: ${Sizes.screens.large}) {\n\t\tpadding-top: ${(props) => (props.isRides ? \"0\" : \"5rem\")};\n\t\twidth: 100%;\n\t}\n`;\n\nconst Title = styled.h2`\n\tfont-size: 2rem;\n\tline-height: 2.6rem;\n\tletter-spacing: -0.0015em;\n`;\n\nconst FiltersWrapper = styled.div`\n\tdisplay: flex;\n\tpadding-top: 2rem;\n\tflex-direction: column;\n\n\t@media only screen and (min-width: ${Sizes.screens.large}) {\n\t\tflex-direction: row;\n\t\tjustify-content: ${(props) =>\n\t\tprops.ShowFilters ? \"flex-start\" : \"flex-end\"};\n\t}\n`;\n\nconst Row = styled.div`\n\tdisplay: flex;\n\tgap: 3rem;\n\tflex-wrap: wrap;\n\tflex: 1;\n\talign-items: center;\n`;\n\nconst Filter = styled(motion.button)`\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tfont-size: 1.3rem;\n\tbackground: ${(props) =>\n\t\tprops.active ? Colors.cneAreas.limeGreen : \"transparent\"};\n\tbackground-size: 0% 100%;\n\tborder: 1px solid\n\t\t${(props) =>\n\t\tprops.active\n\t\t\t? Colors.cneAreas.limeGreen\n\t\t\t: props.isRides\n\t\t\t\t? Colors.base.white\n\t\t\t\t: Colors.base.black};\n\tcolor: ${(props) =>\n\t\tprops.active\n\t\t\t? Colors.base.black\n\t\t\t: props.isRides\n\t\t\t\t? Colors.base.white\n\t\t\t\t: Colors.base.black};\n\tpadding: ${(props) => (props.isAll ? \"1.5rem 4.8rem\" : \"1.5rem\")};\n\ttransition: all 0.7s;\n\n\t${(props) =>\n\t\t!props.active &&\n\t\t`&:hover,\n\t\t &:focus {\n\t\t\tborder: 1px solid ${Colors.cneAreas.limeGreen} ;\n\t\t\tcolor: black;\n\t\t\tbackground: transparent;\n\t\t\tbackground-image: ${Colors.gradients.green};\n\t\t\tbackground-repeat: no-repeat;\n\t\t\tbackground-size: 200% 100%;\n\t\t\ttransition: all .7s;\n\t\t}`}\n`;\n\nconst ViewMoreFilters = styled(Filter)`\n\tgap: 1rem;\n\n\t&:after {\n\t\theight: 24px;\n\t\tcontent: url(${props => props.icon});\n\t\ttransition: all 0.5s ease-in;\n\t}\n\n\t&:hover {\n\t\t&:after {\n\t\t\ttransition: all 0.5s ease-in;\n\t\t\ttransform: rotate(180deg);\n\t\t}\n\t}\n`;\n\nFilters.propTypes = {\n\tfilters: PropTypes.array,\n\tselectFilter: PropTypes.func,\n\tselectedFilter: PropTypes.object,\n\tisRides: PropTypes.bool,\n\tsetSelectedFilter: PropTypes.func,\n\tselectSortOption: PropTypes.func,\n\tselectedSortOption: PropTypes.string,\n\tisFood: PropTypes.bool\n};\n"],"names":["SortDropDown","selectSortOption","selectedSortOption","isFood","openDropDown","setOpenDropDown","useState","dropDownNode","useRef","handleOutsideClick","e","current","contains","target","useEffect","document","addEventListener","removeEventListener","toggleDropDown","currentValue","sortOptions","name","slug","DropDownContainer","ref","DropDownTrigger","onClick","onKeyPress","DropDownList","length","map","option","DropDownListItem","key","CheckboxLabel","type","onChange","checked","propTypes","DropDownLabel","PropTypes","styled","Sizes","Colors","mainScript","assetPath","Typography","Filters","filters","selectFilter","selectedFilter","isRides","isViewMoreSelected","setIsViewMoreSelected","onViewMore","blur","ShowFilters","ShowViewMoreButton","renderedFilters","filter","Filter","variants","Animation","initial","animate","active","isAll","renderViewMoreButton","ViewMoreFilters","tabIndex","icon","FiltersContainer","Title","FiltersWrapper","Row","splice","props","motion","setSelectedFilter"],"sourceRoot":""}