@devgateway/dvz-ui-react 1.9.14 → 1.9.15

package/dist/cjs/embeddable/tabbedposts/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),u=require("react"),l=require("semantic-ui-react"),h=require("@devgateway/wp-react-lib"),S=require("react-intl"),A=require("react-redux"),y=require("../connected-templates/PostIntro.js"),L=require("../../lib/hooks/window-dimensions.js"),q=({posts:t,activeItem:r,setActive:i,showLabels:n})=>t?t.map(s=>e.jsx(l.Menu.Item,{onClick:()=>i(s.slug),className:s.slug===r?"active":"",children:n?e.jsx(h.PostLabel,{post:s}):e.jsx(l.Label,{children:e.jsx("span",{dangerouslySetInnerHTML:{__html:s.title.rendered}})})},s.id)):null,$=({posts:t,activeItem:r,setActive:i,showIcons:n,showLabels:s})=>{const o=t.length;return t?t.map(a=>{var m,g;return(m=a._embedded)!=null&&m["wp:featuredmedia"]&&a._embedded["wp:featuredmedia"][0].source_url,e.jsx(l.Grid.Column,{className:(a.slug===r?"active":"")+(n?" has-icon":""),children:e.jsxs(l.Button,{onClick:()=>i(a.slug),className:`nav  ${o===1?"one":""}`,children:[n&&e.jsx(h.MediaProvider,{id:(g=a.meta_fields)!=null&&g.icon?a.meta_fields.icon[0]:null,children:e.jsx(h.MediaConsumer,{children:e.jsx(h.PostIcon,{className:"icon"})})}),s?e.jsx(h.PostLabel,{post:a}):e.jsx(l.Label,{children:e.jsx("span",{dangerouslySetInnerHTML:{__html:a.title.rendered}})})]})},a.id)}):null},C=({posts:t,activeItem:r})=>(u.useEffect(()=>{const i=document.querySelector(".ui.container.content-tab");i&&(i.scrollTop=0)},[r]),t?t.map(i=>{let n={};return i.slug!==r?n={position:"absolute",left:"-3000px",width:"auto",height:"0px",overflow:"hidden",visibility:"hidden"}:n={visibility:"visible",position:"relative",width:"auto"},e.jsx(y.default,{as:l.Container,fluid:!0,post:i,style:n},i.slug)}):null),k=({posts:t,activeItem:r,setActive:i})=>{const[n,s]=u.useState(t.findIndex(d=>d.slug===r)),[o,a]=u.useState(null),m=u.useRef(null);u.useEffect(()=>{if(o){const d=o.getBoundingClientRect().top+window.scrollY;window.scrollTo({top:d,behavior:"smooth"})}},[o]);const g=(d,x)=>{const{index:c}=x,j=n===c?-1:c;s(j),i(t[c].slug),j!==-1&&a(d.currentTarget)};return e.jsx(l.Accordion,{fluid:!0,styled:!0,children:t.map((d,x)=>{var j;const c=(j=d.meta_fields)!=null&&j.icon?d.meta_fields.icon[0]:null;return e.jsxs(u.Fragment,{children:[e.jsx(l.Accordion.Title,{active:n===x,index:x,onClick:g,children:e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center"},children:[c&&e.jsx(h.MediaProvider,{id:c,children:e.jsx(h.MediaConsumer,{children:e.jsx(h.PostIcon,{className:"icon"})})}),e.jsx("span",{dangerouslySetInnerHTML:{__html:d.title.rendered},style:{marginLeft:c?"10px":"0"}})]}),e.jsx(l.Icon,{name:"chevron down"})]})}),e.jsx(l.Accordion.Content,{className:"accordion-post-content",active:n===x,children:e.jsx("div",{ref:m,children:e.jsx(y.default,{post:d,as:l.Container,fluid:!0})})})]},d.id)})})},R=({posts:t,showLabels:r,height:i})=>{const[n,s]=u.useState(t?t[0].slug:null);return u.useEffect(()=>{setTimeout(()=>{if(window.location.hash){const o=window.location.hash.substr(1),a=document.getElementById(o);a&&t.map(m=>m.slug).indexOf(o)>-1&&(s(o),a.scrollIntoView({behavior:"auto",block:"start"}))}},0)},[t]),e.jsxs(u.Fragment,{children:[t.map(o=>e.jsx("anchor",{id:o.slug},o.slug)),e.jsx(l.Menu,{className:"tabbed posts",text:!0,children:e.jsx(q,{showLabels:r,posts:t,setActive:s,activeItem:n})}),e.jsx(l.Container,{className:"content-tab",style:{height:`${i}px`},children:e.jsx(C,{posts:t,activeItem:n})})]})},D=({posts:t,showLabels:r,showIcons:i,height:n})=>{const[s,o]=u.useState(t?t[0].slug:null);return e.jsx(u.Fragment,{children:e.jsxs(l.Grid,{stackable:!0,className:"tabbed posts",columns:t.length,style:{height:n+"px"},children:[e.jsx($,{showIcons:i,showLabels:r,posts:t,activeItem:s,setActive:o}),e.jsx(l.Grid.Row,{style:{height:`${n}px`},children:e.jsx(l.Grid.Column,{width:16,className:"content",children:e.jsx(l.Container,{className:"content-tab",style:{height:`${n}px`},children:e.jsx(C,{className:"content-tab",posts:t,activeItem:s})})})})]})})},G=t=>{var w;let{"data-type":r,"data-taxonomy":i,"data-categories":n,"data-items":s,"data-theme":o="light","data-show-icons":a,"data-use-scrolls":m,"data-show-labels":g,"data-height":d,"data-preview-mode":x="Desktop",pageModuleProps:c,parent:j,editing:b,unique:I}=t;c!=null&&c.previewMode&&(c!=null&&c.editing)&&(x=c.previewMode,b=c.editing);const p=t.intl.locale,M=Array.isArray(n)?n.join(",").toString():n,f=m==="true",v=f?d:void 0,{width:_}=L.useWindowDimensionsAndDevice(),N=_<=1024,P=x!=="Desktop"&&b,T=N&&!b;return b&&!r?e.jsx(l.Container,{className:`viz tabbed posts ${b?"editing":""} ${f?"scrollable":""}`,fluid:!0}):e.jsx(l.Container,{className:`viz tabbed posts ${b?"editing":""} ${f?"scrollable":""}`,fluid:!0,children:e.jsx(h.PostProvider,{locale:p,type:r,taxonomy:i,categories:M,store:`tabbedposts_${j}_${I}`,page:1,perPage:s,children:e.jsx(h.PostConsumer,{children:e.jsx(h.PostConsumer,{children:T||P?e.jsx(k,{posts:s,activeItem:(w=s[0])==null?void 0:w.slug,setActive:()=>{}}):o==="light"?e.jsx(R,{height:v,showLabels:g==="true"}):e.jsx(D,{height:v,showLabels:g==="true",showIcons:a==="true"})})})})})},E=(t,r)=>{const i=t.getIn(["data","pageModuleProps"]),n={};return i&&(n.pageModuleProps=i),n},H={},z=A.connect(E,H)(S.injectIntl(G));exports.default=z;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),u=require("react"),r=require("semantic-ui-react"),h=require("@devgateway/wp-react-lib"),A=require("react-intl"),L=require("react-redux"),p=require("../connected-templates/PostIntro.js"),q=require("../../lib/hooks/window-dimensions.js"),$=({posts:t,activeItem:l,setActive:i,showLabels:n})=>t?t.map(s=>e.jsx(r.Menu.Item,{onClick:()=>i(s.slug),className:s.slug===l?"active":"",children:n?e.jsx(h.PostLabel,{post:s}):e.jsx(r.Label,{children:e.jsx("span",{dangerouslySetInnerHTML:{__html:s.title.rendered}})})},s.id)):null,k=({posts:t,activeItem:l,setActive:i,showIcons:n,showLabels:s})=>{const o=t.length;return t?t.map(a=>{var m,g;return(m=a._embedded)!=null&&m["wp:featuredmedia"]&&a._embedded["wp:featuredmedia"][0].source_url,e.jsx(r.Grid.Column,{className:(a.slug===l?"active":"")+(n?" has-icon":""),children:e.jsxs(r.Button,{onClick:()=>i(a.slug),className:`nav  ${o===1?"one":""}`,children:[n&&e.jsx(h.MediaProvider,{id:(g=a.meta_fields)!=null&&g.icon?a.meta_fields.icon[0]:null,children:e.jsx(h.MediaConsumer,{children:e.jsx(h.PostIcon,{className:"icon"})})}),s?e.jsx(h.PostLabel,{post:a}):e.jsx(r.Label,{children:e.jsx("span",{dangerouslySetInnerHTML:{__html:a.title.rendered}})})]})},a.id)}):null},I=({posts:t,activeItem:l})=>(u.useEffect(()=>{const i=document.querySelector(".ui.container.content-tab");i&&(i.scrollTop=0)},[l]),t?t.map(i=>{let n={};return i.slug!==l?n={position:"absolute",left:"-3000px",width:"auto",height:"0px",overflow:"hidden",visibility:"hidden"}:n={visibility:"visible",position:"relative",width:"auto"},e.jsx(p.default,{as:r.Container,fluid:!0,post:i,style:n},i.slug)}):null),R=({posts:t,activeItem:l,setActive:i})=>{const[n,s]=u.useState(t.findIndex(d=>d.slug===l)),[o,a]=u.useState(null),m=u.useRef(null);u.useEffect(()=>{if(o){const d=o.getBoundingClientRect().top+window.scrollY;window.scrollTo({top:d,behavior:"smooth"})}},[o]);const g=(d,x)=>{const{index:c}=x,j=n===c?-1:c;s(j),i(t[c].slug),j!==-1&&a(d.currentTarget)};return e.jsx(r.Accordion,{fluid:!0,styled:!0,children:t.map((d,x)=>{var j;const c=(j=d.meta_fields)!=null&&j.icon?d.meta_fields.icon[0]:null;return e.jsxs(u.Fragment,{children:[e.jsx(r.Accordion.Title,{active:n===x,index:x,onClick:g,children:e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center"},children:[c&&e.jsx(h.MediaProvider,{id:c,children:e.jsx(h.MediaConsumer,{children:e.jsx(h.PostIcon,{className:"icon"})})}),e.jsx("span",{dangerouslySetInnerHTML:{__html:d.title.rendered},style:{marginLeft:c?"10px":"0"}})]}),e.jsx(r.Icon,{name:"chevron down"})]})}),e.jsx(r.Accordion.Content,{className:"accordion-post-content",active:n===x,children:e.jsx("div",{ref:m,children:e.jsx(p.default,{post:d,as:r.Container,fluid:!0})})})]},d.id)})})},D=({posts:t,showLabels:l,height:i})=>{const[n,s]=u.useState(t?t[0].slug:null);return u.useEffect(()=>{setTimeout(()=>{if(window.location.hash){const o=window.location.hash.substr(1),a=document.getElementById(o);a&&t.map(m=>m.slug).indexOf(o)>-1&&(s(o),a.scrollIntoView({behavior:"auto",block:"start"}))}},0)},[t]),e.jsxs(u.Fragment,{children:[t.map(o=>e.jsx("anchor",{id:o.slug},o.slug)),e.jsx(r.Menu,{className:"tabbed posts",text:!0,children:e.jsx($,{showLabels:l,posts:t,setActive:s,activeItem:n})}),e.jsx(r.Container,{className:"content-tab",style:{height:`${i}px`},children:e.jsx(I,{posts:t,activeItem:n})})]})},G=({posts:t,showLabels:l,showIcons:i,height:n})=>{const[s,o]=u.useState(t?t[0].slug:null);return e.jsx(u.Fragment,{children:e.jsxs(r.Grid,{stackable:!0,className:"tabbed posts",columns:t.length,style:{height:n+"px"},children:[e.jsx(k,{showIcons:i,showLabels:l,posts:t,activeItem:s,setActive:o}),e.jsx(r.Grid.Row,{style:{height:`${n}px`},children:e.jsx(r.Grid.Column,{width:16,className:"content",children:e.jsx(r.Container,{className:"content-tab",style:{height:`${n}px`},children:e.jsx(I,{className:"content-tab",posts:t,activeItem:s})})})})]})})},E=t=>{var C;let{"data-type":l,"data-taxonomy":i,"data-categories":n,"data-items":s,"data-theme":o="light","data-show-icons":a,"data-use-scrolls":m,"data-show-labels":g,"data-height":d,"data-preview-mode":x="Desktop",pageModuleProps:c,parent:j,editing:b,unique:M}=t;c!=null&&c.previewMode&&(c!=null&&c.editing)&&(x=c.previewMode,b=c.editing);const _=t.intl.locale;let f=n;if(Array.isArray(n))f=n.join(",");else if(typeof n=="string")try{const w=JSON.parse(n);Array.isArray(w)&&(f=w.join(","))}catch{}const v=m==="true",y=v?d:void 0,{width:N}=q.useWindowDimensionsAndDevice(),P=N<=1024,T=x!=="Desktop"&&b,S=P&&!b;return b&&!l?e.jsx(r.Container,{className:`viz tabbed posts ${b?"editing":""} ${v?"scrollable":""}`,fluid:!0}):e.jsx(r.Container,{className:`viz tabbed posts ${b?"editing":""} ${v?"scrollable":""}`,fluid:!0,children:e.jsx(h.PostProvider,{locale:_,type:l,taxonomy:i,categories:f,store:`tabbedposts_${j}_${M}`,page:1,perPage:s,children:e.jsx(h.PostConsumer,{children:e.jsx(h.PostConsumer,{children:S||T?e.jsx(R,{posts:s,activeItem:(C=s[0])==null?void 0:C.slug,setActive:()=>{}}):o==="light"?e.jsx(D,{height:y,showLabels:g==="true"}):e.jsx(G,{height:y,showLabels:g==="true",showIcons:a==="true"})})})})})},H=(t,l)=>{const i=t.getIn(["data","pageModuleProps"]),n={};return i&&(n.pageModuleProps=i),n},z={},B=L.connect(H,z)(A.injectIntl(E));exports.default=B;

