@datarobot/design-system 29.1.0 → 29.1.2

package/cjs/dropdown-menu/dropdown-item-title.d.ts

@@ -3,6 +3,7 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { TooltipPlacementsType } from '../tooltip';
 import './dropdown-item-title.less';
 export type DropdownItemTitleOption = {
+    key: string | number;
     iconClass?: string;
     icon?: IconProp;
     title?: ReactNode;

package/cjs/dropdown-menu/dropdown-item-title.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _faChevronRight = require("@fortawesome/free-solid-svg-icons/faChevronRight");
 var _fontAwesomeIcon = require("../font-awesome-icon");
@@ -12,6 +12,7 @@ var _truncateWithTooltip = require("../truncate-with-tooltip");
 var _tooltip = require("../tooltip");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const DropdownItemTitle = ({
   option,
   isMultiLevelHandler = false
@@ -25,7 +26,8 @@ const DropdownItemTitle = ({
     tooltipPlacement,
     tooltipText,
     tooltipDocsLink,
-    tooltipTestId
+    tooltipTestId,
+    key
   } = option;
   const props = {
     tooltipText,
@@ -59,14 +61,14 @@ const DropdownItemTitle = ({
     })
   });
   const withTruncatableText = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_truncateWithTooltip.TruncateWithTooltip, {
+    children: [/*#__PURE__*/(0, _react.createElement)(_truncateWithTooltip.TruncateWithTooltip, {
       ...props,
-      children: itemTitle
-    }), subtext && /*#__PURE__*/(0, _jsxRuntime.jsx)(_truncateWithTooltip.TruncateWithTooltip, {
+      key: key
+    }, itemTitle), subtext && /*#__PURE__*/(0, _react.createElement)(_truncateWithTooltip.TruncateWithTooltip, {
       ...props,
       tooltipTestId: `${tooltipTestId}-subtext`,
-      children: itemSubText
-    })]
+      key: `${key}-subtext`
+    }, itemSubText)]
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     className: (0, _classnames.default)('drop-item-content-wrap', {

package/cjs/dropdown-menu/dropdown-menu-trigger.js

@@ -22,7 +22,7 @@ const DefaultTriggerContent = ({
   children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
     children: selectedItem?.title ?? defaultTriggerText
   })
-});
+}, selectedItem?.key ?? 0);
 const DropdownMenuTrigger = /*#__PURE__*/(0, _react.forwardRef)(({
   onClick,
   isOpen,

package/cjs/dropdown-menu/dropdown-selectbox-trigger.js

@@ -31,6 +31,7 @@ const DefaultTriggerContent = function ({
     });
   }
   const triggerContent = getGenericTriggerContent(selectedItem, options);
+  const key = selectedItem?.key;
   if (triggerContent) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: "selected-item-details",
@@ -38,7 +39,7 @@ const DefaultTriggerContent = function ({
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           children: triggerContent
         })
-      })
+      }, key)
     });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_truncateWithTooltip.TruncateWithTooltip, {
@@ -46,7 +47,7 @@ const DefaultTriggerContent = function ({
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       children: defaultTriggerText
     })
-  });
+  }, key);
 };
 function getGenericTriggerContent(selectedItem, options) {
   const selectedOptions = options.filter(option => option.isChecked).map(option => option.title);

package/cjs/hooks/use-analytics/use-analytics.test.js

@@ -94,15 +94,5 @@ describe('useAnalytics', function () {
         prop: 'value'
       }]);
     });
-    it('should pass custom event to provider', function () {
-      (0, _react.act)(() => hook.result.current.track({
-        event: 'project_created',
-        label: 'example_dataset',
-        property: 'industry',
-        value: 42
-      }));
-      expect(provider.getLastMediator().method).toEqual(_constants.ANALYTICS_METHODS.TRACK);
-      expect(provider.getLastMediator().args).toEqual(['page.key', 'project_created', 'example_dataset', 'industry', 42, false]);
-    });
   });
 });

package/esm/dropdown-menu/dropdown-item-title.d.ts

