flex-render/dist/index.cjs

Utility to render LINE Flex Bubble / Carousel JSON for displaying in website.

'use strict';var R={giga:"LyGi",mega:"LyMe",kilo:"LyKi",hecto:"LyHe",deca:"LyDe",micro:"LyMi",nano:"LyNa"},z={ltr:"fxLTR",rtl:"fxRTL"},F={header:"t1Header",hero:"t1Hero",body:"t1Body",footer:"t1Footer"},c={box:"MdBx",text:"MdTxt",icon:"MdIco",button:"MdBtn",separator:"MdSep",image:"MdImg",filler:"mdBxFiller",span:"MdSpn",video:"MdVid",spacer:"mdBxSpacer"},P={vertical:"vr",horizontal:"hr",baseline:"hr bl"},$={relative:"",absolute:"ExAbs"},N={none:"",xs:"spcXs",sm:"spcSm",md:"spcMd",lg:"spcLg",xl:"spcXl",xxl:"spcXXl"};var H={link:"ExBtnL",primary:"ExBtn1",secondary:"ExBtn2"},W={cover:"ExCover",fit:"ExFit"},D={xxs:"ExXXs",xs:"ExXs",sm:"ExSm",md:"ExMd",lg:"ExLg",xl:"ExXl",xxl:"ExXXl","3xl":"Ex3Xl","4xl":"Ex4Xl","5xl":"Ex5Xl",full:"ExFull"},K={start:"ExAlgS",end:"ExAlgE",center:"ExAlgC"},G={top:"",bottom:"grvB",center:"grvC"},V={center:"itms-jfcC","flex-start":"itms-jfcS","flex-end":"itms-jfcE","space-between":"itms-jfcSB","space-around":"itms-jfcSA","space-evenly":"itms-jfcSE"},U={center:"itms-algC","flex-start":"itms-algS","flex-end":"itms-algE"},s={none:"None",xxs:"XXs",xs:"Xs",sm:"Sm",md:"Md",lg:"Lg",xl:"Xl",xxl:"XXl","3xl":"3Xl","4xl":"4Xl","5xl":"5Xl",full:"Full"},_={0:"fl0",1:"fl1",2:"fl2",3:"fl3"},Y={regular:"ExWR",bold:"ExWB"},Z={none:"",light:"ExBdrWdtLgh",normal:"ExBdrWdtNml",medium:"ExBdrWdtMdm","semi-bold":"ExBdrWdtSbd",bold:"ExBdrWdtBld"},q={normal:"ExFntStyNml",italic:"ExFntStyIt"},Q={none:"ExTxtDecNone",underline:"ExTxtDecUl","line-through":"ExTxtDecLt"};var w=["none","xxs","xs","sm","md","lg","xl","xxl","3xl","4xl","5xl","full"],p=/^(-?[\d.]+)px$/,a=/^(-?[\d.]+)%$/,L=(e,i)=>{if(!i||i==="none")return e;let t=N[i]||void 0;return t&&e.addClassNames(t),e},b=(e,i,t)=>{if(!i)return e;let r=ve(t)?"L":"T",x=s[i]||void 0;if(x)e.addClassNames(`ExMgn${r}${x}`);else {let l=i.match(p),n=i.match(a);(l||n)&&(r==="T"?e.setStyle("marginTop",i):r==="L"&&e.setStyle("marginLeft",i));}return e},O=(e,i)=>{if(!i)return e;let t=W[i]||void 0;return t&&e.addClassNames(t),e},f=(e,i,t="height")=>{if(!i)return e;let r=D[i]||void 0;if(r)e.addClassNames(r);else {let x=i.match(p),l=i.match(a);(x||l)&&e.setStyle(t,i);}return e},X=(e,i)=>{if(!i)return e;let t=Y[i]||void 0;return t&&e.addClassNames(t),e},J=(e,i)=>{let t=100,r=i==null?void 0:i.match(/^([\d.]+):([\d.]+)$/);return r&&(t=Number(r[2])/Number(r[1])*100),e.setStyle("paddingBottom",`${t}%`),e},k=(e,i)=>{if(!i)return e;let t=K[i]||void 0;return t&&e.addClassNames(t),e},T=(e,i)=>{if(!i)return e;let t=G[i]||void 0;return t&&e.addClassNames(t),e},M=(e,i)=>{if(!i)return e;let t=$[i]||void 0;return t&&e.addClassNames(t),e},ee=(e,i)=>{if(!i)return e;let t=U[i]||void 0;return t&&e.addClassNames(t),e},te=(e,i)=>{if(!i)return e;let t=V[i]||void 0;return t&&e.addClassNames(t),e},u=(e,{offsetBottom:i,offsetEnd:t,offsetStart:r,offsetTop:x})=>{if(!i&&!t&&!r&&!x)return e;if(i)if(w.includes(i))e.addClassNames(`ExB${s[i]}`);else {let l=i.match(p),n=i.match(a);(l||n)&&e.setStyle("bottom",i);}if(x)if(w.includes(x))e.addClassNames(`ExT${s[x]}`);else {let l=x.match(p),n=x.match(a);(l||n)&&e.setStyle("top",x);}if(t)if(w.includes(t))e.addClassNames(`ExR${s[t]}`);else {let l=t.match(p),n=t.match(a);(l||n)&&e.setStyle("right",t);}if(r)if(w.includes(r))e.addClassNames(`ExL${s[r]}`);else {let l=r.match(p),n=r.match(a);(l||n)&&e.setStyle("left",r);}return e},ie=(e,{paddingAll:i,paddingBottom:t,paddingEnd:r,paddingStart:x,paddingTop:l})=>{if(!i&&!t&&!r&&!x&&!l)return e;if(i)if(w.includes(i))e.addClassNames(`ExPadA${s[i]}`);else {let n=i.match(p),d=i.match(a);(n||d)&&e.setStyle("padding",i);}if(t)if(w.includes(t))e.addClassNames(`ExPadB${s[t]}`);else {let n=t.match(p),d=t.match(a);(n||d)&&e.setStyle("paddingBottom",t);}if(r)if(w.includes(r))e.addClassNames(`ExPadR${s[r]}`);else {let n=r.match(p),d=r.match(a);(n||d)&&e.setStyle("paddingRight",r);}if(x)if(w.includes(x))e.addClassNames(`ExPadL${s[x]}`);else {let n=x.match(p),d=x.match(a);(n||d)&&e.setStyle("paddingLeft",x);}if(l)if(w.includes(l))e.addClassNames(`ExPadT${s[l]}`);else {let n=l.match(p),d=l.match(a);(n||d)&&e.setStyle("paddingTop",l);}return e},v=(e,i)=>{if(i==null)return e;let t=i.toString(),r=_[t]||void 0;return r?e.addClassNames(r):(e.setStyle("WebkitFlex",t),e.setStyle("flexGrow",t)),e},re=(e,i)=>{if(!i)return e;let t=H[i]||void 0;return t&&e.addClassNames(t),e},y=/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/,g=(e,i,t="color")=>(i&&i.match(y)&&e.setStyle(t,i),e),xe=(e,i)=>{if(!i)return e;if(i.type==="linearGradient"){let{angle:t,startColor:r,endColor:x,centerColor:l,centerPosition:n}=i,d=t==null?void 0:t.match(/^(\d+)deg$/),m=r==null?void 0:r.match(y),h=x==null?void 0:x.match(y),me=l==null?void 0:l.match(y),we=n==null?void 0:n.match(/^([\d.]+)%$/);!l||!n?d&&m&&h&&e.setStyle("background",`linear-gradient(${t}, ${r} 0%, ${x} 100%)`):d&&m&&me&&we&&h&&e.setStyle("background",`linear-gradient(${t}, ${r} 0%, ${l} ${n}, ${x} 100%)`);}return e},le=(e,i)=>(i&&e.addClassNames("ExWrap"),e),ne=(e,i)=>{if(!i)return e;let t=Z[i]||void 0;if(t)e.addClassNames(t);else {let r=i.match(p),x=i.match(a);(r||x)&&e.setStyle("borderWidth",i);}return e},de=(e,i)=>{if(!i)return e;let t=s[i]||void 0;if(t)e.addClassNames(`ExBdrRad${t}`);else {let r=i.match(p),x=i.match(a);(r||x)&&e.setStyle("borderRadius",i);}return e},oe=(e,i)=>{let t=1,r=i==null?void 0:i.match(/^([\d.]+):([\d.]+)$/);return r&&(t=Number(r[1])/Number(r[2])),e.setStyle("width",`${t}em`),e},I=(e,i)=>{if(!i)return e;let t=q[i]||void 0;return t&&e.addClassNames(t),e},S=(e,i)=>{if(!i)return e;let t=Q[i]||void 0;return t&&e.addClassNames(t),e},E=(e,i,t,r)=>{if(i){let{separator:x,separatorColor:l,backgroundColor:n}=i;if(e=g(e,n,"backgroundColor"),t!=="header"&&x){let d=A({type:"separator",color:l});r==null||r.appendChild(d);}}return [e,r]},B=(e,i)=>{if(!i)return e;switch(i.type){case"uri":e.setAttribute("target","_blank"),e.setAttribute("href",i.uri||""),e.setAttribute("onclick",`window.open('${i.uri||""}')`);break;case"message":e.setAttribute("onclick",`alert('Send Message: ${i.text} to chatroom')`);break;case"postback":e.setAttribute("onclick",`alert('Send Postback: ${i.data}')`);break;case"datetimepicker":e.setAttribute("onclick","alert('Open Datepicker')");break;case"clipboard":e.setAttribute("onclick",`window.navigator.clipboard.writeText('${i.clipboardText}').then(() => alert('Copied to Clipboard: ${i.clipboardText}'))`);break}return e.setStyle("cursor","pointer"),e},pe=e=>w.includes(e),ae=e=>(p.test(e)||a.test(e)),ve=e=>(e==null?void 0:e.type)==="box"&&(e.layout==="horizontal"||e.layout==="baseline"),se=e=>e.replace(/[A-Z]/g,i=>`-${i.toLowerCase()}`);var o=class{tagName;attributes;className;style;children;textContent;constructor(i,t={},r=[],x={},l=[],n=void 0){this.tagName=i,this.attributes=t,this.className=r,this.style=x,this.children=l,this.textContent=n;}getTagName(){return this.tagName}setTextContent(i){this.textContent=i||void 0;}getTextContent(){return this.textContent}removeTextContent(){this.textContent=void 0;}getAttribute(i){return this.attributes[i]}setAttribute(i,t){this.attributes[i]=t;}removeAttribute(i){delete this.attributes[i];}getClassName(){return this.className}addClassName(i){this.className.push(i);}addClassNames(...i){this.className.push(...i);}removeClassName(i){this.className=this.className.filter(t=>t!==i);}getStyle(){return this.style}setStyle(i,t){this.style[i]=t;}removeStyle(i){delete this.style[i];}appendChild(i){this.children.push(i);}render(){let i=Object.entries(this.attributes).map(([n,d])=>`${n}="${d}"`).join(" "),t=this.className.join(" "),r=Object.entries(this.style).map(([n,d])=>`${se(n)}:${d.replace(/"/g,"").replace(/\//g,"/")}`).join(";"),x=`${i!==""?i:""} ${t!==""?`class="${t}"`:""} ${r!==""?`style="${r}"`:""}`.trim(),l=this.children.map(n=>n.render()).join("");return `<${this.tagName}${x!==""?` ${x}`:""}>${l!==""?l:this.textContent||""}</${this.tagName}>`}};var ge=e=>{let i=new o("div");if(i.addClassNames("flex-preview"),e.type==="carousel"){let t=he(e);i.appendChild(t);}else {let t=fe(e);i.appendChild(t);}return i.render()},he=e=>{let i=new o("div");i.addClassName("lyInner");for(let r of e.contents){let x=fe(r);x.addClassNames("lyItem"),i.appendChild(x);}let t=new o("div");return t.addClassName("LySlider"),t.appendChild(i),t},fe=e=>{var r,x,l,n;let i=new o("div");if(i.addClassNames("T1",z[e.direction||"ltr"]),i.setAttribute("dir",e.direction||"ltr"),e.header){let d=j("header",e.header),[m]=E(d,(r=e.styles)==null?void 0:r.header,"header",i);d=m,i.appendChild(d);}if(e.hero){let d=be(e.hero),[m,h]=E(d,(x=e.styles)==null?void 0:x.hero,"hero",i);d=m,i=h,i.appendChild(d);}if(e.body){let d=j("body",e.body);e.footer&&d.addClassNames("ExHasFooter");let[m,h]=E(d,(l=e.styles)==null?void 0:l.body,"body",i);d=m,i=h,i.appendChild(d);}if(e.footer){let d=j("footer",e.footer),[m,h]=E(d,(n=e.styles)==null?void 0:n.footer,"footer",i);d=m,i=h,i.appendChild(d);}let t=new o("div");return t.addClassName(R[e.size||"mega"]),t.appendChild(i),t},j=(e,i)=>{let t=new o("div");t.addClassNames(F[e]);let r=ce(i);return t.appendChild(r),t},be=e=>{let i=new o("div");i.addClassNames(F.hero);let t=C(e);return t&&i.appendChild(t),i},ce=(e,i)=>{let t=new o("div");if(e.contents)for(let r of e.contents){let x=C(r,e);x&&t.appendChild(x);}return t.addClassNames(c.box,...P[e.layout||"vertical"].split(" ")),t=M(t,e.position),t=e.height||e.width?v(t,0):v(t,e.flex),t=L(t,e.spacing),t=b(t,e.margin,i),t=f(t,e.width,"width"),t=f(t,e.height,"height"),t=f(t,e.maxWidth,"maxWidth"),t=f(t,e.maxHeight,"maxHeight"),t=g(t,e.backgroundColor,"backgroundColor"),t=ne(t,e.borderWidth),t=g(t,e.borderColor,"borderColor"),t=de(t,e.cornerRadius),t=te(t,e.justifyContent),t=ee(t,e.alignItems),t=u(t,e),t=ie(t,e),t=xe(t,e.background),e.action&&(t=B(t,e.action)),t},C=(e,i)=>{switch(e.type){case"box":return ce(e,i);case"button":return Me(e,i);case"image":return ue(e,i);case"video":return Ce(e);case"icon":return Ee(e,i);case"text":return Be(e,i);case"span":return ye(e);case"separator":return A(e,i);case"filler":return Te(e);case"spacer":return Fe(e);default:return null}},Me=(e,i)=>{let t=new o("div");if(t.addClassNames(c.button),e.action){let r=new o("a");r=g(r,e.color,e.style==="primary"||e.style==="secondary"?"backgroundColor":"color");let x=new o("div");x.setTextContent(e.action.label),r.appendChild(x),r=B(r,e.action),t.appendChild(r);}return t=v(t,e.flex),t=M(t,e.position),t=b(t,e.margin,i),t=f(t,e.height,"height"),t=re(t,e.style||"link"),t=T(t,e.gravity),t=u(t,e),t},ue=(e,i)=>{let t=new o("div");t.addClassNames(c.image),t=v(t,e.flex),t=M(t,e.position),t=b(t,e.margin,i),t=k(t,e.align),t=T(t,e.gravity),pe(e.size||"md")&&(t=f(t,e.size||"md")),t=O(t,e.aspectMode||"fit"),t=u(t,e);let r=new o("span");r.setStyle("background-image",`url("${e.url}")`),r=g(r,e.backgroundColor,"backgroundColor");let x=new o("a");x=J(x,e.aspectRatio),x=B(x,e.action),x.appendChild(r);let l=new o("div");return ae(e.size||"md")&&(l=f(l,e.size,"width")),l.appendChild(x),t.appendChild(l),t},Ee=(e,i)=>{let t=new o("div");t.addClassNames(c.icon);let r=new o("span");r.setStyle("background-image",`url(${e.url})`),t=M(t,e.position),t=b(t,e.margin,i),t=f(t,e.size),r=oe(r,e.aspectRatio),t=u(t,e),t=v(t,0);let x=new o("div");return x.appendChild(r),t.appendChild(x),t},Be=(e,i)=>{let t=new o("div");if(t.addClassNames(c.text),e.contents&&e.contents.length>0){let r=new o("p");for(let x of e.contents){let l=C(x,e);l&&r.appendChild(l);}t.appendChild(r);}else if(e.text){let r=new o("p");if(r.setTextContent(e.text),e.action){let x=new o("a");x=B(x,e.action),x.appendChild(r),t.appendChild(x);}else t.appendChild(r);}return t=v(t,e.flex),t=b(t,e.margin,i),t=f(t,e.size,"fontSize"),t=f(t,e.lineSpacing,"lineHeight"),t=g(t,e.color,"color"),t=X(t,e.weight),t=I(t,e.style),t=S(t,e.decoration),t=M(t,e.position),t=k(t,e.align),t=T(t,e.gravity),t=le(t,e.wrap),t=u(t,e),t},ye=(e,i)=>{let t=new o("span");return t.addClassNames(c.span),t.setTextContent(e.text),t=f(t,e.size,"fontSize"),t=g(t,e.color,"color"),t=X(t,e.weight),t=I(t,e.style),t=S(t,e.decoration),t},A=(e,i)=>{let t=new o("div");return t.addClassNames(c.separator),t=b(t,e.margin,i),t=g(t,e.color,"borderColor"),t},Te=(e,i)=>{let t=new o("div");return t.addClassNames(c.filler),t=v(t,e.flex),t},Ce=(e,i)=>{let t=new o("div");if(t.addClassNames(c.video),e.altContent){let r=C(e.altContent);r&&t.appendChild(r);}return t},Fe=(e,i)=>{let t=new o("div");return t.addClassNames(c.spacer),t=v(t,0),t=L(t,e.size||"md"),t};
exports.render=ge;