@happeouikit/content-renderer 3.2.23 → 3.2.25

package/dist/index.cjs.js

@@ -135,7 +135,7 @@
 `}return d}),t.subParser("makeMarkdown.paragraph",function(r,i){var a="";if(r.hasChildNodes())for(var d=r.childNodes,o=d.length,f=0;f<o;++f)a+=t.subParser("makeMarkdown.node")(d[f],i);return a=a.trim(),a}),t.subParser("makeMarkdown.pre",function(r,i){var a=r.getAttribute("prenum");return"<pre>"+i.preList[a]+"</pre>"}),t.subParser("makeMarkdown.strikethrough",function(r,i){var a="";if(r.hasChildNodes()){a+="~~";for(var d=r.childNodes,o=d.length,f=0;f<o;++f)a+=t.subParser("makeMarkdown.node")(d[f],i);a+="~~"}return a}),t.subParser("makeMarkdown.strong",function(r,i){var a="";if(r.hasChildNodes()){a+="**";for(var d=r.childNodes,o=d.length,f=0;f<o;++f)a+=t.subParser("makeMarkdown.node")(d[f],i);a+="**"}return a}),t.subParser("makeMarkdown.table",function(r,i){var a="",d=[[],[]],o=r.querySelectorAll("thead>tr>th"),f=r.querySelectorAll("tbody>tr"),c,h;for(c=0;c<o.length;++c){var T=t.subParser("makeMarkdown.tableCell")(o[c],i),k="---";if(o[c].hasAttribute("style")){var _=o[c].getAttribute("style").toLowerCase().replace(/\s/g,"");switch(_){case"text-align:left;":k=":---";break;case"text-align:right;":k="---:";break;case"text-align:center;":k=":---:";break}}d[0][c]=T.trim(),d[1][c]=k}for(c=0;c<f.length;++c){var E=d.push([])-1,l=f[c].getElementsByTagName("td");for(h=0;h<o.length;++h){var v=" ";typeof l[h]<"u"&&(v=t.subParser("makeMarkdown.tableCell")(l[h],i)),d[E].push(v)}}var S=3;for(c=0;c<d.length;++c)for(h=0;h<d[c].length;++h){var P=d[c][h].length;P>S&&(S=P)}for(c=0;c<d.length;++c){for(h=0;h<d[c].length;++h)c===1?d[c][h].slice(-1)===":"?d[c][h]=t.helper.padEnd(d[c][h].slice(-1),S-1,"-")+":":d[c][h]=t.helper.padEnd(d[c][h],S,"-"):d[c][h]=t.helper.padEnd(d[c][h],S);a+="| "+d[c].join(" | ")+` |
 `}return a.trim()}),t.subParser("makeMarkdown.tableCell",function(r,i){var a="";if(!r.hasChildNodes())return"";for(var d=r.childNodes,o=d.length,f=0;f<o;++f)a+=t.subParser("makeMarkdown.node")(d[f],i,!0);return a.trim()}),t.subParser("makeMarkdown.txt",function(r){var i=r.nodeValue;return i=i.replace(/ +/g," "),i=i.replace(/¨NBSP;/g," "),i=t.helper.unescapeHTMLEntities(i),i=i.replace(/([*_~|`])/g,"\\$1"),i=i.replace(/^(\s*)>/g,"\\$1>"),i=i.replace(/^#/gm,"\\#"),i=i.replace(/^(\s*)([-=]{3,})(\s*)$/,"$1\\$2$3"),i=i.replace(/^( {0,3}\d+)\./gm,"$1\\."),i=i.replace(/^( {0,3})([+-])/gm,"$1\\$2"),i=i.replace(/]([\s]*)\(/g,"\\]$1\\("),i=i.replace(/^ {0,3}\[([\S \t]*?)]:/gm,"\\[$1]:"),i});var z=this;e.exports?e.exports=t:z.showdown=t}).call(xe)})(Xt);var Kn=Xt.exports;const Ne=Vr(Kn),at=/@(\d*|channel|editors):\((.*?)\)/,Jt=["channel","editors"],Qn=new RegExp(at,"i"),Yn=new RegExp(at,"gi");let ie;const Dr={color:{type:"lang",regex:/\((.*?)\)\[(rgb\((?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]))\))\]/gi,replace:(e,n)=>`<span style="color:${e.match(/\[(rgb\((?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]), ?)(?:([0-9]{1,2}|1[0-9]{1,2}|2[0-4][0-9]|25[0-5]))\))\]/gi)[0].replace("[","").replace("]","")}">${n}</span>`},mention:{type:"lang",regex:Yn,replace:e=>{const n=e.match(Qn),u=n&&n.length>1&&n[1],t=n&&n.length>2&&n[2];return Jt.find(s=>s.toLowerCase()===String(u).toLowerCase())?`<a class="mention extraMention" data-user-id="${u}">@${t}</a>`:`<a class="mention" data-user-id="${u}">@${t}</a>`}},userMentioTag:{type:"lang",regex:/<user-mentio[^>]*>(.+?)<\/user-mentio>/gi,replace:e=>{const n=e.match(/<user-mentio[^>]*>(.+?)<\/user-mentio>/),u=e.match(/data-user-id=["']([^"]+)["']/),t=n&&n.length>1&&n[1];return`<a class="mention" data-user-id="${u&&u.length>1&&u[1]}">${t}</a>`}}};function Zn(){return ie||(Ne.extension("color",Dr.color),Ne.extension("mention",Dr.mention),Ne.extension("usermentiotag",Dr.userMentioTag),ie=new Ne.Converter({extensions:["color","mention","usermentiotag"]}),ie.setOption("strikethrough",!0),ie.setOption("tables",!0),ie.setOption("openLinksInNewWindow",!0),ie.setOption("disableForced4SpacesIndentedSublists",!0),ie)}const Xn=Zn(),Jn=new RegExp(at,"gi"),ei=new RegExp(/<user-mentio[^>]*data-user-id=["']([^"]+)["'][^>]*>(?:@|(?:&#64;))(.+?)<\/user-mentio>/,"gi"),Tt=(e,n,u)=>Jt.find(t=>t.toLowerCase()===String(n).toLowerCase())?`<a class="mention extraMention" data-user-id="${n}">@${u}</a>`:`<a class="mention" data-user-id="${n}">@${u}</a>`,ri=(e="")=>e.replace(Jn,Tt).replace(ei,Tt),ti=(e="")=>zr(e,{whiteList:Un,css:{whiteList:{...zr.getDefaultCSSWhiteList(),"vertical-align":!0}},stripIgnoreTag:!0}).replace(/&nbsp;/g," ").replace(/\u2060/g,""),ai=(e="")=>{const n=/#(?:[0-9a-fA-F]{3}){1,2}|\brgb\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*\)|\brgba\(\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d{1,3}\s*,\s*\d*(?:\.\d+)?\s*\)/gi;return e.replace(n,u=>`${u}<span class="color-block" style="background-color: ${u};"></span>`)},ni=(e="")=>{try{return Sn(e,{target:"_blank",ignoreTags:["pre","code","script","style"],render:({tagName:n,attributes:u,content:t})=>{let s=t;if(s.length>85){const g=s.slice(0,40),m=s.slice(-40);s=`${g}[...]${m}`}const p=Object.keys(u).reduce((g,m)=>{const b=u[m];return`${g} ${m}="${b}"`});return`<${n} ${p}>${s}</${n}>`},validate:{url(n){return/^(http|ftp)s?:\/\//.test(n)}}})}catch{return e}},ii=(e="",n="html")=>{let u=st.shortToUnicode(e);return u=st.fixEmojioneBug(u),n==="markdown"?u=Xn.makeHtml(u):u=ri(u),u=Zt(u),u=ni(u),u},ui=()=>{const e="ibmMonoOnDemand";if(!document.getElementById(e)){const n=document.createElement("style");n.id=e,n.appendChild(document.createTextNode(`@import url(${Vn});`)),document.head.appendChild(n)}},At=(e="")=>e.replace(/[^\u0000-\u007E]/g,""),si=(e="")=>{const n=/<pre\b[^>]*>\s*<code\b[^>]*>([\s\S]*?)<\/code>\s*<\/pre>/g;return e.replace(n,s=>s.replace(/<\/p>\s*<p>/g,`
 `).replace(/<p>/g,"").replace(/<\/p>/g,"")).replace(n,s=>zr(s,{whiteList:{pre:[],code:[]}}))},di=({content:e,type:n,widgetType:u="post",createAnchors:t,useHashAutoscroll:s,hashAutoscrollTopMargin:p=0,forceDefaultLinkTarget:g,inheritBrandingStyles:m=!1,addColorBlocks:b=!1,replaceLinkDomains:D=[],onSaveToClipboard:C})=>{const w=ue.useRef(null),y=ue.useRef(!1),[q,L]=ue.useState([]),I=ue.useCallback(()=>{var N;try{const{hash:j}=window.location;if(w.current&&j){const z=(N=w.current)==null?void 0:N.querySelector(j);z&&setTimeout(()=>{window.scrollTo({top:z.getBoundingClientRect().top-p,behavior:"smooth"}),z.classList.add("highlight"),setTimeout(()=>{z.classList.remove("highlight")},5e3)},500)}}catch{}},[p]);ue.useLayoutEffect(()=>{if(!w.current||y.current)return;const N=()=>{if(!w.current||!g)return;const a=w.current.querySelectorAll("a")||[];if(a.length>0){const d=window.origin;a.forEach(o=>{const{href:f}=o;f.startsWith(d)?delete o.target:o.target="_blank"})}},j=()=>{w.current&&(w.current.querySelectorAll("a")||[]).forEach(a=>{const{href:d}=a;d.startsWith("mailto:")&&(a.target="_blank")})},z=()=>{if(!w.current)return;const a=w.current.querySelectorAll(Et);a.length>0&&(Er.isDefined("highlightjs")||(ui(),Er([...Fn,...$n],"highlightjs")),Er.ready("highlightjs",()=>{window.hljs.configure({languages:Wn,useBr:!0}),a.forEach(d=>{const o=d.innerText,f=document.createElement(Gn),c=Zt(o);f.textContent=c,d.innerHTML="",d.appendChild(f),window.hljs.highlightBlock(d)}),L(d=>[...d,...a])}))},r=()=>{D.length!==0&&D.forEach(({domainToReplace:a,domainToReplaceWith:d})=>{if(!w.current)return;const o=w.current.querySelectorAll("a")||[];o.length>0&&o.forEach(f=>{try{const{href:c}=f,h=new URL(c),{hostname:T}=h;if(T!==a||h.pathname==="/")return;if(d===""){const k=`${h.pathname}${h.search}${h.hash}`;f.href=k}else f.href=c.replace(a,d)}catch{}})})};requestAnimationFrame(()=>{N(),j(),z(),r(),s&&I()}),y.current=!0},[w,t,g,s,D,I]),ue.useLayoutEffect(()=>{(()=>{if(!w.current||!t)return;const j=w.current.querySelectorAll("h1, h2, h3, h4, h5, h6")||[];j.length>0&&j.forEach(z=>{const{textContent:r=""}=z;(r||"").length>0&&(z.id=z.id||At((r||"").toLowerCase().replace(/\s/g,"-")))}),L(z=>[...z,...j])})()},[t,e]);const x=ue.useMemo(()=>{const N=n&&typeof n=="string"?n.toLowerCase():"html";let j=N==="text"?`<p>${e}</p>`:ii(e,N);return b&&(j=ai(j)),j=si(j),ti(j)},[e,n,b]);return fe.jsxs(fe.Fragment,{children:[fe.jsx(ci,{className:`content-renderer ${u==="page"?"fr-view pages-text":""}`,ref:w,widgetType:u,createAnchors:t,hashAutoscrollTopMargin:s&&p,dangerouslySetInnerHTML:{__html:x},inheritBrandingStyles:m}),q.map(N=>{let j=N.textContent?At(N.textContent):"",z=!1;return N.tagName!==Et&&(z=!0,j=`${window.location.href.split("#")[0]}#${N.id}`),ea.createPortal(fe.jsx(oi,{className:"content-copy-btn",children:fe.jsx(ra.CopyToClipboardButton,{icon:z?fe.jsx(na,{}):void 0,colorScheme:"blank",clipboardContent:j,onSaveToClipboard:C,hideSuccessTooltip:!!C})}),N)})]})},oi=ye.div`
-  position: relative;
+  position: absolute;
   display: inline-block;
   margin-inline-start: var(--space-sm);
   vertical-align: middle;
@@ -259,6 +259,20 @@
     border: 1px solid var(--color-gray100);
   }
 
+  // when wide tables are displayed on small screens they look terrible unless
+  // we add horizontal scrolling: but this requires giving overflow-x: auto to
+  // to the table's container, i.e. this entire content renderer
+  @media (max-width: 521px) { // (using "var(--breakpoint-md, 521px)" fails in storybook for some reason)
+    overflow-x: auto;
+    table {
+      table-layout: auto !important; // overrides 'fixed' set here
+
+      td,
+      th {
+        word-break: normal !important; // overrides 'break-word' set for some components
+      }
+    }
+  }
   /* Table styles */
   // this code is duplicated:
   // - in the happeouikit ContentRenderer (used for viewed content)