carta/api/core.html
2024-05-02 17:30:58 +00:00

112 lines
29 KiB
HTML

<!doctype html>
<html class="dark" lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="../favicon.png" />
<meta name="viewport" content="width=device-width" />
<link href="../_app/immutable/assets/0.7vSfiuRl.css" rel="stylesheet">
<link href="../_app/immutable/assets/community-plugins.D9MMIz_R.css" rel="stylesheet">
<link href="../_app/immutable/assets/examples.RBYF0z3s.css" rel="stylesheet">
<link href="../_app/immutable/assets/index.DMK8G4el.css" rel="stylesheet">
<link href="../_app/immutable/assets/math.DAoj5Yzl.css" rel="stylesheet">
<link href="../_app/immutable/assets/3.DWbm9oEh.css" rel="stylesheet">
<link rel="modulepreload" href="../_app/immutable/entry/start.BivPHxkC.js">
<link rel="modulepreload" href="../_app/immutable/chunks/entry.BgMXaDeF.js">
<link rel="modulepreload" href="../_app/immutable/chunks/scheduler.DKiYiPX0.js">
<link rel="modulepreload" href="../_app/immutable/entry/app.BXoi511P.js">
<link rel="modulepreload" href="../_app/immutable/chunks/preload-helper.BQ24v_F8.js">
<link rel="modulepreload" href="../_app/immutable/chunks/index.z4bt_ZBS.js">
<link rel="modulepreload" href="../_app/immutable/nodes/0.BI5UDqBb.js">
<link rel="modulepreload" href="../_app/immutable/chunks/_commonjsHelpers.bU_6Y6tS.js">
<link rel="modulepreload" href="../_app/immutable/chunks/Link.Dt5uOJAy.js">
<link rel="modulepreload" href="../_app/immutable/chunks/index.CvmYViMX.js">
<link rel="modulepreload" href="../_app/immutable/chunks/spread.CgU5AtxT.js">
<link rel="modulepreload" href="../_app/immutable/chunks/stores.DCXLGCG9.js">
<link rel="modulepreload" href="../_app/immutable/chunks/index.Ba2w8Bvc.js">
<link rel="modulepreload" href="../_app/immutable/nodes/3.CzhdhRpU.js"><title>Core - Carta</title><!-- HEAD_svelte-lepr8h_START --><!-- HEAD_svelte-lepr8h_END -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<!-- Inter -->
<link
href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
rel="stylesheet"
/>
<!-- Fira Code -->
<link
href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap"
rel="stylesheet"
/>
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents"> <nav class="fixed left-0 right-0 top-0 z-10 bg-neutral-900 bg-opacity-50 backdrop-blur-2xl backdrop-filter"><div class="container mx-auto flex items-center justify-between px-4 py-1 sm:px-6"><a href="../"><img src="../logo.png" class="h-8" alt="carta logo"></a> <div class="flex-grow"></div> <button class="mr-2 block aspect-square md:hidden" data-svelte-h="svelte-1ff08e9"><iconify-icon icon="ion:search" class="text-2xl text-neutral-200"></iconify-icon></button> <button class="hidden w-[360px] items-center justify-between rounded-lg border border-neutral-700 bg-neutral-900 px-2 py-1.5 text-sm md:flex mx-auto"><div class="inline-flex items-center space-x-2" data-svelte-h="svelte-1kkkjyx"><iconify-icon icon="ion:search" class="text-xl text-neutral-500"></iconify-icon> <span class="text-neutral-500">Search...</span></div> <kbd class="bg-muted text-muted-foreground pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded border px-1.5 font-mono text-[10px] font-medium opacity-100" data-svelte-h="svelte-zz9ey7"><span class="text-xs"></span>K</kbd></button> <div data-portal="" data-melt-dialog-portalled="" data-bits-dialog-portal=""> </div> <div class="hidden flex-grow md:block"></div> <a href="https://github.com/BearToCode/carta" class="flex h-12 items-center space-x-2 p-2 ml-auto"><iconify-icon icon="mdi:github" class="text-2xl"></iconify-icon> <div class="hidden h-min flex-col justify-center space-y-1 md:flex"><p class="text-[0.9rem] font-semibold leading-3" data-svelte-h="svelte-pjnc05">BearToCode/carta</p> <div class="pulse my-1.5 h-3 w-[80px] rounded-full bg-neutral-800"></div></div></a></div> <div class="absolute bottom-0 left-0 right-0 h-px bg-gradient-to-r from-neutral-900 via-neutral-700 to-neutral-900"></div></nav> <div class="filter-blur-xl min-h-screen w-full py-16 xl:py-24"><div class="fixed bottom-0 left-0 right-0 top-0 z-[-1] backdrop-blur-2xl backdrop-filter" style="background: url(../background.png) no-repeat center center; background-size: cover;"></div> <div class="container mb-4 w-full border-b border-neutral-800 px-4 pb-1 sm:px-6 xl:hidden"><button class="text-neutral-500 hover:text-neutral-200" data-svelte-h="svelte-16xt1x4"><iconify-icon icon="ci:hamburger-lg" class="text-3xl"></iconify-icon></button></div> <div class="container relative mx-auto flex px-4 sm:px-6"><div class="h-full sticky top-24 hidden xl:block"><h3 class="mb-3 ml-4 mt-6 text-sm font-medium first:mt-0 last:mb-0" data-svelte-h="svelte-4l22iw">Overview</h3> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../introduction"><iconify-icon icon="radix-icons:dashboard" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-hmyc8p">Introduction</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../examples"><iconify-icon icon="ph:codesandbox-logo" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-zntwz8">Examples</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../getting-started"><iconify-icon icon="ic:round-download" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-10em7s">Getting Started</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../editing-styles"><iconify-icon icon="lucide:palette" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-1v8s4yb">Editing Styles</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../migration"><iconify-icon icon="material-symbols:upgrade" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-1t554qx">Migration</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../community-plugins"><iconify-icon icon="ph:stack-fill" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-oj1sxw">Community Plugins</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../using-components"><iconify-icon icon="ri:svelte-fill" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-193bojt">Using Components</span></a> <h3 class="mb-3 ml-4 mt-6 text-sm font-medium first:mt-0 last:mb-0" data-svelte-h="svelte-12104bp">Plugins</h3> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../plugins/math"><iconify-icon icon="tabler:math" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-17rk523">Math</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../plugins/code"><iconify-icon icon="fluent:code-16-filled" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-76jeei">Code</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../plugins/emoji"><iconify-icon icon="mingcute:emoji-line" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-64nitr">Emoji</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../plugins/slash"><iconify-icon icon="tabler:slash" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-rxesng">Slash</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../plugins/tikz"><iconify-icon icon="mdi:draw-pen" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-1aormjr">TikZ</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../plugins/attachment"><iconify-icon icon="tdesign:attach" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-ref5p2">Attachment</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../plugins/anchor"><iconify-icon icon="mingcute:link-fill" class="text-xl"></iconify-icon> <span class="text-[0.95rem]" data-svelte-h="svelte-10ozri2">Anchor</span></a> <h3 class="mb-3 ml-4 mt-6 text-sm font-medium first:mt-0 last:mb-0" data-svelte-h="svelte-11166a1">API</h3> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../api/utilities"><span class="text-[0.95rem]" data-svelte-h="svelte-1it2439">Utilities</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../api/core"><span class="text-[0.95rem]" data-svelte-h="svelte-1ud5hhw">Core</span></a> <a class="
text-neutral-400 hover:bg-neutral-800 hover:text-neutral-300
inline-flex w-full items-center space-x-2 rounded-lg px-4 py-1.5" href="../api/extension"><span class="text-[0.95rem]" data-svelte-h="svelte-17upky4">Extension</span></a></div> <main class="container max-w-4xl flex-shrink-0 flex-grow px-0 xl:max-w-3xl xl:px-4 2xl:max-w-4xl"> <h3 class="mb-2 font-semibold text-sky-300">API</h3> <h1 class="mb-4 text-5xl font-bold text-white">Core</h1> <div class="markdown"> <!-- HTML_TAG_START --><h1 id="carta-options" data-svelte-h="svelte-s8n3zs"><a href="#carta-options"><code>Carta</code> options</a></h1> <p data-svelte-h="svelte-13ea9lj">List of options that can be used when creating <code>Carta</code>:</p> <pre class="language-ts"><!-- HTML_TAG_START --><code class="language-ts"><span class="token keyword">new</span> <span class="token class-name">Carta</span><span class="token punctuation">(</span><span class="token punctuation">&#123;</span>
<span class="token comment">/* ... */</span>
<span class="token punctuation">&#125;</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code><!-- HTML_TAG_END --></pre> <h3 id="gfmoptions" data-svelte-h="svelte-139zqql"><a href="#gfmoptions"><code>gfmOptions</code></a></h3> <p data-svelte-h="svelte-1sagm55">Type: <code>GfmOptions</code></p> <p data-svelte-h="svelte-24wgd3">GitHub Flavored Markdown options.</p> <h3 id="extensions" data-svelte-h="svelte-1q9z1r1"><a href="#extensions"><code>extensions</code></a></h3> <p data-svelte-h="svelte-xkcxzu">Type: <code>Extension[]</code></p> <p data-svelte-h="svelte-mlztsw">List of extensions(plugins) to use.</p> <h3 id="rendererdebounce" data-svelte-h="svelte-1n25ynf"><a href="#rendererdebounce"><code>rendererDebounce</code></a></h3> <p data-svelte-h="svelte-1d38pao">Type: <code>number</code></p> <p data-svelte-h="svelte-1jo7ete">Rendering debouncing timeout, in milliseconds.
Defaults to 300ms.</p> <h3 id="disableshortcuts" data-svelte-h="svelte-1uj2i30"><a href="#disableshortcuts"><code>disableShortcuts</code></a></h3> <p data-svelte-h="svelte-15kyw09">Type: <code>DefaultShortcutId[] | true</code></p> <p data-svelte-h="svelte-m0h7je">Remove default shortcuts by id. You can use <code>true</code> to disable all of them.</p> <h3 id="disableicons" data-svelte-h="svelte-4d0ft9"><a href="#disableicons"><code>disableIcons</code></a></h3> <p data-svelte-h="svelte-19btxge">Type: <code>DefaultIconId[] | true</code></p> <p data-svelte-h="svelte-pvqdvl">Remove default icons by id. You can use <code>true</code> to disable all of them.</p> <h3 id="disableprefixes" data-svelte-h="svelte-nhsrxd"><a href="#disableprefixes"><code>disablePrefixes</code></a></h3> <p data-svelte-h="svelte-114atzj">Type: <code>DefaultPrefixId[] | true</code></p> <p data-svelte-h="svelte-1gzycin">Remove default prefixes by id. You can use <code>true</code> to disable all of them.</p> <h3 id="historyoptions" data-svelte-h="svelte-1ib9hkt"><a href="#historyoptions"><code>historyOptions</code></a></h3> <p data-svelte-h="svelte-16dip9x">History management options.</p> <h4 id="historyoptionsmininterval" data-svelte-h="svelte-mq3yjs"><a href="#historyoptionsmininterval"><code>historyOptions.minInterval</code></a></h4> <p data-svelte-h="svelte-1d38pao">Type: <code>number</code></p> <p data-svelte-h="svelte-7fft31">Minimum interval between save states in milliseconds.
Defaults to 300ms.</p> <h4 id="historyoptionsmaxsize" data-svelte-h="svelte-1kezokm"><a href="#historyoptionsmaxsize"><code>historyOptions.maxSize</code></a></h4> <p data-svelte-h="svelte-1d38pao">Type: <code>number</code></p> <p data-svelte-h="svelte-men4m6">Maximum history size in bytes.
Defaults to 1MB.</p> <h3 id="sanitizer" data-svelte-h="svelte-84kbna"><a href="#sanitizer"><code>sanitizer</code></a></h3> <p data-svelte-h="svelte-bpg09l">Type: <code>(html: string) =&gt; void</code></p> <p data-svelte-h="svelte-2e1ue8">HTML sanitizer. See <a href="/carta/getting-started#sanitization">here</a> for more details.</p> <h3 id="shikioptions" data-svelte-h="svelte-3640ur"><a href="#shikioptions"><code>shikiOptions</code></a></h3> <p data-svelte-h="svelte-pgady3">Type: <code>ShikiOptions</code></p> <p data-svelte-h="svelte-wq86wo">Highlighter(Shiki) options.</p> <h3 id="theme" data-svelte-h="svelte-1cpt5d4"><a href="#theme"><code>theme</code></a></h3> <p data-svelte-h="svelte-lsx1gt">Type: <code>Theme | DualTheme</code></p> <p data-svelte-h="svelte-1p9r3v1">Shiki theme to use to highlight Markdown.</p> <h1 id="markdowneditor-options" data-svelte-h="svelte-1f0vvup"><a href="#markdowneditor-options"><code>MarkdownEditor</code> options</a></h1> <p data-svelte-h="svelte-1gj6ern">List of options that can be used in the <code>&lt;MarkdownEditor&gt;</code> component.</p> <h3 id="carta" data-svelte-h="svelte-qq6ghs"><a href="#carta"><code>carta</code></a></h3> <p data-svelte-h="svelte-1i34z6a">Type: <code>Carta</code></p> <p data-svelte-h="svelte-8yta1g">Carta manager to use for this editor.</p> <h3 id="theme-1" data-svelte-h="svelte-3xtvh8"><a href="#theme-1"><code>theme</code></a></h3> <p data-svelte-h="svelte-1uqpafo">Type: <code>string</code></p> <p data-svelte-h="svelte-gjiz4l">The theme of this editor. The editor and related elements will have the <code>carta-theme__&lt;theme&gt;</code> as a class.</p> <h3 id="value" data-svelte-h="svelte-1i6ckrg"><a href="#value"><code>value</code></a></h3> <p data-svelte-h="svelte-1uqpafo">Type: <code>string</code></p> <p data-svelte-h="svelte-x8q7mb">Current Markdown input value.</p> <h3 id="mode" data-svelte-h="svelte-1og3c5s"><a href="#mode"><code>mode</code></a></h3> <p data-svelte-h="svelte-hh1o9q">Type: <code>&#39;tabs&#39; | &#39;split&#39; | &#39;auto&#39;</code></p> <p data-svelte-h="svelte-13ku568">Editor windows mode. With <code>auto</code> it will split when the window size is greater than 768px.</p> <h3 id="scroll" data-svelte-h="svelte-1q483gi"><a href="#scroll"><code>scroll</code></a></h3> <p data-svelte-h="svelte-gibbua">Type: <code>&#39;sync&#39; | &#39;async&#39;</code></p> <p data-svelte-h="svelte-l5v9e5">Scroll synchronization.</p> <h3 id="disabletoolbar" data-svelte-h="svelte-1njhzdc"><a href="#disabletoolbar"><code>disableToolbar</code></a></h3> <p data-svelte-h="svelte-rqajgb">Type: <code>boolean</code></p> <p data-svelte-h="svelte-1t4o7yk">Option to disable the toolbar.</p> <h3 id="placeholder" data-svelte-h="svelte-jvzlok"><a href="#placeholder"><code>placeholder</code></a></h3> <p data-svelte-h="svelte-1uqpafo">Type: <code>string</code></p> <p data-svelte-h="svelte-sxq5vo">Set the textarea placeholder.</p> <h3 id="textarea" data-svelte-h="svelte-1rme4j1"><a href="#textarea"><code>textarea</code></a></h3> <p data-svelte-h="svelte-8zupk1">Type: <code>TextAreaProps</code> (extends <code>Record&lt;string, unknown&gt;</code>)</p> <p data-svelte-h="svelte-1sbhii0">Additional properties that will be used in the textarea used under the hood in the editor.
<code>class</code>, <code>placeholder</code> and <code>value</code> are not allowed. Use the corresponding editor properties
instead.</p> <h3 id="labels" data-svelte-h="svelte-1ok2ezs"><a href="#labels"><code>labels</code></a></h3> <p data-svelte-h="svelte-nlgvew">Type: <code>Partial&lt;Labels&gt;</code></p> <p data-svelte-h="svelte-jdci7r">Can be used to provide custom text for labels in the editor.</p> <h1 id="markdown-options" data-svelte-h="svelte-1q7wxy0"><a href="#markdown-options"><code>Markdown</code> options</a></h1> <p data-svelte-h="svelte-1a9142c">List of options that can be used in the <code>&lt;Markdown&gt;</code> component.</p> <h3 id="carta-1" data-svelte-h="svelte-2kt9ro"><a href="#carta-1"><code>carta</code></a></h3> <p data-svelte-h="svelte-1i34z6a">Type: <code>Carta</code></p> <p data-svelte-h="svelte-8yta1g">Carta manager to use for this editor.</p> <h3 id="theme-2" data-svelte-h="svelte-1r9vdxu"><a href="#theme-2"><code>theme</code></a></h3> <p data-svelte-h="svelte-1uqpafo">Type: <code>string</code></p> <p data-svelte-h="svelte-1yrsk9w">The theme of this editor. The viewer and related elements will have the <code>carta-theme__&lt;theme&gt;</code> as a class.</p> <h3 id="value-1" data-svelte-h="svelte-tc7un0"><a href="#value-1"><code>value</code></a></h3> <p data-svelte-h="svelte-1uqpafo">Type: <code>string</code></p> <p data-svelte-h="svelte-x8q7mb">Current Markdown input value.</p><!-- HTML_TAG_END --></div> <div class="mt-12 w-full border-t border-neutral-800 text-end" data-svelte-h="svelte-1n4hoz2"><span class="mt-6 block text-sm italic text-neutral-400">Handmade by <a target="_blank" class="hover:text-sky-300 hover:underline" href="https://github.com/BearToCode">Davide</a></span></div></main> <div class="h-full space-y-3 sticky top-24 hidden w-[15rem] flex-shrink-0 xl:block"></div></div></div>
<script>
{
__sveltekit_190djg1 = {
base: new URL("..", location).pathname.slice(0, -1),
assets: "/carta"
};
const element = document.currentScript.parentElement;
const data = [null,{"type":"data","data":{content:{html:"\u003Ch1 id=\"carta-options\" data-svelte-h=\"svelte-s8n3zs\">\u003Ca href=\"#carta-options\">\u003Ccode>Carta\u003C/code> options\u003C/a>\u003C/h1> \u003Cp data-svelte-h=\"svelte-13ea9lj\">List of options that can be used when creating \u003Ccode>Carta\u003C/code>:\u003C/p> \u003Cpre class=\"language-ts\">\u003C!-- HTML_TAG_START -->\u003Ccode class=\"language-ts\">\u003Cspan class=\"token keyword\">new\u003C/span> \u003Cspan class=\"token class-name\">Carta\u003C/span>\u003Cspan class=\"token punctuation\">(\u003C/span>\u003Cspan class=\"token punctuation\">&#123;\u003C/span>\n\t\u003Cspan class=\"token comment\">/* ... */\u003C/span>\n\u003Cspan class=\"token punctuation\">&#125;\u003C/span>\u003Cspan class=\"token punctuation\">)\u003C/span>\u003Cspan class=\"token punctuation\">;\u003C/span>\u003C/code>\u003C!-- HTML_TAG_END -->\u003C/pre> \u003Ch3 id=\"gfmoptions\" data-svelte-h=\"svelte-139zqql\">\u003Ca href=\"#gfmoptions\">\u003Ccode>gfmOptions\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1sagm55\">Type: \u003Ccode>GfmOptions\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-24wgd3\">GitHub Flavored Markdown options.\u003C/p> \u003Ch3 id=\"extensions\" data-svelte-h=\"svelte-1q9z1r1\">\u003Ca href=\"#extensions\">\u003Ccode>extensions\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-xkcxzu\">Type: \u003Ccode>Extension[]\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-mlztsw\">List of extensions(plugins) to use.\u003C/p> \u003Ch3 id=\"rendererdebounce\" data-svelte-h=\"svelte-1n25ynf\">\u003Ca href=\"#rendererdebounce\">\u003Ccode>rendererDebounce\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1d38pao\">Type: \u003Ccode>number\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-1jo7ete\">Rendering debouncing timeout, in milliseconds.\nDefaults to 300ms.\u003C/p> \u003Ch3 id=\"disableshortcuts\" data-svelte-h=\"svelte-1uj2i30\">\u003Ca href=\"#disableshortcuts\">\u003Ccode>disableShortcuts\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-15kyw09\">Type: \u003Ccode>DefaultShortcutId[] | true\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-m0h7je\">Remove default shortcuts by id. You can use \u003Ccode>true\u003C/code> to disable all of them.\u003C/p> \u003Ch3 id=\"disableicons\" data-svelte-h=\"svelte-4d0ft9\">\u003Ca href=\"#disableicons\">\u003Ccode>disableIcons\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-19btxge\">Type: \u003Ccode>DefaultIconId[] | true\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-pvqdvl\">Remove default icons by id. You can use \u003Ccode>true\u003C/code> to disable all of them.\u003C/p> \u003Ch3 id=\"disableprefixes\" data-svelte-h=\"svelte-nhsrxd\">\u003Ca href=\"#disableprefixes\">\u003Ccode>disablePrefixes\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-114atzj\">Type: \u003Ccode>DefaultPrefixId[] | true\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-1gzycin\">Remove default prefixes by id. You can use \u003Ccode>true\u003C/code> to disable all of them.\u003C/p> \u003Ch3 id=\"historyoptions\" data-svelte-h=\"svelte-1ib9hkt\">\u003Ca href=\"#historyoptions\">\u003Ccode>historyOptions\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-16dip9x\">History management options.\u003C/p> \u003Ch4 id=\"historyoptionsmininterval\" data-svelte-h=\"svelte-mq3yjs\">\u003Ca href=\"#historyoptionsmininterval\">\u003Ccode>historyOptions.minInterval\u003C/code>\u003C/a>\u003C/h4> \u003Cp data-svelte-h=\"svelte-1d38pao\">Type: \u003Ccode>number\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-7fft31\">Minimum interval between save states in milliseconds.\nDefaults to 300ms.\u003C/p> \u003Ch4 id=\"historyoptionsmaxsize\" data-svelte-h=\"svelte-1kezokm\">\u003Ca href=\"#historyoptionsmaxsize\">\u003Ccode>historyOptions.maxSize\u003C/code>\u003C/a>\u003C/h4> \u003Cp data-svelte-h=\"svelte-1d38pao\">Type: \u003Ccode>number\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-men4m6\">Maximum history size in bytes.\nDefaults to 1MB.\u003C/p> \u003Ch3 id=\"sanitizer\" data-svelte-h=\"svelte-84kbna\">\u003Ca href=\"#sanitizer\">\u003Ccode>sanitizer\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-bpg09l\">Type: \u003Ccode>(html: string) =&gt; void\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-2e1ue8\">HTML sanitizer. See \u003Ca href=\"/carta/getting-started#sanitization\">here\u003C/a> for more details.\u003C/p> \u003Ch3 id=\"shikioptions\" data-svelte-h=\"svelte-3640ur\">\u003Ca href=\"#shikioptions\">\u003Ccode>shikiOptions\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-pgady3\">Type: \u003Ccode>ShikiOptions\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-wq86wo\">Highlighter(Shiki) options.\u003C/p> \u003Ch3 id=\"theme\" data-svelte-h=\"svelte-1cpt5d4\">\u003Ca href=\"#theme\">\u003Ccode>theme\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-lsx1gt\">Type: \u003Ccode>Theme | DualTheme\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-1p9r3v1\">Shiki theme to use to highlight Markdown.\u003C/p> \u003Ch1 id=\"markdowneditor-options\" data-svelte-h=\"svelte-1f0vvup\">\u003Ca href=\"#markdowneditor-options\">\u003Ccode>MarkdownEditor\u003C/code> options\u003C/a>\u003C/h1> \u003Cp data-svelte-h=\"svelte-1gj6ern\">List of options that can be used in the \u003Ccode>&lt;MarkdownEditor&gt;\u003C/code> component.\u003C/p> \u003Ch3 id=\"carta\" data-svelte-h=\"svelte-qq6ghs\">\u003Ca href=\"#carta\">\u003Ccode>carta\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1i34z6a\">Type: \u003Ccode>Carta\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-8yta1g\">Carta manager to use for this editor.\u003C/p> \u003Ch3 id=\"theme-1\" data-svelte-h=\"svelte-3xtvh8\">\u003Ca href=\"#theme-1\">\u003Ccode>theme\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1uqpafo\">Type: \u003Ccode>string\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-gjiz4l\">The theme of this editor. The editor and related elements will have the \u003Ccode>carta-theme__&lt;theme&gt;\u003C/code> as a class.\u003C/p> \u003Ch3 id=\"value\" data-svelte-h=\"svelte-1i6ckrg\">\u003Ca href=\"#value\">\u003Ccode>value\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1uqpafo\">Type: \u003Ccode>string\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-x8q7mb\">Current Markdown input value.\u003C/p> \u003Ch3 id=\"mode\" data-svelte-h=\"svelte-1og3c5s\">\u003Ca href=\"#mode\">\u003Ccode>mode\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-hh1o9q\">Type: \u003Ccode>&#39;tabs&#39; | &#39;split&#39; | &#39;auto&#39;\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-13ku568\">Editor windows mode. With \u003Ccode>auto\u003C/code> it will split when the window size is greater than 768px.\u003C/p> \u003Ch3 id=\"scroll\" data-svelte-h=\"svelte-1q483gi\">\u003Ca href=\"#scroll\">\u003Ccode>scroll\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-gibbua\">Type: \u003Ccode>&#39;sync&#39; | &#39;async&#39;\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-l5v9e5\">Scroll synchronization.\u003C/p> \u003Ch3 id=\"disabletoolbar\" data-svelte-h=\"svelte-1njhzdc\">\u003Ca href=\"#disabletoolbar\">\u003Ccode>disableToolbar\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-rqajgb\">Type: \u003Ccode>boolean\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-1t4o7yk\">Option to disable the toolbar.\u003C/p> \u003Ch3 id=\"placeholder\" data-svelte-h=\"svelte-jvzlok\">\u003Ca href=\"#placeholder\">\u003Ccode>placeholder\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1uqpafo\">Type: \u003Ccode>string\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-sxq5vo\">Set the textarea placeholder.\u003C/p> \u003Ch3 id=\"textarea\" data-svelte-h=\"svelte-1rme4j1\">\u003Ca href=\"#textarea\">\u003Ccode>textarea\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-8zupk1\">Type: \u003Ccode>TextAreaProps\u003C/code> (extends \u003Ccode>Record&lt;string, unknown&gt;\u003C/code>)\u003C/p> \u003Cp data-svelte-h=\"svelte-1sbhii0\">Additional properties that will be used in the textarea used under the hood in the editor.\n\u003Ccode>class\u003C/code>, \u003Ccode>placeholder\u003C/code> and \u003Ccode>value\u003C/code> are not allowed. Use the corresponding editor properties\ninstead.\u003C/p> \u003Ch3 id=\"labels\" data-svelte-h=\"svelte-1ok2ezs\">\u003Ca href=\"#labels\">\u003Ccode>labels\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-nlgvew\">Type: \u003Ccode>Partial&lt;Labels&gt;\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-jdci7r\">Can be used to provide custom text for labels in the editor.\u003C/p> \u003Ch1 id=\"markdown-options\" data-svelte-h=\"svelte-1q7wxy0\">\u003Ca href=\"#markdown-options\">\u003Ccode>Markdown\u003C/code> options\u003C/a>\u003C/h1> \u003Cp data-svelte-h=\"svelte-1a9142c\">List of options that can be used in the \u003Ccode>&lt;Markdown&gt;\u003C/code> component.\u003C/p> \u003Ch3 id=\"carta-1\" data-svelte-h=\"svelte-2kt9ro\">\u003Ca href=\"#carta-1\">\u003Ccode>carta\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1i34z6a\">Type: \u003Ccode>Carta\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-8yta1g\">Carta manager to use for this editor.\u003C/p> \u003Ch3 id=\"theme-2\" data-svelte-h=\"svelte-1r9vdxu\">\u003Ca href=\"#theme-2\">\u003Ccode>theme\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1uqpafo\">Type: \u003Ccode>string\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-1yrsk9w\">The theme of this editor. The viewer and related elements will have the \u003Ccode>carta-theme__&lt;theme&gt;\u003C/code> as a class.\u003C/p> \u003Ch3 id=\"value-1\" data-svelte-h=\"svelte-tc7un0\">\u003Ca href=\"#value-1\">\u003Ccode>value\u003C/code>\u003C/a>\u003C/h3> \u003Cp data-svelte-h=\"svelte-1uqpafo\">Type: \u003Ccode>string\u003C/code>\u003C/p> \u003Cp data-svelte-h=\"svelte-x8q7mb\">Current Markdown input value.\u003C/p>",css:{code:"",map:null},head:""},metadata:{section:"API",title:"Core"}},"uses":{"url":1}}];
Promise.all([
import("../_app/immutable/entry/start.BivPHxkC.js"),
import("../_app/immutable/entry/app.BXoi511P.js")
]).then(([kit, app]) => {
kit.start(app, element, {
node_ids: [0, 3],
data,
form: null,
error: null
});
});
}
</script>
</div>
</body>
</html>