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) 2.13 kB
"use strict";const t=require("react/jsx-runtime"),o=require("react"),c=require("semantic-ui-react"),A=require("react-redux"),N=require("../../lib/hooks/window-dimensions.js"),j=({content:r,link:n,index:i})=>t.jsx(c.GridColumn,{children:t.jsxs(c.GridRow,{id:"ref_"+i,className:"reference",children:[t.jsx("div",{className:"index",children:i}),t.jsx("div",{className:"content",children:r}),t.jsx("div",{className:"link",children:t.jsx("a",{href:n,target:"_blank",children:n})})]})}),R=r=>{let n;try{n=decodeURIComponent(r)}catch{n=r,console.error("error occurred decoding content:"+r)}return n},T=({editing:r=!1,"data-columns":n=3,"data-height":i=1e3,"data-flex-direction":l="row"})=>{const{width:f}=N.useWindowDimensionsAndDevice(),[y,x]=o.useState(window.innerWidth>window.innerHeight?"landscape":"portrait"),[u,p]=o.useState(f<1380);o.useEffect(()=>{const e=()=>{x(window.innerWidth>window.innerHeight?"landscape":"portrait"),p(window.innerWidth<1380)};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[]);const m={flexDirection:l},[h,b]=o.useState([]);l=="column"&&n>1&&(m.height=i+"px"),o.useEffect(()=>{try{setTimeout(()=>{const e=window.parent.document.querySelectorAll("div.wp-reference");b(e)},3e3)}catch{}});const g=h?new Array(...h):[],a=[];return g.forEach(e=>{a.find(d=>d.getAttribute("data-index")==e.getAttribute("data-index"))||a.push(e)}),t.jsxs(c.Container,{className:"references list",children:[r&&t.jsx("div",{className:"edit-mode-message",children:t.jsx("p",{children:"No preview available. The full list of references will be displayed in the live page."})}),t.jsx(c.Grid,{fluid:!0,stretched:!!u,columns:u?1:n,style:m,children:a.sort((e,s)=>{const d=e.getAttribute("data-index")??"",w=s.getAttribute("data-index")??"",I=d?parseInt(d):Number.POSITIVE_INFINITY,v=w?parseInt(w):Number.POSITIVE_INFINITY;return I-v}).map(e=>{const s=e.getAttribute("data-index")??"";return t.jsx(j,{index:s,content:R(e.getAttribute("data-description")),link:e.getAttribute("data-link")},s)})})]})},E=(r,n)=>({random:r.getIn(["embeddable","random"])}),q={},S=A.connect(E,q)(T);module.exports=S;