@ekz/lexical-file 0.40.0

package/EkzLexicalFile.dev.js

@@ -0,0 +1,121 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+'use strict';
+
+var lexical = require('@ekz/lexical');
+
+var version = "0.40.0";
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+/**
+ * Generates a SerializedDocument from the given EditorState
+ * @param editorState - the EditorState to serialize
+ * @param config - An object that optionally contains source and lastSaved.
+ * source defaults to Lexical and lastSaved defaults to the current time in
+ * epoch milliseconds.
+ */
+function serializedDocumentFromEditorState(editorState, config = Object.freeze({})) {
+  return {
+    editorState: editorState.toJSON(),
+    lastSaved: config.lastSaved || Date.now(),
+    source: config.source || 'Lexical',
+    version
+  };
+}
+
+/**
+ * Parse an EditorState from the given editor and document
+ *
+ * @param editor - The lexical editor
+ * @param maybeStringifiedDocument - The contents of a .lexical file (as a JSON string, or already parsed)
+ */
+function editorStateFromSerializedDocument(editor, maybeStringifiedDocument) {
+  const json = typeof maybeStringifiedDocument === 'string' ? JSON.parse(maybeStringifiedDocument) : maybeStringifiedDocument;
+  return editor.parseEditorState(json.editorState);
+}
+
+/**
+ * Takes a file and inputs its content into the editor state as an input field.
+ * @param editor - The lexical editor.
+ */
+function importFile(editor) {
+  readTextFileFromSystem(text => {
+    editor.setEditorState(editorStateFromSerializedDocument(editor, text));
+    editor.dispatchCommand(lexical.CLEAR_HISTORY_COMMAND, undefined);
+  });
+}
+function readTextFileFromSystem(callback) {
+  const input = document.createElement('input');
+  input.type = 'file';
+  input.accept = '.lexical';
+  input.addEventListener('change', event => {
+    const target = event.target;
+    if (target.files) {
+      const file = target.files[0];
+      const reader = new FileReader();
+      reader.readAsText(file, 'UTF-8');
+      reader.onload = readerEvent => {
+        if (readerEvent.target) {
+          const content = readerEvent.target.result;
+          callback(content);
+        }
+      };
+    }
+  });
+  input.click();
+}
+
+/**
+ * Generates a .lexical file to be downloaded by the browser containing the current editor state.
+ * @param editor - The lexical editor.
+ * @param config - An object that optionally contains fileName and source. fileName defaults to
+ * the current date (as a string) and source defaults to Lexical.
+ */
+function exportFile(editor, config = Object.freeze({})) {
+  const now = new Date();
+  const serializedDocument = serializedDocumentFromEditorState(editor.getEditorState(), {
+    ...config,
+    lastSaved: now.getTime()
+  });
+  const fileName = config.fileName || now.toISOString();
+  exportBlob(serializedDocument, `${fileName}.lexical`);
+}
+
+// Adapted from https://stackoverflow.com/a/19328891/2013580
+function exportBlob(data, fileName) {
+  const a = document.createElement('a');
+  const body = document.body;
+  if (body === null) {
+    return;
+  }
+  body.appendChild(a);
+  a.style.display = 'none';
+  const json = JSON.stringify(data);
+  const blob = new Blob([json], {
+    type: 'octet/stream'
+  });
+  const url = window.URL.createObjectURL(blob);
+  a.href = url;
+  a.download = fileName;
+  a.click();
+  window.URL.revokeObjectURL(url);
+  a.remove();
+}
+
+exports.editorStateFromSerializedDocument = editorStateFromSerializedDocument;
+exports.exportFile = exportFile;
+exports.importFile = importFile;
+exports.serializedDocumentFromEditorState = serializedDocumentFromEditorState;

package/EkzLexicalFile.dev.mjs

