@synerise/ds-context-selector 0.24.5 → 0.24.6

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.24.6](https://github.com/Synerise/synerise-design/compare/@synerise/ds-context-selector@0.24.5...@synerise/ds-context-selector@0.24.6) (2024-08-30)
+
+
+### Bug Fixes
+
+* **context-selector:** reuse renderHoverTooltip for selected item ([57e8a14](https://github.com/Synerise/synerise-design/commit/57e8a148e70bccd54c6d4540fb36c14d492f110b))
+
+
+
+
+
 ## [0.24.5](https://github.com/Synerise/synerise-design/compare/@synerise/ds-context-selector@0.24.4...@synerise/ds-context-selector@0.24.5) (2024-08-27)
 
 **Note:** Version bump only for package @synerise/ds-context-selector

package/dist/ContextSelector.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { ContextProps } from './ContextSelector.types';
-declare const ContextSelector: React.FC<ContextProps>;
+declare const ContextSelector: ({ defaultDropdownVisibility, selectedItem, onSelectItem, onSetGroup, groups, items, texts, opened, addMode, loading, customTriggerComponent, trigger, menuItemHeight, dropdownWrapperStyles, onClickOutsideEvents, onClickOutside, onSearch, hideSearchField, hasMoreItems, onFetchData, onActivate, onDeactivate, onOpen, getPopupContainerOverride, type, dropdownProps, disabled, errorText, readOnly, getMenuEntryProps, }: ContextProps) => React.JSX.Element;
 export default ContextSelector;

package/dist/ContextSelector.js

@@ -6,7 +6,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import * as React from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import Button from '@synerise/ds-button';
 import Icon, { Add3M, AngleDownS } from '@synerise/ds-icon';
 import Menu from '@synerise/ds-menu';
@@ -51,41 +51,41 @@ var ContextSelector = function ContextSelector(_ref) {
       readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
       getMenuEntryProps = _ref.getMenuEntryProps;
 
-  var _React$useState = React.useState(defaultDropdownVisibility != null ? defaultDropdownVisibility : false),
-      dropdownVisible = _React$useState[0],
-      setDropdownVisible = _React$useState[1];
+  var _useState = useState(defaultDropdownVisibility != null ? defaultDropdownVisibility : false),
+      dropdownVisible = _useState[0],
+      setDropdownVisible = _useState[1];
 
-  React.useEffect(function () {
+  useEffect(function () {
     setDropdownVisible(defaultDropdownVisibility != null ? defaultDropdownVisibility : false);
   }, [defaultDropdownVisibility]);
-  var handleChange = React.useCallback(function (val) {
+  var handleChange = useCallback(function (val) {
     setDropdownVisible(false);
     onSelectItem(val);
   }, [onSelectItem]);
-  var handleOnSetGroup = React.useCallback(function (val) {
+  var handleOnSetGroup = useCallback(function (val) {
     onSetGroup && onSetGroup(val);
   }, [onSetGroup]);
-  React.useEffect(function () {
+  useEffect(function () {
     if (opened) {
       setDropdownVisible(true);
     }
   }, [opened]);
-  var triggerMode = React.useMemo(function () {
+  var triggerMode = useMemo(function () {
     if (selectedItem) {
       return readOnly ? 'icon-label' : 'two-icons';
     }
 
     return readOnly ? 'simple' : 'label-icon';
   }, [selectedItem, readOnly]);
-  var triggerColor = React.useMemo(function () {
+  var triggerColor = useMemo(function () {
     if (!selectedItem) return 'blue';
     return type === 'event' ? 'cyan' : 'green';
   }, [selectedItem, type]);
-  var handleClick = React.useCallback(function () {
+  var handleClick = useCallback(function () {
     onOpen && onOpen();
     setDropdownVisible(true);
   }, [onOpen]);
-  var triggerButton = React.useMemo(function () {
+  var triggerButton = useMemo(function () {
     var buttonLabel = texts.buttonLabel;
     var hasError = Boolean(errorText);
     return addMode && !selectedItem ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
@@ -119,7 +119,7 @@ var ContextSelector = function ContextSelector(_ref) {
           popupPlacement: 'top',
           getPopupContainer: getPopupContainerOverride || getPopupContainer
         },
-        renderHoverTooltip: selectedItem ? function () {
+        renderHoverTooltip: selectedItem ? selectedItem.renderHoverTooltip || function () {
           return /*#__PURE__*/React.createElement(InformationCard, _extends({
             icon: selectedItem.icon,
             subtitle: selectedItem.subtitle,
@@ -135,7 +135,7 @@ var ContextSelector = function ContextSelector(_ref) {
       }, getMenuEntryProps == null ? void 0 : getMenuEntryProps(selectedItem))]
     });
   }, [texts, addMode, selectedItem, disabled, readOnly, handleClick, triggerColor, triggerMode, getPopupContainerOverride, errorText, getMenuEntryProps]);
-  var onDropdownVisibilityChange = React.useCallback(function (value) {
+  var onDropdownVisibilityChange = useCallback(function (value) {
     if (value) {
       onActivate && onActivate('');
       setDropdownVisible(true);

package/dist/ContextSelector.types.d.ts

@@ -4,13 +4,14 @@ import { ItemSize } from '@synerise/ds-menu';
 import { DropdownProps } from '@synerise/ds-dropdown/dist/Dropdown';
 import type { FactorsProps } from '@synerise/ds-factors';
 import { InformationCardProps } from '@synerise/ds-information-card';
+import { ListItemProps } from '@synerise/ds-list-item';
 export type ContextTexts = {
     buttonLabel: string;
     searchPlaceholder: string;
     loadingResults: string;
     noResults: string;
 };
-export type ContextItem = {
+export type ContextItem = Pick<ListItemProps, 'renderHoverTooltip' | 'hoverTooltipProps' | 'disabled'> & {
     id: ReactText | null;
     name: string;
     icon: ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-context-selector",
-  "version": "0.24.5",
+  "version": "0.24.6",
   "description": "ContextSelector UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -27,24 +27,24 @@
     "test:watch": "npm run test -- --watchAll",
     "types": "tsc --noEmit"
   },
-  "gitHead": "a035aeea499cea00e72e20e3790c0ffcad4fe956",
+  "gitHead": "d5df67eecdc1cbcb56def8c17d04b7d883876fbf",
   "sideEffects": [
     "dist/style/*",
     "*.less"
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-button": "^0.21.6",
-    "@synerise/ds-dropdown": "^0.18.10",
-    "@synerise/ds-factors": "^0.23.7",
-    "@synerise/ds-icon": "^0.65.1",
-    "@synerise/ds-information-card": "^0.5.4",
-    "@synerise/ds-list-item": "^0.4.6",
-    "@synerise/ds-menu": "^0.19.10",
-    "@synerise/ds-result": "^0.7.0",
-    "@synerise/ds-scrollbar": "^0.11.6",
+    "@synerise/ds-button": "^0.21.7",
+    "@synerise/ds-dropdown": "^0.18.11",
+    "@synerise/ds-factors": "^0.24.0",
+    "@synerise/ds-icon": "^0.65.2",
+    "@synerise/ds-information-card": "^0.5.5",
+    "@synerise/ds-list-item": "^0.4.7",
+    "@synerise/ds-menu": "^0.19.11",
+    "@synerise/ds-result": "^0.7.1",
+    "@synerise/ds-scrollbar": "^0.11.7",
     "@synerise/ds-skeleton": "^0.6.5",
-    "@synerise/ds-tabs": "^0.15.3",
+    "@synerise/ds-tabs": "^0.15.4",
     "@synerise/ds-utils": "^0.28.2",
     "react-window": "1.8.5",
     "uuid": "^8.3.2"