@enonic/react-components/dist/index.mjs

Library of React components for handling Enonic XP data and page components

import{a as d,b as f,c as ge}from"./chunk-J42GJEXW.mjs";import{a as p,b as c,c as l,d as L,e as fe,f as le,g as ue,h as de,i as J,j as F}from"./chunk-PN3WU6U5.mjs";import{jsx as ke}from"react/jsx-runtime";function q({comment:o}){return ke("div",{dangerouslySetInnerHTML:{__html:`<!--${o}-->`}})}function _(o,e,t=4){return JSON.stringify(o,e,t)}import{jsx as z}from"react/jsx-runtime";function Y({component:o,data:e,common:t,meta:r}){let{descriptor:n}=o,{mode:a,componentRegistry:s}=r;if(!n)return;let i=s.getLayout(n);if(!i)return z(f,{mode:a,children:`Layout descriptor:${n} not registered in ComponentRegistry!`});let{View:m}=i;return m?z(m,{component:o,data:e,common:t,meta:r}):z(f,{mode:a,children:`No View found for layout descriptor:${n} in ComponentRegistry!`})}import{jsx as H}from"react/jsx-runtime";function Q({component:o,data:e,common:t,meta:r}){let{descriptor:n}=o,{mode:a,componentRegistry:s}=r;if(!n)return;let i=s.getPage(n);if(!i)return H(f,{mode:a,children:`Page descriptor:${n} not registered in ComponentRegistry!`});let{View:m}=i;return m?H(m,{component:o,data:e,common:t,meta:r}):H(f,{mode:a,children:`No View found for page descriptor:${n} in ComponentRegistry!`})}import{jsx as K}from"react/jsx-runtime";function Z({component:o,data:e,common:t,meta:r}){let{descriptor:n}=o,{mode:a,componentRegistry:s}=r;if(!n)return;let i=s.getPart(n);if(!i)return K(f,{children:`Part descriptor:${n} not registered in ComponentRegistry!`,mode:a});let{View:m}=i;return m?K(m,{component:o,data:e,common:t,meta:r}):K(f,{children:`No View found for part descriptor:${n} in ComponentRegistry!`,mode:a})}import{jsx as be}from"react/jsx-runtime";function N({data:o}){return!o||!o.path?null:be(q,{comment:`#COMPONENT ${o.path}`})}import De from"html-react-parser/lib/index";var g;(function(o){o.Root="root",o.Text="text",o.Directive="directive",o.Comment="comment",o.Script="script",o.Style="style",o.Tag="tag",o.CDATA="cdata",o.Doctype="doctype"})(g||(g={}));var io=g.Root,po=g.Text,so=g.Directive,mo=g.Comment,co=g.Script,fo=g.Style,lo=g.Tag,uo=g.CDATA,go=g.Doctype;function j(o){if(!o)return{};let e={};return o.split(";").forEach(r=>{let[n,a]=r.trim().split(":");n&&a&&(e[n.replace(/-([a-z])/g,(s,i)=>i.toUpperCase())]=a)}),e}import*as B from"react";import{Fragment as Oe,jsx as Le}from"react/jsx-runtime";function Pe({children:o,mode:e}){try{return Le(Oe,{children:o})}catch(t){return ge(e)({error:t})}}import{jsx as V}from"react/jsx-runtime";function w({children:o,mode:e}){if(typeof document=="undefined")return V(B.Suspense,{fallback:null,children:V(Pe,{mode:e,children:o})});{let t=B.lazy(()=>import("./ErrorBoundary.client-H4CXE734.mjs"));return V(B.Suspense,{fallback:null,children:V(t,{mode:e,children:o})})}}import{jsx as U,jsxs as _e}from"react/jsx-runtime";function Re(A){var T=A,{el:o,Image:e,data:{images:t},meta:{mode:r},replacer:n,component:a,common:s,Link:i,Macro:m,createReplacer:P}=T,D=l(T,["el","Image","data","meta","replacer","component","common","Link","Macro","createReplacer"]);if(!t||!t.length)return U(d,{children:"Can't replace image, when there are no images in the data object!"});let R=o.attribs[le];if(!R)return U(d,{children:"Image element has no data-image-ref attibute!"});let y=t.find(C=>C.ref===R);if(!y)return _e(d,{children:["Unable to find image with ref ",R," in images object!"]});let{attribs:{alt:u,sizes:x,src:M,srcset:S,style:E=""}}=o,k=j(E),{image:I,style:b}=y,O=c(p({},D),{alt:u,image:I,imageStyle:b,sizes:x,src:M,srcSet:S,style:k});return U(w,{mode:r,children:U(e,p({},O))})}import{domToReact as Ne}from"html-react-parser/lib/index";import{jsx as $,jsxs as we}from"react/jsx-runtime";function ye(A){var T=A,{createReplacer:o,data:e,el:t,Image:r,Link:n,Macro:a,meta:s,replacer:i,component:m,common:P}=T,D=l(T,["createReplacer","data","el","Image","Link","Macro","meta","replacer","component","common"]);let{attribs:{href:R,[ue]:y,target:u,title:x}}=t;if(!y)return;if(!R)return $(d,{children:"Link element has no href attribute!"});let{links:M}=e;if(!M||!M.length)return $(d,{children:"Can't replace link, when there are no links in the data object!"});let S=M.find(W=>W.ref===y);if(!S)return we(d,{children:["Unable to find link with ref ",y," in links object!"]});let{content:E,media:k,uri:I}=S,b=c(p({},D),{content:E,href:R,media:k,target:u,title:x,uri:I}),O=Ne(t.children,{replace:o(c(p({},D),{data:e,Image:r,Link:n,Macro:a,meta:s,common:P,component:m,replacer:i}))}),{mode:C}=s;return $(w,{mode:C,children:$(n,c(p({},b),{children:O}))})}import{domToReact as Ae}from"html-react-parser/lib/index";var ee=o=>{if(!o||o.trim().length===0)return"";let e=o.replace(/([^0-9A-Za-z])+/g,"_");return e.length>0&&/[0-9]/.test(e.charAt(0))&&(e="_"+e),e};import{jsx as v,jsxs as Ie}from"react/jsx-runtime";function Ce(o){let b=o,{createReplacer:e,el:t}=b,r=l(b,["createReplacer","el"]),n=t.attribs[de];if(!n)return v(d,{children:"Macro element has no data-macro-ref attribute!"});let O=r,{data:a,common:s,component:i,meta:m,Macro:P,replacer:D,Link:A,Image:T}=O,R=l(O,["data","common","component","meta","Macro","replacer","Link","Image"]),y=a.macroComponents||a.macros;if(!y||!y.length)return v(d,{children:"Can't replace macro, when there are no macros in the data object!"});let u=y.find(C=>"component"in C?C.component.ref===n:C.ref===n);if(!u)return Ie(d,{children:["Unable to find macro with ref ",n," in macros object!"]});let x,M;"component"in u?(x=u.component,M=u.data):(x={ref:u.ref,descriptor:u.descriptor,name:u.name,type:"macro"},M=u.config[ee(u.name)]);let S=c(p({},R),{component:x,common:s,meta:m,data:M}),E=Ae(t.children,{replace:e(r)}),{componentRegistry:k,mode:I}=m;if(k){let C=k.getMacro(x.descriptor);if(C){let W=C.View;return v(W,c(p({},S),{children:E}))}}return v(w,{mode:I,children:v(P,c(p({},S),{children:E}))})}function X(o){return e=>{if(e.type!==g.Tag)return e;let t=e;switch(t.tagName){case"img":return Re(c(p({},o),{el:t,createReplacer:X}));case"a":return ye(c(p({},o),{el:t,createReplacer:X}));case fe:return Ce(c(p({},o),{el:t,createReplacer:X}));default:let r=o,{replacer:n,Link:a,Macro:s,Image:i}=r,m=l(r,["replacer","Link","Macro","Image"]);if(n){let P=n(c(p({},m),{el:t}));if(P)return P}}return t}}import{jsx as Xe}from"react/jsx-runtime";var oe=({alt:o,sizes:e,src:t,srcSet:r,style:n})=>Xe("img",p({},{alt:o,sizes:e,src:t,srcSet:r,style:n}));import{jsx as Je}from"react/jsx-runtime";var te=n=>{var a=n,{content:o,media:e,uri:t}=a,r=l(a,["content","media","uri"]);return Je("a",p({},r))};import{jsx as G}from"react/jsx-runtime";function re(s){var i=s,{children:o,meta:e,data:t,common:r,component:n}=i,a=l(i,["children","meta","data","common","component"]);let{name:m,descriptor:P}=n,{mode:D}=e,A=e.componentRegistry;if(!A)return G(f,{mode:D,children:`Can't render macro "${P}". Macro component or componentRegistry should be provided to RichText.`});let T=A.getMacro(m);if(!T)return G(f,{mode:D,children:`Macro "${P}" is not registered in ComponentRegistry!`});let{View:R}=T;return R?G(R,c(p({},a),{meta:e,component:n,data:t,common:r,children:o})):G(f,{mode:D,children:`No View found for macro "${P}" in ComponentRegistry!`})}import{jsx as Ve}from"react/jsx-runtime";function ne(i){var m=i,{tag:o,className:e,Image:t=oe,Link:r=te,Macro:n=re,data:a}=m,s=l(m,["tag","className","Image","Link","Macro","data"]);return Ve(o||"section",{className:e,children:a.processedHtml?(De.default||De)(a.processedHtml,{replace:X(c(p({},s),{data:a,Image:t,Link:r,Macro:n}))}):""})}import{jsx as Te,jsxs as Ue}from"react/jsx-runtime";var ae=({component:o,data:e,common:t,meta:r})=>{let{mode:n}=r,a=n==="edit"?"text":void 0;if(!e)return n==="edit"||n==="inline"||n==="admin"?Ue(f,{"data-portal-component-type":a,mode:n,children:["Text component missing props: ",_(o)]}):(console.warn("BaseText: Text component missing props:",_(o)),Te(N,{data:o}));let{as:s,data:i}=e;return Te(ne,{tag:s,data:i,meta:r,component:o,common:t})};import{jsx as ie}from"react/jsx-runtime";var pe=({component:o,data:e,common:t,meta:r})=>{let{contentType:n}=o,{mode:a,componentRegistry:s}=r,i=s.getContentType(n);if(!i)return ie(f,{mode:a,children:`ContentType:${n} not registered in ComponentRegistry!`});let{View:m}=i;return m?ie(m,{component:o,data:e,common:t,meta:r}):ie(f,{mode:a,children:`No View found for contentType:${n} in ComponentRegistry!`})};import{jsx as Me}from"react/jsx-runtime";var he=({mode:o,type:e,children:t})=>{let r={};return o==="edit"&&(e==="part"||e==="fragment"||e==="text"||e==="layout"||e==="page")&&(r["data-portal-component-type"]=e),t?Me("div",c(p({},r),{children:t})):Me("div",p({},r))};import{jsx as h}from"react/jsx-runtime";function se({component:o,data:e,common:t,meta:r}){let{mode:n,componentRegistry:a}=r;if(!a)return console.warn("BaseComponent componentRegistry missing! with component:",_(o)),h(N,{data:o});let s=o.type;if(!s||!Object.values(J).includes(s))return console.error("BaseComponent unknown component type:",_(o)),h(N,{data:o});let i;switch(s){case"part":i=h(Z,{data:e,component:o,common:t,meta:r});break;case"layout":i=h(Y,{data:e,component:o,common:t,meta:r});break;case"page":i=h(Q,{data:e,component:o,common:t,meta:r});break;case"contentType":i=h(pe,{data:e,component:o,common:t,meta:r});break;case"text":{i=h(ae,{data:e,component:o,common:t,meta:r});break}case"error":{i=h(f,{mode:n,html:o.html});break}case"fragment":break}return h(he,{type:s,mode:n,children:i})}var me=class{constructor(){L(this,"_contentTypes",{});L(this,"_pages",{});L(this,"_parts",{});L(this,"_layouts",{});L(this,"_macros",{})}addContentType(e,t){this._contentTypes[e]=t}addMacro(e,t){this._macros[e]=t}addLayout(e,t){this._layouts[e]=t}addPage(e,t){this._pages[e]=t}addPart(e,t){this._parts[e]=t}getContentType(e){return this._contentTypes[e]}getLayout(e){return this._layouts[e]}getMacro(e){return this._macros[e]}getPage(e){return this._pages[e]}getPart(e){return this._parts[e]}hasContentType(e){return this._contentTypes[e]!==void 0}hasMacro(e){return this._macros[e]!==void 0}hasLayout(e){return this._layouts[e]!==void 0}hasPage(e){return this._pages[e]!==void 0}hasPart(e){return this._parts[e]!==void 0}};function xe(o){var e,t,r="";if(typeof o=="string"||typeof o=="number")r+=o;else if(typeof o=="object")if(Array.isArray(o)){var n=o.length;for(e=0;e<n;e++)o[e]&&(t=xe(o[e]))&&(r&&(r+=" "),r+=t)}else for(t in o)o[t]&&(r&&(r+=" "),r+=t);return r}function $e(){for(var o,e,t=0,r="",n=arguments.length;t<n;t++)(o=arguments[t])&&(e=xe(o))&&(r&&(r+=" "),r+=e);return r}var Se=$e;import{jsx as Ee}from"react/jsx-runtime";var ce=({as:o,className:e,common:t,meta:r,data:n=[],name:a})=>{if(!(a||"").trim())throw console.error(`<Region NO_NAME> name: ${JSON.stringify(a)}`),Error("Can't render <Region> without a 'name' prop.");return Ee(o||"div",{className:Se("xp-region",e),"data-portal-region":a,children:n.map((i,m)=>Ee(se,{component:i.component,data:i.data,meta:r,common:t},m))})};import{jsx as We}from"react/jsx-runtime";function Ge({common:o,component:e,meta:t}){let r;if("regions"in e)r=e.regions;else return console.warn(`Regions: component type "${e.type}" is not supported. Expected "layout" or "page".`),null;return Object.keys(r).map((n,a)=>We(ce,{data:r[n].components,common:o,meta:t,name:n},`region-${a}-${n}`))}export{se as BaseComponent,pe as BaseContentType,Y as BaseLayout,re as BaseMacro,Q as BasePage,Z as BasePart,ae as BaseText,J as COMPONENT_DATA_TYPE,me as ComponentRegistry,d as ErrorComponent,q as HtmlComment,oe as Image,te as Link,ce as Region,Ge as Regions,ne as RichText,F as XP_REQUEST_MODE,N as XpFallback,j as cssToReactStyle,ee as sanitizeGraphqlName};