ErdEditorElement

Editorul este un HTMLElement obișnuit.
Definiția sa de tip este următoarea.

interface ErdEditorElement extends HTMLElement {
  readonly: boolean;
  systemDarkMode: boolean; // system dark/light auto
  enableThemeBuilder: boolean;
  enableLocalePicker: boolean;
  enableWelcomeScreen: boolean;
  value: string;
  readonly runtimeValue: string;
  focus: () => void;
  blur: () => void;
  clear: () => void;
  destroy: () => void;
  setInitialValue: (value: string) => void;
  setPresetTheme: (themeOptions: Partial<ThemeOptions>) => void;
  setSystemAppearance: (appearance: 'dark' | 'light' | null) => void;
  setTheme: (theme: Partial<Theme>) => void;
  setLocale: (locale: LocaleOption) => void;
  setSystemLocale: (locale: string | null) => void;
  setKeyBindingMap: (
    keyBindingMap: Partial<
      Omit<
        KeyBindingMap,
        | 'edit'
        | 'stop'
        | 'undo'
        | 'redo'
        | 'zoomIn'
        | 'zoomOut'
        | 'zoomReset'
      >
    >
  ) => void;
  setSchemaSQL: SetSchema;
  setSchemaGraphQL: SetSchema;
  setSchemaDBML: SetSchema;
  setSchemaAML: SetSchema;
  setSchemaJSON: (
    value: string,
    options?: { mode?: 'replace' | 'append' }
  ) => void;
  getSchemaSQL: (
    databaseVendor?: DatabaseVendor,
    options?: SchemaSQLOptions
  ) => string;
  getSharedStore: (
    config?: SharedStoreConfig & {
      mouseTracker?: boolean;
      focusTracker?: boolean;
    }
  ) => SharedStore;
  setDiffValue: (value: string) => void;
}

Editorul se redă într-un shadow root închis, așa că editor.shadowRoot este null, iar stilurile nu trec nici dinspre pagină în editor, nici invers.
Nimic din interior nu poate fi accesat cu un selector: stilizați-l în schimb prin setTheme și proprietățile personalizate CSS --erd-editor-*.

Singurele atribute sunt readonly, system-dark-mode, enable-theme-builder, enable-locale-picker și enable-welcome-screen, iar toate cinci au valoarea implicită false. Ultimele două au apărut în versiunea 4.0.0. Fiecare își citește valoarea așa cum se descrie la readonly.

Începând cu versiunea 4.1.0, fila ERD are un explorator, un arbore al diagramei andocat în stânga pânzei, cu funcția Găsire și înlocuire în partea de sus. Niciun atribut, nicio proprietate, metodă sau eveniment nu îl deschide, nu îl închide și nu îi raportează starea: se deschide din butonul Explorer al barei de instrumente, din comanda Toggle Explorer din căutarea rapidă sau din meniul contextual al pânzei ori cu combinația de taste findReplace.
Fiecare element pornește cu exploratorul închis. Starea sa (deschis sau închis), lățimea, restrângerile și căutarea se păstrează cât timp există elementul, peste schimbările de filă și peste orice încărcare, inclusiv setInitialValue, și nu ajung niciodată în value, runtimeValue, istoricul anulărilor sau un store partajat.

readonly

Setează capacitatea de editare a editorului.
Cât timp este setat, atribuirea proprietății value, clear(), setSchemaSQL(), setSchemaGraphQL(), setSchemaDBML(), setSchemaAML(), setSchemaJSON(), anularea și refacerea sunt toate ignorate, iar evenimentul change nu este emis niciodată. Încărcați în schimb un document cu setInitialValue.
Vizualizarea funcționează în continuare: zoomul, deplasarea pânzei, instrumentul mână, modul Zen, fila pânzei, fila Vizualizare în ambele sale moduri, inclusiv focalizarea pe tabele, sistemul de baze de date și setările de ieșire pentru SQL și generatorul de cod se aplică toate în continuare, așa că un vizualizator doar în citire poate exporta în continuare SQL pentru alt sistem de baze de date sau poate citi codul generat.
Începând cu versiunea 4.1.0, se deschide și exploratorul, iar alegerea unuia dintre rândurile sale duce la ceea ce reprezintă rândul, ca într-un editor editabil. Funcția Găsire și înlocuire din partea sa de sus doar caută, fără săgeata Toggle Replace și fără rândul Înlocuire, iar saltul la o potrivire o aduce în continuare la vedere și o selectează. Panoul are titlul Explorer, iar sfatul ecran al butonului din bara de instrumente este Explorer (Ctrl + F) (Windows/Linux) sau Explorer (⌘ + F) (Mac) în orice editor. De la versiunea 3.10.0 până la versiunea 4.0.0, Găsire și înlocuire se deschidea ca un panou flotant doar pentru căutare, cu titlul Find.
Panoul Proprietăți tabel se deschide în continuare și, începând cu versiunea 3.10.0, afișează insigna Read only lângă titlu, iar fila sa Indexes nu permite modificări (consultați Proprietăți tabel).
Începând cu versiunea 4.0.0, un editor doar în citire nu oferă Import and Add, New Table Group, Group selected tables, Remove from group (consultați Grupuri de tabele) sau Map Columns și nu afișează ecranul de bun venit. Butoanele de blocare din fila Setări nu schimbă nimic, iar scripturile Before tables și After tables din fila Schemă SQL nu pot fi editate.
Începând cu versiunea 4.1.0, nu afișează nici butoanele New Table, New Memo sau New Table Group pe bara de instrumente a pânzei, iar combinațiile de taste addTableGroup și groupSelectedTables nu au niciun efect.
Opțiunile This window only din fila Schemă SQL, Statements, Header și Tables, nu se salvează niciodată și se aplică în continuare, la fel ca și caseta de dialog Export image, configuratorul de teme și selectorul de limbă de afișare. O alegere în configuratorul de teme sau în selectorul de limbă de afișare emite în continuare changePresetTheme sau changeLocale.
Un atribut fără valoare, ="" și ="true" se citesc toate ca true. ="false" se citește ca false, la fel ca orice alt șir de caractere, inclusiv idiomul HTML readonly="readonly".

editor.readonly = true;
// or
editor.setAttribute('readonly', 'true');

<erd-editor readonly></erd-editor>

systemDarkMode

Determină dacă editorul se sincronizează automat cu modul întunecat/luminos al sistemului.
Începând cu versiunea 4.0.0, activarea sa setează câmpul appearance al temei la 'system', așa cum face setPresetTheme({ appearance: 'system' }). Editorul afișează apoi aspectul luminos sau întunecat raportat de sistemul de operare ori cel indicat de setSystemAppearance și comută atunci când acesta se schimbă.
Un apel ulterior setPresetTheme cu 'light' sau 'dark' ori alegerea Light sau Dark în configuratorul de teme sau în căutarea rapidă înlocuiește 'system' și rămâne: următoarea schimbare a sistemului de operare nu îl mai suprascrie, deși systemDarkMode este încă true. Înainte de versiunea 4.0.0, următoarea schimbare a sistemului de operare îl suprascria.
Dezactivarea sa cât timp aspectul este 'system' păstrează aspectul luminos sau întunecat afișat în acel moment. Dezactivarea sa după ce aspectul a fost schimbat de la 'system' îl lasă neschimbat.
Modificarea sa nu emite niciun eveniment.

editor.systemDarkMode = true;
// or
editor.setAttribute('system-dark-mode', 'true');

<erd-editor system-dark-mode></erd-editor>

enableThemeBuilder

Determină dacă este oferită o interfață care simplifică setarea temelor predefinite.
Afișează butonul Theme din bara de instrumente, care deschide configuratorul de teme cu Accent color, Gray color și Appearance. Începând cu versiunea 4.0.0, opțiunea Appearance oferă System alături de Light și Dark, iar cât timp această proprietate este activată, căutarea rapidă listează Theme cu System, Light și Dark. Consultați Limbă și temă.

editor.enableThemeBuilder = true;
// or
editor.setAttribute('enable-theme-builder', 'true');

<erd-editor enable-theme-builder></erd-editor>

Schimbarea temei predefinite din acest panou sau din căutarea rapidă emite evenimentul changePresetTheme.

enableLocalePicker

Începând cu versiunea 4.0.0, determină dacă este oferită o interfață pentru alegerea limbii de afișare a editorului.
Afișează butonul Display Language din bara de instrumente, după Theme când sunt afișate amândouă. Butonul deschide selectorul de limbă de afișare, iar căutarea rapidă listează Display Language. Ambele oferă System și cele 25 de limbi (consultați Limbă și temă).
Decide și ce afișează un editor înainte ca metoda setLocale să fie apelată sau să fie aleasă o limbă: 'system' cât timp este activată, engleza cât timp este dezactivată, așa că un element care nu configurează nimic păstrează engleza pe care a afișat-o mereu. Activarea sau dezactivarea sa comută imediat între cele două. După ce o limbă a fost setată sau aleasă, acea alegere rămâne, indiferent dacă proprietatea este activată sau dezactivată.
Setați-o înainte ca elementul să fie adăugat în DOM, pentru ca primul cadru să urmeze 'system'.
O alegere emite changeLocale.

editor.enableLocalePicker = true;
// or
editor.setAttribute('enable-locale-picker', 'true');

<erd-editor enable-locale-picker></erd-editor>

enableWelcomeScreen