package/dist/cjs/layout/PreviewComponent.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),s=require("react"),u=require("react-router"),m=require("semantic-ui-react"),w=require("@devgateway/wp-react-lib"),f=require("../embeddable/index.js"),P=()=>{const d=u.useParams(),[p]=u.useSearchParams(),[o]=s.useState(()=>f.getComponentByNameIgnoreCase(d.name??"")),[n,l]=s.useState(()=>Object.fromEntries(p.entries())),i=s.useRef(n);i.current=n;const a=s.useCallback(g=>{const e=g.data;if(e.messageType&&e.messageType==="component-attributes"){const c={...i.current};Object.keys(e).forEach(r=>{c["data-"+r.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()]=typeof e[r]=="object"?Array.isArray(e[r])?e[r].join(","):JSON.stringify(e[r]):e[r]}),l(c)}},[]);return s.useEffect(()=>(window.addEventListener("message",a,!1),window.parent&&window.parent.postMessage({type:"componentReady",value:!0},"*"),window.top&&window.top.postMessage({type:"componentReady",value:!0},"*"),()=>{window.removeEventListener("message",a)}),[a]),t.jsx("div",{children:t.jsx(m.Container,{fluid:!0,className:"editing",children:o?t.jsx(o,{...n,editing:!0}):t.jsx(m.Segment.Group,{color:"red",textAlign:"center",children:t.jsx("h1",{children:"Wrong Component Name"})})})})},j=()=>t.jsx(w.SettingsConsumer,{children:t.jsx(P,{})});exports.default=j;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),r=require("react"),u=require("react-router"),m=require("semantic-ui-react"),w=require("@devgateway/wp-react-lib"),f=require("../embeddable/index.js"),P=()=>{const d=u.useParams(),[p]=u.useSearchParams(),[o]=r.useState(()=>f.getComponentByNameIgnoreCase(d.name??"")),[n,l]=r.useState(()=>Object.fromEntries(p.entries())),i=r.useRef(n);i.current=n;const a=r.useCallback(g=>{const t=g.data;if(t.messageType&&t.messageType==="component-attributes"){const c={...i.current};Object.keys(t).forEach(s=>{c["data-"+s.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()]=typeof t[s]=="object"?JSON.stringify(t[s]):t[s]}),l(c)}},[]);return r.useEffect(()=>(window.addEventListener("message",a,!1),window.parent&&window.parent.postMessage({type:"componentReady",value:!0},"*"),window.top&&window.top.postMessage({type:"componentReady",value:!0},"*"),()=>{window.removeEventListener("message",a)}),[a]),e.jsx("div",{children:e.jsx(m.Container,{fluid:!0,className:"editing",children:o?e.jsx(o,{...n,editing:!0}):e.jsx(m.Segment.Group,{color:"red",textAlign:"center",children:e.jsx("h1",{children:"Wrong Component Name"})})})})},j=()=>e.jsx(w.SettingsConsumer,{children:e.jsx(P,{})});exports.default=j;

