@layers-app/editor 0.7.82 → 0.7.84

package/dist/layers.P6wShzg6.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),P=require("@lexical/react/LexicalComposerContext"),v=require("@lexical/react/LexicalErrorBoundary"),y=require("@lexical/react/LexicalNestedComposer"),$=require("@lexical/react/LexicalRichTextPlugin"),k=require("@lexical/react/useLexicalNodeSelection"),q=require("@lexical/utils"),t=require("lexical"),x=require("./layers.DYInS_N4.js"),Y=require("@mantine/core");function w({children:n,className:l}){return e.jsx("div",{className:l||"Placeholder__root",children:n})}function B({label:n,value:l,onChange:o,placeholder:C="","data-test-id":i,type:d="text"}){return e.jsx(Y.TextInput,{type:d,placeholder:C,value:l,onChange:c=>{o(c.target.value)},label:n,"data-test-id":i,mb:10})}const b=new Set;function W(n){if(!b.has(n))throw new Promise(l=>{const o=new Image;o.src=n,o.onload=()=>{b.add(n),l(null)}})}function F({altText:n,className:l,imageRef:o,src:C,width:i,height:d,position:c}){return W(C),e.jsx("img",{className:l||void 0,src:C,alt:n,ref:o,"data-position":c,style:{display:"block",height:d,width:i},draggable:"false"})}function A({activeEditor:n,nodeKey:l,onClose:o}){const i=n.getEditorState().read(()=>t.$getNodeByKey(l)),[d,c]=s.useState(i.getAltText()),[h,S]=s.useState(i.getShowCaption()),[_,N]=s.useState(i.getPosition()),p=m=>{S(m.target.checked)},g=()=>{const m={altText:d,position:_,showCaption:h};i&&n.update(()=>{i.update(m)}),o()};return e.jsxs(e.Fragment,{children:[e.jsx("div",{style:{marginBottom:"1em"},children:e.jsx(B,{label:"Alt-текст",placeholder:"Альтернативный текст",onChange:c,value:d,"data-test-id":"image-modal-alt-text-input"})}),e.jsxs("div",{className:"Input__wrapper",children:[e.jsx("input",{id:"caption",type:"checkbox",checked:h,onChange:p}),e.jsx("label",{htmlFor:"caption",children:"Show Caption"})]}),e.jsx(x.Button,{"data-test-id":"image-modal-file-upload-btn",onClick:()=>g(),children:"Применить"})]})}function K({src:n,altText:l,nodeKey:o,width:C,height:i,showCaption:d,caption:c,position:h}){const[S,_]=x.useModal(),N=s.useRef(null),p=s.useRef(null),[g,m,M]=k.useLexicalNodeSelection(o),[a]=P.useLexicalComposerContext(),[D,L]=s.useState(null),O=s.useRef(null),E=s.useCallback(u=>{if(g&&t.$isNodeSelection(t.$getSelection())){u.preventDefault();const r=t.$getNodeByKey(o);x.$isInlineImageNode(r)&&r.remove()}return!1},[g,o]),R=s.useCallback(u=>{const f=t.$getSelection(),r=p.current;if(g&&t.$isNodeSelection(f)&&f.getNodes().length===1){if(d)return t.$setSelection(null),u.preventDefault(),c.focus(),!0;if(r!==null&&r!==document.activeElement)return u.preventDefault(),r.focus(),!0}return!1},[c,g,d]),j=s.useCallback(u=>O.current===c||p.current===u.target?(t.$setSelection(null),a.update(()=>{m(!0);const f=a.getRootElement();f!==null&&f.focus()}),!0):!1,[c,a,m]);s.useEffect(()=>{let u=!0;const f=q.mergeRegister(a.registerUpdateListener(({editorState:r})=>{u&&L(r.read(()=>t.$getSelection()))}),a.registerCommand(t.SELECTION_CHANGE_COMMAND,(r,I)=>(O.current=I,!1),t.COMMAND_PRIORITY_LOW),a.registerCommand(t.CLICK_COMMAND,r=>{const I=r;return I.target===N.current?(I.shiftKey?m(!g):(M(),m(!0)),!0):!1},t.COMMAND_PRIORITY_LOW),a.registerCommand(t.DRAGSTART_COMMAND,r=>r.target===N.current?(r.preventDefault(),!0):!1,t.COMMAND_PRIORITY_LOW),a.registerCommand(t.KEY_DELETE_COMMAND,E,t.COMMAND_PRIORITY_LOW),a.registerCommand(t.KEY_BACKSPACE_COMMAND,E,t.COMMAND_PRIORITY_LOW),a.registerCommand(t.KEY_ENTER_COMMAND,R,t.COMMAND_PRIORITY_LOW),a.registerCommand(t.KEY_ESCAPE_COMMAND,j,t.COMMAND_PRIORITY_LOW));return()=>{u=!1,f()}},[M,a,g,o,E,R,j,m]);const T=g;return e.jsxs(s.Suspense,{fallback:null,children:[e.jsxs(e.Fragment,{children:[e.jsxs("div",{draggable:!1,children:[e.jsx("button",{className:"image-edit-button",ref:p,onClick:()=>{_("Update Inline Image",u=>e.jsx(A,{activeEditor:a,nodeKey:o,onClose:u}))},children:"Edit"}),e.jsx(F,{className:T?`focused ${t.$isNodeSelection(D)?"draggable":""}`:null,src:n,altText:l,imageRef:N,width:C,height:i,position:h})]}),d&&e.jsx("div",{className:"image-caption-container",children:e.jsxs(y.LexicalNestedComposer,{initialEditor:c,children:[e.jsx(x.LinkPlugin,{}),e.jsx(x.FloatingTextFormatToolbarPlugin,{}),e.jsx($.RichTextPlugin,{contentEditable:e.jsx(x.LexicalContentEditable,{className:"InlineImageNode__contentEditable"}),placeholder:e.jsx(w,{className:"InlineImageNode__placeholder",children:"Enter a caption..."}),ErrorBoundary:v.LexicalErrorBoundary})]})})]}),S]})}exports.UpdateInlineImageDialog=A;exports.default=K;