[{"data":1,"prerenderedAt":334},["ShallowReactive",2],{"docs:\u002Fen\u002Fdocs\u002Finstallation\u002Fesm":3},{"id":4,"title":5,"body":6,"description":326,"extension":327,"meta":328,"navigation":133,"path":330,"seo":331,"stem":332,"__hash__":333},"docs_en\u002Fen\u002Fdocs\u002Finstallation\u002Fesm.md","JavaScript editor via ESM",{"type":7,"value":8,"toc":320},"minimark",[9,13,27,32,39,55,61,65,68,72,75,79,91,235,316],[10,11,12],"p",{},"ESM integration lets you use the ViText JavaScript editor in a bundled application: import the class and styles, then export HTML from the visual document.",[10,14,15,16,20,21,26],{},"The ",[17,18,19],"code",{},"@vitext-ru\u002Feditor@1.0.0-beta.6"," package is published on npm with ESM, TypeScript types and CSS. Core is installed automatically. For integration without a bundler, use the ",[22,23,25],"a",{"href":24},"\u002Fen\u002Fdocs\u002Finstallation\u002Fscript","browser archive",".",[28,29,31],"h2",{"id":30},"current-availability","Current availability",[10,33,34,35,38],{},"Install the prerelease using the ",[17,36,37],{},"beta"," tag:",[40,41,46],"pre",{"className":42,"code":43,"language":44,"meta":45,"style":45},"language-sh shiki shiki-themes github-dark","npm install @vitext-ru\u002Feditor@beta\n","sh","",[17,47,48],{"__ignoreMap":45},[49,50,53],"span",{"class":51,"line":52},"line",1,[49,54,43],{},[10,56,57,58,60],{},"For a fixed version, use ",[17,59,19],{},". Core will be installed automatically. Import the editor and @vitext-ru\u002Feditor\u002Fstyle.css together. Importing ViText does not require Vue or React.",[28,62,64],{"id":63},"mount-and-await-readiness","Mount and await readiness",[10,66,67],{},"Use an HTMLElement or selector as target. HTML and JSON without CSS apply before setContent returns its Promise. Await initial Markdown or CSS via whenReady; await later asynchronous operations before consuming their result. The browser needs the lazy source and codec resources from the same build.",[28,69,71],{"id":70},"ownership","Ownership",[10,73,74],{},"Keep the instance in your component\u002Fapplication. A change callback reports the applied document; it is not a server write. Dispose listeners you create outside ViText and destroy the instance before a new mount.",[28,76,78],{"id":77},"framework-integration","Framework integration",[10,80,81,82,86,87,26],{},"Server-rendered applications mount only in the browser. Guard asynchronous imports against unmounting and do not reuse a destroyed instance. ",[22,83,85],{"href":84},"\u002Fen\u002Fdocs\u002Fintegrations\u002Fvue-nuxt","Vue and Nuxt",", ",[22,88,90],{"href":89},"\u002Fen\u002Fdocs\u002Fguides\u002Flifecycle","lifecycle",[40,92,96],{"className":93,"code":94,"language":95,"meta":45,"style":45},"language-ts shiki shiki-themes github-dark","import ViText from '@vitext-ru\u002Feditor';\nimport '@vitext-ru\u002Feditor\u002Fstyle.css';\n\nconst editor = new ViText('#editor', {\n  content: '\u003Cp>Hello!\u003C\u002Fp>', language: 'en', preset: 'pro'\n});\nawait editor.setContent('# Heading', { format: 'markdown' });\nconsole.log(editor.getHTML());\n","ts",[17,97,98,118,128,135,164,185,191,217],{"__ignoreMap":45},[49,99,100,104,108,111,115],{"class":51,"line":52},[49,101,103],{"class":102},"snl16","import",[49,105,107],{"class":106},"s95oV"," ViText ",[49,109,110],{"class":102},"from",[49,112,114],{"class":113},"sU2Wk"," '@vitext-ru\u002Feditor'",[49,116,117],{"class":106},";\n",[49,119,121,123,126],{"class":51,"line":120},2,[49,122,103],{"class":102},[49,124,125],{"class":113}," '@vitext-ru\u002Feditor\u002Fstyle.css'",[49,127,117],{"class":106},[49,129,131],{"class":51,"line":130},3,[49,132,134],{"emptyLinePlaceholder":133},true,"\n",[49,136,138,141,145,148,151,155,158,161],{"class":51,"line":137},4,[49,139,140],{"class":102},"const",[49,142,144],{"class":143},"sDLfK"," editor",[49,146,147],{"class":102}," =",[49,149,150],{"class":102}," new",[49,152,154],{"class":153},"svObZ"," ViText",[49,156,157],{"class":106},"(",[49,159,160],{"class":113},"'#editor'",[49,162,163],{"class":106},", {\n",[49,165,167,170,173,176,179,182],{"class":51,"line":166},5,[49,168,169],{"class":106},"  content: ",[49,171,172],{"class":113},"'\u003Cp>Hello!\u003C\u002Fp>'",[49,174,175],{"class":106},", language: ",[49,177,178],{"class":113},"'en'",[49,180,181],{"class":106},", preset: ",[49,183,184],{"class":113},"'pro'\n",[49,186,188],{"class":51,"line":187},6,[49,189,190],{"class":106},"});\n",[49,192,194,197,200,203,205,208,211,214],{"class":51,"line":193},7,[49,195,196],{"class":102},"await",[49,198,199],{"class":106}," editor.",[49,201,202],{"class":153},"setContent",[49,204,157],{"class":106},[49,206,207],{"class":113},"'# Heading'",[49,209,210],{"class":106},", { format: ",[49,212,213],{"class":113},"'markdown'",[49,215,216],{"class":106}," });\n",[49,218,220,223,226,229,232],{"class":51,"line":219},8,[49,221,222],{"class":106},"console.",[49,224,225],{"class":153},"log",[49,227,228],{"class":106},"(editor.",[49,230,231],{"class":153},"getHTML",[49,233,234],{"class":106},"());\n",[40,236,238],{"className":93,"code":237,"language":95,"meta":45,"style":45},"const host = document.querySelector\u003CHTMLElement>('#editor')!;\nconst editor = new ViText(host, { content: '\u003Cp>Документ\u003C\u002Fp>' });\nawait editor.whenReady();\neditor.destroy();\n",[17,239,240,274,294,306],{"__ignoreMap":45},[49,241,242,244,247,249,252,255,258,261,264,266,269,272],{"class":51,"line":52},[49,243,140],{"class":102},[49,245,246],{"class":143}," host",[49,248,147],{"class":102},[49,250,251],{"class":106}," document.",[49,253,254],{"class":153},"querySelector",[49,256,257],{"class":106},"\u003C",[49,259,260],{"class":153},"HTMLElement",[49,262,263],{"class":106},">(",[49,265,160],{"class":113},[49,267,268],{"class":106},")",[49,270,271],{"class":102},"!",[49,273,117],{"class":106},[49,275,276,278,280,282,284,286,289,292],{"class":51,"line":120},[49,277,140],{"class":102},[49,279,144],{"class":143},[49,281,147],{"class":102},[49,283,150],{"class":102},[49,285,154],{"class":153},[49,287,288],{"class":106},"(host, { content: ",[49,290,291],{"class":113},"'\u003Cp>Документ\u003C\u002Fp>'",[49,293,216],{"class":106},[49,295,296,298,300,303],{"class":51,"line":130},[49,297,196],{"class":102},[49,299,199],{"class":106},[49,301,302],{"class":153},"whenReady",[49,304,305],{"class":106},"();\n",[49,307,308,311,314],{"class":51,"line":137},[49,309,310],{"class":106},"editor.",[49,312,313],{"class":153},"destroy",[49,315,305],{"class":106},[317,318,319],"style",{},"html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html pre.shiki code .snl16, html code.shiki .snl16{--shiki-default:#F97583}html pre.shiki code .s95oV, html code.shiki .s95oV{--shiki-default:#E1E4E8}html pre.shiki code .sU2Wk, html code.shiki .sU2Wk{--shiki-default:#9ECBFF}html pre.shiki code .sDLfK, html code.shiki .sDLfK{--shiki-default:#79B8FF}html pre.shiki code .svObZ, html code.shiki .svObZ{--shiki-default:#B392F0}",{"title":45,"searchDepth":120,"depth":120,"links":321},[322,323,324,325],{"id":30,"depth":120,"text":31},{"id":63,"depth":120,"text":64},{"id":70,"depth":120,"text":71},{"id":77,"depth":120,"text":78},"Install the ViText JavaScript editor from npm. ESM and CSS imports, Markdown and HTML, and instance cleanup.","md",{"group":329,"order":130},"Getting started","\u002Fen\u002Fdocs\u002Finstallation\u002Fesm",{"title":5,"description":326},"en\u002Fdocs\u002Finstallation\u002Fesm","TDRGxVMp78Lt9xZWTj51evKSUXo0-UlarFsAMHhVfdM",1792670389524]