Începând cu versiunea 4.0.0, determină dacă o diagramă goală îl întâmpină pe cititor cu ecranul de bun venit.
Acesta stă deasupra filei ERD cât timp documentul nu are niciun tabel, nicio notă afișată și niciun grup de tabele afișat. Nu este afișat cât timp atributul readonly este setat, în modul Zen sau cât timp este deschis panoul Proprietăți tabel, vizualizatorul de diferențe, călătoria în timp sau previzualizarea aranjării automate. Primul tabel, prima notă afișată sau primul grup de tabele afișat îl face să dispară, iar o anulare care readuce diagrama la starea goală îl face să reapară.
Rândurile sale New Table, New Memo și Command Palette afișează prima combinație din addTable, addMemo și search așa cum le-a lăsat setKeyBindingMap și niciuna pentru un nume lăsat gol. Săgețile sale indică butoanele Theme și Display Language numai acolo unde enableThemeBuilder și enableLocalePicker le afișează.
În meniul său, tastele ↑, ↓, Home și End trec de la un rând la altul și sunt împiedicate și oprite. Tastele Enter și Space sunt oprite, nu împiedicate, așa că le preia rândul activ, iar tasta Escape în lista formatelor Import duce înapoi, fiind împiedicată și oprită. Orice altă tastă ajunge ca de obicei la editor și la pagină.
Nu schimbă nimic în document, așa că lasă value neschimbat și nu emite niciun eveniment change.
Activați-o după ce setInitialValue a încărcat documentul, așa cum fac aplicațiile gazdă oficiale, pentru ca ecranul să nu apară niciodată, nici măcar o clipă, peste un fișier care încă se încarcă.

editor.enableWelcomeScreen = true;
// or
editor.setAttribute('enable-welcome-screen', 'true');

<erd-editor enable-welcome-screen></erd-editor>

value

getter

Returnează documentul curent ca șir de caractere JSON, în schema definită de editor.
Începând cu versiunea 4.0.0, este forma de stocare, documentul așa cum îl conține un fișier, adică și ceea ce scrie exportul json și ceea ce salvează aplicațiile gazdă oficiale. Conține doar entitățile existente, fără cele eliminate, fără ordinea de suprapunere și fără ceea ce editorul calculează singur, de exemplu lățimile măsurate, marcajele de cheie și punctele de ancorare ale relațiilor. Cheile entităților apar într-o ordine fixă, textul este indentat cu două spații și se termină cu un caracter de linie nouă, așa că același document dă mereu aceiași octeți.
Fiecare setare a cărei blocare este activată se scrie cu valoarea la care este blocată, nu așa cum o arată ecranul. Blocarea Viewport cuprinde originX, originY și zoomLevel, iar Canvas Type, Language, Table Name Case, Column Name Case și Bracket Type cuprind fiecare propria setare. Orice altă setare se scrie așa cum este, iar lockSettings se scrie întotdeauna. Pentru biți, consultați Settings.
Un document nou are toate blocările activate, fie că este cel pe care un element îl afișează înainte de a primi o valoare, fie unul încărcat dintr-o valoare goală. Proprietatea sa value păstrează originea la 0, 0, nivelul de zoom la 1, fila ERD, precum și limbajul implicit al generatorului de cod, stilurile de denumire implicite și tipul de delimitator implicit, până când blocarea corespunzătoare este dezactivată.
Înainte de versiunea 4.0.0, returna întregul document așa cum îl deținea editorul, cu ignoreSaveSettings aplicat. Documentul așa cum îl deține editorul este acum runtimeValue, iar ignoreSaveSettings nu mai este citit sau scris.

const data = editor.value;

setter

Încarcă o stare a editorului salvată anterior. Înlocuiește întregul document: cel curent este golit mai întâi.
La fel ca clear(), setInitialValue() și metodele setSchema* în modul lor implicit mode: 'replace', elimină și vizualizarea Flux a filei Vizualizare: aranjarea, tabelele la care este restrânsă, afișarea rândurilor, zoomul și deplasarea. O adăugare (mode: 'append') nu o elimină.
Se înregistrează în istoric, permițând Undo, Redo, și emite change.
Acceptă forma de stocare, o valoare runtimeValue sau un fișier salvat de o versiune anterioară.
Un șir gol sau orice nu este șir de caractere încarcă un document nou în loc să genereze o eroare, așa că verificați valoarea înainte de a o atribui.
Acest document nou este cel cu care pornește setInitialValue(''): gol, cu setările implicite și, începând cu versiunea 4.0.0, cu toate blocările activate. În versiunile 3.10.x nu salva nici poziția de derulare, nici nivelul de zoom, iar înainte de acestea le salva pe amândouă.
Un store partajat retransmite această încărcare colaboratorilor cu JSON-ul complet al noului document, așa că fiecare partener, inclusiv unul cu o versiune mai veche, încarcă același document.
Începând cu versiunea 4.0.0, blocările documentului încărcat și valorile blocate pe care le scrie apoi value provin din text, iar vizualizarea ajunge acolo unde o plasează textul sau pe diagramă când nicio parte a acesteia nu este desenată acolo. Pentru fiecare altă setare blocată de text – fila, limbajul generatorului de cod, stilurile de denumire și tipul de delimitator – editorul continuă să afișeze ce afișa înainte de încărcare. O setare pe care textul o lasă deblocată preia valoarea din text. setInitialValue preia în schimb toate valorile din text; consultați-o și pentru un text care nu numește nicio blocare.
Nici un text care nu este JSON, de exemplu un fișier rămas cu marcaje de conflict de îmbinare, nu generează o eroare: documentul este golit, setările sale rămân cum erau, iar eroarea de parsare este scrisă în consolă.
Atribuirea este ignorată cât timp readonly este setat; folosiți setInitialValue pentru a încărca un document într-un editor doar în citire.

editor.value = 'json...';

runtimeValue

Începând cu versiunea 4.0.0, returnează documentul așa cum îl deține acest editor, ca șir de caractere JSON. Nu are setter, așa că atribuirea sa aruncă o excepție în codul care rulează în modul strict.
Conține ceea ce value omite: entitățile eliminate și ordinea lor, ordinea de suprapunere, lățimile măsurate, marcajele de cheie, punctele de ancorare ale relațiilor și secvențele. Și aici setările blocate se scriu cu valorile lor blocate.
Folosiți-o pentru a inițializa, prin metoda sa setInitialValue, un alt editor care se alătură unei sesiuni deja în desfășurare, de exemplu un colaborator sau o a doua vizualizare a aceluiași document. O anulare a unei eliminări pe care sesiunea o trimite ulterior restaurează atunci acolo entitatea întreagă, în timp ce un editor inițializat din value nu conține nicio entitate eliminată și restaurează în schimb un tabel gol, fără nume. Consultați Editare colaborativă.
Nimic nu mai colectează entitățile eliminate, așa că ele rămân în această valoare până la următoarea deschidere a documentului din fișierul său.
Nu o scrieți niciodată într-un fișier: salvați value, pe care JSON Schema îl acceptă, spre deosebire de aceasta.

otherEditor.setInitialValue(editor.runtimeValue);

setInitialValue

Încarcă o stare a editorului salvată anterior. Încărcarea în sine nu se înregistrează în istoric, așa că nu poate fi anulată, și nu se emite niciun eveniment change.
Golește și istoricul anulărilor, așa că nimic din ce s-a făcut înainte de încărcare nu poate fi anulat sau refăcut peste documentul încărcat.
Acceptă forma de stocare, o valoare runtimeValue sau un fișier salvat de o versiune anterioară și, spre deosebire de atribuirea proprietății value, preia toate setările din text, inclusiv fila și setările de cod.
Un șir gol sau orice nu este șir de caractere încarcă un document nou în loc să genereze o eroare, așa că setInitialValue('') pornește o diagramă goală.
Începând cu versiunea 4.0.0, acest document nou, care este și ceea ce afișează un element înainte de a primi vreo valoare, are toate blocările activate. Derularea, zoomul, schimbarea filelor și modificarea limbajului generatorului de cod, a stilurilor de denumire sau a tipului de delimitator lasă value neschimbat și nu emit niciun change. În versiunile 3.10.x nu salva nici poziția de derulare, nici nivelul de zoom, iar înainte de acestea le salva pe amândouă.
Un document încărcat din text păstrează blocările pe care le numește. Unul care nu numește niciuna – orice fișier salvat înainte de versiunea 4.0.0, oricare ar fi fost valoarea ignoreSaveSettings, și un fișier .vuerd v2 – se deschide cu toate blocările activate, cu setarea Viewport blocată la originea 0, 0 și la nivelul de zoom 1, pe fila ERD, cu limbajul, stilurile de denumire și tipul de delimitator așa cum le-a salvat.
În ambele cazuri, vizualizarea se deschide la vizualizarea documentului – cea salvată în text când acesta își numește blocările, originea 0, 0 la nivelul de zoom 1 când nu numește niciuna – sau pe diagramă când nicio parte a acesteia nu este desenată acolo. O setare Viewport blocată își păstrează în continuare valorile blocate în value.
Începând cu versiunea 4.0.0, renunță și la starea de colaborare a documentului deținut anterior, iar un store partajat al acestui editor care este deja abonat le cere din nou celorlalte editoare starea lor, așa că un editor reîncărcat într-o sesiune în desfășurare recuperează decalajul. Inițializați un astfel de editor cu valoarea runtimeValue a altui editor.
Nici un text care nu este JSON nu generează o eroare: documentul este golit, setările sale rămân cum erau, iar eroarea de parsare este scrisă în consolă.
Spre deosebire de atribuirea proprietății value, metoda nu este afectată de readonly, așa că prin ea încărcați un document într-un vizualizator doar în citire.

editor.setInitialValue('json...');

Încărcare la pornire, salvare la modificare.

editor.setInitialValue(localStorage.getItem('my-diagram') ?? '');
editor.addEventListener('change', () => {
  localStorage.setItem('my-diagram', editor.value);
});

Evenimente

Singurele trei evenimente publice sunt change, changePresetTheme și changeLocale; changeLocale a apărut în versiunea 4.0.0.
Elementul declanșează pe el însuși și evenimente interne @dineug/erd-editor/internal-*, pentru propria funcționare; acestea nu fac parte din API.

change