@@ -3,6 +3,7 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { TooltipPlacementsType } from '../tooltip';
 import './dropdown-item-title.less';
 export type DropdownItemTitleOption = {
+    key: string | number;
     iconClass?: string;
     icon?: IconProp;
     title?: ReactNode;

package/esm/dropdown-menu/dropdown-item-title.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { createElement as _createElement } from 'react';
 import classnames from 'classnames';
 import { faChevronRight } from '@fortawesome/free-solid-svg-icons/faChevronRight';
 import { FontAwesomeIcon } from '../font-awesome-icon';
@@ -18,7 +18,8 @@ const DropdownItemTitle = ({
     tooltipPlacement,
     tooltipText,
     tooltipDocsLink,
-    tooltipTestId
+    tooltipTestId,
+    key
   } = option;
   const props = {
     tooltipText,
@@ -52,14 +53,14 @@ const DropdownItemTitle = ({
     })
   });
   const withTruncatableText = /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(TruncateWithTooltip, {
+    children: [/*#__PURE__*/_createElement(TruncateWithTooltip, {
       ...props,
-      children: itemTitle
-    }), subtext && /*#__PURE__*/_jsx(TruncateWithTooltip, {
+      key: key
+    }, itemTitle), subtext && /*#__PURE__*/_createElement(TruncateWithTooltip, {
       ...props,
       tooltipTestId: `${tooltipTestId}-subtext`,
-      children: itemSubText
-    })]
+      key: `${key}-subtext`
+    }, itemSubText)]
   });
   return /*#__PURE__*/_jsx("div", {
     className: classnames('drop-item-content-wrap', {

package/esm/dropdown-menu/dropdown-menu-trigger.js

@@ -14,7 +14,7 @@ const DefaultTriggerContent = ({
   children: /*#__PURE__*/_jsx("span", {
     children: selectedItem?.title ?? defaultTriggerText
   })
-});
+}, selectedItem?.key ?? 0);
 const DropdownMenuTrigger = /*#__PURE__*/forwardRef(({
   onClick,
   isOpen,

package/esm/dropdown-menu/dropdown-selectbox-trigger.js

@@ -23,6 +23,7 @@ const DefaultTriggerContent = function ({
     });
   }
   const triggerContent = getGenericTriggerContent(selectedItem, options);
+  const key = selectedItem?.key;
   if (triggerContent) {
     return /*#__PURE__*/_jsx("span", {
       className: "selected-item-details",
@@ -30,7 +31,7 @@ const DefaultTriggerContent = function ({
         children: /*#__PURE__*/_jsx("span", {
           children: triggerContent
         })
-      })
+      }, key)
     });
   }
   return /*#__PURE__*/_jsx(TruncateWithTooltip, {
@@ -38,7 +39,7 @@ const DefaultTriggerContent = function ({
     children: /*#__PURE__*/_jsx("span", {
       children: defaultTriggerText
     })
-  });
+  }, key);
 };
 function getGenericTriggerContent(selectedItem, options) {
   const selectedOptions = options.filter(option => option.isChecked).map(option => option.title);

package/esm/hooks/use-analytics/use-analytics.test.js

@@ -93,15 +93,5 @@ describe('useAnalytics', function () {
         prop: 'value'
       }]);
     });
-    it('should pass custom event to provider', function () {
-      act(() => hook.result.current.track({
-        event: 'project_created',
-        label: 'example_dataset',
-        property: 'industry',
-        value: 42
-      }));
-      expect(provider.getLastMediator().method).toEqual(ANALYTICS_METHODS.TRACK);
-      expect(provider.getLastMediator().args).toEqual(['page.key', 'project_created', 'example_dataset', 'industry', 42, false]);
-    });
   });
 });

package/js/bundle/bundle.js

@@ -50824,7 +50824,8 @@ var DropdownItemTitle = function DropdownItemTitle(_ref) {
     tooltipPlacement = option.tooltipPlacement,
     tooltipText = option.tooltipText,
     tooltipDocsLink = option.tooltipDocsLink,
-    tooltipTestId = option.tooltipTestId;
+    tooltipTestId = option.tooltipTestId,
+    key = option.key;
   var props = {
     tooltipText: tooltipText,
     tooltipPlacement: tooltipPlacement || _tooltip__WEBPACK_IMPORTED_MODULE_5__.TOOLTIP_PLACEMENT_TYPES.RIGHT,
@@ -50852,8 +50853,11 @@ var DropdownItemTitle = function DropdownItemTitle(_ref) {
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", {
     className: "menu-item-subtext"
   }, subtext));
-  var withTruncatableText = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_4__.TruncateWithTooltip, props, itemTitle), subtext && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_4__.TruncateWithTooltip, _extends({}, props, {
-    tooltipTestId: "".concat(tooltipTestId, "-subtext")
+  var withTruncatableText = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_4__.TruncateWithTooltip, _extends({}, props, {
+    key: key
+  }), itemTitle), subtext && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_4__.TruncateWithTooltip, _extends({}, props, {
+    tooltipTestId: "".concat(tooltipTestId, "-subtext"),
+    key: "".concat(key, "-subtext")
   }), itemSubText));
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: classnames__WEBPACK_IMPORTED_MODULE_1___default()('drop-item-content-wrap', {
@@ -51541,10 +51545,12 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
 
 
 var DefaultTriggerContent = function DefaultTriggerContent(_ref) {
-  var _selectedItem$title;
+  var _selectedItem$key, _selectedItem$title;
   var selectedItem = _ref.selectedItem,
     defaultTriggerText = _ref.defaultTriggerText;
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_4__.TruncateWithTooltip, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", null, (_selectedItem$title = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.title) !== null && _selectedItem$title !== void 0 ? _selectedItem$title : defaultTriggerText));
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_4__.TruncateWithTooltip, {
+    key: (_selectedItem$key = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.key) !== null && _selectedItem$key !== void 0 ? _selectedItem$key : 0
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", null, (_selectedItem$title = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.title) !== null && _selectedItem$title !== void 0 ? _selectedItem$title : defaultTriggerText));
 };
 var DropdownMenuTrigger = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(function (_ref2, ref) {
   var onClick = _ref2.onClick,
@@ -52186,13 +52192,17 @@ var DefaultTriggerContent = function DefaultTriggerContent(_ref) {
     });
   }
   var triggerContent = getGenericTriggerContent(selectedItem, options);
+  var key = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.key;
   if (triggerContent) {
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", {
       className: "selected-item-details"
-    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_5__.TruncateWithTooltip, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", null, triggerContent)));
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_5__.TruncateWithTooltip, {
+      key: key
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", null, triggerContent)));
   }
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_truncate_with_tooltip__WEBPACK_IMPORTED_MODULE_5__.TruncateWithTooltip, {
-    className: "placeholder"
+    className: "placeholder",
+    key: key
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", null, defaultTriggerText));
 };
 function getGenericTriggerContent(selectedItem, options) {