UNPKG

@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) 1.77 kB
"use strict";const e=require("react/jsx-runtime"),d=require("@devgateway/wp-react-lib"),I=require("../connected-templates/PostIntro.js"),U=require("react"),u=require("semantic-ui-react"),h=require("pure-react-carousel"),W=require("./timeline.js"),$=r=>{let o=0;const{posts:i,height:a,interval:s,autoSwitch:n,currentSlide:l}=r;return e.jsx(h.CarouselProvider,{currentSlide:l,interval:s,isPlaying:n,totalSlides:i.length,children:e.jsx(h.Slider,{style:{height:`${a}px`},tag:"ul",children:i.map(c=>e.jsx(h.Slide,{index:o++,tag:"li",children:e.jsx(I,{post:c,fluid:!0})}))})})},J=r=>{const{"data-type":o,"data-taxonomy":i,"data-categories":a,"data-count":s,"data-height":n,"data-line-color":l="#000","data-config":c="{}","data-position":x="middle","data-line-width":C="1","data-margin-left":S=50,"data-margin-top":j=25,"data-margin-right":f=50,"data-margin-bottom":P=25,"data-font-size":q=14,"data-title-width":R=100,"data-subtitle-width":w=50,editing:g,parent:y,unique:N}=r,[m,b]=U.useState([0]),p=t=>g?t:decodeURIComponent(t),v=t=>JSON.parse(p(t)),z={marginLeft:S,marginTop:j,marginRight:f,marginBottom:P,lineWidth:C,height:150,position:x,lineColor:p(l),config:JSON.parse(decodeURIComponent(c)),fontSize:q,titleWidth:R,subtitleWidth:w};return e.jsx(u.Container,{style:{height:`${n}px`},className:"viz new-time-line ",fluid:!0,children:e.jsxs(d.PostProvider,{type:o,taxonomy:i,categories:v(a),store:"carousel_"+y+"_"+N,page:1,perPage:s,children:[e.jsx(u.Container,{className:"carousel-section",children:e.jsx(d.PostConsumer,{children:e.jsx($,{currentSlide:m,height:n-250,interval:5,autoSwitch:!1})})}),e.jsx(u.Container,{className:"time-line-section",children:e.jsx(d.PostConsumer,{children:e.jsx(W,{currentSlide:m,onSelectSlide:t=>{b(t)},...z})})})]})})};module.exports=J;