@@ -0,0 +1,116 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import { CLEAR_HISTORY_COMMAND } from '@ekz/lexical';
+
+var version = "0.40.0";
+
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+/**
+ * Generates a SerializedDocument from the given EditorState
+ * @param editorState - the EditorState to serialize
+ * @param config - An object that optionally contains source and lastSaved.
+ * source defaults to Lexical and lastSaved defaults to the current time in
+ * epoch milliseconds.
+ */
+function serializedDocumentFromEditorState(editorState, config = Object.freeze({})) {
+  return {
+    editorState: editorState.toJSON(),
+    lastSaved: config.lastSaved || Date.now(),
+    source: config.source || 'Lexical',
+    version
+  };
+}
+
+/**
+ * Parse an EditorState from the given editor and document
+ *
+ * @param editor - The lexical editor
+ * @param maybeStringifiedDocument - The contents of a .lexical file (as a JSON string, or already parsed)
+ */
+function editorStateFromSerializedDocument(editor, maybeStringifiedDocument) {
+  const json = typeof maybeStringifiedDocument === 'string' ? JSON.parse(maybeStringifiedDocument) : maybeStringifiedDocument;
+  return editor.parseEditorState(json.editorState);
+}
+
+/**
+ * Takes a file and inputs its content into the editor state as an input field.
+ * @param editor - The lexical editor.
+ */
+function importFile(editor) {
+  readTextFileFromSystem(text => {
+    editor.setEditorState(editorStateFromSerializedDocument(editor, text));
+    editor.dispatchCommand(CLEAR_HISTORY_COMMAND, undefined);
+  });
+}
+function readTextFileFromSystem(callback) {
+  const input = document.createElement('input');
+  input.type = 'file';
+  input.accept = '.lexical';
+  input.addEventListener('change', event => {
+    const target = event.target;
+    if (target.files) {
+      const file = target.files[0];
+      const reader = new FileReader();
+      reader.readAsText(file, 'UTF-8');
+      reader.onload = readerEvent => {
+        if (readerEvent.target) {
+          const content = readerEvent.target.result;
+          callback(content);
+        }
+      };
+    }
+  });
+  input.click();
+}
+
+/**
+ * Generates a .lexical file to be downloaded by the browser containing the current editor state.
+ * @param editor - The lexical editor.
+ * @param config - An object that optionally contains fileName and source. fileName defaults to
+ * the current date (as a string) and source defaults to Lexical.
+ */
+function exportFile(editor, config = Object.freeze({})) {
+  const now = new Date();
+  const serializedDocument = serializedDocumentFromEditorState(editor.getEditorState(), {
+    ...config,
+    lastSaved: now.getTime()
+  });
+  const fileName = config.fileName || now.toISOString();
+  exportBlob(serializedDocument, `${fileName}.lexical`);
+}
+
+// Adapted from https://stackoverflow.com/a/19328891/2013580
+function exportBlob(data, fileName) {
+  const a = document.createElement('a');
+  const body = document.body;
+  if (body === null) {
+    return;
+  }
+  body.appendChild(a);
+  a.style.display = 'none';
+  const json = JSON.stringify(data);
+  const blob = new Blob([json], {
+    type: 'octet/stream'
+  });
+  const url = window.URL.createObjectURL(blob);
+  a.href = url;
+  a.download = fileName;
+  a.click();
+  window.URL.revokeObjectURL(url);
+  a.remove();
+}
+
+export { editorStateFromSerializedDocument, exportFile, importFile, serializedDocumentFromEditorState };

package/EkzLexicalFile.js

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+'use strict'
+const EkzLexicalFile = process.env.NODE_ENV !== 'production' ? require('./EkzLexicalFile.dev.js') : require('./EkzLexicalFile.prod.js');
+module.exports = EkzLexicalFile;

package/EkzLexicalFile.mjs

