@devgateway/dvz-ui-react/dist/cjs/layout/SearchControl.js

A modular, embeddable React component library for data visualization and UI, built with TypeScript. Provides reusable components for charts, maps, dashboards, and more, with built-in support for internationalization and Redux integration.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),d=require("react"),m=require("@devgateway/wp-react-lib"),I=require("./CustomSemanticSearch.js"),M=require("react-dom"),N=require("semantic-ui-react"),v=require("react-intl"),j=(n,r)=>{if(!r)return n;const a=new RegExp(`(${r})`,"gi");return n.replace(a,"<strong>$1</strong>")},w=v.injectIntl(({ID:n,title:r,slug:a,parent_title:i,parent_slug:t,parent_link:c,extract:o,type:h,link:l,terms:f,subtype:g,bread_crumbs:s=[],metadata:{redirect_url:p},intl:{locale:x},searchTerm:u})=>{let S=c?m.utils.replaceLink(c,x)+`#${a}`:m.utils.replaceLink(l,x);S=p?p+`#${a}`:S;const y=j(String(r),u),R=j(o,u);return e.jsx("div",{className:"search-results-wrapper searching-results",style:{display:"flex",flexDirection:"column"},children:e.jsxs("div",{className:"has-standard-12-font-size",onClick:T=>document.location.href=S,children:[e.jsx("h5",{className:"breadcrumbs-search",dangerouslySetInnerHTML:{__html:s&&s.length>0?j(s.join(" / "),u):""}}),e.jsx("div",{className:"has-standard-14-font-size",children:e.jsx("h4",{className:"search-title",dangerouslySetInnerHTML:{__html:y}})}),e.jsx("div",{className:"search-content",dangerouslySetInnerHTML:{__html:m.utils.replaceHTMLinks(R,x)}})]})})}),C=({results:n,meta:r,perPage:a,intl:i,searchTerm:t})=>{const c=r?r["x-wp-total"]:0;return r&&r["x-wp-totalpages"],e.jsxs("div",{id:"float-results-container",children:[e.jsx("span",{className:"float-results-header",children:i.formatMessage({id:"search.results.summary",defaultMessage:"{count} of {total} Results"},{count:c<a?c:a,total:c})}),n.map(o=>e.jsx(w,{...o,searchTerm:t},o.ID))]})},E=({onSearch:n,perPage:r,loading:a,results:i,meta:t,intl:c})=>(t&&t["x-wp-total"],t&&t["x-wp-totalpages"],e.jsx("input",{placeholder:c.formatMessage({id:"search.placeholder",defaultMessage:"Search..."}),type:"text",className:"input search",name:"search",onChange:o=>{n(o.target.value)}})),L=({onSearch:n,onSetSelected:r,perPage:a,loading:i,results:t,meta:c,locale:o,intl:h,searchTerm:l})=>{const[f,g]=d.useState(!1),s=d.useRef(null);d.useEffect(()=>{const u=document.createElement("div");u.setAttribute("id","float-input-container"),u.setAttribute("class","input container"),u.style.display="none";const S=document.getElementById("root");return S&&(S.appendChild(u),s.current=u),()=>{s.current&&s.current.parentNode&&s.current.parentNode.removeChild(s.current)}},[]),d.useEffect(()=>{s.current&&(s.current.style.display=f?"block":"none")},[f]);const p=()=>{r(null),g(!0)},x=()=>{g(!1)};return e.jsxs(e.Fragment,{children:[e.jsx("div",{id:"ui-float-search",className:"ui float-search",onMouseOver:p,children:e.jsx(N.Icon,{name:"search",size:"small"})}),s.current&&M.createPortal(f?e.jsxs("div",{onMouseLeave:x,children:[e.jsx("div",{className:"float-search-container",children:e.jsx(E,{onSearch:n,perPage:a,loading:i,results:t,meta:c,intl:h,searchTerm:l})}),t&&t.length>0&&e.jsx(v.IntlProvider,{locale:o,children:e.jsx(C,{results:t,meta:c,perPage:a,intl:h,searchTerm:l})})]}):null,s.current)]})},b=({onSearch:n,perPage:r,loading:a,results:i,meta:t,intl:c})=>{const o=t?t["x-wp-total"]:0,h=t?t["x-wp-totalpages"]:0,[l,f]=d.useState("");d.useEffect(()=>{const s=setTimeout(()=>{n(l)},300);return()=>clearTimeout(s)},[l]);const g=s=>e.jsx(w,{...s,searchTerm:l});return e.jsx(I.default,{value:l,loading:a,placeholder:c.formatMessage({id:"search.placeholder",defaultMessage:"Search..."}),onResultSelect:(s,p)=>null,total:o,perPage:r,totalPages:h,onSearchChange:(s,p)=>{f(p.value)},resultRenderer:g,results:i,showNoResults:!1,intl:c,searchTerm:l})},q=v.injectIntl(n=>{const{intl:r,onSetSelected:a}=n,[i,t]=d.useState(""),[c,o]=d.useState(!1);d.useEffect(()=>{const l=()=>{o(window.innerWidth<=1365)};return l(),window.addEventListener("resize",l),()=>window.removeEventListener("resize",l)},[]);const h=n.settings.react_search_type==="floating"||c?e.jsx(L,{onSetSelected:a,onSearch:t,perPage:5,...n,searchTerm:i}):e.jsx(b,{onSetSelected:a,onSearch:t,perPage:5,...n});return e.jsx(m.SearchProvider,{search:i,perPage:5,locale:r.locale,children:e.jsx(m.SearchConsumer,{children:h})})});exports.default=q;