Când în editor apar modificări, acesta emite un eveniment.
Evenimentul este amânat (debounce) cu 200 ms și nu este emis cât timp readonly este true.
Se declanșează la orice modificare a documentului: o editare în interfață, atribuirea proprietății value, clear(), fiecare dintre metodele setSchema* și, începând cu versiunea 4.0.0, setSchemaJSON() și Import and Add. setInitialValue nu îl emite.
Nimic din ce se face în modul Flux al filei Vizualizare (zoomul, deplasarea, mutarea cardurilor, Tidy Up, afișarea rândurilor sau restrângerea vizualizării dintr-un card) nu îl emite, deoarece nimic din toate acestea nu este o modificare a documentului.
Începând cu versiunea 4.0.0, nu îl emite nici modificarea unei setări a cărei blocare este activată, deoarece aceasta schimbă doar ecranul, niciodată value: o derulare sau un zoom al pânzei ERD cât timp setarea Viewport este blocată, o schimbare de filă cât timp setarea Canvas Type este blocată și o modificare a limbajului generatorului de cod, a stilului de denumire a tabelelor, a stilului de denumire a coloanelor sau a tipului de delimitator cât timp propria blocare este activată. Doar aceste modificări sunt excluse, așa că un lot care editează și documentul îl emite în continuare. Blocarea sau deblocarea unei setări îl emite.
Toate blocările sunt activate într-un document nou și în orice fișier salvat înainte de versiunea 4.0.0, așa că, implicit, derularea, zoomul și schimbarea filelor nu emit nimic. Aceasta include focalizarea pe tabele din fila ERD, butonul cu pictograma de link extern al cardului, care vă duce din Flux înapoi la fila ERD, saltul la un rând din explorator sau la o potrivire a căutării, precum și deschiderea exploratorului sau saltul la un rezultat al căutării rapide dintr-o altă filă. Fiecare dintre acestea emite un singur change numai cât timp este dezactivată o blocare care acoperă acțiunea respectivă: Canvas Type pentru schimbarea filei și Viewport pentru derularea pe care o face și un buton de card, un rezultat al căutării rapide, un rând din explorator sau o potrivire a căutării. Începând cu versiunea 4.1.0, fiecare dintre aceste derulări urmează o singură regulă, Unde ajunge un salt, așa că un rezultat de tip tabel din căutarea rapidă nu mai derulează de fiecare dată, iar un salt pe care regula îl lasă pe loc nu produce nicio derulare care să emită evenimentul. Deschiderea, închiderea sau redimensionarea exploratorului îngustează sau lărgește pânza fără a-i muta originea și nu emite nici ea nimic. Înainte de versiunea 4.0.0, derularea, zoomul și schimbarea filelor îl emiteau întotdeauna, chiar și când editor.value rezulta identic.
Pentru a evita scrierile care nu schimbă nimic, comparați editor.value cu valoarea pe care ați stocat-o ultima dată, nu cu fișierul încărcat: un fișier scris de o versiune anterioară, un fișier v2 sau unul editat manual poate ieși diferit în value imediat ce se încarcă, deoarece value îl scrie în forma de stocare. La fel se poate întâmpla cu un fișier a cărui blocare Viewport este dezactivată și a cărui origine nu afișează nicio parte a diagramei pe acest ecran: încărcarea mută vizualizarea pe diagramă, iar value scrie locul unde ajunge aceasta. Începând cu versiunea 4.0.0, lățimile măsurate nu mai provoacă acest lucru, deoarece value nu conține niciuna. O aplicație gazdă care scrie fișiere poate deosebi în schimb o editare de o schimbare a vizualizării cu ajutorul câmpului changed al unui store de replicare (consultați on@change).
Evenimentul nu are câmpul detail, nu se propagă și nu iese din shadow root, așa că ascultați-l chiar pe element și citiți editor.value în funcția de tratare.

editor.addEventListener('change', event => {
  const data = event.target.value;
});

changePresetTheme

Este emis când tema predefinită este schimbată din configuratorul de teme încorporat sau, începând cu versiunea 4.0.0, din comanda Theme din căutarea rapidă. Fiecare alegere îl emite, inclusiv alegerea opțiunii deja în vigoare.
Apelarea de către dumneavoastră a metodelor setPresetTheme sau setSystemAppearance ori activarea sau dezactivarea proprietății systemDarkMode nu îl emite.
event.detail este obiectul ThemeOptions complet de după alegere, { appearance, grayColor, accentColor }, nu obiectul parțial solicitat. Începând cu versiunea 4.0.0, câmpul său appearance este 'system' cât timp este ales System, nu aspectul luminos sau întunecat afișat, așa că stocați-l ca atare și transmiteți-l înapoi metodei setPresetTheme.

editor.addEventListener('changePresetTheme', event => {
  const themeOptions = event.detail;
});

changeLocale

Începând cu versiunea 4.0.0, este emis când se alege o limbă în editor, din selectorul de limbă de afișare sau din comanda Display Language din căutarea rapidă, ambele activate de enableLocalePicker.
Se declanșează după ce limba a fost aplicată, la fiecare alegere, inclusiv la alegerea opțiunii deja în vigoare. setLocale și setSystemLocale nu îl emit niciodată și nici o schimbare a limbilor browserului nu îl emite. O schimbare a limbii nu emite niciun change.
event.detail este { locale }, de tipul LocaleOption: 'system' când a fost ales System, altfel codul limbii. Elementul nu reține alegerea, așa că stocați-o și transmiteți-o metodei setLocale la următoarea încărcare.
La fel ca change, nu se propagă, așa că ascultați-l chiar pe element.

editor.addEventListener('changeLocale', event => {
  const { locale } = event.detail; // 'system' | 'ko-KR' | ...
});

focus

Mută focusul pe editor.

editor.focus();

blur

Elimină focusul de pe editor.

editor.blur();

clear

Golește documentul, eliminând toate tabelele, coloanele, relațiile, indexurile și notele și, începând cu versiunea 4.0.0, toate grupurile de tabele.
Toate setările rămân, inclusiv baza de date, poziția vizualizării, nivelul de zoom, opțiunile de afișare ale tabelelor, fiecare blocare cu valoarea pe care o deține și scripturile Before tables și After tables din fila Schemă SQL, așa că un fișier golit salvează în continuare ce salva. Pentru a porni în schimb un document nou, atribuiți '' proprietății value sau apelați setInitialValue('').
Se înregistrează în istoric, așa că poate fi anulată, și emite change. O anulare readuce documentul așa cum îl deținea editorul, cu fiecare setare blocată la valoarea sa blocată. Este ignorată cât timp readonly este setat.

editor.clear();

destroy

Distruge complet instanța editorului, astfel încât aceasta să nu mai poată fi refolosită.
Eliberează ascultătorii și abonamentele editorului și distruge fiecare store partajat returnat de getSharedStore.
Un lot din flux pe care un store partajat îl mai reține se pierde odată cu acesta; apelați mai întâi metoda flushStreamBuffers a acelui store pentru a-l trimite.

editor.destroy();

setKeyBindingMap

Redefinește comenzile rapide de la tastatură.
edit, stop, undo, redo, zoomIn, zoomOut și zoomReset sunt fixe și nu pot fi redefinite.
Se scriu doar cele douăzeci și unu de nume de mai jos; orice altceva din obiect este ignorat, inclusiv numele fixe.
Începând cu versiunea 3.10.0, search poate fi redefinit, iar findReplace este nou. Înainte, search era fix. Începând cu versiunea 4.0.0, removeSelection este nou. Începând cu versiunea 4.1.0, addTableGroup și groupSelectedTables sunt noi.
Valoarea unei combinații de taste trebuie să fie de tipul ShortcutOption[]. Un șir simplu este ignorat, așa că scrieți { addTable: [{ shortcut: 'Alt+KeyN' }] }, nu { addTable: 'Alt+KeyN' }.
Un tablou gol este acceptat și nu asociază nimic: setKeyBindingMap({ findReplace: [] }) lasă Ctrl + F (Windows/Linux) sau ⌘ + F (Mac) paginii, iar { search: [] } face același lucru pentru Ctrl + K (Windows/Linux) sau ⌘ + K (Mac). Butonul Search din bara de instrumente deschide în continuare căutarea rapidă, butonul Explorer din bara de instrumente deschide și închide în continuare exploratorul, iar comanda Toggle Explorer din căutarea rapidă și din meniul contextual al pânzei deschide în continuare căutarea acestuia sau îl închide; niciunul dintre acestea nu afișează o comandă rapidă pentru un nume lăsat gol. { removeSelection: [] } lasă Delete și Backspace paginii, iar elementele de ștergere din meniurile tabelului, notei și grupului de tabele (Delete, Delete selected, Delete column, Delete columns) nu mai afișează atunci nicio comandă rapidă.
Începând cu versiunea 4.1.0, { addTableGroup: [] } lasă Alt + G (Windows/Linux) sau ⌥ + G (Mac) paginii, iar { groupSelectedTables: [] } lasă T apoi G. Comanda New Table Group de pe bara de instrumente a pânzei, din meniul contextual al pânzei și din căutarea rapidă, elementul Group selected tables din meniul tabelului și comanda Group Selected Tables din căutarea rapidă funcționează în continuare, fără nicio comandă rapidă afișată. Sfaturile ecran ale butoanelor New Table, New Memo și New Table Group de pe bara de instrumente a pânzei numesc prima combinație din addTable, addMemo și addTableGroup sau, pentru o combinație de taste lăsată goală, doar butonul.
Apelul face o îmbinare parțială: numele pe care le omiteți își păstrează valorile implicite, iar un al doilea apel păstrează modificările anterioare. Nu există un getter pentru combinațiile de taste curente: createKeyBindingMap returnează valorile implicite, nu ce a modificat setKeyBindingMap.

type ShortcutOption = {
  shortcut: string;
  preventDefault?: boolean;
  stopPropagation?: boolean;
};

const defaultKeyBindingMap: Omit<
  KeyBindingMap,
  | 'edit'
  | 'stop'
  | 'undo'
  | 'redo'
  | 'zoomIn'
  | 'zoomOut'
  | 'zoomReset'
