@devgateway/dvz-ui-react
Version:
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.
2 lines (1 loc) • 2.83 kB
JavaScript
Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),g=require("semantic-ui-react"),f=require("react"),I=require("clsx"),c=require("../utils/semanticUtils.js"),N=require("react-intl"),S=require("@devgateway/wp-react-lib"),j=(s,n)=>{if(!n)return s;const u=new RegExp(`(${n})`,"gi");return s.replace(u,"<strong>$1</strong>")},k=N.injectIntl(({title:s,slug:n,parent_link:u,extract:m,link:y,searchTerm:d,metadata:r,bread_crumbs:a=[],intl:{locale:i}})=>{let o=u?S.utils.replaceLink(u,i)+`#${n}`:S.utils.replaceLink(y,i);o=r!=null&&r.redirect_url?(r==null?void 0:r.redirect_url)+`#${n}`:o;const x=j(String(s),d),h=j(m,d);return t.jsx("div",{className:"search-results-wrapper searching-results",style:{display:"flex",flexDirection:"column"},children:t.jsxs("div",{className:"has-standard-12-font-size",onClick:()=>document.location.href=o,children:[t.jsx("h5",{className:"breadcrumbs-search",dangerouslySetInnerHTML:{__html:Array.isArray(a)&&a.length>0?j(a.join(" / "),d):""}}),t.jsx("div",{className:"has-standard-14-font-size",children:t.jsx("h4",{className:"search-title",dangerouslySetInnerHTML:{__html:x}})}),t.jsx("div",{className:"has-standard-12-font-size search-content",dangerouslySetInnerHTML:{__html:S.utils.replaceHTMLinks(h,i)}})]})})}),U=s=>{const{results:n,onSearchChange:u,value:m,showNoResults:y,onResultSelect:d,loading:r,placeholder:a,perPage:i,total:o,searchTerm:x}=s,h=N.useIntl(),[v,E]=f.useState(""),[w,M]=f.useState(!1),[H,L]=f.useState(!1),P=n&&n.length>0?[{isHeader:!0,headerText:h.formatMessage({id:"search.results.summary",defaultMessage:"{count} of {} Results"},{count:o<i?o:i,total:o})},...n]:[],R=()=>{const{perPage:e,total:l}=s,$=I("results header",l===1&&"single");return t.jsx(g.Segment,{basic:!0,textAlign:"left",className:$,children:h.formatMessage({id:"search.results.summary",defaultMessage:"{count} of {} Results"},{count:l<e?l:e,total:l})})},p=e=>e.isHeader?R():(console.log("res",e),t.jsx(f.Fragment,{children:t.jsx(k,{...e,searchTerm:x})})),q=e=>t.jsx(g.Input,{icon:"search",placeholder:a,...e}),T=(e,l)=>{M(!1),s.onBlur&&s.onBlur(e,l)},_=(e,l)=>{M(!0),s.onFocus&&s.onFocus(e,l)},F=e=>{L(!0),s.onMouseDown&&s.onMouseDown(e)},{aligned:O,category:b,className:z,fluid:A,size:C}=s,D=I("ui",H&&"active",C,v,c.useKeyOnly(b,"category"),c.useKeyOnly(w,"focus"),c.useKeyOnly(A,"fluid"),c.useKeyOnly(r,"loading"),c.useValueAndKey(O,"aligned"),"search",z),K=c.getUnhandledProps(g.Search,s),[V,B]=c.partitionHTMLProps(K,{htmlProps:c.htmlInputAttrs});return t.jsx(g.Search,{...B,className:D,onBlur:T,size:"mini",aligned:"right",placeholder:a,onFocus:_,onMouseDown:F,resultRenderer:e=>p(e),onSearchChange:u,results:P,input:q(),value:m,showNoResults:y,onResultSelect:d,loading:r,header:R()})};exports.default=U;
;