@contentful/field-editor-rich-text 3.2.0 → 3.2.1

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.2.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rich-text@3.2.0...@contentful/field-editor-rich-text@3.2.1) (2022-11-18)
+
+### Bug Fixes
+
+- explicitly setting sub super styles [TOL-30] ([#1281](https://github.com/contentful/field-editors/issues/1281)) ([6044115](https://github.com/contentful/field-editors/commit/6044115c89d68ac37d3a36d239bd45e5503cea7b))
+
 # [3.2.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rich-text@3.1.12...@contentful/field-editor-rich-text@3.2.0) (2022-11-16)
 
 ### Features

package/dist/field-editor-rich-text.cjs.development.js

@@ -5313,13 +5313,21 @@ var createUnderlinePlugin = function createUnderlinePlugin() {
   });
 };
 
+var styles$f = {
+  superscript: /*#__PURE__*/emotion.css({
+    verticalAlign: 'super',
+    fontSize: 'smaller'
+  })
+};
 var ToolbarSuperscriptButton = /*#__PURE__*/createMarkToolbarButton({
   title: 'Superscript',
   mark: Contentful.MARKS.SUPERSCRIPT,
   icon: /*#__PURE__*/React.createElement(f36Icons.SuperscriptIcon, null)
 });
 function Superscript(props) {
-  return /*#__PURE__*/React.createElement("sup", _extends({}, props.attributes), props.children);
+  return /*#__PURE__*/React.createElement("sup", _extends({}, props.attributes, {
+    className: styles$f.superscript
+  }), props.children);
 }
 var createSuperscriptPlugin = function createSuperscriptPlugin() {
   return plateBasicMarks.createSuperscriptPlugin({
@@ -5336,6 +5344,12 @@ var createSuperscriptPlugin = function createSuperscriptPlugin() {
   });
 };
 
+var styles$g = {
+  subscript: /*#__PURE__*/emotion.css({
+    verticalAlign: 'sub',
+    fontSize: 'smaller'
+  })
+};
 var ToolbarSubscriptButton = /*#__PURE__*/createMarkToolbarButton({
   title: 'Subscript',
   mark: Contentful.MARKS.SUBSCRIPT,
@@ -5344,7 +5358,9 @@ var ToolbarSubscriptButton = /*#__PURE__*/createMarkToolbarButton({
   })
 });
 function Subscript(props) {
-  return /*#__PURE__*/React.createElement("sub", _extends({}, props.attributes), props.children);
+  return /*#__PURE__*/React.createElement("sub", _extends({}, props.attributes, {
+    className: styles$g.subscript
+  }), props.children);
 }
 var createSubscriptPlugin = function createSubscriptPlugin() {
   return plateBasicMarks.createSubscriptPlugin({
@@ -5572,10 +5588,10 @@ var createNormalizerPlugin = function createNormalizerPlugin() {
 };
 
 var _templateObject$6, _styles$1;
-var styles$f = (_styles$1 = {}, _styles$1[Contentful.BLOCKS.PARAGRAPH] = /*#__PURE__*/emotion.css(_templateObject$6 || (_templateObject$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n    line-height: ", ";\n    margin-bottom: 1.5em;\n  "])), tokens.lineHeightDefault), _styles$1);
+var styles$h = (_styles$1 = {}, _styles$1[Contentful.BLOCKS.PARAGRAPH] = /*#__PURE__*/emotion.css(_templateObject$6 || (_templateObject$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n    line-height: ", ";\n    margin-bottom: 1.5em;\n  "])), tokens.lineHeightDefault), _styles$1);
 function Paragraph(props) {
   return /*#__PURE__*/React.createElement("div", _extends({}, props.attributes, {
-    className: styles$f[Contentful.BLOCKS.PARAGRAPH]
+    className: styles$h[Contentful.BLOCKS.PARAGRAPH]
   }), props.children);
 }
 
@@ -6217,7 +6233,7 @@ var isTable = function isTable(node) {
   return slate.Element.isElement(node) && node.type === Contentful.BLOCKS.TABLE;
 };
 
-var styles$g = {
+var styles$i = {
   topRight: /*#__PURE__*/emotion.css({
     position: 'absolute',
     top: '6px',
@@ -6306,7 +6322,7 @@ var TableActions = function TableActions() {
     size: "small",
     variant: "transparent",
     tabIndex: -1,
-    className: styles$g.topRight,
+    className: styles$i.topRight,
     icon: /*#__PURE__*/React__default.createElement(f36Icons.ChevronDownIcon, null),
     "aria-label": "Open table menu",
     testId: "cf-table-actions-button"
@@ -7236,7 +7252,7 @@ var normalizeEditorValue = function normalizeEditorValue(value, options) {
 };
 
 var STYLE_EDITOR_BORDER = "1px solid " + tokens.gray400;
-var styles$h = {
+var styles$j = {
   root: /*#__PURE__*/emotion.css({
     position: 'relative'
   }),
@@ -7353,7 +7369,7 @@ var EmbedEntityWidget = function EmbedEntityWidget(_ref) {
   }, actions) : null;
 };
 
-var styles$i = {
+var styles$k = {
   toolbar: /*#__PURE__*/emotion.css({
     border: "1px solid " + tokens.gray400,
     backgroundColor: tokens.gray100,
@@ -7398,14 +7414,14 @@ var Toolbar = function Toolbar(_ref) {
   var shouldDisableTables = isDisabled || !canInsertBlocks || isListSelected || isBlockquoteSelected;
   return /*#__PURE__*/React__default.createElement(f36Components.Flex, {
     testId: "toolbar",
-    className: styles$i.toolbar,
+    className: styles$k.toolbar,
     alignItems: "center"
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: styles$i.formattingOptionsWrapper
+    className: styles$k.formattingOptionsWrapper
   }, /*#__PURE__*/React__default.createElement(ToolbarHeadingButton, {
     isDisabled: isDisabled || !canInsertBlocks
   }), validationInfo.isAnyMarkEnabled && /*#__PURE__*/React__default.createElement("span", {
-    className: styles$i.divider
+    className: styles$k.divider
   }), isMarkEnabled(sdk.field, Contentful.MARKS.BOLD) && /*#__PURE__*/React__default.createElement(ToolbarBoldButton, {
     isDisabled: isDisabled
   }), isMarkEnabled(sdk.field, Contentful.MARKS.ITALIC) && /*#__PURE__*/React__default.createElement(ToolbarItalicButton, {
@@ -7419,11 +7435,11 @@ var Toolbar = function Toolbar(_ref) {
   }), isMarkEnabled(sdk.field, Contentful.MARKS.CODE) && /*#__PURE__*/React__default.createElement(ToolbarCodeButton, {
     isDisabled: isDisabled
   }), validationInfo.isAnyHyperlinkEnabled && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("span", {
-    className: styles$i.divider
+    className: styles$k.divider
   }), /*#__PURE__*/React__default.createElement(ToolbarHyperlinkButton, {
     isDisabled: isDisabled
   })), validationInfo.isAnyBlockFormattingEnabled && /*#__PURE__*/React__default.createElement("span", {
-    className: styles$i.divider
+    className: styles$k.divider
   }), /*#__PURE__*/React__default.createElement(ToolbarListButton, {
     isDisabled: isDisabled || !canInsertBlocks
   }), isNodeTypeEnabled(sdk.field, Contentful.BLOCKS.QUOTE) && /*#__PURE__*/React__default.createElement(ToolbarQuoteButton, {
@@ -7433,7 +7449,7 @@ var Toolbar = function Toolbar(_ref) {
   }), isNodeTypeEnabled(sdk.field, Contentful.BLOCKS.TABLE) && /*#__PURE__*/React__default.createElement(ToolbarTableButton, {
     isDisabled: shouldDisableTables
   })), /*#__PURE__*/React__default.createElement("div", {
-    className: styles$i.embedActionsWrapper
+    className: styles$k.embedActionsWrapper
   }, /*#__PURE__*/React__default.createElement(EmbedEntityWidget, {
     isDisabled: isDisabled,
     canInsertBlocks: canInsertBlocks
@@ -7458,7 +7474,7 @@ function getValidationInfo(field) {
 }
 
 var _templateObject$b;
-var styles$j = {
+var styles$l = {
   nativeSticky: /*#__PURE__*/emotion.css(_templateObject$b || (_templateObject$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n    position: -webkit-sticky;\n    position: sticky;\n    top: -1px;\n    z-index: 2;\n  "])))
 };
 
@@ -7466,7 +7482,7 @@ var StickyToolbarWrapper = function StickyToolbarWrapper(_ref) {
   var isDisabled = _ref.isDisabled,
       children = _ref.children;
   return /*#__PURE__*/React__default.createElement("div", {
-    className: isDisabled ? '' : styles$j.nativeSticky
+    className: isDisabled ? '' : styles$l.nativeSticky
   }, children);
 };
 
@@ -7579,9 +7595,9 @@ var ConnectedRichTextEditor = function ConnectedRichTextEditor(props) {
     setPendingExternalUpdate(true);
     setEditorContent(editor, documentToEditorValue(props.value));
   }, [props.value, id]);
-  var classNames = emotion.cx(styles$h.editor, props.minHeight !== undefined ? emotion.css({
+  var classNames = emotion.cx(styles$j.editor, props.minHeight !== undefined ? emotion.css({
     minHeight: props.minHeight
-  }) : undefined, props.isDisabled ? styles$h.disabled : styles$h.enabled, props.isToolbarHidden && styles$h.hiddenToolbar);
+  }) : undefined, props.isDisabled ? styles$j.disabled : styles$j.enabled, props.isToolbarHidden && styles$j.hiddenToolbar);
   React.useEffect(function () {
     if (!isFirstRender) {
       return;
@@ -7597,7 +7613,7 @@ var ConnectedRichTextEditor = function ConnectedRichTextEditor(props) {
   }, /*#__PURE__*/React__default.createElement(ContentfulEditorIdProvider, {
     value: id
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: styles$h.root,
+    className: styles$j.root,
     "data-test-id": "rich-text-editor"
   }, /*#__PURE__*/React__default.createElement(plateCore.Plate, {
     id: id,