> = {
  search: [
    { shortcut: '$mod+KeyK', preventDefault: true, stopPropagation: true },
  ],
  findReplace: [
    { shortcut: '$mod+KeyF', preventDefault: true, stopPropagation: true },
  ],
  addTable: [{ shortcut: 'Alt+KeyN', preventDefault: true }],
  addColumn: [{ shortcut: 'Alt+Enter', preventDefault: true }],
  addMemo: [{ shortcut: 'Alt+KeyM', preventDefault: true }],
  addTableGroup: [
    { shortcut: 'Alt+KeyG', preventDefault: true, stopPropagation: true },
  ],
  groupSelectedTables: [{ shortcut: 'KeyT KeyG', preventDefault: true }],
  removeTable: [
    { shortcut: '$mod+Backspace', preventDefault: true },
    { shortcut: '$mod+Delete', preventDefault: true },
  ],
  removeColumn: [
    { shortcut: 'Alt+Backspace', preventDefault: true },
    { shortcut: 'Alt+Delete', preventDefault: true },
  ],
  removeSelection: [
    { shortcut: 'Delete', preventDefault: true },
    { shortcut: 'Backspace', preventDefault: true },
  ],
  primaryKey: [{ shortcut: 'Alt+KeyK', preventDefault: true }],
  selectAllTable: [
    { shortcut: '$mod+KeyA', preventDefault: true },
    { shortcut: '$mod+Alt+KeyA', preventDefault: true },
  ],
  selectAllColumn: [{ shortcut: 'Alt+KeyA', preventDefault: true }],
  relationshipZeroOne: [{ shortcut: '$mod+Alt+Digit1', preventDefault: true }],
  relationshipZeroN: [{ shortcut: '$mod+Alt+Digit2', preventDefault: true }],
  relationshipOneOnly: [{ shortcut: '$mod+Alt+Digit3', preventDefault: true }],
  relationshipOneN: [{ shortcut: '$mod+Alt+Digit4', preventDefault: true }],
  tableProperties: [{ shortcut: 'Alt+Space', preventDefault: true }],
  focusView: [
    { shortcut: 'Alt+KeyF', preventDefault: true, stopPropagation: true },
  ],
  handTool: [{ shortcut: 'Space', preventDefault: true }],
  zenMode: [
    { shortcut: 'Alt+KeyZ', preventDefault: true, stopPropagation: true },
  ],
};

// example
editor.setKeyBindingMap({
  addTable: [{ shortcut: '$mod+KeyN', preventDefault: true }],
});

selectAllTable, handTool, removeSelection și, începând cu versiunea 4.1.0, groupSelectedTables cedează în fața cursorului de text: cât timp focusul este într-un câmp input, într-un textarea sau într-un element contenteditable, $mod + A selectează textul, Space tastează un spațiu, Delete și Backspace șterg text, iar T apoi G tastează cele două litere, în loc să ajungă la pânză. Niciuna dintre aceste apăsări nu este împiedicată. Orice combinație la care le reasociați se comportă la fel.

Începând cu versiunea 4.0.0, removeSelection (Delete sau Backspace) elimină selecția din fila ERD ca un singur pas de anulare, fără confirmare. Când tabelul activ este singurul element selectat, una sau mai multe dintre coloanele sale sunt selectate, iar zoomul îi desenează rândurile, elimină acele coloane; altfel elimină toate tabelele, notele și grupurile de tabele selectate, păstrând tabelele unui grup. Consultați Ștergerea tabelelor și notelor.
O tastă ținută apăsat elimină o singură dată, iar nimic nu se elimină cât timp este deschis un editor de celulă, de notă sau de nume de grup de tabele. În afara unui câmp de text și a panourilor care rețin combinațiile de taste (consultați createKeyBindingMap), apăsarea este împiedicată pe orice filă cât timp editorul are focusul, inclusiv pe un buton cu focus din bara de instrumente, precum și într-un editor doar în citire, unde nu elimină nimic.

Începând cu versiunea 4.1.0, addTableGroup (Alt+KeyG) activează trasarea New Table Group în fila ERD, după care următoarea apăsare a butonului principal pe pânză trasează grupul, iar o nouă apăsare dezactivează trasarea, la fel ca butonul New Table Group de pe bara de instrumente a pânzei. groupSelectedTables (KeyT KeyG, T apoi G) pune tabelele selectate într-un grup nou și deschide editorul numelui acestuia, la fel ca elementul Group selected tables din meniul contextual al unui tabel. Fără niciun tabel selectat nu adaugă nimic; o notă sau un grup de tabele selectat nu contează. Consultați Trasarea unui grup și Gruparea tabelelor selectate.
Amândouă acționează doar acolo unde meniurile oferă un grup: nu cât timp readonly este setat, cât timp opțiunea de afișare Table Groups ascunde grupurile sau cât timp este deschis un editor de celulă, de notă sau de nume de grup de tabele. La fel ca celelalte combinații de taste ale pânzei, acționează doar în fila ERD și nu cât timp este deschisă căutarea rapidă, panoul Proprietăți tabel, vizualizatorul de diferențe, călătoria în timp, previzualizarea aranjării automate ori caseta de dialog Export image sau Map Columns. Acolo unde nu fac nimic, apăsarea este totuși împiedicată, cu excepția cazului în care groupSelectedTables cedează în fața cursorului de text. Combinația addTableGroup este și ea oprită, la fel ca focusView și zenMode, așa că un ascultător keydown al paginii, în faza de propagare, nu o aude niciodată.

Începând cu versiunea 3.10.0, findReplace ($mod+KeyF) deschide funcția Găsire și înlocuire. Începând cu versiunea 4.1.0, comută exploratorul care o conține, iar fila Comenzi rapide o listează ca Toggle Explorer.
Cât timp butonul Explorer din bara de instrumente apare apăsat (exploratorul este deschis în fila ERD și nu este ascuns de modul Zen), închide exploratorul, cu excepția cazului în care este deschisă căutarea rapidă, panoul Proprietăți tabel, configuratorul de teme, selectorul de limbă de afișare, caseta de dialog Export image sau Map Columns. Altfel, închide oricare dintre acestea este deschis, aduce fila ERD din orice altă filă și deschide exploratorul cu cursorul de text în câmpul Find și textul căutat selectat. Un editor prea îngust pentru a afișa exploratorul lângă pânză îl păstrează deschis, dar deoparte, și afișează notificarea Widen the window to show the Explorer. Înainte de versiunea 4.1.0, deschidea panoul flotant Găsire și înlocuire sau readucea tastatura în câmpul acestuia și nu îl închidea niciodată.
Nu cedează în fața cursorului de text: cât timp editorul are focusul, este preluată pe orice filă, de pe pânză sau dintr-un câmp input din editor. Apăsarea este împiedicată, așa că browserul nu deschide bara de căutare, și oprită, așa că niciun ascultător keydown al paginii în faza de propagare nu o aude. Cu un editor de celulă sau de notă deschis ori, începând cu versiunea 4.0.0, cu un editor de nume de grup de tabele deschis, este în continuare împiedicată și oprită, dar nu face nimic.
Cât timp este deschis vizualizatorul de diferențe, călătoria în timp sau previzualizarea aranjării automate, pe oricare filă, ori cât timp o metodă de introducere (IME) încă compune, nu este nici împiedicată, nici oprită, așa că o primește căutarea proprie a browserului sau a aplicației gazdă. În interiorul exploratorului, o apăsare aflată încă în compunere este oprită acolo, deși nu este împiedicată. Orice combinație la care reasociați findReplace se comportă la fel.

focusView acționează doar în fila ERD. Cu cel puțin un tabel selectat, deschide fila Vizualizare în modul Flux, restrânsă la acele tabele și la toate tabelele aflate la o relație distanță; o notă sau un grup de tabele selectat nu contează, iar fără niciun tabel selectat nu face nimic. Consultați Focalizarea pe tabele.

stop (Escape) în fila ERD încheie un editor de celulă sau de notă deschis ori o relație în curs de trasare și lasă selecția neschimbată. Începând cu versiunea 4.0.0, încheie și un editor de nume de grup de tabele, fără a scrie vreun nume, precum și o trasare New Table Group. Editorul apelează preventDefault() pentru această apăsare.
Când niciunul dintre acestea nu este deschis, Escape deselectează tot, scoate focusul de pe celula activă și nu este împiedicat. Prin urmare, ieșirea dintr-o editare și deselectarea necesită două apăsări.
În afară de explorator, de formatele Import ale ecranului de bun venit și de selectoarele și casetele de dialog de mai jos, editorul nu oprește niciodată propagarea apăsărilor pe Escape, așa că o pagină care le ascultă ea însăși, de exemplu pentru a închide o casetă de dialog proprie, aude ambele apăsări și o poate ignora pe cea al cărei defaultPrevented este true.
Cât timp este deschisă căutarea rapidă, panoul Proprietăți tabel, vizualizatorul de diferențe, previzualizarea aranjării automate sau călătoria în timp, Escape închide în schimb acel element și lasă selecția neschimbată. Nici această apăsare nu este împiedicată.
Începând cu versiunea 4.0.0, o casetă de dialog Export image sau Map Columns deschisă preia și ea Escape, închizându-se și lăsând selecția neschimbată. Fiecare preia tastatura când se deschide, iar acel Escape este atât împiedicat, cât și oprit.
Începând cu versiunea 4.1.0, o apăsare pe Escape cu focusul în explorator, în arborele, câmpurile sau butoanele sale, readuce tastatura la pânză și lasă exploratorul deschis și selecția neschimbată. Editorul apelează atât preventDefault(), cât și stopPropagation() pentru ea, așa că nu ajunge niciodată la un ascultător keydown al paginii în faza de propagare.
O apăsare pe Escape pe pânză nu închide niciodată exploratorul. Înainte de versiunea 4.1.0, o apăsare pe Escape în panoul Găsire și înlocuire îl închidea, iar una pe pânză îl închidea prin aceeași apăsare care deselecta tot.
Începând cu versiunea 4.0.0, selectorul de limbă de afișare și selectorul de culori se închid la Escape: în interiorul lor, apăsarea este împiedicată și oprită, iar pe pânză îi închide prin aceeași apăsare care deselectează tot, fără a fi împiedicată sau oprită.
O apăsare pe Escape cât timp o metodă de introducere (IME) încă compune aparține compunerii. Lasă neschimbat un editor deschis și nu este împiedicată, așa că o pagină poate ignora și ea o apăsare al cărei isComposing este true sau al cărei keyCode este 229. În interiorul exploratorului, o astfel de apăsare, ca orice tastă apăsată acolo în timpul compunerii, este și oprită, iar tastatura rămâne în câmp.
Înainte de versiunea 3.9.2, o singură apăsare pe Escape încheia o editare sau o trasare și totodată deselecta tot, iar editorul nu o împiedica niciodată.

