@bbl-digital/snorre 4.2.14 → 4.2.17

package/lib/core/QuillEditor/classes/ListItem.js

@@ -1,14 +1,9 @@
 import Quill from 'quill';
-import { MyListContainer } from './ListContainer';
 const ListItem = Quill.import('formats/list');
 class MyListItem extends ListItem {
-  static requiredContainer = MyListContainer;
   static create(value) {
     return super.create(value);
   }
-  static register() {
-    Quill.register(MyListContainer, true);
-  }
   optimize(context) {
     if (this.statics.requiredContainer && !(this.parent instanceof this.statics.requiredContainer)) {
       // Insert the format value (bullet, ordered) into wrap arguments

package/lib/core/QuillEditor/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/QuillEditor/index.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAc3C,OAAO,2BAA2B,CAAA;AAqDlC,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA0S3C,CAAA;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/QuillEditor/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAW3C,OAAO,2BAA2B,CAAA;AAkClC,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA+Q3C,CAAA;AAED,eAAe,WAAW,CAAA"}

package/lib/core/QuillEditor/index.js

@@ -1,21 +1,17 @@
 /** @jsxImportSource @emotion/react */
-import { useRef, useState, useEffect, useCallback, useLayoutEffect } from 'react';
+import { useRef, useState, useEffect, useCallback } from 'react';
 import Quill from 'quill';
 import { basicToolbar, richToolbar } from './config';
 import { ErrorWrapper, Label, styles } from './styles';
 import Text from '../Text';
 import IconErrorOutline from '../../icons/General/IconErrorOutline';
 import { useTheme } from '@emotion/react';
-import MyListItem from './classes/ListItem';
-import { IndentAttributor } from './classes/IndentAttributor';
 import { CustomLinkSanitizer } from './classes/LinkSanitizer';
-import { MyListContainer } from './classes/ListContainer';
 import DOMPurify from 'dompurify';
 import 'quill/dist/quill.snow.css';
-import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-const Parchment = Quill.import('parchment');
 
 // Colors
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 Quill.register(Quill.import('attributors/style/color'), true);
 // Background colors
 Quill.register(Quill.import('attributors/style/background'), true);
@@ -39,22 +35,11 @@ Quill.register('attributors/style/bold', true);
 const Size = Quill.import('attributors/style/size');
 Size.whitelist = ['0.75em', '1em', '1.5em', '2.5em'];
 Quill.register(Size, true);
-let IndentStyle = new IndentAttributor('indent', 'margin-left', {
-  scope: Parchment.Scope.BLOCK,
-  whitelist: ['1em', '2em', '3em', '4em', '5em', '6em', '7em', '8em', '9em']
-});
 
 // Font
 const Font = Quill.import('formats/font');
 Font.whitelist = ['Source Sans Pro', 'sans-serif'];
 Quill.register(Font, true);
-const Container = MyListContainer;
-Container.allowedChildren = [MyListItem];
-Quill.register(IndentStyle, true);
-Quill.register({
-  'formats/list': Container,
-  'formats/ulist': MyListItem
-}, true);
 Quill.register(CustomLinkSanitizer, true);
 const QuillEditor = ({
   height,
@@ -87,7 +72,6 @@ const QuillEditor = ({
   const isMounted = useRef(false);
   const quillRef = useRef(null);
   const defaultValueRef = useRef(initialValue);
-  const onTextChangeRef = useRef(onChange);
   const editorId = useRef(new Date().getTime() + (100 * Math.random()).toFixed(0));
   const {
     alert
@@ -122,17 +106,6 @@ const QuillEditor = ({
     }
     return true;
   }, [quill]);
-  const handleAutoidentList = useCallback((range, _context, quill) => {
-    if (!quill) return true;
-    const [line] = quill.getLine(range.index);
-    const formats = line.formats();
-    if (formats.list) {
-      const indent = formats.indent ? parseInt(formats.indent, 10) : 0;
-      quill.format('indent', indent + 1);
-      return false;
-    }
-    return true;
-  }, [quill]);
   const modules = {
     toolbar: toolbars[type || 'basic'],
     clipboard: {
@@ -149,20 +122,16 @@ const QuillEditor = ({
       }
     }
   };
-  const handleChange = useCallback((delta, _oldDelta, source, quill) => {
+  const handleChange = useCallback(quill => {
     if (!quill) return;
-    const html = sanitizeHtml ? DOMPurify.sanitize(quill.root.innerHTML, {
+    const html = sanitizeHtml ? DOMPurify.sanitize(quill.getSemanticHTML(), {
       USE_PROFILES: {
         html: true
       }
     }) : quill.root.innerHTML;
-    if (onChange) {
-      onChange(html, delta, source, quill);
-    }
+    const length = quill.getLength() - 1;
+    onChange?.(html, length);
   }, [onChange, quill]);
-  useLayoutEffect(() => {
-    onTextChangeRef.current = onChange;
-  });
   useEffect(() => {
     if (isMounted.current) return;
     quillRef.current = new Quill(`#editor${editorId.current}`, {
@@ -189,16 +158,6 @@ const QuillEditor = ({
     }, (range, context) => {
       return handleBackspaceWithIndentetList(range, context, quillRef.current);
     });
-    // Tabbing within a list should indent the list item
-    quillRef.current.keyboard.addBinding({
-      key: 'Tab'
-    }, {
-      format: {
-        list: true
-      }
-    }, (range, context) => {
-      return handleAutoidentList(range, context, quillRef.current);
-    });
     quillRef.current.root.style.touchAction = 'pan-y';
     quillRef.current.root.style.overflowY = 'auto';
     quillRef.current.disable();
@@ -224,7 +183,6 @@ const QuillEditor = ({
       });
       quillRef.current.setContents(formattedDelta);
     }
-    quillRef.current.on(Quill.events.TEXT_CHANGE, (...args) => handleChange(...args, quillRef.current));
     if (onFocus || onBlur) {
       quillRef.current.on(Quill.events.SELECTION_CHANGE, (range, oldRange, source) => {
         const hasFocus = range && !oldRange;
@@ -239,6 +197,10 @@ const QuillEditor = ({
       quillRef.current = null;
     };
   }, [quillRef]);
+  useEffect(() => {
+    if (!quill) return;
+    quill.on(Quill.events.TEXT_CHANGE, () => handleChange(quill));
+  }, [quill, handleChange]);
   useEffect(() => {
     if (!quill) return;
     quill.clipboard.addMatcher(Node.ELEMENT_NODE, (node, delta) => {

package/lib/core/QuillEditor/models.d.ts

@@ -60,7 +60,7 @@ interface QuillEditorProps {
     resize?: boolean | 'both';
     formats?: string[];
     bounds?: string | HTMLElement;
-    onChange?: (content: string, delta: any, source: string, editor: any) => void;
+    onChange?: (content: string, length: number) => void;
     onFocus?: (html: string) => void;
     onBlur?: (html: string) => void;
     invalidMessage?: string;

package/lib/core/QuillEditor/models.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"models.d.ts","sourceRoot":"","sources":["../../../src/packages/core/QuillEditor/models.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"models.d.ts","sourceRoot":"","sources":["../../../src/packages/core/QuillEditor/models.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,UAAU,kBAAkB;IAE1B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,MAAM,CAAC,EAAE,OAAO,CAAA;IAGhB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IAGtB,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IAGhE,IAAI,CAAC,EAAE;QACL,OAAO,CAAC,EAAE,OAAO,CAAA;QACjB,MAAM,CAAC,EAAE,OAAO,CAAA;KACjB,CAAA;IAGD,MAAM,CAAC,EAAE;QACP,GAAG,CAAC,EAAE,OAAO,CAAA;QACb,KAAK,CAAC,EAAE,OAAO,CAAA;KAChB,CAAA;IAGD,MAAM,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,OAAO,CAAA;QACd,IAAI,CAAC,EAAE,OAAO,CAAA;KACf,CAAA;IAGD,SAAS,CAAC,EAAE;QACV,GAAG,CAAC,EAAE,OAAO,CAAA;KACd,CAAA;IAGD,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,GAAG;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IAGrD,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,CAAA;IAC1B,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,CAAA;IAG/B,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,CAAA;IAGzB,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,GAAG;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IAGtD,KAAK,CAAC,EAAE,OAAO,CAAA;IAGf,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,UAAU,gBAAgB;IACxB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAA;IAC3C,aAAa,CAAC,EAAE;QACd,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAA;KAC/B,CAAA;IACD,MAAM,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IACzB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,WAAW,CAAA;IAC7B,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACpD,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAChC,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,UAAU,cAAc;IACtB,QAAQ,EAAE,MAAM,GAAG,CAAA;IACnB,SAAS,EAAE,MAAM,cAAc,GAAG,IAAI,CAAA;CACvC;AAED,UAAU,QAAQ;IAChB,OAAO,EAAE,KAAK,GAAG,IAAI,CAAA;CACtB;AAED,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbl-digital/snorre",
-  "version": "4.2.14",
+  "version": "4.2.17",
   "description": "Design library for BBL Digital",
   "license": "MIT",
   "main": "./lib/index.js",