@frontify/fondue 12.0.0-beta.282 → 12.0.0-beta.283

package/dist/index.umd.js

@@ -68,7 +68,7 @@ Shift+Ctrl+Return`:"Already at maximum numbers of columns"),onMouseDown:u=>tT(a,
             font-weight: bold;
             line-height: 10px;
             border-radius: 2px;
-        `]},Td0=e=>t.createElement(w.MentionInputElement,{...e,styles:Vd0});class jd0 extends l0{constructor(l=w.ELEMENT_MENTION_INPUT,a=Td0){super(l,a)}}class Dd0 extends n0{constructor(l){super(Md0,{markupElement:new oT().setNodeWithMentionable(l.mentionableItems),markupInputElement:new jd0,...l})}inline(){var l;return zd0(((l=this.props)==null?void 0:l.mentionableItems)||[])}plugins(){return[w.createComboboxPlugin(),w.createMentionPlugin(pd0)]}}const Fd0="blur-on-break-plugin",Bd0=["input","select","textarea","button","a[href]","area[href]","summary","iframe","object","embed","audio[controls]","video[controls]","[contenteditable]","[tabindex]"].join(':not([hidden]):not([tabindex="-1"]):not([disabled]),'),cT=(e,l)=>{if(!document.activeElement)return;e.preventDefault();const a=Array.from(document.querySelectorAll(Bd0)).filter(s=>Od0(s)),o=a.indexOf(document.activeElement),i=(l?o+1:o-1+a.length)%a.length,c=a[i];c&&c.focus()},Od0=e=>{let l=e;for(;l;){const a=window.getComputedStyle(l);if(a.display==="none"||a.visibility==="hidden")return!1;l=l.parentElement}return!0},sT=()=>{var e;(e=document.activeElement)==null||e.blur()},Pd0=(e,{options:{onBreak:l=()=>{}}})=>a=>{w.Hotkeys.isSplitBlock(a)&&(a.stopPropagation(),a.preventDefault(),sT(),typeof l=="function"&&l(e.children))},Ud0="blurOnBreak",Qd0=w.createPluginFactory({key:Ud0,handlers:{onKeyDown:Pd0}});class Yd0 extends n0{constructor(a){super(Fd0,{...a});W(this,"onBreak");this.onBreak=a==null?void 0:a.onBreak}plugins(){return[Qd0({options:{onBreak:this.onBreak}})]}}const O1=new QV;O1.setPlugin(new LV).setPlugin(new kV({textStyles:[new SV]})).setPlugin([new aV,new wV,new RV,new XV,new vV,new cV],[new Rp,new _p,new tV,new eV,new UV,new Jp,new FV,new qV,new mV]);class m2{static getInstance(){return this.editor===void 0&&this.init(),this.editor}static init(l=x1(),a=O1){const o=e7(l,a);return this.editor=w.createPlateEditor({id:l,plugins:o.create()}),this}}W(m2,"editor"),W(m2,"editorId",x1());const Gd0=e=>e[0].hasOwnProperty("type")?e:[{type:"p",children:e}],mT=[{type:w.ELEMENT_PARAGRAPH,children:[{text:""}]}],L2=({editorId:e="parseRawValue",raw:l,plugins:a})=>{const o=m2.init(`${e}_parseRawValue`,a).getInstance();let i=mT;if(!l)return i;try{i=JSON.parse(l)}catch{const c=l.trim().replaceAll(/>\s+</g,"><"),s=w.deserializeHtml(o,{element:c});i=Gd0(s)}return o.children=i,w.normalizeEditor(o,{force:!0}),o.children},M5=e=>e&&typeof e=="object"&&!Array.isArray(e),LT=(e,l)=>{if(!M5(e)||!M5(l))return{};const a=Object.assign({},e);for(const o of Object.keys(l)){if(o in e&&M5(l[o])){a[o]=LT(e[o],l[o]);continue}Object.assign(a,{[o]:l[o]})}return a},Wd0=e=>e.hasOwnProperty("type")&&typeof e.type=="string"&&e.type.length>0,qd0=e=>e.hasOwnProperty("children")&&Array.isArray(e.children)&&e.children.length===1,Kd0=e=>typeof e=="object"&&e.hasOwnProperty("text")&&typeof e.text=="string"&&e.text.length===0,$d0=e=>qd0(e)&&Kd0(e.children[0]),Xd0=e=>{if(!e)return!0;if(Array.isArray(e)&&e.length<2){if(e.length===0)return!0;const l=e[0];if(Wd0(l)&&$d0(l))return!0}return!1},Jd0=({children:e,editorWidth:l,toolbarButtonGroups:a=[],toolbarWidth:o})=>{const[i,c]=t.useState(),s=t.useRef();t.useEffect(()=>{if(o)c(o);else{const L=Up(a);L>0&&c(L+a.length+Pp)}},[l,o,a]),t.useEffect(()=>{const L=()=>{const d=window.getSelection(),u=(d==null?void 0:d.rangeCount)??0,f=u>0&&(d==null?void 0:d.getRangeAt(0).startOffset),h=u>0&&(d==null?void 0:d.getRangeAt(0).endOffset);!(!!d&&f!==h&&u>0)&&s.current&&s.current()};return document.addEventListener("selectionchange",L),()=>document.removeEventListener("selectionchange",L)},[]);const m=(L,d,u)=>{s.current=w.autoUpdate(L,d,u)};return t.createElement(w.BalloonToolbar,{floatingOptions:{middleware:[w.flip(),w.shift()],whileElementsMounted:m},styles:{root:{border:"none",background:"#ffffff",width:i}}},t.createElement("div",{"data-selector":"toolbar-floating","data-test-id":"toolbar-floating",className:"tw-rounded tw-min-h-12 tw-border tw-border-line tw-shadow-lg tw-bg-base tw-divide-y tw-divide-line tw-flex tw-flex-wrap"},e))},dT={[h0.BOTTOM]:{PlateWrapperClassNames:"tw-relative tw-w-full tw-flex tw-flex-col",ToolbarWrapper:Ks0},[h0.FLOATING]:{PlateWrapperClassNames:"tw-relative tw-w-full",ToolbarWrapper:Jd0},[h0.TOP]:{PlateWrapperClassNames:"tw-relative tw-w-full tw-flex tw-flex-col-reverse",ToolbarWrapper:$s0}},_d0=(e,l)=>{const a=dT[e].PlateWrapperClassNames;return A([a,l&&"tw-border tw-border-line-strong tw-rounded"])},Rd0=({children:e,apply:l})=>{for(const a of e)l({type:"remove_node",path:[0],node:a})},eu0=({value:e})=>{const l=w.usePlateEditorRef();return t.useEffect(()=>{e&&(Rd0(l),w.insertNodes(l,e))},[l,e]),null},tu0=({hideExternalFloatingModals:e})=>{const l=w.useEditorRef(),a=w.useFloatingLinkSelectors().isOpen(l.id),o=t.useCallback(()=>{a&&w.floatingLinkActions.reset(),e&&e(l.id)},[a,e,l]),i=t.useCallback(()=>{l.collapse(),o()},[l,o]);return t.useEffect(()=>{const c=s=>{const m=`[data-editor-id='${l.id}']`,L="[data-selector='toolbar-floating']",d="[data-is-underlay]",u=document.querySelector(m),f=document.querySelector(L),h=document.querySelector(d),g=s.target,v=h==null?void 0:h.contains(g),E=u==null?void 0:u.contains(g),C=f==null?void 0:f.contains(g);C&&o(),!E&&!C&&!v&&i()};return document.addEventListener("pointerdown",c),document.addEventListener("focusin",c),()=>{document.removeEventListener("focusin",c),document.removeEventListener("pointerdown",c)}},[i,o,l.id]),null},lu0={position:"relative",height:"0"},uT=({id:e,value:l,placeholder:a="",readonly:o=!1,onTextChange:i,onBlur:c,padding:s=k3.None,position:m=h0.FLOATING,plugins:L=O1,updateValueOnChange:d=!1,onValueChanged:u,border:f=!0,toolbarWidth:h,hideExternalFloatingModals:g})=>{var H,I;const v=E0(e),{localValue:E,onChange:C,memoizedValue:M,config:Z}=Rs0({editorId:v,initialValue:l,onTextChange:i,plugins:L,onValueChanged:u}),N=L.plugins.find(b=>b.key===B1),x=((H=N==null?void 0:N.options)==null?void 0:H.columns)??1,k=((I=N==null?void 0:N.options)==null?void 0:I.gap)??R3,S={placeholder:a,renderPlaceholder:({children:b,attributes:y})=>{const V={...y,style:{...y.style,...lu0}};return t.createElement("span",{...V},b)},readOnly:o,onBlur:()=>c&&c(JSON.stringify(E.current)),className:`${s}`,style:{columns:x,columnGap:k,outline:"none"},onKeyDown:b=>{b.code==="Tab"&&cT(b,!b.shiftKey)},scrollSelectionIntoView:()=>{}};return t.createElement(Gp,{value:{styles:Z.styles(),position:m,border:f,editorId:v}},t.createElement(w.Plate,{id:v,onChange:C,editableProps:S,plugins:Z.create(),initialValue:M},!S.readOnly&&Z.toolbar(h),Z.inline(),d&&t.createElement(eu0,{value:L2({editorId:v,raw:l,plugins:L})}),m===h0.FLOATING&&t.createElement(tu0,{hideExternalFloatingModals:g})))};uT.displayName="FondueRichTextEditor";const wT=e=>e.split("").reverse().join(""),P1=(e,l)=>{const a=e.trim(),o=a,i=`${l}${o}${wT(l)}`;if(o.length===e.length)return i;const c=l+o+wT(l);return e.replace(a,c)},nu0=(e,l)=>{const a=`
+        `]},Td0=e=>t.createElement(w.MentionInputElement,{...e,styles:Vd0});class jd0 extends l0{constructor(l=w.ELEMENT_MENTION_INPUT,a=Td0){super(l,a)}}class Dd0 extends n0{constructor(l){super(Md0,{markupElement:new oT().setNodeWithMentionable(l.mentionableItems),markupInputElement:new jd0,...l})}inline(){var l;return zd0(((l=this.props)==null?void 0:l.mentionableItems)||[])}plugins(){return[w.createComboboxPlugin(),w.createMentionPlugin(pd0)]}}const Fd0="blur-on-break-plugin",Bd0=["input","select","textarea","button","a[href]","area[href]","summary","iframe","object","embed","audio[controls]","video[controls]","[contenteditable]","[tabindex]"].join(':not([hidden]):not([tabindex="-1"]):not([disabled]),'),cT=(e,l)=>{if(!document.activeElement)return;e.preventDefault();const a=Array.from(document.querySelectorAll(Bd0)).filter(s=>Od0(s)),o=a.indexOf(document.activeElement),i=(l?o+1:o-1+a.length)%a.length,c=a[i];c&&c.focus()},Od0=e=>{let l=e;for(;l;){const a=window.getComputedStyle(l);if(a.display==="none"||a.visibility==="hidden")return!1;l=l.parentElement}return!0},sT=()=>{var e;(e=document.activeElement)==null||e.blur()},Pd0=(e,{options:{onBreak:l=()=>{}}})=>a=>{w.Hotkeys.isSplitBlock(a)&&(a.stopPropagation(),a.preventDefault(),sT(),typeof l=="function"&&l(e.children))},Ud0="blurOnBreak",Qd0=w.createPluginFactory({key:Ud0,handlers:{onKeyDown:Pd0}});class Yd0 extends n0{constructor(a){super(Fd0,{...a});W(this,"onBreak");this.onBreak=a==null?void 0:a.onBreak}plugins(){return[Qd0({options:{onBreak:this.onBreak}})]}}const O1=new QV;O1.setPlugin(new LV).setPlugin(new kV({textStyles:[new SV]})).setPlugin([new aV,new wV,new RV,new XV,new vV,new cV],[new Rp,new _p,new tV,new eV,new UV,new Jp,new FV,new qV,new mV]);class m2{static getInstance(){return this.editor===void 0&&this.init(),this.editor}static init(l=x1(),a=O1){const o=e7(l,a);return this.editor=w.createPlateEditor({id:l,plugins:o.create()}),this}}W(m2,"editor"),W(m2,"editorId",x1());const Gd0=e=>e[0].hasOwnProperty("type")?e:[{type:"p",children:e}],mT=[{type:w.ELEMENT_PARAGRAPH,children:[{text:""}]}],L2=({editorId:e="parseRawValue",raw:l,plugins:a})=>{const o=m2.init(`${e}_parseRawValue`,a).getInstance();let i=mT;if(!l)return i;try{i=JSON.parse(l)}catch{const c=l.trim().replaceAll(/>\s+</g,"><"),s=w.deserializeHtml(o,{element:c});i=Gd0(s)}return o.children=i,w.normalizeEditor(o,{force:!0}),o.children},M5=e=>e&&typeof e=="object"&&!Array.isArray(e),LT=(e,l)=>{if(!M5(e)||!M5(l))return{};const a=Object.assign({},e);for(const o of Object.keys(l)){if(o in e&&M5(l[o])){a[o]=LT(e[o],l[o]);continue}Object.assign(a,{[o]:l[o]})}return a},Wd0=e=>e.hasOwnProperty("type")&&typeof e.type=="string"&&e.type.length>0,qd0=e=>e.hasOwnProperty("children")&&Array.isArray(e.children)&&e.children.length===1,Kd0=e=>typeof e=="object"&&e.hasOwnProperty("text")&&typeof e.text=="string"&&e.text.length===0,$d0=e=>qd0(e)&&Kd0(e.children[0]),Xd0=e=>{if(!e)return!0;if(Array.isArray(e)&&e.length<2){if(e.length===0)return!0;const l=e[0];if(Wd0(l)&&$d0(l))return!0}return!1},Jd0=({children:e,editorWidth:l,toolbarButtonGroups:a=[],toolbarWidth:o})=>{const[i,c]=t.useState(),s=t.useRef();t.useEffect(()=>{if(o)c(o);else{const L=Up(a);L>0&&c(L+a.length+Pp)}},[l,o,a]),t.useEffect(()=>{const L=()=>{const d=window.getSelection(),u=(d==null?void 0:d.rangeCount)??0,f=u>0&&(d==null?void 0:d.getRangeAt(0).startOffset),h=u>0&&(d==null?void 0:d.getRangeAt(0).endOffset);!(!!d&&f!==h&&u>0)&&s.current&&s.current()};return document.addEventListener("selectionchange",L),()=>document.removeEventListener("selectionchange",L)},[]);const m=(L,d,u)=>{s.current=w.autoUpdate(L,d,u)};return t.createElement(w.BalloonToolbar,{floatingOptions:{middleware:[w.flip(),w.shift()],whileElementsMounted:m},styles:{root:{border:"none",background:"#ffffff",width:i,transitionDuration:"0s"}}},t.createElement("div",{"data-selector":"toolbar-floating","data-test-id":"toolbar-floating",className:"tw-rounded tw-min-h-12 tw-border tw-border-line tw-shadow-lg tw-bg-base tw-divide-y tw-divide-line tw-flex tw-flex-wrap"},e))},dT={[h0.BOTTOM]:{PlateWrapperClassNames:"tw-relative tw-w-full tw-flex tw-flex-col",ToolbarWrapper:Ks0},[h0.FLOATING]:{PlateWrapperClassNames:"tw-relative tw-w-full",ToolbarWrapper:Jd0},[h0.TOP]:{PlateWrapperClassNames:"tw-relative tw-w-full tw-flex tw-flex-col-reverse",ToolbarWrapper:$s0}},_d0=(e,l)=>{const a=dT[e].PlateWrapperClassNames;return A([a,l&&"tw-border tw-border-line-strong tw-rounded"])},Rd0=({children:e,apply:l})=>{for(const a of e)l({type:"remove_node",path:[0],node:a})},eu0=({value:e})=>{const l=w.usePlateEditorRef();return t.useEffect(()=>{e&&(Rd0(l),w.insertNodes(l,e))},[l,e]),null},tu0=({hideExternalFloatingModals:e})=>{const l=w.useEditorRef(),a=w.useFloatingLinkSelectors().isOpen(l.id),o=t.useCallback(()=>{a&&w.floatingLinkActions.reset(),e&&e(l.id)},[a,e,l]),i=t.useCallback(()=>{l.collapse(),o()},[l,o]);return t.useEffect(()=>{const c=s=>{const m=`[data-editor-id='${l.id}']`,L="[data-selector='toolbar-floating']",d="[data-is-underlay]",u=document.querySelector(m),f=document.querySelector(L),h=document.querySelector(d),g=s.target,v=h==null?void 0:h.contains(g),E=u==null?void 0:u.contains(g),C=f==null?void 0:f.contains(g);C&&o(),!E&&!C&&!v&&i()};return document.addEventListener("pointerdown",c),document.addEventListener("focusin",c),()=>{document.removeEventListener("focusin",c),document.removeEventListener("pointerdown",c)}},[i,o,l.id]),null},lu0={position:"relative",height:"0"},uT=({id:e,value:l,placeholder:a="",readonly:o=!1,onTextChange:i,onBlur:c,padding:s=k3.None,position:m=h0.FLOATING,plugins:L=O1,updateValueOnChange:d=!1,onValueChanged:u,border:f=!0,toolbarWidth:h,hideExternalFloatingModals:g})=>{var H,I;const v=E0(e),{localValue:E,onChange:C,memoizedValue:M,config:Z}=Rs0({editorId:v,initialValue:l,onTextChange:i,plugins:L,onValueChanged:u}),N=L.plugins.find(b=>b.key===B1),x=((H=N==null?void 0:N.options)==null?void 0:H.columns)??1,k=((I=N==null?void 0:N.options)==null?void 0:I.gap)??R3,S={placeholder:a,renderPlaceholder:({children:b,attributes:y})=>{const V={...y,style:{...y.style,...lu0}};return t.createElement("span",{...V},b)},readOnly:o,onBlur:()=>c&&c(JSON.stringify(E.current)),className:`${s}`,style:{columns:x,columnGap:k,outline:"none"},onKeyDown:b=>{b.code==="Tab"&&cT(b,!b.shiftKey)},scrollSelectionIntoView:()=>{}};return t.createElement(Gp,{value:{styles:Z.styles(),position:m,border:f,editorId:v}},t.createElement(w.Plate,{id:v,onChange:C,editableProps:S,plugins:Z.create(),initialValue:M},!S.readOnly&&Z.toolbar(h),Z.inline(),d&&t.createElement(eu0,{value:L2({editorId:v,raw:l,plugins:L})}),m===h0.FLOATING&&t.createElement(tu0,{hideExternalFloatingModals:g})))};uT.displayName="FondueRichTextEditor";const wT=e=>e.split("").reverse().join(""),P1=(e,l)=>{const a=e.trim(),o=a,i=`${l}${o}${wT(l)}`;if(o.length===e.length)return i;const c=l+o+wT(l);return e.replace(a,c)},nu0=(e,l)=>{const a=`
 `;return(l.strikethrough||l.bold||l.italic)&&new RegExp(a,"g").test(e)&&(e=e.replaceAll(a,`\\
 `)),e},ru0=(e,l)=>(l.strikethrough&&l.bold&&l.italic?e=P1(e,"~~***"):l.bold&&l.italic?e=P1(e,"***"):(l.bold&&(e=P1(e,"**")),l.italic&&(e=P1(e,"_")),l.strikethrough&&(e=P1(e,"~~")),l.code&&(e=P1(e,"`"))),e=nu0(e,l),e),U1=e=>!("type"in e),au0={paragraph:"paragraph",blockQuote:"block_quote",codeBlock:"code_block",link:"link",ulList:"ul_list",olList:"ol_list",listItem:"list_item",listItemChild:"lic",heading:{1:"heading_one",2:"heading_two",3:"heading_three",4:"heading_four",5:"heading_five",6:"heading_six"},emphasisMark:"italic",strongMark:"bold",deleteMark:"strikethrough",inlineCodeMark:"code",thematicBreak:"thematic_break",image:"image",mention:"mention"},I5={Blank:"_blank",Self:"_self"},ou0=e=>`@[${e.category}:${e.id}]`,iu0=e=>`${e}
 `,cu0=(e,l,a,o)=>{const i=a&&a.parentType===e.olList,c=a.children.length===1&&U1(a.children[0]);let s="";for(let m=0;o>m;m++)i?s+="   ":s+="  ";return`${s}${i?"1.":"-"} ${l}${c?`