re-enable tooltip on forms and upgrade [email protected]

otoroshi/javascript/package.json

@@ -58,7 +58,7 @@
     "react-select": "^5.7.5",
     "react-sparklines": "1.7.0",
     "react-table": "6.11.4",
-    "react-tooltip": "^4.5.1",
+    "react-tooltip": "5.28.0",
     "recharts": "1.8.5",
     "set-value": "4.0.1",
     "showdown": "1.9.1",

otoroshi/javascript/src/components/nginputs/inputs.js

@@ -5,9 +5,11 @@ import { Location } from '../Location';
 import { ObjectInput } from '../inputs';
 import isEqual from 'lodash/isEqual';
 import { Forms } from '../../forms';
-import ReactTooltip from 'react-tooltip';
 import { ReactSelectOverride } from '../inputs/ReactSelectOverride';
 
+import { Tooltip as ReactTooltip } from 'react-tooltip'
+import { v4 as uuid } from 'uuid';
+
 const CodeInput = React.lazy(() => Promise.resolve(require('../inputs/CodeInput')));
 
 const ReadOnlyField = ({ value, pre }) => {
@@ -255,6 +257,8 @@ export function LabelAndInput(_props) {
 
   const style = _props.style || props.style || _props.rawSchema?.props?.margin || {};
 
+  const helpId = uuid()
+
   return (
     <div className={`row ${margin}`} style={style}>
       <label
@@ -264,10 +268,10 @@ export function LabelAndInput(_props) {
         }}
       >
         {label.replace(/_/g, ' ')}{' '}
-        {_props.help && (
+        {help && (
           <span>
-            <i className="far fa-question-circle" data-tip={_props.help} />
-            <ReactTooltip />
+            <i className="far fa-question-circle" data-tooltip-id={helpId} data-tooltip-content={help} />
+            <ReactTooltip id={helpId} />
           </span>
         )}
       </label>

otoroshi/javascript/src/style/components/_popup.scss

@@ -11,8 +11,10 @@
   padding-left: 10px;
   border-bottom-left-radius: 4px;
   justify-content: space-around;
-  a,a:hover{
-    color : #856404;
+
+  a,
+  a:hover {
+    color: #856404;
   }
 }
 
@@ -25,3 +27,7 @@
   right: 0px;
   z-index: 99999;
 }
+
+.react-tooltip {
+  z-index: 99999;
+}

otoroshi/javascript/yarn.lock

@@ -1953,6 +1953,13 @@
   dependencies:
     "@floating-ui/utils" "^0.1.3"
 
+"@floating-ui/core@^1.6.0":
+  version "1.6.8"
+  resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.6.8.tgz#aa43561be075815879305965020f492cdb43da12"
+  integrity sha512-7XJ9cPU+yI2QeLS+FCSlqNFZJq8arvswefkZrYI1yQBbftw6FyrZOxYSh+9S7z7TpeWlRt9zJ5IhM1WIL334jA==
+  dependencies:
+    "@floating-ui/utils" "^0.2.8"
+
 "@floating-ui/dom@^1.0.1":
   version "1.5.3"
   resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.5.3.tgz#54e50efcb432c06c23cd33de2b575102005436fa"
@@ -1961,11 +1968,24 @@
     "@floating-ui/core" "^1.4.2"
     "@floating-ui/utils" "^0.1.3"
 
+"@floating-ui/dom@^1.6.1":
+  version "1.6.12"
+  resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.6.12.tgz#6333dcb5a8ead3b2bf82f33d6bc410e95f54e556"
+  integrity sha512-NP83c0HjokcGVEMeoStg317VD9W7eDlGK7457dMBANbKA6GJZdc7rjujdgqzTaz93jkGgc5P/jeWbaCHnMNc+w==
+  dependencies:
+    "@floating-ui/core" "^1.6.0"
+    "@floating-ui/utils" "^0.2.8"
+
 "@floating-ui/utils@^0.1.3":
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.1.4.tgz#19654d1026cc410975d46445180e70a5089b3e7d"
   integrity sha512-qprfWkn82Iw821mcKofJ5Pk9wgioHicxcQMxx+5zt5GSKoqdWvgG5AxVmpmUUjzTLPVSH5auBrhI93Deayn/DA==
 
+"@floating-ui/utils@^0.2.8":
+  version "0.2.8"
+  resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.8.tgz#21a907684723bbbaa5f0974cf7730bd797eb8e62"
+  integrity sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==
+
 "@fortawesome/fontawesome-free@^5.15.3":
   version "5.15.4"
   resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free/-/fontawesome-free-5.15.4.tgz#ecda5712b61ac852c760d8b3c79c96adca5554e5"
@@ -4639,6 +4659,11 @@ [email protected], classnames@^2.2.1, classnames@^2.2.3, classnames@^2.2.5, classna
   resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
   integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
 
+classnames@^2.3.0:
+  version "2.5.1"
+  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.5.1.tgz#ba774c614be0f016da105c858e7159eae8e7687b"
+  integrity sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==
+
 clean-css@^5.2.2:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-5.3.0.tgz#ad3d8238d5f3549e83d5f87205189494bc7cbb59"
@@ -11497,13 +11522,13 @@ [email protected]:
     prop-types "^15.7.2"
     uuid "^7.0.3"
 
-react-tooltip@^4.5.1:
-  version "4.5.1"
-  resolved "https://registry.yarnpkg.com/react-tooltip/-/react-tooltip-4.5.1.tgz#77eccccdf16adec804132e558ec20ca5783b866a"
-  integrity sha512-Zo+CSFUGXar1uV+bgXFFDe7VeS2iByeIp5rTgTcc2HqtuOS5D76QapejNNfx320MCY91TlhTQat36KGFTqgcvw==
+react-tooltip@5.28.0:
+  version "5.28.0"
+  resolved "https://registry.yarnpkg.com/react-tooltip/-/react-tooltip-5.28.0.tgz#c7b5343ab2d740a428494a3d8315515af1f26f46"
+  integrity sha512-R5cO3JPPXk6FRbBHMO0rI9nkUG/JKfalBSQfZedZYzmqaZQgq7GLzF8vcCWx6IhUCKg0yPqJhXIzmIO5ff15xg==
   dependencies:
-    prop-types "^15.8.1"
-    uuid "^7.0.3"
+    "@floating-ui/dom" "^1.6.1"
+    classnames "^2.3.0"
 
 react-transition-group@^2.2.1, react-transition-group@^2.5.0:
   version "2.9.0"