createKeyBindingMap

Începând cu versiunea 3.9.2, pachetul exportă createKeyBindingMap() și, odată cu aceasta, tipurile KeyBindingMap, KeyBindingName și ShortcutOption.
Returnează combinațiile de taste implicite, toate cele 28 de nume, inclusiv cele fixe, ca o hartă nouă la fiecare apel, așa că modificarea hărții returnate nu schimbă nimic altceva.
De la aceste valori pornește fiecare editor, iar un apel setKeyBindingMap nu se reflectă în ele.
Doar createKeyBindingMap este un export la execuție; celelalte trei sunt tipuri.

type KeyBindingName =
  | 'edit'
  | 'stop'
  | 'search'
  | 'findReplace'
  | 'undo'
  | 'redo'
  | 'addTable'
  | 'addColumn'
  | 'addMemo'
  | 'addTableGroup'
  | 'groupSelectedTables'
  | 'removeTable'
  | 'removeColumn'
  | 'removeSelection'
  | 'primaryKey'
  | 'selectAllTable'
  | 'selectAllColumn'
  | 'relationshipZeroOne'
  | 'relationshipZeroN'
  | 'relationshipOneOnly'
  | 'relationshipOneN'
  | 'tableProperties'
  | 'focusView'
  | 'zoomIn'
  | 'zoomOut'
  | 'zoomReset'
  | 'handTool'
  | 'zenMode';

type KeyBindingMap = Record<KeyBindingName, ShortcutOption[]>;

declare function createKeyBindingMap(): KeyBindingMap;

// example
import { createKeyBindingMap } from '@dineug/erd-editor';

const shortcuts = Object.values(createKeyBindingMap())
  .flat()
  .map(({ shortcut }) => shortcut); // 'Enter', 'Escape', '$mod+KeyK', ...

Fiecare shortcut este o combinație în sintaxa tinykeys, cu tasta numită după KeyboardEvent.code, unde $mod este ⌘ pe macOS și Control în rest.
Începând cu versiunea 4.0.0, editorul citește singur aceste combinații, în aceeași sintaxă, nu prin tinykeys. O tastă se potrivește după code sau după key, indiferent de majuscule, iar o apăsare se potrivește numai când sunt ținute apăsat exact tastele de modificare pe care le numește combinația. AltGraph contează ca Control și Alt pe Windows și ca Alt pe macOS. Apăsările separate printr-un spațiu formează o secvență, care o ia de la capăt după o secundă fără niciun eveniment keydown.
Începând cu versiunea 4.1.0, una dintre valorile implicite este o secvență: groupSelectedTables este KeyT KeyG, T apoi G. O secvență se execută la apăsarea care o completează și doar acea apăsare primește preventDefault și stopPropagation ale secvenței, așa că, cu valorile implicite, T ajunge la pagină și doar G este împiedicat. Meniurile, căutarea rapidă și fila Comenzi rapide afișează o secvență ca o tastă pentru fiecare apăsare.
Numele fixe sunt asociate cu Enter (edit), Escape (stop), $mod+KeyZ (undo), $mod+Shift+KeyZ (redo), $mod+Equal (zoomIn), $mod+Minus (zoomOut) și $mod+Digit0 (zoomReset). edit și stop nu au indicatori; celelalte cinci au preventDefault și stopPropagation. Restul sunt valorile implicite de mai sus, printre care search și findReplace.

Editorul le ascultă pe propriul element, așa că o aplicație gazdă care preia tastele înaintea editorului, cu comenzi rapide globale sau cu un ascultător keydown în faza de captură, trebuie să le lase să treacă cât timp editorul are focusul.
Construiți lista combinațiilor de lăsat să treacă pornind de la createKeyBindingMap(), cu combinațiile de taste transmise metodei setKeyBindingMap în locul celor implicite.
Începând cu versiunea 3.10.0, această listă include $mod+KeyF, combinația de căutare a browserului. O aplicație gazdă care vrea să-și păstreze propria căutare pe această combinație transmite setKeyBindingMap({ findReplace: [] }).
Începând cu versiunea 4.0.0, include și tastele Delete și Backspace simple. O aplicație gazdă care vrea să păstreze aceste taste transmite setKeyBindingMap({ removeSelection: [] }).
Începând cu versiunea 4.1.0, include și Alt+KeyG și secvența KeyT KeyG, care vine ca un singur șir: împărțiți-l la spațiu și lăsați să treacă fiecare apăsare, inclusiv T și G simple, deoarece o secvență căreia îi lipsește o apăsare nu se completează niciodată. O aplicație gazdă care vrea să păstreze aceste taste transmite setKeyBindingMap({ addTableGroup: [] }) sau setKeyBindingMap({ groupSelectedTables: [] }).

Cât timp focusul este în explorator, în arborele său, în câmpurile Find și Replace sau în butoanele sale, findReplace, search, undo, redo, zoomIn, zoomOut și zoomReset trec mai departe la editor, așa că findReplace acționează acolo la fel ca pe pânză. Orice altă combinație de taste, așa cum este setată în prezent, se oprește la explorator, o secvență prin ultima sa apăsare (un G simplu, cu valorile implicite), la fel ca tastele săgeți, Tab, Enter, Space, Home, End și orice tastă apăsată cât timp o metodă de introducere (IME) încă compune. Cu excepția tastei Escape, care readuce tastatura la pânză, acestea sunt oprite fără a fi împiedicate, așa că acționează ca taste obișnuite în câmpurile, butoanele și arborele exploratorului și nu ajung nici la pânză, nici la un ascultător keydown al paginii în faza de propagare: acolo Alt + N nu adaugă niciun tabel, iar Delete nu elimină nimic. Tastele care mută focusul, restrâng sau duc la un rând din arbore și Enter în câmpul Find sau Replace, care trece prin potriviri sau înlocuiește, sunt și împiedicate.
Orice altă tastă, de exemplu combinația de salvare sau de paletă de comenzi a unei aplicații gazdă, ajunge ca de obicei la pagină. Consultați Taste în explorator. Înainte de versiunea 4.1.0, panoul flotant Găsire și înlocuire reținea tastele în același mod, cu excepția tastelor Home și End, a ultimei apăsări a unei secvențe și a tastei Space cât timp handTool era asociat cu altă tastă.
Începând cu versiunea 4.0.0, selectorul de limbă de afișare reține tastele în același mod: aceleași șapte combinații trec mai departe, iar orice altă combinație (începând cu versiunea 4.1.0, o secvență prin ultima sa apăsare), tastele săgeți și Tab sunt oprite acolo fără a fi împiedicate, la fel ca orice tastă apăsată cât timp o metodă de introducere (IME) încă compune. ↑, ↓, Home, End, Enter și Space pe unul dintre rândurile sale trec de la un rând la altul sau aleg unul și sunt și împiedicate.

$mod

Schimbă tasta Control în funcție de mediu.

• Mac: $mod = Meta (⌘)
• Windows/Linux: $mod = Control

Tabelul comenzilor rapide

Folosește proprietățile key, code ale evenimentului de tastatură.
Folosiți code pentru poziții absolute și key pentru valorile introduse.

Windows	macOS	key	code
N/A	Command / ⌘	Meta	MetaLeft / MetaRight
Alt	Option / ⌥	Alt	AltLeft / AltRight
Control	Control / ^	Control	ControlLeft / ControlRight
Shift	Shift	Shift	ShiftLeft / ShiftRight
Space	Space	N/A	Space
Enter	Return	Enter	Enter
Esc	Esc	Escape	Escape
Backspace	Delete / ⌫	Backspace	Backspace
Delete	fn + Delete	Delete	Delete
1, 2 etc.	1, 2 etc.	1, 2 etc.	Digit1, Digit2 etc.
a, b etc.	a, b etc.	a, b etc.	KeyA, KeyB etc.
-	-	-	Minus
=	=	=	Equal
+	+	+	Equal

Temă

setPresetTheme

Setează o temă predefinită.
Valorile implicite sunt appearance: 'dark', grayColor: 'slate' și accentColor: 'indigo'.
Fiecare câmp se aplică separat, așa că un apel parțial le lasă neschimbate pe celelalte două. O valoare care nu este unul dintre numele de mai jos este ignorată, iar apelul nu aruncă niciodată o excepție.
Începând cu versiunea 4.0.0, câmpul appearance acceptă și 'system', adică opțiunea System din configuratorul de teme. Aceasta afișează aspectul luminos sau întunecat raportat de sistemul de operare ori cel indicat de setSystemAppearance și comută atunci când acesta se schimbă.

type ThemeOptions = {
  appearance: 'dark' | 'light' | 'system';
  grayColor: 'gray' | 'mauve' | 'slate' | 'sage' | 'olive' | 'sand';
  accentColor:
    | 'gray'
    | 'gold'
    | 'bronze'
    | 'brown'
    | 'yellow'
    | 'amber'
    | 'orange'
    | 'tomato'
    | 'red'
    | 'ruby'
    | 'crimson'
    | 'pink'
    | 'plum'
    | 'purple'
    | 'violet'
    | 'iris'
    | 'indigo'
    | 'blue'
    | 'cyan'
    | 'teal'
    | 'jade'
    | 'green'
    | 'grass'
    | 'lime'
    | 'mint'
    | 'sky';
};

// example
editor.setPresetTheme({ appearance: 'light' });

setSystemAppearance