@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import * as modDev from './EkzLexicalFile.dev.mjs';
+import * as modProd from './EkzLexicalFile.prod.mjs';
+const mod = process.env.NODE_ENV !== 'production' ? modDev : modProd;
+export const editorStateFromSerializedDocument = mod.editorStateFromSerializedDocument;
+export const exportFile = mod.exportFile;
+export const importFile = mod.importFile;
+export const serializedDocumentFromEditorState = mod.serializedDocumentFromEditorState;

package/EkzLexicalFile.node.mjs

@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const mod = await (process.env.NODE_ENV !== 'production' ? import('./EkzLexicalFile.dev.mjs') : import('./EkzLexicalFile.prod.mjs'));
+export const editorStateFromSerializedDocument = mod.editorStateFromSerializedDocument;
+export const exportFile = mod.exportFile;
+export const importFile = mod.importFile;
+export const serializedDocumentFromEditorState = mod.serializedDocumentFromEditorState;

package/EkzLexicalFile.prod.js

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+"use strict";var e=require("@ekz/lexical");function t(e,t=Object.freeze({})){return{editorState:e.toJSON(),lastSaved:t.lastSaved||Date.now(),source:t.source||"Lexical",version:"0.40.0"}}function o(e,t){const o="string"==typeof t?JSON.parse(t):t;return e.parseEditorState(o.editorState)}exports.editorStateFromSerializedDocument=o,exports.exportFile=function(e,o=Object.freeze({})){const n=new Date;!function(e,t){const o=document.createElement("a"),n=document.body;if(null===n)return;n.appendChild(o),o.style.display="none";const r=JSON.stringify(e),i=new Blob([r],{type:"octet/stream"}),a=window.URL.createObjectURL(i);o.href=a,o.download=t,o.click(),window.URL.revokeObjectURL(a),o.remove()}(t(e.getEditorState(),{...o,lastSaved:n.getTime()}),`${o.fileName||n.toISOString()}.lexical`)},exports.importFile=function(t){!function(e){const t=document.createElement("input");t.type="file",t.accept=".lexical",t.addEventListener("change",t=>{const o=t.target;if(o.files){const t=o.files[0],n=new FileReader;n.readAsText(t,"UTF-8"),n.onload=t=>{if(t.target){const o=t.target.result;e(o)}}}}),t.click()}(n=>{t.setEditorState(o(t,n)),t.dispatchCommand(e.CLEAR_HISTORY_COMMAND,void 0)})},exports.serializedDocumentFromEditorState=t;

package/EkzLexicalFile.prod.mjs

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import{CLEAR_HISTORY_COMMAND as e}from"@ekz/lexical";function t(e,t=Object.freeze({})){return{editorState:e.toJSON(),lastSaved:t.lastSaved||Date.now(),source:t.source||"Lexical",version:"0.40.0"}}function n(e,t){const n="string"==typeof t?JSON.parse(t):t;return e.parseEditorState(n.editorState)}function o(t){!function(e){const t=document.createElement("input");t.type="file",t.accept=".lexical",t.addEventListener("change",t=>{const n=t.target;if(n.files){const t=n.files[0],o=new FileReader;o.readAsText(t,"UTF-8"),o.onload=t=>{if(t.target){const n=t.target.result;e(n)}}}}),t.click()}(o=>{t.setEditorState(n(t,o)),t.dispatchCommand(e,void 0)})}function i(e,n=Object.freeze({})){const o=new Date;!function(e,t){const n=document.createElement("a"),o=document.body;if(null===o)return;o.appendChild(n),n.style.display="none";const i=JSON.stringify(e),a=new Blob([i],{type:"octet/stream"}),c=window.URL.createObjectURL(a);n.href=c,n.download=t,n.click(),window.URL.revokeObjectURL(c),n.remove()}(t(e.getEditorState(),{...n,lastSaved:o.getTime()}),`${n.fileName||o.toISOString()}.lexical`)}export{n as editorStateFromSerializedDocument,i as exportFile,o as importFile,t as serializedDocumentFromEditorState};

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) Meta Platforms, Inc. and affiliates.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/LexicalFile.js.flow

