@conduction/components 2.1.15 → 2.1.16

package/README.md

@@ -4,6 +4,7 @@
 
 - **Version 2.1 (breaking changes from 2.0.x)**
 
+  - 2.1.16: Refactor ToolTip layoutClassName placement.
   - 2.1.15: Add InputDate component based on react-datepicker.
   - 2.1.14: Refactor checkbox to remove svg errors
   - 2.1.13: Refactor components to remove svg errors (e.g. shape-rendering => shapeRendering)

package/lib/components/toolTip/ToolTip.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
 import ReactTooltip from "react-tooltip";
 import * as styles from "./ToolTip.module.css";
 export const ToolTip = ({ children, layoutClassName, tooltip }) => {
-    return (_jsxs("div", { className: styles.wrapper, children: [_jsx("div", { "data-tip": tooltip, className: layoutClassName && layoutClassName, children: children }), _jsx(ReactTooltip, { place: "top", type: "dark", effect: "solid", className: styles.tooltip })] }));
+    return (_jsxs("div", { className: clsx(styles.wrapper, layoutClassName && layoutClassName), children: [_jsx("div", { "data-tip": tooltip, children: children }), _jsx(ReactTooltip, { place: "top", type: "dark", effect: "solid", className: styles.tooltip })] }));
 };
 export { ReactTooltip };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conduction/components",
-  "version": "2.1.15",
+  "version": "2.1.16",
   "description": "React (Gatsby) components used within the Conduction Skeleton Application (and its implementations)",
   "main": "lib/index.js",
   "scripts": {

package/src/components/toolTip/ToolTip.tsx

@@ -1,3 +1,4 @@
+import clsx from "clsx";
 import _ from "lodash";
 import * as React from "react";
 import ReactTooltip from "react-tooltip";
@@ -11,10 +12,8 @@ interface ToolTipProps {
 
 export const ToolTip: React.FC<ToolTipProps> = ({ children, layoutClassName, tooltip }) => {
   return (
-    <div className={styles.wrapper}>
-      <div data-tip={tooltip} className={layoutClassName && layoutClassName}>
-        {children}
-      </div>
+    <div className={clsx(styles.wrapper, layoutClassName && layoutClassName)}>
+      <div data-tip={tooltip}>{children}</div>
 
       <ReactTooltip place={"top"} type={"dark"} effect={"solid"} className={styles.tooltip} />
     </div>