@oliasoft-open-source/react-ui-library 3.9.16 → 3.9.18-beta-1

package/dist/global.css

@@ -20309,11 +20309,16 @@ button:active .remirror-menu-pane-shortcut,
   margin: 0;
   /* margin-bottom: var(--rmr-space-2); */
 }
-._richTextToolbar_l8wda_1 {
-  padding: 8px;
+._richTextToolbar_is6av_1 {
+  padding: 0 8px;
   display: flex;
   gap: 4px;
 }
+._richTextToolbarContainer_is6av_6 {
+  display: flex;
+  justify-content: space-between;
+  padding: 8px 0;
+}
 /*
  This file has shared variables that are re-used in other LESS files/modules
  Only use simple variables in this file

package/dist/index.js

@@ -11923,7 +11923,10 @@ const menuShape = propTypes$1.exports.shape({
   trigger: propTypes$1.exports.oneOf(["Text", "Button", "DropDownButton", "Component"]),
   colored: propTypes$1.exports.oneOfType([propTypes$1.exports.bool, propTypes$1.exports.string]),
   small: propTypes$1.exports.bool,
-  label: propTypes$1.exports.string,
+  label: propTypes$1.exports.oneOfType([
+    propTypes$1.exports.string,
+    propTypes$1.exports.node
+  ]),
   component: propTypes$1.exports.node,
   sections: propTypes$1.exports.oneOfType([
     propTypes$1.exports.arrayOf(menuSectionShape),
@@ -56312,11 +56315,13 @@ function TbListNumbers(props) {
 function TbList(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "strokeWidth": "2", "stroke": "currentColor", "fill": "none", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "stroke": "none", "d": "M0 0h24v24H0z", "fill": "none" } }, { "tag": "path", "attr": { "d": "M9 6l11 0" } }, { "tag": "path", "attr": { "d": "M9 12l11 0" } }, { "tag": "path", "attr": { "d": "M9 18l11 0" } }, { "tag": "path", "attr": { "d": "M5 6l0 .01" } }, { "tag": "path", "attr": { "d": "M5 12l0 .01" } }, { "tag": "path", "attr": { "d": "M5 18l0 .01" } }] })(props);
 }
-const richTextToolbar = "_richTextToolbar_l8wda_1";
+const richTextToolbar = "_richTextToolbar_is6av_1";
+const richTextToolbarContainer = "_richTextToolbarContainer_is6av_6";
 const styles$f = {
-  richTextToolbar
+  richTextToolbar,
+  richTextToolbarContainer
 };
-const RichTextToolbar = ({ disabled: disabled2 }) => {
+const RichTextToolbar = ({ disabled: disabled2, toolbarComponent }) => {
   const {
     focus: focus2,
     toggleBold,
@@ -56353,28 +56358,36 @@ const RichTextToolbar = ({ disabled: disabled2 }) => {
       active: active2.orderedList()
     }
   ];
-  return /* @__PURE__ */ jsxRuntime.exports.jsx("div", {
-    className: styles$f.richTextToolbar,
-    children: items.map((item2, index2) => /* @__PURE__ */ jsxRuntime.exports.jsx(Button$1, {
-      small: true,
-      round: true,
-      basic: true,
-      icon: item2.icon,
-      colored: "muted",
-      onClick: () => {
-        item2.onClick();
-        focus2();
-      },
-      active: item2.active,
-      disabled: disabled2
-    }, index2))
+  return /* @__PURE__ */ jsxRuntime.exports.jsxs("div", {
+    className: styles$f.richTextToolbarContainer,
+    children: [
+      /* @__PURE__ */ jsxRuntime.exports.jsx("div", {
+        className: styles$f.richTextToolbar,
+        children: items.map((item2, index2) => /* @__PURE__ */ jsxRuntime.exports.jsx(Button$1, {
+          small: true,
+          round: true,
+          basic: true,
+          icon: item2.icon,
+          colored: "muted",
+          onClick: () => {
+            item2.onClick();
+            focus2();
+          },
+          active: item2.active,
+          disabled: disabled2
+        }, index2))
+      }),
+      toolbarComponent
+    ]
   });
 };
 RichTextToolbar.defaultProps = {
-  disabled: false
+  disabled: false,
+  toolbarComponent: null
 };
 RichTextToolbar.propTypes = {
-  disabled: propTypes$1.exports.bool
+  disabled: propTypes$1.exports.bool,
+  toolbarComponent: propTypes$1.exports.node
 };
 const inputInTable$4 = "_inputInTable_12bel_333";
 const inputHover$4 = "_inputHover_12bel_339";
@@ -56395,7 +56408,7 @@ const styles$e = {
   richTextInput
 };
 const RichTextInput = forwardRef(
-  ({ placeholder: placeholder3, onChange, value, disabled: disabledProp }, ref2) => {
+  ({ placeholder: placeholder3, onChange, value, disabled: disabledProp, toolbarComponent }, ref2) => {
     const disabledContext = useContext(DisabledContext);
     const disabled2 = disabledProp || disabledContext;
     const { manager, state, setState, getContext: getContext2 } = useRemirror({
@@ -56428,7 +56441,8 @@ const RichTextInput = forwardRef(
         editable: !disabled2,
         children: [
           /* @__PURE__ */ jsxRuntime.exports.jsx(RichTextToolbar, {
-            disabled: disabled2
+            disabled: disabled2,
+            toolbarComponent
           }),
           /* @__PURE__ */ jsxRuntime.exports.jsx(EditorComponent, {})
         ]
@@ -56440,13 +56454,15 @@ RichTextInput.defaultProps = {
   disabled: false,
   onChange: null,
   placeholder: null,
-  value: null
+  value: null,
+  toolbarComponent: null
 };
 RichTextInput.propTypes = {
   disabled: propTypes$1.exports.bool,
   onChange: propTypes$1.exports.func,
   placeholder: propTypes$1.exports.string,
-  value: propTypes$1.exports.string
+  value: propTypes$1.exports.string,
+  toolbarComponent: propTypes$1.exports.node
 };
 const row = "_row_19xw9_333";
 const styles$d = {