@devgateway/dvz-ui-react/dist/cjs/embeddable/featuredtabs/index.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"),a=require("react"),o=require("semantic-ui-react"),u=require("@devgateway/wp-react-lib"),P=require("../connected-templates/PostIntro.js"),S=require("../../lib/hooks/window-dimensions.js"),_=require("react-redux"),M=({post:n,onClick:g,active:c,moreLabel:l})=>{const m=n._embedded?n._embedded["wp:featuredmedia"]:null;return e.jsxs("div",{className:"cover",style:{backgroundImage:`url(${m?m[0].source_url:""})`},children:[e.jsx(P.default,{post:n}),c?e.jsxs(o.Label,{onClick:g,children:[e.jsx(o.Icon,{name:"arrow alternate circle left outline",size:"large"})," Back "]}):e.jsxs(o.Label,{onClick:g,children:[e.jsx(o.Icon,{name:"search",size:"large"})," ",l]})]})},T=({post:n})=>{const l=new DOMParser().parseFromString(n.content.rendered,"text/html").querySelector("figure");return l?e.jsx("div",{style:{flex:"0 0 40px"},dangerouslySetInnerHTML:{__html:l.outerHTML}}):null},L=({posts:n,width:g,height:c,color:l,moreLabel:m})=>{const[f,r]=a.useState(null),[j,y]=a.useState(!1),[b,p]=a.useState([0,0]),h=l.split(","),w=t=>{j?(y(!1),r(t)):(r(t),y(!0))};return a.useEffect(()=>{f&&p([window.scrollX,window.scrollY]),f==null&&window.scrollTo(b[0],b[1])},[f]),a.useEffect(()=>{window.setTimeout(()=>{if(window.location.hash){const t=window.location.hash.substr(1),s=document.getElementById(t);s&&n&&n.map(i=>i.slug).indexOf(t)>-1&&(r(t),s.scrollIntoView({behavior:"auto",block:"start"}))}},0)},[n]),e.jsx(o.Container,{fluid:!0,className:"featured tabs",style:{minHeight:`${c}px`},children:e.jsx(o.Grid,{stackable:!0,columns:f!=null?1:n==null?void 0:n.length,className:"desktop",children:n==null?void 0:n.map((t,s)=>{var i;return e.jsxs(a.Fragment,{children:[e.jsxs(o.Grid.Column,{style:f==null?{display:"block",visibility:"visible",backgroundColor:h[s]}:{display:"none",visibility:"hidden"},children:[e.jsx("a",{id:t.slug}),e.jsx(M,{post:t,moreLabel:m,onClick:()=>w(t.slug)})]}),e.jsxs(o.Grid.Column,{className:"expanded",style:f!=t.slug?{display:"none",visibility:"hidden"}:{display:"block",visibility:"visible"},children:[e.jsxs(o.Segment,{style:{backgroundColor:h[s]},children:[((i=t.meta_fields)==null?void 0:i.icon)&&e.jsx(u.MediaProvider,{id:t.meta_fields?t.meta_fields.icon[0]:null,children:e.jsx(u.MediaConsumer,{children:e.jsx(u.PostIcon,{})})}),e.jsx(u.PostTitle,{as:"h2",post:t,className:"has-standard-36-font-size has-white-color"}),e.jsx(o.Label,{className:"closeIcon",onClick:()=>r(null),children:e.jsx(o.Icon,{name:"times circle outline",size:"large"})})]}),e.jsx(u.PostContent,{as:"div",fluid:!0,post:t,style:{maxHeight:`calc(${c}px - 150px)`}}),e.jsxs(o.Label,{className:"closeIconText",style:{backgroundColor:`${h[s]}`},onClick:()=>r(null),children:[e.jsx(o.Icon,{name:"times circle outline",size:"large"})," Close "]})]})]},t.slug)})})})},A=({posts:n,activeItem:g,setActive:c,color:l})=>{const[m,f]=a.useState(n.findIndex(i=>i.slug===g)),[r,j]=a.useState(null),y=l.split(","),b=()=>{var i;return((i=window.screen.orientation)==null?void 0:i.type)||(window.innerWidth>window.innerHeight?"landscape-primary":"portrait-primary")},[p,h]=a.useState(b()),w=()=>{setTimeout(()=>{h(b())},100)},t=(i,x,d)=>{document.querySelectorAll(i).forEach(C=>{C.querySelector(x)&&C.classList.add(d)})};a.useEffect(()=>{if(r){const i=r.getBoundingClientRect().top+window.scrollY;window.scrollTo({top:i,behavior:"smooth"})}t(".ui.fluid.container.viz.featured.tabs",".accordion .accordion-post-ft-title","has-accordion-title"),t(".ui.fluid.container.viz.featured.tabs",".accordion .accordion-post-vft-content","has-accordion-content"),t(".ui.fluid.container.viz.featured.tabs","blockquote","has-blockquote"),t(".ui.fluid.container.viz.featured.tabs",".vt-accordion-post-intro figure","has-vt-accordion-figure"),t(".ui.fluid.container.viz.featured.tabs",".content.active.accordion-post-content .wp-block-columns","has-wp-block-columns")},[r]),a.useEffect(()=>(window.screen.orientation&&window.screen.orientation.addEventListener("change",w),window.addEventListener("resize",w),()=>{window.removeEventListener("resize",w),window.screen.orientation&&window.screen.orientation.removeEventListener("change",w)}),[]);const s=(i,x)=>{const{index:d}=x,v=m===d?-1:d;f(v),c(n[d].slug),v!==-1&&j(i.currentTarget)};return e.jsx(o.Accordion,{fluid:!0,styled:!0,children:n.map((i,x)=>{var v;const d=(v=i.meta_fields)!=null&&v.icon?i.meta_fields.icon[0]:null;return e.jsxs(a.Fragment,{children:[e.jsx(o.Accordion.Title,{active:m===x,index:x,onClick:s,style:{backgroundColor:y[x]},children:e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center"},children:[d&&e.jsx(u.MediaProvider,{id:d,children:e.jsx(u.MediaConsumer,{children:e.jsx(u.PostIcon,{className:"icon"})})}),!d&&e.jsx(T,{post:i}),e.jsx("p",{className:"accordion-post-ft-title",dangerouslySetInnerHTML:{__html:i.title.rendered},style:{marginLeft:"10px"}})]}),e.jsx(o.Icon,{name:"chevron down"})]})}),e.jsx(o.Accordion.Content,{className:"accordion-post-ft-content",active:m===x,children:e.jsx(u.PostContent,{post:i})})]},i.id)})})},q=n=>{var I;let{"data-width":g,"data-height":c,"data-type":l,"data-taxonomy":m,"data-categories":f,"data-items":r,"data-color":j,"data-use-scrolls":y,"data-read-more-label":b="READ More","data-preview-mode":p="Desktop",editing:h,parent:w,unique:t,pageModuleProps:s}=n;const i=n.intl.locale;s!=null&&s.editing&&(s!=null&&s.previewMode)&&(h=s.editing,p=s.previewMode);const x=y=="true",{width:d}=S.useWindowDimensionsAndDevice(),v=d<=1250,C=p!=="Desktop"&&h,k=v&&!h;return e.jsx(o.Container,{className:`viz featured tabs ${h?"editing":""} ${x?"scrollable":""}`,fluid:!0,children:e.jsx(u.PostProvider,{locale:i,type:l,taxonomy:m,categories:f,store:`tabbedposts_${w}_${t}`,page:1,perPage:r,children:e.jsx(u.PostConsumer,{children:C||k?e.jsx(A,{posts:r,activeItem:(I=r==null?void 0:r[0])==null?void 0:I.slug,color:j,setActive:()=>{}}):e.jsx(L,{moreLabel:b,color:j,width:g,height:c})})})})},z=(n,g)=>{const c=n.getIn(["data","pageModuleProps"]),l={};return c&&(l.pageModuleProps=c),l},E={},N=_.connect(z,E)(q);exports.default=N;