@oliasoft-open-source/react-ui-library 3.9.4 → 3.9.6

package/dist/global.css

@@ -24618,22 +24618,22 @@ html[data-theme='dark'] {
 /*
   Z-INDEX
 */
-._clickableRow_137ob_333 {
+._clickableRow_17l7m_333 {
   cursor: pointer;
 }
-._hoverableRow_137ob_336:hover,
-._clickableRow_137ob_333:hover {
-  background-color: var(--color-background-listitem-active) !important;
+._hoverableRow_17l7m_336:not(._rowActive_17l7m_336):hover,
+._clickableRow_17l7m_333:not(._rowActive_17l7m_336):hover {
+  background-color: var(--color-background-listitem-hover) !important;
 }
-._expandableRow_137ob_340._flush_137ob_340 {
+._expandableRow_17l7m_340._flush_17l7m_340 {
   padding: 0 !important;
   height: auto !important;
 }
-._rowActive_137ob_344 {
+._rowActive_17l7m_336 {
   position: relative;
   background-color: var(--color-background-listitem-active) !important;
 }
-._rowActive_137ob_344:after {
+._rowActive_17l7m_336:after {
   content: '';
   position: absolute;
   left: 0;
@@ -24645,24 +24645,24 @@ html[data-theme='dark'] {
   transition: background 0.3s;
   background: var(--color-background-primary);
 }
-._dragIconCell_137ob_360 {
+._dragIconCell_17l7m_360 {
   width: 36px;
   position: relative;
 }
-._dragIcon_137ob_360 {
+._dragIcon_17l7m_360 {
   display: flex;
   align-items: center;
   justify-content: center;
   position: absolute;
   inset: 0;
 }
-._dragIcon_137ob_360 path {
+._dragIcon_17l7m_360 path {
   stroke: var(--color-text-faint);
 }
-._dragIcon_137ob_360:hover path {
+._dragIcon_17l7m_360:hover path {
   stroke: var(--color-text-primary-hover);
 }
-._dragIcon_137ob_360:active path {
+._dragIcon_17l7m_360:active path {
   stroke: var(--color-text-primary-active);
 }
 /*

package/dist/index.js

@@ -6,7 +6,7 @@ var __publicField = (obj, key2, value) => {
 };
 import { jsx, Fragment as Fragment$1, jsxs } from "react/jsx-runtime";
 import * as React$4 from "react";
-import React__default, { useState, useRef, useEffect, useCallback as useCallback$1, createElement, forwardRef, useContext, useMemo as useMemo$1, useLayoutEffect as useLayoutEffect$1, createContext, isValidElement, useReducer, useDebugValue, Fragment as Fragment$2, Component as Component$1, PureComponent, memo, cloneElement as cloneElement$1, useImperativeHandle } from "react";
+import React__default, { useState, useRef, useEffect, useCallback as useCallback$1, createElement, forwardRef, useContext, useMemo as useMemo$1, useLayoutEffect as useLayoutEffect$1, createContext, isValidElement, useReducer, useDebugValue, Fragment as Fragment$2, Component as Component$1, PureComponent, useImperativeHandle, memo, cloneElement as cloneElement$1 } from "react";
 import * as PropTypes from "prop-types";
 import PropTypes__default from "prop-types";
 import ReactDOM, { createPortal, unstable_batchedUpdates, render } from "react-dom";
@@ -54768,49 +54768,48 @@ const styles$e = {
   hideScrollbars: hideScrollbars$4,
   richTextInput
 };
-const RichTextInput = ({
-  placeholder: placeholder3,
-  onChange,
-  value,
-  disabled: disabledProp
-}) => {
-  const disabledContext = useContext(DisabledContext);
-  const disabled2 = disabledProp || disabledContext;
-  const { manager, state } = useRemirror({
-    extensions: () => [
-      new BoldExtension(),
-      new BulletListExtension(),
-      new CodeExtension(),
-      new ItalicExtension(),
-      new MarkdownExtension(),
-      new OrderedListExtension(),
-      new PlaceholderExtension({ placeholder: placeholder3 })
-    ],
-    content: value,
-    selection: "start",
-    stringHandler: "markdown"
-  });
-  const handleChange = ({ helpers }) => {
-    const markdown = helpers.getMarkdown();
-    onChange(markdown);
-  };
-  return /* @__PURE__ */ jsx("div", {
-    className: styles$e.richTextInput,
-    children: /* @__PURE__ */ jsxs(Remirror, {
-      manager,
-      initialContent: state,
-      placeholder: placeholder3,
-      onChange: handleChange,
-      editable: !disabled2,
-      children: [
-        /* @__PURE__ */ jsx(RichTextToolbar, {
-          disabled: disabled2
-        }),
-        /* @__PURE__ */ jsx(EditorComponent, {})
-      ]
-    })
-  });
-};
+const RichTextInput = forwardRef(
+  ({ placeholder: placeholder3, onChange, value, disabled: disabledProp }, ref2) => {
+    const disabledContext = useContext(DisabledContext);
+    const disabled2 = disabledProp || disabledContext;
+    const { manager, state, setState, getContext: getContext2 } = useRemirror({
+      extensions: () => [
+        new BoldExtension(),
+        new BulletListExtension(),
+        new CodeExtension(),
+        new ItalicExtension(),
+        new MarkdownExtension(),
+        new OrderedListExtension(),
+        new PlaceholderExtension({ placeholder: placeholder3 })
+      ],
+      content: value,
+      selection: "start",
+      stringHandler: "markdown"
+    });
+    useImperativeHandle(ref2, () => getContext2(), [getContext2]);
+    const handleChange = ({ helpers, state: state2 }) => {
+      const markdown = helpers.getMarkdown();
+      setState(state2);
+      onChange(markdown);
+    };
+    return /* @__PURE__ */ jsx("div", {
+      className: styles$e.richTextInput,
+      children: /* @__PURE__ */ jsxs(Remirror, {
+        manager,
+        state,
+        placeholder: placeholder3,
+        onChange: handleChange,
+        editable: !disabled2,
+        children: [
+          /* @__PURE__ */ jsx(RichTextToolbar, {
+            disabled: disabled2
+          }),
+          /* @__PURE__ */ jsx(EditorComponent, {})
+        ]
+      })
+    });
+  }
+);
 RichTextInput.defaultProps = {
   disabled: false,
   onChange: null,
@@ -58421,19 +58420,19 @@ Cell.propTypes = {
   cell: cellShape,
   testId: PropTypes__default.string
 };
-const clickableRow = "_clickableRow_137ob_333";
-const hoverableRow = "_hoverableRow_137ob_336";
-const expandableRow = "_expandableRow_137ob_340";
-const flush2 = "_flush_137ob_340";
-const rowActive = "_rowActive_137ob_344";
-const dragIconCell = "_dragIconCell_137ob_360";
-const dragIcon = "_dragIcon_137ob_360";
+const clickableRow = "_clickableRow_17l7m_333";
+const hoverableRow = "_hoverableRow_17l7m_336";
+const rowActive = "_rowActive_17l7m_336";
+const expandableRow = "_expandableRow_17l7m_340";
+const flush2 = "_flush_17l7m_340";
+const dragIconCell = "_dragIconCell_17l7m_360";
+const dragIcon = "_dragIcon_17l7m_360";
 const styles$6 = {
   clickableRow,
   hoverableRow,
+  rowActive,
   expandableRow,
   flush: flush2,
-  rowActive,
   dragIconCell,
   dragIcon
 };