package/dist/esm/embeddable/tabbedposts/index.js

@@ -1,47 +1,47 @@
 import { jsx as e, jsxs as f } from "react/jsx-runtime";
-import I, { useState as w, useRef as G, useEffect as x } from "react";
-import { Container as b, Accordion as y, Icon as V, Menu as T, Grid as v, Label as M, Button as W } from "semantic-ui-react";
-import { PostProvider as q, PostConsumer as _, MediaProvider as P, MediaConsumer as A, PostIcon as S, PostLabel as $ } from "@devgateway/wp-react-lib";
-import { injectIntl as E } from "react-intl";
-import { connect as O } from "react-redux";
-import k from "../connected-templates/PostIntro.js";
+import C, { useState as w, useRef as V, useEffect as N } from "react";
+import { Container as b, Accordion as x, Icon as W, Menu as A, Grid as v, Label as P, Button as q } from "semantic-ui-react";
+import { PostProvider as E, PostConsumer as M, MediaProvider as S, MediaConsumer as $, PostIcon as k, PostLabel as L } from "@devgateway/wp-react-lib";
+import { injectIntl as O } from "react-intl";
+import { connect as J } from "react-redux";
+import j from "../connected-templates/PostIntro.js";
 import { useWindowDimensionsAndDevice as U } from "../../lib/hooks/window-dimensions.js";
