https://www.linode.com/etc.clientlibs/linode/clientlibs/clientlib-…/static/js/filter-items.639d8d5d.chunk.js

1"use strict";(self.webpackChunkui_frontend_react=self.webpackChunkui_frontend_react||[]).push([[46],{4661:(e,t,l)=>{l.r(t),l.d(t,{default:()=>u});var i=l(7051),n=l(5043),s=l(3986),a=l(579);const r=["onFilter","activeFilter"],o=e=>{let{onFilter:t,activeFilter:l}=e,o=(0,s.A)(e,r);const{id:c,type:d,name:u,title:f,children:m,color:h}=o,[p,v]=n.useState(),[_,g]=n.useState([]),[x,j]=n.useState(1),[w,y]=n.useState(!1),[F,C]=n.useState(""),[N,b]=n.useState(),k=n.useRef(null),E=n.useRef(null),L=n.useRef(null),S=window.location.pathname.split("/"),M=S[S.length-1].replace(".html",""),A=n.useMemo(()=>Boolean(null===p||void 0===p?void 0:p.length),[p]),T=n.useMemo(()=>(null===l||void 0===l?void 0:l.id)===c&&(null===l||void 0===l?void 0:l.type)===d,[l,c,d]),B=n.useMemo(()=>null===m||void 0===m?void 0:m.find(e=>e.id===(null===l||void 0===l?void 0:l.id)&&e.type===(null===l||void 0===l?void 0:l.type)),[m,l]);(0,n.useEffect)(()=>{0===(null===l||void 0===l?void 0:l.length)&&b(null)},[l]);const D=(0,n.useCallback)(e=>{k.current&&(k.current===e.target||k.current.contains(e.target)?w||y(!0):R())},[w]);(0,n.useEffect)(()=>(document.addEventListener("mousedown",D,!0),()=>{document.removeEventListener("mousedown",D,!0)}),[D]),(0,n.useEffect)(()=>{m&&v(m.sort((e,t)=>e.title.trim().localeCompare(t.title.trim())))},[m]),(0,n.useEffect)(()=>{if(p){let e=p;A&&F.length>0&&(e=p.filter(e=>-1!==e.title.toLowerCase().indexOf(F.toLowerCase()))),g(e)}},[p,A,F]),(0,n.useEffect)(()=>{if(w){let e=l?_.findIndex(e=>e.id===l.id):0;e<0&&(e=0),b(_[e])}},[_,w,l]),(0,n.useEffect)(()=>{if(N){const e=k.current.getElementsByClassName("selected")[0];if(e){const t=L.current,l=e.offsetTop<t.scrollTop,i=e.offsetTop+e.clientHeight>t.scrollTop+t.clientHeight;l?t.scrollTop=e.offsetTop:i&&(t.scrollTop=e.offsetTop+e.clientHeight-t.clientHeight)}}},[N]);const R=()=>{y(!1),b(null),C(""),E.current.blur()},H=e=>{R(),t(e)};return(0,a.jsxs)("div",(0,i.A)((0,i.A)({ref:k,onClick:e=>A?(()=>{if(!w||x)return j(0),null;y(!1),j(1)})():H(o)},A?{}:{"data-analytics-link":"Filter | no-dropdown - "+f+" | "+o.id}),{},{className:"filter filter--".concat(u,"\n        ").concat(h?" filter--color-".concat(h):"","\n        ").concat(A?" filter--menu":"","\n        ").concat(w?" filter--menu-open":"","\n        ").concat(T||B?" active":"","\n      "),children:[(0,a.jsxs)("label",{children:[(0,a.jsx)("span",{children:N&&w?F||N.title:(null===B||void 0===B?void 0:B.title)||f}),(0,a.jsx)("input",{ref:E,autoComplete:"off",type:A?"text":"button",placeholder:N?N.title:(null===B||void 0===B?void 0:B.title)||f,value:A?w?F:(null===B||void 0===B?void 0:B.title)||f:f,onChange:e=>C(e.target.value),onKeyDown:e=>{if(w){const t=e.key,l=_.findIndex(e=>e.id===N.id);"ArrowDown"===t?(e.preventDefault(),_.length>=l+2&&b(_[l+1])):"ArrowUp"===t?(e.preventDefault(),l>0&&b(_[l-1])):"Enter"===t?H(_[l]):"Escape"===t&&R()}}})]}),A&&(0,a.jsxs)("div",{ref:L,className:"filter__items".concat(w?" show":""),children:[_.length<1&&(0,a.jsx)("p",{className:"filter__items__empty",children:"No Results Found."}),_.map(e=>(0,n.createElement)("button",{className:"\n                ".concat((null===l||void 0===l?void 0:l.id)===e.id&&e.type===(null===l||void 0===l?void 0:l.type)?" active":"","\n                ").concat((null===N||void 0===N?void 0:N.id)===e.id&&e.type===(null===N||void 0===N?void 0:N.type)?" selected":"","\n              "),onClick:()=>H(e),"data-analytics-link":(M||"undefined")+" filter | dropdown - "+f+" | "+e.id,key:e.id},e.title))]})]}))};var c=l(3611);l(9336);const d=new URLSearchParams(document.location.search),u=e=>{let{title:t,filterLabel:l="Filter By",emptyMessage:s,filters:r,blogSelectedAuthor:u,showFilters:f=!0,showClear:m=!0,items:h,itemComponent:p,perPage:v=9,onFilter:_,onClear:g,activeFilter:x,clearFilterLabel:j="Clear Filter",loadMoreLabel:w="Load More",authorName:y,isBlogFilter:F=!1}=e;const[C,N]=n.useState(!1),[b,k]=n.useState(parseInt(d.get("page")||1)),E=window.location.pathname.split("/"),L=E[E.length-1].replace(".html",""),S=n.useMemo(()=>b*v,[b,v]),M=x&&"tag"===x.type,A=n.useMemo(()=>{const e=document.location.search,t=b+1;return e?e.includes("page=")?e.replace(/page=[0-9]+/,"page=".concat(t)):"".concat(e,"&page=").concat(t):"?page=".concat(t)},[b]);n.useEffect(()=>(N(!1),()=>k(1)),[x]);const T=h.length>S?e=>{e.preventDefault(),k(e=>e+1)}:null;

1return(0,c.A)("LoadMore"),(0,a.jsxs)("div",{className:"filter-items",children:[f&&(0,a.jsx)("div",{className:"filter-items__filters",children:(0,a.jsxs)("div",{className:"wrapper",children:[(0,a.jsx)("label",{onClick:()=>N(!C),children:l}),(0,a.jsxs)("div",{className:"filter-items__filters__list".concat(C?" active":""),children:[r.map(e=>(0,a.jsx)(o,(0,i.A)({onFilter:_,activeFilter:x},e),e.id)),m&&x&&(0,a.jsx)("button",{onClick:()=>g?g():_(null),className:"clear","data-analytics-link":(L||"undefined")+" filter | clear filter",children:j})]})]})}),u&&(0,a.jsx)("div",{class:"author_bio",children:u}),(0,a.jsx)("div",{className:"filter-items__items",children:(0,a.jsxs)("div",{className:"wrapper",children:[(0,a.jsx)(a.Fragment,{children:u&&y&&t&&(0,a.jsxs)("h1",{class:"filter-items__title",children:[t," by ",y]})}),(0,a.jsx)(a.Fragment,{children:!u&&t&&!F&&(0,a.jsx)("h2",{class:"filter-items__title",children:t})}),(0,a.jsx)(a.Fragment,{children:!u&&t&&F&&M&&(0,a.jsx)("h1",{class:"filter-items__title",children:t})}),(0,a.jsx)(a.Fragment,{children:!u&&t&&F&&!M&&(0,a.jsx)("h2",{class:"filter-items__title",children:t})}),Boolean(h.length)&&(0,a.jsx)("div",{className:"filter-items__items__list",children:h.slice(0,S).map(p)}),Boolean(!h.length)&&s&&(0,a.jsx)("div",{className:"filter-items__items__empty",children:(0,a.jsx)("p",{children:s})})]})}),T&&(0,a.jsx)("div",{className:"filter-items__load-more",children:(0,a.jsx)("div",{className:"wrapper",children:(0,a.jsx)("a",{rel:"next",href:A,onClick:T,children:w})})})]})}},9336:(e,t,l)=>{l.r(t),l.d(t,{default:()=>i});const i={}}}]);
2//# sourceMappingURL=filter-items.639d8d5d.chunk.js.map