@wordpress/editor
Version:
Enhanced block editor for WordPress posts.
8 lines (7 loc) • 5.56 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/components/post-text-editor/index.js"],
"sourcesContent": ["import Textarea from 'react-autosize-textarea';\nimport { useLayoutEffect, useRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useInstanceId } from '@wordpress/compose';\nimport { VisuallyHidden } from '@wordpress/ui';\nimport { store as editorStore } from '../../store';\nimport { adjustPosition, getDiff } from './utils';\n\n/**\n * Displays the Post Text Editor along with content in Visual and Text mode.\n *\n * @return {React.ReactNode} The rendered PostTextEditor component.\n */\nexport default function PostTextEditor() {\n\tconst instanceId = useInstanceId( PostTextEditor );\n\tconst textareaRef = useRef();\n\tconst previousValueRef = useRef();\n\tconst selectionRef = useRef();\n\tconst { value, type, id } = useSelect( ( select ) => {\n\t\tconst { getCurrentPostType, getCurrentPostId, getEditedPostContent } =\n\t\t\tselect( editorStore );\n\t\treturn {\n\t\t\tvalue: getEditedPostContent(),\n\t\t\ttype: getCurrentPostType(),\n\t\t\tid: getCurrentPostId(),\n\t\t};\n\t}, [] );\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\n\tuseLayoutEffect( () => {\n\t\tconst textarea = textareaRef.current;\n\t\tconst previousValue = previousValueRef.current;\n\t\tpreviousValueRef.current = value;\n\n\t\tif (\n\t\t\t! textarea ||\n\t\t\tpreviousValue === undefined ||\n\t\t\tpreviousValue === value ||\n\t\t\t! selectionRef.current\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { selectionStart, selectionEnd, selectionDirection } =\n\t\t\tselectionRef.current;\n\t\tconst changes = getDiff( previousValue, value );\n\t\tconst adjustedSelectionStart = adjustPosition(\n\t\t\tselectionStart,\n\t\t\tchanges,\n\t\t\tpreviousValue,\n\t\t\tvalue\n\t\t);\n\t\tconst adjustedSelectionEnd = adjustPosition(\n\t\t\tselectionEnd,\n\t\t\tchanges,\n\t\t\tpreviousValue,\n\t\t\tvalue\n\t\t);\n\n\t\ttextarea.setSelectionRange(\n\t\t\tadjustedSelectionStart,\n\t\t\tadjustedSelectionEnd,\n\t\t\tselectionDirection\n\t\t);\n\t\tselectionRef.current = {\n\t\t\tselectionStart: adjustedSelectionStart,\n\t\t\tselectionEnd: adjustedSelectionEnd,\n\t\t\tselectionDirection,\n\t\t};\n\t}, [ value ] );\n\n\tconst updateSelection = ( event ) => {\n\t\tconst { selectionStart, selectionEnd, selectionDirection } =\n\t\t\tevent.target;\n\t\tselectionRef.current = {\n\t\t\tselectionStart,\n\t\t\tselectionEnd,\n\t\t\tselectionDirection,\n\t\t};\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<VisuallyHidden\n\t\t\t\t// eslint-disable-next-line jsx-a11y/label-has-associated-control\n\t\t\t\trender={ <label htmlFor={ `post-content-${ instanceId }` } /> }\n\t\t\t>\n\t\t\t\t{ __( 'Type text or HTML' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<Textarea\n\t\t\t\tautoComplete=\"off\"\n\t\t\t\tdir=\"auto\"\n\t\t\t\tref={ textareaRef }\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ ( event ) => {\n\t\t\t\t\tupdateSelection( event );\n\t\t\t\t\tpreviousValueRef.current = event.target.value;\n\t\t\t\t\teditEntityRecord( 'postType', type, id, {\n\t\t\t\t\t\tcontent: event.target.value,\n\t\t\t\t\t\tblocks: undefined,\n\t\t\t\t\t\tselection: undefined,\n\t\t\t\t\t} );\n\t\t\t\t} }\n\t\t\t\tonFocus={ updateSelection }\n\t\t\t\t// A click or arrow-key caret move does not fire `select` (only\n\t\t\t\t// range selections do), so track those moves via mouseup/keyup.\n\t\t\t\tonMouseUp={ updateSelection }\n\t\t\t\tonKeyUp={ updateSelection }\n\t\t\t\tclassName=\"editor-post-text-editor\"\n\t\t\t\tid={ `post-content-${ instanceId }` }\n\t\t\t\tplaceholder={ __( 'Start writing with text or HTML' ) }\n\t\t\t/>\n\t\t</>\n\t);\n}\n"],
"mappings": ";AAAA,OAAO,cAAc;AACrB,SAAS,iBAAiB,cAAc;AACxC,SAAS,UAAU;AACnB,SAAS,SAAS,iBAAiB;AACnC,SAAS,aAAa,iBAAiB;AACvC,SAAS,qBAAqB;AAC9B,SAAS,sBAAsB;AAC/B,SAAS,SAAS,mBAAmB;AACrC,SAAS,gBAAgB,eAAe;AA4EtC,mBAGW,KAHX;AArEa,SAAR,iBAAkC;AACxC,QAAM,aAAa,cAAe,cAAe;AACjD,QAAM,cAAc,OAAO;AAC3B,QAAM,mBAAmB,OAAO;AAChC,QAAM,eAAe,OAAO;AAC5B,QAAM,EAAE,OAAO,MAAM,GAAG,IAAI,UAAW,CAAE,WAAY;AACpD,UAAM,EAAE,oBAAoB,kBAAkB,qBAAqB,IAClE,OAAQ,WAAY;AACrB,WAAO;AAAA,MACN,OAAO,qBAAqB;AAAA,MAC5B,MAAM,mBAAmB;AAAA,MACzB,IAAI,iBAAiB;AAAA,IACtB;AAAA,EACD,GAAG,CAAC,CAAE;AACN,QAAM,EAAE,iBAAiB,IAAI,YAAa,SAAU;AAEpD,kBAAiB,MAAM;AACtB,UAAM,WAAW,YAAY;AAC7B,UAAM,gBAAgB,iBAAiB;AACvC,qBAAiB,UAAU;AAE3B,QACC,CAAE,YACF,kBAAkB,UAClB,kBAAkB,SAClB,CAAE,aAAa,SACd;AACD;AAAA,IACD;AAEA,UAAM,EAAE,gBAAgB,cAAc,mBAAmB,IACxD,aAAa;AACd,UAAM,UAAU,QAAS,eAAe,KAAM;AAC9C,UAAM,yBAAyB;AAAA,MAC9B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AACA,UAAM,uBAAuB;AAAA,MAC5B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAEA,aAAS;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,IACD;AACA,iBAAa,UAAU;AAAA,MACtB,gBAAgB;AAAA,MAChB,cAAc;AAAA,MACd;AAAA,IACD;AAAA,EACD,GAAG,CAAE,KAAM,CAAE;AAEb,QAAM,kBAAkB,CAAE,UAAW;AACpC,UAAM,EAAE,gBAAgB,cAAc,mBAAmB,IACxD,MAAM;AACP,iBAAa,UAAU;AAAA,MACtB;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AAEA,SACC,iCACC;AAAA;AAAA,MAAC;AAAA;AAAA,QAEA,QAAS,oBAAC,WAAM,SAAU,gBAAiB,UAAW,IAAK;AAAA,QAEzD,aAAI,mBAAoB;AAAA;AAAA,IAC3B;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA,cAAa;AAAA,QACb,KAAI;AAAA,QACJ,KAAM;AAAA,QACN;AAAA,QACA,UAAW,CAAE,UAAW;AACvB,0BAAiB,KAAM;AACvB,2BAAiB,UAAU,MAAM,OAAO;AACxC,2BAAkB,YAAY,MAAM,IAAI;AAAA,YACvC,SAAS,MAAM,OAAO;AAAA,YACtB,QAAQ;AAAA,YACR,WAAW;AAAA,UACZ,CAAE;AAAA,QACH;AAAA,QACA,SAAU;AAAA,QAGV,WAAY;AAAA,QACZ,SAAU;AAAA,QACV,WAAU;AAAA,QACV,IAAK,gBAAiB,UAAW;AAAA,QACjC,aAAc,GAAI,iCAAkC;AAAA;AAAA,IACrD;AAAA,KACD;AAEF;",
"names": []
}