@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) • 3.12 kB
JavaScript
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),i=require("semantic-ui-react"),l=require("@devgateway/wp-react-lib"),o=require("react"),C=require("react-intl"),v=require("../connected-templates/PostContent.js"),P=n=>e.jsx("img",{src:n.media&&n.media.guid?n.media.guid.rendered:null,className:"svg-icon"}),b=function(n){return n?n.toString().replace(/&#(\d+);/g,function(x,u){return String.fromCharCode(u)}):""},N=({pages:n,title:x,selected:u,onPageSelected:j})=>{const s=n?n.sort((t,r)=>t.menu_order-r.menu_order):[],[d,m]=o.useState({id:-1});o.useEffect(()=>{m(s[0])},[n]);const p=s.map(t=>({page:t,id:t.id,label:t.meta_fields.label?t.meta_fields.label:t.title.rendered,iconComponent:e.jsx(l.MediaProvider,{id:t.meta_fields&&t.meta_fields.icon?t.meta_fields.icon[0]:null,children:e.jsx(l.MediaConsumer,{children:e.jsx(P,{})})})})),[g,f]=o.useState(null);o.useEffect(()=>{j(g)},[g]);const c=({pages:t,selected:r,expanded:h})=>(!g&&h&&f(t[0]),t&&t.map(a=>e.jsx(i.Menu.Item,{className:`${r&&a.id==r.id?"selected":""}`,onClick:I=>j(a),children:a.title.rendered},a.id)));return e.jsxs(i.Container,{fluid:!0,children:[e.jsxs(i.Menu,{vertical:!0,text:!0,size:"mini",className:"navbar-menu",children:[e.jsx(i.Menu.Item,{header:!0,children:x}),p.map(t=>e.jsxs(i.Menu.Item,{className:`group ${t.id===d.id?"group-selected":""}`,onClick:r=>{m(t);const h=document.getElementsByClassName("group");for(let a=0;a<h.length;a++)h[a].classList.remove("group-selected");r.currentTarget.classList.add("group-selected")},children:[t.iconComponent?t.iconComponent:e.jsx(i.Image,{src:t.icon}),e.jsx("span",{children:b(t.label)}),e.jsx("div",{className:"green-rectangle"}),e.jsx(i.Menu.Menu,{className:`${t.id==d.id?"expanded":"collapsed"}`,children:e.jsx(l.PageProvider,{locale:"en",parent:t.id,store:"child_menu"+t.id,perPage:100,children:e.jsx(l.PageConsumer,{children:e.jsx(c,{selected:u,expanded:t.id==d.id})})})})]},t.label))]}),e.jsx("div",{className:"navbar-footer",children:e.jsx("p",{className:"navbar-footer-text",children:"Data and publications were made possible through support of the United States Agency for International Development (USAID)."})})]})},S=({page:n})=>e.jsx(i.Container,{children:e.jsx(v.default,{post:n})}),M=n=>{const{"data-height":x,"data-style":u,"data-columns":j,"data-parent":s,"data-title":d="Menu",editing:m,component:p,unique:g,intl:{locale:f}}=n,[c,t]=o.useState(null),r=m?{padding:"4px",margin:"0px"}:{};return e.jsxs(i.Container,{style:r,fluid:!0,className:"viz child page navigator",children:[s&&e.jsx(l.PageProvider,{locale:f,parent:s,noCache:!0,store:"child_menu"+n.parent+"_"+n.unique,perPage:100,children:e.jsx(i.Grid,{children:e.jsxs(i.Grid.Row,{children:[e.jsx(i.Grid.Column,{className:"navigator",width:2,children:e.jsx(l.PageConsumer,{children:e.jsx(N,{selected:c,title:d,onPageSelected:t})})}),e.jsx(i.Grid.Column,{width:14,className:"content",children:c&&e.jsx(S,{page:c})})]})})}),!s&&e.jsx(i.Segment,{color:"red",children:"No child pages here"})]})},_=C.injectIntl(M);exports.default=_;