@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict
+ *
+ */
+
+import type {LexicalEditor} from '@ekz/lexical';
+
+declare export function importFile(editor: LexicalEditor): void;
+declare export function exportFile(
+  editor: LexicalEditor,
+  config?: $ReadOnly<{fileName?: string, source?: string}>,
+): void;

package/README.md

@@ -0,0 +1,5 @@
+# `@lexical/file`
+
+[![See API Documentation](https://lexical.dev/img/see-api-documentation.svg)](https://lexical.dev/docs/api/modules/lexical_file)
+
+This package contains the functionality for the file import/export feature of Lexical.

package/fileImportExport.d.ts

@@ -0,0 +1,51 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import type { EditorState, LexicalEditor, SerializedEditorState } from '@ekz/lexical';
+export interface SerializedDocument {
+    /** The serialized editorState produced by editorState.toJSON() */
+    editorState: SerializedEditorState;
+    /** The time this document was created in epoch milliseconds (Date.now()) */
+    lastSaved: number;
+    /** The source of the document, defaults to Lexical */
+    source: string | 'Lexical';
+    /** The version of Lexical that produced this document */
+    version: string;
+}
+/**
+ * Generates a SerializedDocument from the given EditorState
+ * @param editorState - the EditorState to serialize
+ * @param config - An object that optionally contains source and lastSaved.
+ * source defaults to Lexical and lastSaved defaults to the current time in
+ * epoch milliseconds.
+ */
+export declare function serializedDocumentFromEditorState(editorState: EditorState, config?: Readonly<{
+    source?: string;
+    lastSaved?: number;
+}>): SerializedDocument;
+/**
+ * Parse an EditorState from the given editor and document
+ *
+ * @param editor - The lexical editor
+ * @param maybeStringifiedDocument - The contents of a .lexical file (as a JSON string, or already parsed)
+ */
+export declare function editorStateFromSerializedDocument(editor: LexicalEditor, maybeStringifiedDocument: SerializedDocument | string): EditorState;
+/**
+ * Takes a file and inputs its content into the editor state as an input field.
+ * @param editor - The lexical editor.
+ */
+export declare function importFile(editor: LexicalEditor): void;
+/**
+ * Generates a .lexical file to be downloaded by the browser containing the current editor state.
+ * @param editor - The lexical editor.
+ * @param config - An object that optionally contains fileName and source. fileName defaults to
+ * the current date (as a string) and source defaults to Lexical.
+ */
+export declare function exportFile(editor: LexicalEditor, config?: Readonly<{
+    fileName?: string;
+    source?: string;
+}>): void;

package/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export { editorStateFromSerializedDocument, exportFile, importFile, type SerializedDocument, serializedDocumentFromEditorState, } from './fileImportExport';

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@ekz/lexical-file",
+  "description": "This package provides the file import/export feature for Lexical.",
+  "keywords": [
+    "lexical",
+    "editor",
+    "rich-text",
+    "file",
+    "import",
+    "export"
+  ],
+  "license": "MIT",
+  "version": "0.40.0",
+  "main": "LexicalFile.js",
+  "types": "index.d.ts",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/facebook/lexical.git",
+    "directory": "packages/lexical-file"
+  },
+  "module": "LexicalFile.mjs",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./index.d.ts",
+        "development": "./LexicalFile.dev.mjs",
+        "production": "./LexicalFile.prod.mjs",
+        "node": "./LexicalFile.node.mjs",
+        "default": "./LexicalFile.mjs"
+      },
+      "require": {
+        "types": "./index.d.ts",
+        "development": "./LexicalFile.dev.js",
+        "production": "./LexicalFile.prod.js",
+        "default": "./LexicalFile.js"
+      }
+    }
+  },
+  "dependencies": {
+    "@ekz/lexical": "0.40.0"
+  }
+}