Începând cu versiunea 4.0.0, indică aspectul luminos sau întunecat pe care îl afișează aspectul 'system', pentru o aplicație gazdă cu propriul aspect luminos și întunecat, de exemplu tema unui IDE. Cât timp unul este indicat, schimbările sistemului de operare sunt ignorate.
null sau orice valoare diferită de 'dark' ori 'light' revine la urmarea sistemului de operare.
Cât timp aspectul este 'light' sau 'dark', nu schimbă nimic pe ecran, dar valoarea este păstrată și se aplică imediat ce aspectul devine 'system'. Altfel se aplică imediat. Nu emite nimic, iar changePresetTheme continuă să raporteze 'system'.
Aplicațiile gazdă VS Code, JetBrains și Obsidian o apelează cu propriul aspect luminos sau întunecat și din nou de fiecare dată când acesta se schimbă.

editor.setPresetTheme({ appearance: 'system' });
editor.setSystemAppearance('light'); // null follows the OS again

setTheme

Permite personalizarea temei.
Fiecare apel înlocuiește întregul strat personalizat, așa că transmiteți din nou obiectul complet pentru a schimba un singur token peste o suprascriere existentă și transmiteți {} pentru a reveni la tema predefinită.
Se păstrează doar numele de tokenuri de mai jos, cu valori de tip șir de caractere; orice altceva este eliminat fără eroare.
Stratul se află deasupra temei predefinite, așa că un apel ulterior setPresetTheme înlocuiește tema predefinită de dedesubt, în timp ce suprascrierile dumneavoastră rămân.

JavaScript

type Theme = {
  grayColor1: string;
  grayColor2: string;
  grayColor3: string;
  grayColor4: string;
  grayColor5: string;
  grayColor6: string;
  grayColor7: string;
  grayColor8: string;
  grayColor9: string;
  grayColor10: string;
  grayColor11: string;
  grayColor12: string;

  accentColor1: string;
  accentColor2: string;
  accentColor3: string;
  accentColor4: string;
  accentColor5: string;
  accentColor6: string;
  accentColor7: string;
  accentColor8: string;
  accentColor9: string;
  accentColor10: string;
  accentColor11: string;
  accentColor12: string;

  canvasBackground: string;
  canvasBoundaryBackground: string;

  tableBackground: string;
  tableHeaderBackground: string;
  tableSelect: string;
  tableBorder: string;
  tableShadow: string;

  tableGroupHeaderBackground: string;
  tableGroupBackground: string;
  tableGroupBorder: string;

  memoBackground: string;
  memoSelect: string;
  memoBorder: string;
  memoShadow: string;

  columnSelect: string;
  columnSelectHover: string;
  columnHover: string;

  relationshipHover: string;

  visualizationLink: string;
  visualizationColumn: string;
  visualizationRelationship: string;

  toolbarBackground: string;

  contextMenuBackground: string;
  contextMenuSelect: string;
  contextMenuHover: string;
  contextMenuBorder: string;

  minimapBorder: string;
  minimapShadow: string;
  minimapViewportBorder: string;
  minimapViewportBorderHover: string;

  toastBackground: string;
  toastBorder: string;
  toastSuccess: string;
  toastError: string;

  findReplaceError: string;

  mapColumnsError: string;

  schemaSqlWarningBackground: string;
  schemaSqlWarningForeground: string;

  dragSelectBackground: string;
  dragSelectBorder: string;

  scrollbarTrack: string;
  scrollbarThumb: string;
  scrollbarThumbHover: string;

  foreground: string;
  active: string;
  placeholder: string;

  focus: string;
  inputActive: string;

  keyPK: string;
  keyFK: string;
  keyPFK: string;

  treeBackground: string;
  treeRowHover: string;
  treeRowCurrent: string;
  treeMuted: string;
  treeMatch: string;

  explorerBackground: string;
  explorerBorder: string;

  diffInsertForeground: string;
  diffDeleteForeground: string;
  diffModifyForeground: string;
  diffRenameForeground: string;
};

// example
editor.setTheme({
  canvasBackground: '#1b1b1f',
  tableBackground: '#242429',
  keyPK: '#ffc53d',
});

tableShadow și memoShadow sunt culoarea umbrei pe care o aruncă tabelele și notele pe pânza ERD. Tema predefinită întunecată le lasă transparent, ceea ce nu aruncă nicio umbră, la fel ca transmiterea valorii none sau a unui șir gol către setTheme; tema predefinită luminoasă folosește rgba(0, 0, 0, 0.18).

Începând cu versiunea 4.0.0, există încă nouă tokenuri:

• tableGroupHeaderBackground, tableGroupBackground și tableGroupBorder colorează bara de titlu, corpul și conturul unui grup de tabele care nu are o culoare proprie.
• toastSuccess și toastError colorează marcajul unei notificări care raportează cum s-a încheiat o acțiune.
• findReplaceError și mapColumnsError colorează erorile afișate de funcția Găsire și înlocuire și de caseta de dialog Mapare coloane. Înainte, Găsire și înlocuire folosea diffDeleteForeground, așa că suprascrierea acestuia nu o mai recolorează.
• schemaSqlWarningBackground și schemaSqlWarningForeground colorează avertismentele din opțiunile filei Schemă SQL.

Începând cu versiunea 4.1.0, există încă nouă tokenuri:

• treeBackground, treeRowHover, treeRowCurrent, treeMuted și treeMatch colorează arborele comun exploratorului și vizualizatorului de diferențe: fundalul său, care umple și câmpurile Find și Replace ale exploratorului; un rând aflat sub indicator, rândul pe care se află tastatura cât timp arborele are focusul și un buton aflat sub indicator în antetul și căutarea exploratorului; rândul potrivirii curente a căutării; textul estompat, de exemplu contoarele, tipurile de date și săgețile de restrângere; și marcajul din spatele textului găsit de o căutare.
• explorerBackground și explorerBorder colorează panoul exploratorului și liniile sale: marginea de lângă pânză, linia de sub căutare și bordurile câmpurilor sale și ale butoanelor pe care le desfășoară Search In. explorerBorder desenează și marginea arborelui vizualizatorului de diferențe, linia de sub câmpul său Filter by name și bordura acestui câmp. Pictogramele cheilor din explorator folosesc keyPK, keyFK și keyPFK.
• diffModifyForeground și diffRenameForeground colorează ceea ce vizualizatorul de diferențe marchează ca modificat și redenumit, în arborele său și pe ambele documente. diffModifyForeground conturează și un tabel, o notă sau un grup de tabele care a fost mutat, redimensionat, recolorat sau regrupat, indiferent ce altceva s-a schimbat în el, și desenează conectorul unei chei străine care s-a modificat.

diffInsertForeground și diffDeleteForeground colorează acum ceea ce vizualizatorul de diferențe marchează ca adăugat și eliminat, în arborele său și pe documentul care îl conține, deopotrivă în text, contururi și conectori. diffInsertBackground, diffDeleteBackground, diffCrossBackground și diffCrossForeground au fost eliminate în versiunea 4.1.0, deoarece vizualizatorul de diferențe nu mai umple celulele. setTheme le elimină ca pe orice alt nume care nu se află în Theme, iar variabilele lor CSS, --erd-editor-diff-insert-background, --erd-editor-diff-delete-background, --erd-editor-diff-cross-background și --erd-editor-diff-cross-foreground, nu mai sunt citite.

Variabile CSS

Fiecare token din Theme are o variabilă CSS corespunzătoare, numită --erd-editor- urmat de cheia scrisă în kebab-case: grayColor10 este --erd-editor-gray-color-10, keyPK este --erd-editor-key-pk, iar keyPFK este --erd-editor-key-pfk.
Variabilele se moștenesc în editor, așa că setați-le oriunde doriți să se aplice. Pe :root, aplică tema tuturor editoarelor din pagină; pe elementul însuși, doar acestuia.

erd-editor {
  --erd-editor-canvas-background: #1b1b1f;
}

Începând cu versiunea 3.4.0, tokenurile dargSelect, scrise greșit, se scriu dragSelect, iar variabilele lor CSS s-au schimbat din --erd-editor-darg-select-background și --erd-editor-darg-select-border în --erd-editor-drag-select-background și --erd-editor-drag-select-border. O foaie de stil care folosește încă numele vechi este ignorată.

Valorile implicite ale temei

