orc-shared 1.5.0-dev.14 → 1.5.0-dev.16

package/dist/components/MaterialUI/DataDisplay/PredefinedElements/InformationItem.js

@@ -10,6 +10,7 @@ var _MultipleLinesText = _interopRequireDefault(require("../TooltippedElements/M
 var _textProps = _interopRequireDefault(require("../../textProps"));
 var _propertyValidator = require("../../../../utils/propertyValidator");
 var _sharedMessages = _interopRequireDefault(require("../../../../sharedMessages"));
+var _classnames = _interopRequireDefault(require("classnames"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 (function () {
   var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;
@@ -81,7 +82,9 @@ var InformationItemChildren = function InformationItemChildren(_ref) {
     children = _ref.children,
     showNotAvailable = _ref.showNotAvailable,
     _ref$isMaxLineCountEn = _ref.isMaxLineCountEnabled,
-    isMaxLineCountEnabled = _ref$isMaxLineCountEn === void 0 ? true : _ref$isMaxLineCountEn;
+    isMaxLineCountEnabled = _ref$isMaxLineCountEn === void 0 ? true : _ref$isMaxLineCountEn,
+    tooltipClasses = _ref.tooltipClasses,
+    valueClasses = _ref.valueClasses;
   var _useIntl = (0, _reactIntl.useIntl)(),
     formatMessage = _useIntl.formatMessage;
   if ((0, _propertyValidator.isReactComponent)(children)) {
@@ -89,11 +92,12 @@ var InformationItemChildren = function InformationItemChildren(_ref) {
   }
   var multipleLinesTextProps = new _textProps.default();
   if (isMaxLineCountEnabled) multipleLinesTextProps.set(_textProps.default.propNames.lineCount, 2);
-  multipleLinesTextProps.set(_textProps.default.propNames.classes, classes.value);
+  multipleLinesTextProps.set(_textProps.default.propNames.classes, (0, _classnames.default)(classes.value, valueClasses));
   var value = children != null ? children : showNotAvailable ? formatMessage(_sharedMessages.default.notAvailable) : "";
   return /*#__PURE__*/_react.default.createElement(_MultipleLinesText.default, {
     textProps: multipleLinesTextProps,
-    children: value
+    children: value,
+    tooltipClasses: tooltipClasses
   });
 };
 __signature__(InformationItemChildren, "useIntl{{ formatMessage }}", function () {
@@ -134,7 +138,9 @@ var InformationItem = function InformationItem(_ref4) {
     showNotAvailable = _ref4$showNotAvailabl === void 0 ? false : _ref4$showNotAvailabl,
     _ref4$marginTop = _ref4.marginTop,
     marginTop = _ref4$marginTop === void 0 ? 0 : _ref4$marginTop,
-    isMaxLineCountEnabled = _ref4.isMaxLineCountEnabled;
+    isMaxLineCountEnabled = _ref4.isMaxLineCountEnabled,
+    tooltipClasses = _ref4.tooltipClasses,
+    valueClasses = _ref4.valueClasses;
   var classes = useStyles({
     required: required,
     error: error,
@@ -150,7 +156,9 @@ var InformationItem = function InformationItem(_ref4) {
     classes: classes,
     children: children,
     showNotAvailable: showNotAvailable,
-    isMaxLineCountEnabled: isMaxLineCountEnabled
+    isMaxLineCountEnabled: isMaxLineCountEnabled,
+    tooltipClasses: tooltipClasses,
+    valueClasses: valueClasses
   }));
 };
 __signature__(InformationItem, "useStyles{classes}", function () {

package/dist/components/MaterialUI/DataDisplay/TooltippedElements/MultipleLinesText.js

@@ -42,7 +42,8 @@ var useStyles = (0, _styles.makeStyles)(function (theme) {
 var MultipleLinesText = function MultipleLinesText(_ref) {
   var children = _ref.children,
     titleValue = _ref.titleValue,
-    textProps = _ref.textProps;
+    textProps = _ref.textProps,
+    tooltipClasses = _ref.tooltipClasses;
   var classes = useStyles();
   var _useState = (0, _react.useState)(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -73,7 +74,8 @@ var MultipleLinesText = function MultipleLinesText(_ref) {
     alwaysDisplay: isClamped,
     onClampStart: function onClampStart(event) {
       return clampHandler(event);
-    }
+    },
+    tooltipClasses: tooltipClasses
   });
 };
 __signature__(MultipleLinesText, "useStyles{classes}\nuseState{[isClamped, setIsClamped](false)}\nuseCallback{clampHandler}", function () {

package/dist/components/MaterialUI/hocs/withDeferredTooltip.js

@@ -5,7 +5,7 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _Tooltip = _interopRequireDefault(require("@material-ui/core/Tooltip"));
 var _propertyValidator = require("../../../utils/propertyValidator");
-var _excluded = ["titleValue", "alwaysDisplay"];
+var _excluded = ["titleValue", "alwaysDisplay", "tooltipClasses"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -39,6 +39,7 @@ var withDeferredTooltip = function withDeferredTooltip(Comp) {
   return __signature__(__signature__(function (_ref) {
     var titleValue = _ref.titleValue,
       alwaysDisplay = _ref.alwaysDisplay,
+      tooltipClasses = _ref.tooltipClasses,
       props = _objectWithoutProperties(_ref, _excluded);
     var _useState = (0, _react.useState)(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -62,6 +63,7 @@ var withDeferredTooltip = function withDeferredTooltip(Comp) {
     if (shouldBeTooltipped === false) return defaultComponent;
     return /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
       arrow: true,
+      classes: tooltipClasses != null ? tooltipClasses : null,
       title: titleValue,
       disableHoverListener: false,
       disableFocusListener: true,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "orc-shared",
-	"version": "1.5.0-dev.14",
+	"version": "1.5.0-dev.16",
 	"description": "Shared code for Orckestra applications",
 	"main": "./src/index.js",
 	"exports": {

package/src/components/MaterialUI/DataDisplay/PredefinedElements/InformationItem.js

@@ -7,6 +7,7 @@ import TextProps from "../../textProps";
 import { isReactComponent } from "../../../../utils/propertyValidator";
 import sharedMessages from "../../../../sharedMessages";
 import { useIntl } from "react-intl";
+import classNames from "classnames";
 
 const useStyles = makeStyles(theme => ({
 	title: {
@@ -53,7 +54,14 @@ const useStyles = makeStyles(theme => ({
 	},
 }));
 
-const InformationItemChildren = ({ classes, children, showNotAvailable, isMaxLineCountEnabled = true }) => {
+const InformationItemChildren = ({
+	classes,
+	children,
+	showNotAvailable,
+	isMaxLineCountEnabled = true,
+	tooltipClasses,
+	valueClasses,
+}) => {
 	const { formatMessage } = useIntl();
 
 	if (isReactComponent(children)) {
@@ -62,11 +70,11 @@ const InformationItemChildren = ({ classes, children, showNotAvailable, isMaxLin
 
 	const multipleLinesTextProps = new TextProps();
 	if (isMaxLineCountEnabled) multipleLinesTextProps.set(TextProps.propNames.lineCount, 2);
-	multipleLinesTextProps.set(TextProps.propNames.classes, classes.value);
+	multipleLinesTextProps.set(TextProps.propNames.classes, classNames(classes.value, valueClasses));
 
 	const value = children ?? (showNotAvailable ? formatMessage(sharedMessages.notAvailable) : "");
 
-	return <MultipleLinesText textProps={multipleLinesTextProps} children={value} />;
+	return <MultipleLinesText textProps={multipleLinesTextProps} children={value} tooltipClasses={tooltipClasses} />;
 };
 
 const InformationItemHeader = ({ classes, label, headerIcon }) => {
@@ -94,6 +102,8 @@ const InformationItem = ({
 	showNotAvailable = false,
 	marginTop = 0,
 	isMaxLineCountEnabled,
+	tooltipClasses,
+	valueClasses,
 }) => {
 	const classes = useStyles({ required, error, marginTop });
 
@@ -105,6 +115,8 @@ const InformationItem = ({
 				children={children}
 				showNotAvailable={showNotAvailable}
 				isMaxLineCountEnabled={isMaxLineCountEnabled}
+				tooltipClasses={tooltipClasses}
+				valueClasses={valueClasses}
 			/>
 		</div>
 	);

package/src/components/MaterialUI/DataDisplay/TooltippedElements/MultipleLinesText.js

@@ -11,7 +11,7 @@ const useStyles = makeStyles(theme => ({
 	},
 }));
 
-const MultipleLinesText = ({ children, titleValue, textProps }) => {
+const MultipleLinesText = ({ children, titleValue, textProps, tooltipClasses }) => {
 	const classes = useStyles();
 
 	const [isClamped, setIsClamped] = useState(false);
@@ -48,6 +48,7 @@ const MultipleLinesText = ({ children, titleValue, textProps }) => {
 			titleValue={title}
 			alwaysDisplay={isClamped}
 			onClampStart={event => clampHandler(event)}
+			tooltipClasses={tooltipClasses}
 		/>
 	);
 };

package/src/components/MaterialUI/hocs/withDeferredTooltip.js

@@ -8,7 +8,7 @@ import { isString, isObject, isStringNullOrWhitespace, isReactComponent } from "
 
 const withDeferredTooltip =
 	Comp =>
-	({ titleValue, alwaysDisplay, ...props }) => {
+	({ titleValue, alwaysDisplay, tooltipClasses, ...props }) => {
 		const [shouldBeTooltipped, setShouldBeTooltipped] = useState(false);
 
 		const defaultComponent = <Comp onMouseEnter={event => makeComponentTooltipped(event)} {...props} />;
@@ -32,6 +32,7 @@ const withDeferredTooltip =
 		return (
 			<MuiTooltip
 				arrow
+				classes={tooltipClasses ?? null}
 				title={titleValue}
 				disableHoverListener={false}
 				disableFocusListener={true}

package/src/components/MaterialUI/hocs/withDeferredTooltip.test.js

@@ -155,4 +155,56 @@ describe("withDeferredTooltip", () => {
 
 		expect(wrapper.prop("onMouseEnter"), "to be", undefined);
 	});
+
+	it("Always displays passed title in tooltip with tooltip classes when specified", () => {
+		const Wrapper = props => <ComponentToBeTooltipped {...props} />;
+
+		const TooltippedCompponent = withDeferredTooltip(Wrapper);
+
+		const mountedTooltippedComponent = shallow(
+			<TooltippedCompponent alwaysDisplay titleValue="test" tooltipClasses={{ classTest: "testMyMojo" }} />,
+		);
+
+		const event = {
+			target: {
+				offsetWidth: 100,
+				scrollWidth: 100,
+			},
+		};
+
+		mountedTooltippedComponent.find(Wrapper).invoke("onMouseEnter")(event);
+
+		let expected = (
+			<MuiTooltip title="test" classes={{ classTest: "testMyMojo" }}>
+				<Wrapper />
+			</MuiTooltip>
+		);
+
+		expect(mountedTooltippedComponent.containsMatchingElement(expected), "to be true");
+	});
+
+	it("Always displays passed title in tooltip without tooltip classes when not specified", () => {
+		const Wrapper = props => <ComponentToBeTooltipped {...props} />;
+
+		const TooltippedCompponent = withDeferredTooltip(Wrapper);
+
+		const mountedTooltippedComponent = shallow(<TooltippedCompponent alwaysDisplay titleValue="test" />);
+
+		const event = {
+			target: {
+				offsetWidth: 100,
+				scrollWidth: 100,
+			},
+		};
+
+		mountedTooltippedComponent.find(Wrapper).invoke("onMouseEnter")(event);
+
+		let expected = (
+			<MuiTooltip title="test" classes={null}>
+				<Wrapper />
+			</MuiTooltip>
+		);
+
+		expect(mountedTooltippedComponent.containsMatchingElement(expected), "to be true");
+	});
 });