-const Y = ({ posts: t, activeItem: o, setActive: i, showLabels: n }) => t ? t.map((l) => /* @__PURE__ */ e(
-  T.Item,
+const Y = ({ posts: t, activeItem: r, setActive: i, showLabels: n }) => t ? t.map((l) => /* @__PURE__ */ e(
+  A.Item,
   {
     onClick: () => i(l.slug),
-    className: l.slug === o ? "active" : "",
-    children: n ? /* @__PURE__ */ e($, { post: l }) : /* @__PURE__ */ e(M, { children: /* @__PURE__ */ e("span", { dangerouslySetInnerHTML: { __html: l.title.rendered } }) })
+    className: l.slug === r ? "active" : "",
+    children: n ? /* @__PURE__ */ e(L, { post: l }) : /* @__PURE__ */ e(P, { children: /* @__PURE__ */ e("span", { dangerouslySetInnerHTML: { __html: l.title.rendered } }) })
   },
   l.id
-)) : null, J = ({
+)) : null, K = ({
   posts: t,
-  activeItem: o,
+  activeItem: r,
   setActive: i,
   showIcons: n,
   showLabels: l
 }) => {
-  const r = t.length;
+  const o = t.length;
   return t ? t.map((a) => {
     var d, m;
     return (d = a._embedded) != null && d["wp:featuredmedia"] && a._embedded["wp:featuredmedia"][0].source_url, /* @__PURE__ */ e(
       v.Column,
       {
-        className: (a.slug === o ? "active" : "") + (n ? " has-icon" : ""),
+        className: (a.slug === r ? "active" : "") + (n ? " has-icon" : ""),
         children: /* @__PURE__ */ f(
-          W,
+          q,
           {
             onClick: () => i(a.slug),
-            className: `nav  ${r === 1 ? "one" : ""}`,
+            className: `nav  ${o === 1 ? "one" : ""}`,
             children: [
               n && /* @__PURE__ */ e(
-                P,
+                S,
                 {
                   id: (m = a.meta_fields) != null && m.icon ? a.meta_fields.icon[0] : null,
-                  children: /* @__PURE__ */ e(A, { children: /* @__PURE__ */ e(S, { className: "icon" }) })
+                  children: /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(k, { className: "icon" }) })
                 }
               ),
-              l ? /* @__PURE__ */ e($, { post: a }) : /* @__PURE__ */ e(M, { children: /* @__PURE__ */ e(
+              l ? /* @__PURE__ */ e(L, { post: a }) : /* @__PURE__ */ e(P, { children: /* @__PURE__ */ e(
                 "span",
                 {
                   dangerouslySetInnerHTML: { __html: a.title.rendered }
@@ -54,12 +54,12 @@ const Y = ({ posts: t, activeItem: o, setActive: i, showLabels: n }) => t ? t.ma
       a.id
     );
   }) : null;
-}, L = ({ posts: t, activeItem: o }) => (x(() => {
+}, D = ({ posts: t, activeItem: r }) => (N(() => {
   const i = document.querySelector(".ui.container.content-tab");
   i && (i.scrollTop = 0);
-}, [o]), t ? t.map((i) => {
+}, [r]), t ? t.map((i) => {
   let n = {};
-  return i.slug !== o ? n = {
+  return i.slug !== r ? n = {
     position: "absolute",
     left: "-3000px",
     width: "auto",
@@ -70,30 +70,30 @@ const Y = ({ posts: t, activeItem: o, setActive: i, showLabels: n }) => t ? t.ma
     visibility: "visible",
     position: "relative",
     width: "auto"
-  }, /* @__PURE__ */ e(k, { as: b, fluid: !0, post: i, style: n }, i.slug);
-}) : null), K = ({ posts: t, activeItem: o, setActive: i }) => {
+  }, /* @__PURE__ */ e(j, { as: b, fluid: !0, post: i, style: n }, i.slug);
+}) : null), Q = ({ posts: t, activeItem: r, setActive: i }) => {
   const [n, l] = w(
-    t.findIndex((s) => s.slug === o)
-  ), [r, a] = w(null), d = G(null);
-  x(() => {
-    if (r) {
-      const s = r.getBoundingClientRect().top + window.scrollY;
+    t.findIndex((s) => s.slug === r)
+  ), [o, a] = w(null), d = V(null);
+  N(() => {
+    if (o) {
+      const s = o.getBoundingClientRect().top + window.scrollY;
       window.scrollTo({
         top: s,
         behavior: "smooth"
       });
     }
-  }, [r]);
+  }, [o]);
   const m = (s, u) => {
     const { index: c } = u, h = n === c ? -1 : c;
     l(h), i(t[c].slug), h !== -1 && a(s.currentTarget);
   };
-  return /* @__PURE__ */ e(y, { fluid: !0, styled: !0, children: t.map((s, u) => {
+  return /* @__PURE__ */ e(x, { fluid: !0, styled: !0, children: t.map((s, u) => {
     var h;
     const c = (h = s.meta_fields) != null && h.icon ? s.meta_fields.icon[0] : null;
-    return /* @__PURE__ */ f(I.Fragment, { children: [
+    return /* @__PURE__ */ f(C.Fragment, { children: [
       /* @__PURE__ */ e(
-        y.Title,
+        x.Title,
         {
           active: n === u,
           index: u,
@@ -109,7 +109,7 @@ const Y = ({ posts: t, activeItem: o, setActive: i, showLabels: n }) => t ? t.ma
               },
               children: [
                 /* @__PURE__ */ f("div", { style: { display: "flex", alignItems: "center" }, children: [
-                  c && /* @__PURE__ */ e(P, { id: c, children: /* @__PURE__ */ e(A, { children: /* @__PURE__ */ e(S, { className: "icon" }) }) }),
+                  c && /* @__PURE__ */ e(S, { id: c, children: /* @__PURE__ */ e($, { children: /* @__PURE__ */ e(k, { className: "icon" }) }) }),
                   /* @__PURE__ */ e(
                     "span",
                     {
@@ -118,50 +118,50 @@ const Y = ({ posts: t, activeItem: o, setActive: i, showLabels: n }) => t ? t.ma
                     }
                   )
                 ] }),
-                /* @__PURE__ */ e(V, { name: "chevron down" })
+                /* @__PURE__ */ e(W, { name: "chevron down" })
               ]
             }
           )
         }
       ),
       /* @__PURE__ */ e(
-        y.Content,
+        x.Content,
         {
           className: "accordion-post-content",
           active: n === u,
-          children: /* @__PURE__ */ e("div", { ref: d, children: /* @__PURE__ */ e(k, { post: s, as: b, fluid: !0 }) })
+          children: /* @__PURE__ */ e("div", { ref: d, children: /* @__PURE__ */ e(j, { post: s, as: b, fluid: !0 }) })
         }
       )
     ] }, s.id);
   }) });
-}, Q = ({ posts: t, showLabels: o, height: i }) => {
+}, X = ({ posts: t, showLabels: r, height: i }) => {
   const [n, l] = w(t ? t[0].slug : null);
-  return x(() => {
+  return N(() => {
     setTimeout(() => {
       if (window.location.hash) {
-        const r = window.location.hash.substr(1), a = document.getElementById(r);
-        a && t.map((d) => d.slug).indexOf(r) > -1 && (l(r), a.scrollIntoView({ behavior: "auto", block: "start" }));
+        const o = window.location.hash.substr(1), a = document.getElementById(o);
+        a && t.map((d) => d.slug).indexOf(o) > -1 && (l(o), a.scrollIntoView({ behavior: "auto", block: "start" }));
       }
     }, 0);
-  }, [t]), /* @__PURE__ */ f(I.Fragment, { children: [
-    t.map((r) => /* @__PURE__ */ e("anchor", { id: r.slug }, r.slug)),
-    /* @__PURE__ */ e(T, { className: "tabbed posts", text: !0, children: /* @__PURE__ */ e(Y, { showLabels: o, posts: t, setActive: l, activeItem: n }) }),
-    /* @__PURE__ */ e(b, { className: "content-tab", style: { height: `${i}px` }, children: /* @__PURE__ */ e(L, { posts: t, activeItem: n }) })
+  }, [t]), /* @__PURE__ */ f(C.Fragment, { children: [
+    t.map((o) => /* @__PURE__ */ e("anchor", { id: o.slug }, o.slug)),
+    /* @__PURE__ */ e(A, { className: "tabbed posts", text: !0, children: /* @__PURE__ */ e(Y, { showLabels: r, posts: t, setActive: l, activeItem: n }) }),
+    /* @__PURE__ */ e(b, { className: "content-tab", style: { height: `${i}px` }, children: /* @__PURE__ */ e(D, { posts: t, activeItem: n }) })
   ] });
-}, X = ({ posts: t, showLabels: o, showIcons: i, height: n }) => {
-  const [l, r] = w(t ? t[0].slug : null);
-  return /* @__PURE__ */ e(I.Fragment, { children: /* @__PURE__ */ f(v, { stackable: !0, className: "tabbed posts", columns: t.length, style: { height: n + "px" }, children: [
-    /* @__PURE__ */ e(J, { showIcons: i, showLabels: o, posts: t, activeItem: l, setActive: r }),
-    /* @__PURE__ */ e(v.Row, { style: { height: `${n}px` }, children: /* @__PURE__ */ e(v.Column, { width: 16, className: "content", children: /* @__PURE__ */ e(b, { className: "content-tab", style: { height: `${n}px` }, children: /* @__PURE__ */ e(L, { className: "content-tab", posts: t, activeItem: l }) }) }) })
+}, Z = ({ posts: t, showLabels: r, showIcons: i, height: n }) => {
+  const [l, o] = w(t ? t[0].slug : null);
+  return /* @__PURE__ */ e(C.Fragment, { children: /* @__PURE__ */ f(v, { stackable: !0, className: "tabbed posts", columns: t.length, style: { height: n + "px" }, children: [
+    /* @__PURE__ */ e(K, { showIcons: i, showLabels: r, posts: t, activeItem: l, setActive: o }),
+    /* @__PURE__ */ e(v.Row, { style: { height: `${n}px` }, children: /* @__PURE__ */ e(v.Column, { width: 16, className: "content", children: /* @__PURE__ */ e(b, { className: "content-tab", style: { height: `${n}px` }, children: /* @__PURE__ */ e(D, { className: "content-tab", posts: t, activeItem: l }) }) }) })
   ] }) });
-}, Z = (t) => {
-  var N;
+}, ee = (t) => {
+  var T;
   let {
-    "data-type": o,
+    "data-type": r,
     "data-taxonomy": i,
     "data-categories": n,
     "data-items": l,
-    "data-theme": r = "light",
+    "data-theme": o = "light",
     "data-show-icons": a,
     "data-use-scrolls": d,
     "data-show-labels": m,
@@ -170,38 +170,48 @@ const Y = ({ posts: t, activeItem: o, setActive: i, showLabels: n }) => t ? t.ma
     pageModuleProps: c,
     parent: h,
     editing: g,
-    unique: j
+    unique: R
   } = t;
   c != null && c.previewMode && (c != null && c.editing) && (u = c.previewMode, g = c.editing);
-  const D = t.intl.locale, R = Array.isArray(n) ? n.join(",").toString() : n, p = d === "true", C = p ? s : void 0, { width: H } = U(), z = H <= 1024, B = u !== "Desktop" && g, F = z && !g;
-  return g && !o ? /* @__PURE__ */ e(b, { className: `viz tabbed posts ${g ? "editing" : ""} ${p ? "scrollable" : ""}`, fluid: !0 }) : /* @__PURE__ */ e(b, { className: `viz tabbed posts ${g ? "editing" : ""} ${p ? "scrollable" : ""}`, fluid: !0, children: /* @__PURE__ */ e(
-    q,
+  const H = t.intl.locale;
+  let p = n;
+  if (Array.isArray(n))
+    p = n.join(",");
+  else if (typeof n == "string")
+    try {
+      const I = JSON.parse(n);
+      Array.isArray(I) && (p = I.join(","));
+    } catch {
+    }
+  const y = d === "true", _ = y ? s : void 0, { width: z } = U(), B = z <= 1024, F = u !== "Desktop" && g, G = B && !g;
+  return g && !r ? /* @__PURE__ */ e(b, { className: `viz tabbed posts ${g ? "editing" : ""} ${y ? "scrollable" : ""}`, fluid: !0 }) : /* @__PURE__ */ e(b, { className: `viz tabbed posts ${g ? "editing" : ""} ${y ? "scrollable" : ""}`, fluid: !0, children: /* @__PURE__ */ e(
+    E,
     {
-      locale: D,
-      type: o,
+      locale: H,
+      type: r,
       taxonomy: i,
-      categories: R,
-      store: `tabbedposts_${h}_${j}`,
+      categories: p,
+      store: `tabbedposts_${h}_${R}`,
       page: 1,
       perPage: l,
-      children: /* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(_, { children: F || B ? /* @__PURE__ */ e(K, { posts: l, activeItem: (N = l[0]) == null ? void 0 : N.slug, setActive: () => {
-      } }) : r === "light" ? /* @__PURE__ */ e(Q, { height: C, showLabels: m === "true" }) : /* @__PURE__ */ e(
-        X,
+      children: /* @__PURE__ */ e(M, { children: /* @__PURE__ */ e(M, { children: G || F ? /* @__PURE__ */ e(Q, { posts: l, activeItem: (T = l[0]) == null ? void 0 : T.slug, setActive: () => {
+      } }) : o === "light" ? /* @__PURE__ */ e(X, { height: _, showLabels: m === "true" }) : /* @__PURE__ */ e(
+        Z,
         {
-          height: C,
+          height: _,
           showLabels: m === "true",
           showIcons: a === "true"
         }
       ) }) })
     }
   ) });
-}, ee = (t, o) => {
+}, te = (t, r) => {
   const i = t.getIn([
     "data",
     "pageModuleProps"
   ]), n = {};
   return i && (n.pageModuleProps = i), n;
-}, te = {}, de = O(ee, te)(E(Z));
+}, ne = {}, ue = J(te, ne)(O(ee));
 export {
-  de as default
+  ue as default
 };

package/dist/esm/layout/PreviewComponent.js

@@ -1,4 +1,4 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import { useState as i, useRef as f, useCallback as g, useEffect as l } from "react";
 import { useParams as w, useSearchParams as P } from "react-router";
 import { Container as y, Segment as C } from "semantic-ui-react";
@@ -10,18 +10,18 @@ const b = () => {
   ), s = f(o);
   s.current = o;
   const n = g((u) => {
-    const e = u.data;
-    if (e.messageType && e.messageType === "component-attributes") {
+    const t = u.data;
+    if (t.messageType && t.messageType === "component-attributes") {
       const m = { ...s.current };
-      Object.keys(e).forEach((t) => {
-        m["data-" + t.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase()] = typeof e[t] == "object" ? Array.isArray(e[t]) ? e[t].join(",") : JSON.stringify(e[t]) : e[t];
+      Object.keys(t).forEach((r) => {
+        m["data-" + r.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase()] = typeof t[r] == "object" ? JSON.stringify(t[r]) : t[r];
       }), d(m);
     }
   }, []);
   return l(() => (window.addEventListener("message", n, !1), window.parent && window.parent.postMessage({ type: "componentReady", value: !0 }, "*"), window.top && window.top.postMessage({ type: "componentReady", value: !0 }, "*"), () => {
     window.removeEventListener("message", n);
-  }), [n]), /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(y, { fluid: !0, className: "editing", children: a ? /* @__PURE__ */ r(a, { ...o, editing: !0 }) : /* @__PURE__ */ r(C.Group, { color: "red", textAlign: "center", children: /* @__PURE__ */ r("h1", { children: "Wrong Component Name" }) }) }) });
-}, x = () => /* @__PURE__ */ r(h, { children: /* @__PURE__ */ r(b, {}) });
+  }), [n]), /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(y, { fluid: !0, className: "editing", children: a ? /* @__PURE__ */ e(a, { ...o, editing: !0 }) : /* @__PURE__ */ e(C.Group, { color: "red", textAlign: "center", children: /* @__PURE__ */ e("h1", { children: "Wrong Component Name" }) }) }) });
+}, L = () => /* @__PURE__ */ e(h, { children: /* @__PURE__ */ e(b, {}) });
 export {
-  x as default
+  L as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devgateway/dvz-ui-react",
-  "version": "1.9.14",
+  "version": "1.9.15",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/types/index.d.ts",