@pushwoosh/dumb-components 1.0.64 → 1.0.66

package/RichMessageEditor/RichMessageEditor.js

@@ -28,8 +28,9 @@ export const RichMessageEditor = ({
     floatingStyles,
     update
   } = useFloating({
+    strategy: 'fixed',
     middleware: [offset(8), autoPlacement({
-      allowedPlacements: ['left', 'left-start', 'left-end', 'right', 'right-start', 'right-end']
+      allowedPlacements: ['right', 'right-start', 'right-end', 'left', 'left-start', 'left-end']
     })]
   });
   const onSelectionChange = selection => {
@@ -109,6 +110,9 @@ export const RichMessageEditor = ({
         if (selection) {
           onSelectionChange(selection);
         }
+      },
+      onDelete: () => {
+        setShowDrop(undefined);
       }
     }), showDrop && React.createElement("div", {
       style: floatingStyles,

package/RichMessageEditor/slate/DynamicContentElement.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare function renderElement(props: any): React.JSX.Element;
+export declare function renderElement(props: any, onDelete: () => void): React.JSX.Element;

package/RichMessageEditor/slate/DynamicContentElement.js

@@ -6,6 +6,7 @@ import { Chip } from '../../Chip';
 const DynamicContentElementComponent = ({
   attributes,
   element,
+  onDelete,
   children
 }) => {
   const editor = useSlateStatic();
@@ -38,6 +39,7 @@ const DynamicContentElementComponent = ({
           focus: point
         });
       }
+      onDelete();
     }
   }, React.createElement("span", null, tagName || 'Not set'), children);
 };
@@ -45,12 +47,14 @@ const Element = props => {
   const {
     attributes,
     children,
-    element
+    element,
+    onDelete
   } = props;
   switch (element.type) {
     case 'dc':
       return React.createElement(DynamicContentElementComponent, {
-        ...props
+        ...props,
+        onDelete: onDelete
       });
     default:
       return React.createElement("p", {
@@ -58,8 +62,9 @@ const Element = props => {
       }, children);
   }
 };
-export function renderElement(props) {
+export function renderElement(props, onDelete) {
   return React.createElement(Element, {
-    ...props
+    ...props,
+    onDelete: onDelete
   });
 }

package/RichMessageEditor/slate/SlateEditor.d.ts

@@ -13,6 +13,7 @@ export declare const SlateEditor: FC<SlateEditor>;
 type SlateEditableProps = {
     minHeight?: string;
     onFocus?: () => void;
+    onDelete: () => void;
 };
 export declare const SlateEditable: FC<SlateEditableProps>;
 export {};

package/RichMessageEditor/slate/SlateEditor.js

@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import { Slate } from 'slate-react';
+import { usePersistentFunction } from '@pushwoosh/kit-helpers';
 import { renderElement } from './DynamicContentElement';
 import { content2string, string2content } from './helpers';
 import { EditableStyled } from './SlateEditor.styled';
@@ -23,11 +24,15 @@ export const SlateEditor = ({
 };
 export const SlateEditable = ({
   minHeight,
-  onFocus
+  onFocus,
+  onDelete
 }) => {
+  const renderElementPersistent = usePersistentFunction(props => {
+    return renderElement(props, onDelete);
+  });
   return React.createElement(EditableStyled, {
     "$minHeight": minHeight,
-    renderElement: renderElement,
+    renderElement: renderElementPersistent,
     onFocus: onFocus
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/dumb-components",
-  "version": "1.0.64",
+  "version": "1.0.66",
   "description": "React components to build Pushwoosh products",
   "main": "index.js",
   "module": "index.js",