:root {
  --erd-editor-gray-color-1: #111113;
  --erd-editor-gray-color-2: #18191b;
  --erd-editor-gray-color-3: #212225;
  --erd-editor-gray-color-4: #272a2d;
  --erd-editor-gray-color-5: #2e3135;
  --erd-editor-gray-color-6: #363a3f;
  --erd-editor-gray-color-7: #43484e;
  --erd-editor-gray-color-8: #5a6169;
  --erd-editor-gray-color-9: #696e77;
  --erd-editor-gray-color-10: #777b84;
  --erd-editor-gray-color-11: #b0b4ba;
  --erd-editor-gray-color-12: #edeef0;
  --erd-editor-accent-color-1: #11131f;
  --erd-editor-accent-color-2: #141726;
  --erd-editor-accent-color-3: #182449;
  --erd-editor-accent-color-4: #1d2e62;
  --erd-editor-accent-color-5: #253974;
  --erd-editor-accent-color-6: #304384;
  --erd-editor-accent-color-7: #3a4f97;
  --erd-editor-accent-color-8: #435db1;
  --erd-editor-accent-color-9: #3e63dd;
  --erd-editor-accent-color-10: #5472e4;
  --erd-editor-accent-color-11: #9eb1ff;
  --erd-editor-accent-color-12: #d6e1ff;
  --erd-editor-canvas-background: #212225;
  --erd-editor-canvas-boundary-background: #111113;
  --erd-editor-table-background: #18191b;
  --erd-editor-table-header-background: #2e3135;
  --erd-editor-table-select: #435db1;
  --erd-editor-table-border: #363a3f;
  --erd-editor-table-shadow: transparent;
  --erd-editor-table-group-header-background: #43484e;
  --erd-editor-table-group-background: #d3edf81d;
  --erd-editor-table-group-border: #43484e;
  --erd-editor-memo-background: #18191b;
  --erd-editor-memo-select: #435db1;
  --erd-editor-memo-border: #363a3f;
  --erd-editor-memo-shadow: transparent;
  --erd-editor-column-select: #182449;
  --erd-editor-column-select-hover: #1d2e62;
  --erd-editor-column-hover: #272a2d;
  --erd-editor-relationship-hover: #435db1;
  --erd-editor-visualization-link: #43484e;
  --erd-editor-visualization-column: #5a6169;
  --erd-editor-visualization-relationship: #5a6169;
  --erd-editor-toolbar-background: #111113;
  --erd-editor-context-menu-background: #18191b;
  --erd-editor-context-menu-select: #272a2d;
  --erd-editor-context-menu-hover: #3a4f97;
  --erd-editor-context-menu-border: #363a3f;
  --erd-editor-minimap-border: black;
  --erd-editor-minimap-shadow: black;
  --erd-editor-minimap-viewport-border: #3a4f97;
  --erd-editor-minimap-viewport-border-hover: #435db1;
  --erd-editor-toast-background: #18191b;
  --erd-editor-toast-border: #363a3f;
  --erd-editor-toast-success: #3dd68c;
  --erd-editor-toast-error: #ff9592;
  --erd-editor-find-replace-error: #ff9592;
  --erd-editor-map-columns-error: #ff9592;
  --erd-editor-schema-sql-warning-background: #500f1c;
  --erd-editor-schema-sql-warning-foreground: #ff9592;
  --erd-editor-drag-select-background: #253974;
  --erd-editor-drag-select-border: #435db1;
  --erd-editor-scrollbar-track: #ddeaf814;
  --erd-editor-scrollbar-thumb: #696e77;
  --erd-editor-scrollbar-thumb-hover: #777b84;
  --erd-editor-foreground: #b0b4ba;
  --erd-editor-active: #edeef0;
  --erd-editor-placeholder: #e5edfd7b;
  --erd-editor-focus: #435db1;
  --erd-editor-input-active: #5472e4;
  --erd-editor-key-pk: #ffc53d;
  --erd-editor-key-fk: #e54666;
  --erd-editor-key-pfk: #00a2c7;
  --erd-editor-tree-background: #111113;
  --erd-editor-tree-row-hover: #212225;
  --erd-editor-tree-row-current: #1d2e62;
  --erd-editor-tree-muted: #b0b4ba;
  --erd-editor-tree-match: #253974;
  --erd-editor-explorer-background: #111113;
  --erd-editor-explorer-border: #363a3f;
  --erd-editor-diff-insert-foreground: #3dd68c;
  --erd-editor-diff-delete-foreground: #ff9592;
  --erd-editor-diff-modify-foreground: #ffca16;
  --erd-editor-diff-rename-foreground: #70b8ff;
}

Limbă de afișare

Începând cu versiunea 4.0.0, textul propriu al editorului – meniurile, panourile, casetele de dialog, căutarea rapidă, notificările și cuvintele pe care le desenează pe diagramă, de exemplu unnamed, inclusiv în imaginile exportate – este disponibil în 25 de limbi. Numele tabelelor și coloanelor, SQL-ul, tipurile de date și codul generat nu se traduc niciodată. Consultați Limbă și temă.
Înainte ca metoda setLocale să fie apelată sau să fie aleasă o limbă, editorul afișează engleza sau urmează 'system' cât timp proprietatea enableLocalePicker este activată.
Editorul setează lang și dir pe propria rădăcină, aflată într-un shadow root închis, niciodată pe elementul gazdă sau pe pagină, așa că o pagină de la dreapta la stânga nu inversează editorul, iar o limbă de la dreapta la stânga nu inversează pagina. Ebraica, araba și persana așază interfața editorului de la dreapta la stânga; diagrama în sine nu este niciodată afișată în oglindă. Începând cu versiunea 4.1.0, exploratorul rămâne în stânga pânzei în orice limbă, iar în aceste trei limbi propriile sale rânduri se citesc de la dreapta la stânga.
Pachetul exportă tipurile LocaleCode (unul dintre codurile de mai jos) și LocaleOption.

type LocaleOption = LocaleCode | 'system';

Cod	Afișat ca	Limbă
id-ID	Bahasa Indonesia	Indoneziană
de-DE	Deutsch	Germană
en	English	Engleză
es-ES	Español	Spaniolă
eu-ES	Euskara	Bască
fr-FR	Français	Franceză
it-IT	Italiano	Italiană
nl-NL	Nederlands	Neerlandeză
pl-PL	Polski	Poloneză
pt-PT	Português	Portugheză
pt-BR	Português Brasileiro	Portugheză braziliană
ro-RO	Română	Română
sk-SK	Slovenčina	Slovacă
sl-SI	Slovenščina	Slovenă
sv-SE	Svenska	Suedeză
tr-TR	Türkçe	Turcă
ru-RU	Русский	Rusă
uk-UA	Українська	Ucraineană
he-IL	עברית	Ebraică
ar-SA	العربية	Arabă
fa-IR	فارسی	Persană
ja-JP	日本語	Japoneză
zh-CN	简体中文	Chineză simplificată
zh-TW	繁體中文	Chineză tradițională
ko-KR	한국어	Coreeană

setLocale

Setează limba de afișare: 'system' sau unul dintre codurile de mai sus. Orice altceva, de exemplu un simplu 'ko', un cod necunoscut sau o valoare care nu este șir de caractere, este ignorat fără eroare.
Se aplică înainte ca metoda să returneze, așa că o limbă setată înainte ca elementul să fie adăugat în DOM apare deja în primul său cadru.
Nu emite nimic, nici changeLocale, nici change, și nu atinge nici value, nici istoricul anulărilor, nici vreun store partajat.
Alegerea rămâne indiferent dacă proprietatea enableLocalePicker este activată sau dezactivată, iar setLocale('system') urmează sistemul și cu selectorul dezactivat.
Editorul nu stochează nimic. Pentru a păstra alegerea unui cititor, ascultați changeLocale și transmiteți-o înapoi la următoarea încărcare.

editor.enableLocalePicker = true;
editor.setLocale(localStorage.getItem('locale') ?? 'system');
editor.addEventListener('changeLocale', event => {
  localStorage.setItem('locale', event.detail.locale);
});

setSystemLocale

Indică limba pe care o reprezintă 'system', ca etichetă BCP 47, pentru o aplicație gazdă cu propria limbă de afișare. Aplicațiile gazdă VS Code, JetBrains și Obsidian o apelează cu propria limbă de afișare.
Spațiile de la capetele etichetei sunt eliminate. null, un șir gol sau o valoare care nu este șir de caractere revine la navigator.languages al browserului, pe care editorul îl urmează pe măsură ce se schimbă.
Contează doar cât timp opțiunea în vigoare este 'system' și se aplică imediat. Rândul System al selectorului afișează limba la care se rezolvă.
Eticheta sau, pe rând, fiecare dintre limbile browserului se rezolvă la prima limbă pe care o are editorul, după subeticheta de limbă, indiferent de majuscule și de caracterele de subliniere: de-AT dă de-DE, iar en-GB dă en. Chineza se stabilește după sistemul de scriere, Hant dând zh-TW și Hans dând zh-CN, iar în lipsa acestuia după regiune, TW, HK și MO dând zh-TW și oricare alta zh-CN. pt dă pt-BR, cu excepția cazului în care este indicată o altă regiune decât BR. Când nimic nu se potrivește, editorul afișează engleza.

editor.setLocale('system');
editor.setSystemLocale('pt-PT'); // null follows the browser again

setSchemaSQL

Încarcă un fișier Schemă SQL.
Implicit, înlocuiește documentul curent în loc să îl îmbine cu acesta; consultați opțiunea mode de mai jos. Setările existente se păstrează, inclusiv fiecare blocare și valoarea sa blocată, cu excepția poziției vizualizării și a nivelului de zoom, iar tabelele sunt plasate după citirea fișierului, pe rânduri, dacă opțiunea placement de mai jos nu cere altceva. Cu setarea Viewport blocată, value scrie apoi vizualizarea cu care începe importul, originea 0, 0 la nivelul de zoom 1. Prin urmare, un document importat într-un element care nu a primit niciodată o valoare are toate blocările activate, la fel ca un document nou.
Se înregistrează în istoric, permițând Undo, Redo, și emite change. Un șir gol este ignorat, iar apelul nu face nimic cât timp readonly este setat.
setSchemaGraphQL, setSchemaDBML și setSchemaAML se comportă la fel, iar parserele lor nu eșuează niciodată: un text pe care nu îl pot citi încarcă un document gol în loc să genereze o eroare.
Începând cu versiunea 4.0.0, toate patru acceptă un al doilea argument opțional, { placement, mode }:

• placement: 'grid', valoarea implicită, plasează imediat tabelele pe rânduri, ca înainte, iar apelul nu returnează nimic.
• placement: 'auto' aranjează mai întâi tabelele după relațiile lor, așa cum face Import în editor, și returnează un Promise care se rezolvă după ce importul a fost plasat ca un singur pas de anulare. Mai puțin de două tabele, nicio relație, o aranjare care eșuează, o pagină fără SharedWorker sau butonul Cancel din notificarea Placing tables le plasează în schimb pe rânduri. O încărcare între timp – un alt import care înlocuiește documentul, atribuirea proprietății value, setInitialValue(), clear(), încărcarea unui colaborator sau o anulare ori refacere a unei încărcări sau a apelului clear() – îi ia locul, iar obiectul Promise se rezolvă fără să se fi încărcat nimic. Importurile plasate astfel ajung în ordinea în care au început.
• mode: 'replace', valoarea implicită, înlocuiește documentul. mode: 'append' adaugă fișierul sub diagramă, așa cum face Import și adăugare, lăsând neschimbate toate tabelele deja existente, precum și toate setările, cu excepția filei și a poziției vizualizării. Dintr-o altă filă, fila ERD apare mai întâi. Tabelele noi și grupurile de tabele aduse de un fișier DBML cât timp grupurile de tabele sunt afișate devin selecția, iar vizualizarea derulează până la ele, dacă nu sunt deja bine vizibile, după regula pe care o urmează orice salt începând cu versiunea 4.1.0 (consultați Unde ajunge un salt). O singură anulare elimină întreaga adăugare. Un text pe care nu îl poate citi nu adaugă nimic și lasă documentul neschimbat.

