{"version":3,"file":"Multifilter_1.Dv-R9L2x.mjs","names":["useState","useRef","_Fragment"],"sources":["https:/framerusercontent.com/modules/lYCiYYcOeCNFzdqTCtKN/p4ETewRXqzNru5MThfhS/Multifilter_1.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import{useState,useEffect,useRef}from\"react\";// Customizable constants\n// Font settings\nconst FONT_FAMILY=\"Inter, sans-serif\";const TEXT_COLOR=\"#1E293B\";const TEXT_SIZE=\"14px\";const TEXT_WEIGHT=500;// Padding and spacing\nconst PADDING_VERTICAL=\"8px\";const PADDING_HORIZONTAL=\"12px\";const FILTER_GAP=\"10px\";const FILTER_BOTTOM_MARGIN=\"20px\";// Colors\nconst BORDER_COLOR=\"#CBD5E1\";const BACKGROUND_COLOR=\"#FFF\";const SELECTED_BACKGROUND_COLOR=\"#EEEDFD\";const ACTIVE_BORDER_COLOR=\"#594FEE\";const HOVER_BACKGROUND_COLOR=\"#F8FAFC\";const ACTIVE_TEXT_COLOR=\"#594FEE\";// Borders and dimensions\nconst BORDER_RADIUS=\"8px\";const BORDER_WIDTH=\"1px\";const ICON_SIZE=\"16px\";// Shadow\nconst BOX_SHADOW=\"0px 0.301px 1.505px -1.5px rgba(0, 0, 0, 0.18), 0px 1.144px 5.721px -3px rgba(0, 0, 0, 0.04)\";// Base styles for the select component\nconst baseFilterStyles={borderRadius:BORDER_RADIUS,border:`${BORDER_WIDTH} solid ${BORDER_COLOR}`,background:BACKGROUND_COLOR,boxShadow:BOX_SHADOW,padding:`${PADDING_VERTICAL} ${PADDING_HORIZONTAL}`,fontFamily:FONT_FAMILY,color:TEXT_COLOR,fontSize:TEXT_SIZE,fontWeight:TEXT_WEIGHT,boxSizing:\"border-box\",width:\"auto\",minWidth:\"100%\",maxWidth:\"none\",appearance:\"none\",whiteSpace:\"nowrap\",overflow:\"visible\",textOverflow:\"clip\",paddingRight:`calc(${PADDING_HORIZONTAL} + ${ICON_SIZE} + 2px)`,position:\"relative\"};export function multiFilterCMS(Component){return props=>{const[filters,setFilters]=useState({});const selectRefs=useRef({});useEffect(()=>{const layer=document.querySelector(`.${props.className}`);if(layer){const cards=layer.querySelectorAll(\"[aria-label='cmsitem']\");cards.forEach(card=>{let matchAll=true;Object.entries(filters).forEach(([filterId,filterValue])=>{if(filterValue){const filterElement=card.querySelector(`[aria-label^=\"filter-${filterId}\"]`);if(filterElement){const text=filterElement.textContent?.toLowerCase()||\"\";if(!text.includes(filterValue.toLowerCase())){matchAll=false;}}}});card.classList.toggle(\"hidden\",!matchAll);});}},[props.className,filters]);const handleFilterChange=(filterId,value)=>{setFilters(prevFilters=>({...prevFilters,[filterId]:value}));setTimeout(()=>adjustSelectWidth(filterId),0);};const adjustSelectWidth=filterId=>{const select=selectRefs.current[filterId];if(select){const tempSpan=document.createElement(\"span\");tempSpan.style.visibility=\"hidden\";tempSpan.style.position=\"absolute\";tempSpan.style.whiteSpace=\"nowrap\";tempSpan.style.font=window.getComputedStyle(select).font;tempSpan.textContent=select.options[select.selectedIndex].text;document.body.appendChild(tempSpan);const textWidth=tempSpan.offsetWidth;document.body.removeChild(tempSpan);const extraSpace=parseInt(PADDING_HORIZONTAL)*2+parseInt(ICON_SIZE)+8// Adjust for padding and icon space\n;select.style.width=`${textWidth+extraSpace}px`;}};useEffect(()=>{const layer=document.querySelector(`.${props.className}`);if(layer){const filterElements=layer.querySelectorAll('[aria-label^=\"filter-\"]');const uniqueFilters={};filterElements.forEach(el=>{const id=el.getAttribute(\"aria-label\")?.split(\"-\")[1];if(id){if(!uniqueFilters[id]){uniqueFilters[id]=new Set;}uniqueFilters[id].add(el.textContent||\"\");}});const initialFilters={};Object.keys(uniqueFilters).forEach(filterId=>{initialFilters[filterId]=\"\";});setFilters(initialFilters);}},[props.className]);useEffect(()=>{Object.keys(filters).forEach(adjustSelectWidth);},[filters]);return /*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(\"div\",{style:{display:\"flex\",flexWrap:\"wrap\",gap:FILTER_GAP,marginBottom:FILTER_BOTTOM_MARGIN,justifyContent:\"flex-start\",width:\"100%\"},children:Object.entries(filters).map(([filterId,filterValue])=>{const isActive=!!filterValue;const style={...baseFilterStyles,background:isActive?SELECTED_BACKGROUND_COLOR:BACKGROUND_COLOR,borderColor:isActive?ACTIVE_BORDER_COLOR:BORDER_COLOR,color:isActive?ACTIVE_TEXT_COLOR:TEXT_COLOR};return /*#__PURE__*/_jsxs(\"div\",{style:{position:\"relative\",display:\"inline-block\",width:\"auto\"},children:[/*#__PURE__*/_jsxs(\"select\",{ref:el=>selectRefs.current[filterId]=el,value:filterValue,onChange:e=>handleFilterChange(filterId,e.target.value),style:style,children:[/*#__PURE__*/_jsxs(\"option\",{value:\"\",children:[\"All \",filterId]}),Array.from(document.querySelectorAll(`.${props.className} [aria-label^=\"filter-${filterId}\"]`)).map(el=>el.textContent).filter((value,index,self)=>value&&self.indexOf(value)===index).map(option=>/*#__PURE__*/_jsx(\"option\",{value:option,children:option},option))]}),/*#__PURE__*/_jsx(\"span\",{style:{position:\"absolute\",right:PADDING_HORIZONTAL,top:\"50%\",transform:\"translateY(-50%)\",pointerEvents:\"none\",display:\"flex\",alignItems:\"center\",color:isActive?ACTIVE_TEXT_COLOR:TEXT_COLOR},children:/*#__PURE__*/_jsx(\"svg\",{xmlns:\"http://www.w3.org/2000/svg\",viewBox:\"0 0 24 24\",fill:\"none\",stroke:\"currentColor\",strokeWidth:\"2\",strokeLinecap:\"round\",strokeLinejoin:\"round\",style:{width:ICON_SIZE,height:ICON_SIZE},children:/*#__PURE__*/_jsx(\"polyline\",{points:\"6 9 12 15 18 9\"})})})]},filterId);})}),/*#__PURE__*/_jsx(Component,{...props}),/*#__PURE__*/_jsx(\"style\",{children:`\n                    .${props.className} .hidden {\n                        display: none;\n                    }\n                    select:hover {\n                        background-color: ${HOVER_BACKGROUND_COLOR} !important;\n                    }\n                    select {\n                        -webkit-appearance: none;\n                        -moz-appearance: none;\n                        appearance: none;\n                    }\n                `})]});};}\nexport const __FramerMetadata__ = {\"exports\":{\"multiFilterCMS\":{\"type\":\"reactHoc\",\"name\":\"multiFilterCMS\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Multifilter_1.map"],"mappings":"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"}