Cât timp readonly este setat, o înlocuire este ignorată, o adăugare nu adaugă nimic, iar un apel cu placement: 'auto' se rezolvă imediat.
Începând cu versiunea 3.10.0, setSchemaSQL citește fișierul pentru baza de date curentă a documentului: cu Databricks selectat, șirurile între apostrofuri urmează secvențele de escape cu backslash din Spark. Consultați Comentarii.
Începând cu versiunea 3.10.0, setSchemaSQL citește o constrângere UNIQUE pe două sau mai multe coloane ca un singur index unic, nu ca un indicator unic pe fiecare coloană. Consultați Chei unice și indexuri.
Începând cu versiunea 3.10.0, importurile SQL, DBML și AML păstrează acțiunile ON DELETE și ON UPDATE ale cheilor străine pe care le citesc.
Începând cu versiunea 4.0.0, setSchemaSQL păstrează întreaga expresie DEFAULT a unei coloane, citește ADD DEFAULT … FOR și comentariile MS_Description din SQL Server, transformă coloanele de tip serial și identity din PostgreSQL în autoincrementare, păstrează UNSIGNED și ZEROFILL într-un tip de date și citește o cheie primară pe care ALTER TABLE … ADD PRIMARY KEY o marchează CLUSTERED, NONCLUSTERED sau USING BTREE. Consultați Schemă SQL.
Pentru sintaxa acceptată de fiecare parser, consultați Importarea sau exportarea fișierelor.

type SetSchema = {
  (
    value: string,
    options: { placement: 'auto'; mode?: 'replace' | 'append' }
  ): Promise<void>;
  (
    value: string,
    options?: { placement?: 'grid'; mode?: 'replace' | 'append' }
  ): void;
};

// example
editor.setSchemaSQL('Schema SQL...');
// or
await editor.setSchemaSQL('Schema SQL...', { placement: 'auto' });
// or
editor.setSchemaSQL('Schema SQL...', { mode: 'append' });

setSchemaGraphQL

Încarcă un document GraphQL SDL.
Definițiile de tip obiect devin tabele, iar un câmp al cărui tip este un alt tabel devine o relație.

editor.setSchemaGraphQL('GraphQL SDL...');

setSchemaDBML

Încarcă un fișier DBML, formatul folosit de dbdiagram.io și dbdocs.
Începând cu versiunea 4.0.0, fiecare TableGroup devine un grup de tabele, iar atributul headercolor al unui tabel devine culoarea acestuia. Consultați DBML.

editor.setSchemaDBML('DBML...');

setSchemaAML

Încarcă un fișier AML (Azimutt Markup Language). Sunt acceptate atât varianta actuală, cât și varianta veche v1.
Începând cu versiunea 4.0.0, culoarea unei entități, unul dintre numele de culori Azimutt sau o valoare hexazecimală între ghilimele, devine culoarea tabelului său. Consultați AML.

editor.setSchemaAML('AML...');

setSchemaJSON

Începând cu versiunea 4.0.0, încarcă un document .erd.json, de exemplu textul returnat de value.
În modul implicit mode: 'replace', încarcă documentul la fel ca atribuirea proprietății value: se înregistrează în istoric, emite change și preia blocările documentului în același mod. Spre deosebire de value, un șir gol sau o valoare care nu este șir de caractere este ignorat în loc să pornească un document nou. Un text care nu este JSON golește documentul, la fel ca la value.
mode: 'append' adaugă sub diagramă tabelele, relațiile, indexurile, notele și grupurile de tabele ale documentului, cu ID-uri noi, păstrându-le pozițiile relative și omițând setările documentului, așa cum face Import și adăugare cu un fișier json. Un text pe care nu îl poate citi sau un document fără niciun tabel și fără nicio notă nu adaugă nimic. Altfel, adăugarea se plasează ca o adăugare făcută cu setSchemaSQL, cu notele și grupurile de tabele noi selectate împreună cu tabelele, fiecare tip cât timp este afișat.
Returnează după ce documentul a fost plasat și este ignorată cât timp readonly este setat.

editor.setSchemaJSON('json...');
// or
editor.setSchemaJSON('json...', { mode: 'append' });

getSchemaSQL

Exportă starea curentă a editorului ca Schemă SQL.
Dacă databaseVendor nu este specificat, funcționează pe baza sistemului de baze de date setat în prezent. Un nume care nu se află în lista de mai jos este tratat la fel, fără a genera o eroare.
Numele sunt delimitate cu tipul de delimitator afișat de editor. Cât timp setarea Bracket Type este blocată, acesta poate diferi de cel salvat de value, care este cel cu care delimitează numele instrumentul erd_read al unui agent de programare.
Începând cu versiunea 4.0.0, un argument opțional options alege instrucțiunile și antetul, așa cum fac opțiunile filei Schemă SQL. SchemaSQLOptions este exportat ca tip.

• statements: 'create', valoarea implicită; 'ifNotExists', care scrie IF NOT EXISTS pe MySQL, MariaDB, PostgreSQL, SQLite și Databricks și revine la 'create' în rest; sau 'recreate', care șterge tabelele înainte de a le crea, Snowflake scriind în schimb CREATE OR REPLACE TABLE.
• header: 'none', valoarea implicită; 'use', care trece la baza de date sau schema documentului; sau 'createAndUse', care mai întâi o creează, dacă nu există, apoi trece la ea. O bază de date care nu are varianta cerută revine la alta, așa cum face fila: Oracle scrie 'use' pentru 'createAndUse', PostgreSQL nu scrie niciun antet pentru 'use', iar SQLite nu scrie niciunul. Un antet se scrie doar cât timp numele bazei de date a documentului este un identificator simplu: litere ASCII, cifre și _, fără a începe cu o cifră.

O opțiune omisă sau una cu o valoare necunoscută se citește ca valoarea sa implicită, așa că un apel fără opțiuni scrie instrucțiuni CREATE simple, fără antet, ca înainte.
Începând cu versiunea 4.0.0, rezultatul include întotdeauna scripturile Before tables și After tables ale documentului, în ordinea: antet, scriptul de dinainte, instrucțiunile DROP, tabelele, scriptul de după. Opțiunile proprii Statements, Header și Tables ale filei Schemă SQL nu afectează niciodată acest apel, care scrie întotdeauna întregul document.
Începând cu versiunea 3.10.0, fiecare cheie străină conține clauzele ON DELETE și ON UPDATE ale relației. O clauză se scrie doar când acțiunea sa este setată și sistemul de baze de date o acceptă, așa că o acțiune pe care acel sistem nu o acceptă este omisă și se aplică valoarea sa implicită. Începând cu versiunea 4.0.0, Snowflake acceptă doar NO ACTION. Pentru ce scrie fiecare bază de date, consultați ON DELETE și ON UPDATE.
Începând cu versiunea 3.10.0, un apostrof dintr-un comentariu de tabel sau de coloană este scris cu escape, așa că un comentariu precum it's nu mai strică instrucțiunea. Fiecare sistem de baze de date care scrie comentariile ca literali de tip șir îl dublează, cu excepția Databricks, care pune un backslash înaintea fiecărui apostrof și a fiecărui backslash. SQLite scrie în continuare comentariile ca linii --.
Începând cu versiunea 4.0.0, mai multe baze de date scriu diferit și numele cheilor, valorile implicite și autoincrementarea. Consultați Ce scrie codul DDL.

type DatabaseVendor =
  | 'Databricks'
  | 'MariaDB'
  | 'MSSQL'
  | 'MySQL'
  | 'Oracle'
  | 'PostgreSQL'
  | 'Snowflake'
  | 'SQLite';

type SchemaSQLOptions = {
  statements?: 'create' | 'ifNotExists' | 'recreate';
  header?: 'none' | 'use' | 'createAndUse';
};

const schemaSQL = editor.getSchemaSQL();
// or
const postgresSQL = editor.getSchemaSQL('PostgreSQL');
// or
const mysqlSQL = editor.getSchemaSQL('MySQL', {
  statements: 'ifNotExists',
  header: 'createAndUse',
});

getSharedStore

Returnează un store pentru editarea colaborativă în timp real.
config este { getNickname?, mouseTracker?, focusTracker? }. Ambele opțiuni de urmărire au valoarea implicită true: mouseTracker difuzează cursorul acestui editor către celelalte, iar focusTracker difuzează celula sa activă, selecția și caseta de selecție.
Consultați Editare colaborativă.

const sharedStore = editor.getSharedStore({
  mouseTracker: false,
  focusTracker: false,
});

setDiffValue

Deschide vizualizatorul de diferențe, comparând documentul deschis în prezent cu cel transmis.
Nu returnează nimic și nu modifică documentul, așa că închiderea vizualizatorului lasă editorul exact cum era.
O valoare goală sau orice nu este șir de caractere este comparată cu un document gol.
Este același strat suprapus ca cel deschis de elementul Vizualizator de diferențe din meniul contextual al pânzei.
Începând cu versiunea 4.1.0, asociază conținutul celor două documente mai întâi după ID și abia apoi după ceea ce păstrează fiecare element, de exemplu numele unui tabel sau textul unei note (consultați Ce se compară). Prin urmare, față de o versiune anterioară a aceluiași document, de exemplu o revizie Git a fișierului său, o redenumire apare ca un singur element redenumit; față de un document ale cărui ID-uri diferă, apare ca o eliminare și o adăugare. Vizualizatorul listează modificările într-un arbore lângă cele două documente și le marchează cu culori în loc să umple celulele.

editor.setDiffValue('prev json...');