@synerise/ds-item-picker 1.8.0 → 1.8.2

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.8.2](https://github.com/Synerise/synerise-design/compare/@synerise/ds-item-picker@1.8.1...@synerise/ds-item-picker@1.8.2) (2025-07-15)
+
+
+### Bug Fixes
+
+* **item-picker:** allow click on infocard ([f2c035b](https://github.com/Synerise/synerise-design/commit/f2c035b52872e1908a4e0695345e170b3256f29f))
+
+
+
+
+
+## [1.8.1](https://github.com/Synerise/synerise-design/compare/@synerise/ds-item-picker@1.8.0...@synerise/ds-item-picker@1.8.1) (2025-07-14)
+
+
+### Bug Fixes
+
+* **item-picker:** back action overflow with ellipsis ([c35f1c2](https://github.com/Synerise/synerise-design/commit/c35f1c2340e4fd905e9df0e723856d192c8f4d6c))
+
+
+
+
+
 # [1.8.0](https://github.com/Synerise/synerise-design/compare/@synerise/ds-item-picker@1.7.1...@synerise/ds-item-picker@1.8.0) (2025-07-11)
 
 

package/dist/components/ItemPickerList/ItemPickerList.js

@@ -8,6 +8,7 @@ import { useTheme } from '@synerise/ds-core';
 import Dropdown from '@synerise/ds-dropdown';
 import Icon, { ArrowLeftM } from '@synerise/ds-icon';
 import { itemSizes } from '@synerise/ds-list-item';
+import { Text } from '@synerise/ds-typography';
 import { focusWithArrowKeys, useCombinedRefs, useKeyboardShortcuts, useScrollContain } from '@synerise/ds-utils';
 import { useDefaultTexts } from '../../hooks/useDefaultTexts';
 import * as S from './ItemPickerList.styles';
@@ -191,7 +192,12 @@ export var ItemPickerList = function ItemPickerList(_ref) {
       var searchByActionLabel = (searchByAction == null ? void 0 : searchByAction.sectionTitle) || (searchByAction == null ? void 0 : searchByAction.text);
       var searchInActionLabel = searchInAction == null ? void 0 : searchInAction.text;
       var searchInItemLabel = searchInItem && "" + (searchInAction == null ? void 0 : searchInAction.renderSearchInValueText(searchInItem));
-      return [].concat(itemsPath, [searchInActionLabel, searchInItemLabel, searchByActionLabel]).filter(Boolean).join(' - ');
+      var labelParts = [].concat(itemsPath, [searchInActionLabel, searchInItemLabel, searchByActionLabel]).filter(Boolean).join(' - ');
+      return /*#__PURE__*/React.createElement(Text, {
+        ellipsis: {
+          tooltip: labelParts
+        }
+      }, labelParts);
     };
     return /*#__PURE__*/React.createElement(React.Fragment, null, isSection && /*#__PURE__*/React.createElement(Dropdown.BackAction, {
       tooltipProps: {

package/dist/components/ItemPickerList/ItemPickerList.styles.js

@@ -1,6 +1,7 @@
 import { VariableSizeList } from 'react-window';
 import styled, { css } from 'styled-components';
 import Dropdown from '@synerise/ds-dropdown';
+import { Label as DropdownBackActionLabel } from '@synerise/ds-dropdown/dist/elements/BackAction/BackAction.styles';
 import DSEmptyStates from '@synerise/ds-empty-states';
 import DSLoader from '@synerise/ds-loader';
 import Scrollbar from '@synerise/ds-scrollbar';
@@ -10,13 +11,13 @@ import { LIST_INNER_PADDING } from './constants';
 export var ListWrapper = styled.div.withConfig({
   displayName: "ItemPickerListstyles__ListWrapper",
   componentId: "sc-1r33ill-0"
-})(["position:relative;flex:1 0 calc(100% - ", "px);", " ", ""], function (props) {
+})(["position:relative;flex:1 0 calc(100% - ", "px);", " ", " ", "{min-width:0;}"], function (props) {
   return props.offsetSpace;
 }, function (props) {
   return props.wrapperHeight !== undefined && "height: " + (props.wrapperHeight + LIST_INNER_PADDING) + "px;";
 }, function (props) {
   return props.centered && css(["display:flex;flex-direction:column;"]);
-});
+}, DropdownBackActionLabel);
 export var ListContainer = styled(Dropdown.Wrapper).withConfig({
   displayName: "ItemPickerListstyles__ListContainer",
   componentId: "sc-1r33ill-1"

package/dist/components/ItemPickerNew/ItemPickerNew.js

@@ -1,10 +1,9 @@
 var _excluded = ["onFocus", "onBlur", "onClear", "selectedItem", "onChange", "dropdownProps", "texts", "triggerProps", "renderTrigger", "placeholder", "placeholderIcon", "label", "description", "error", "errorMessage", "errorText", "disabled", "tooltip", "tooltipConfig"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import Dropdown from '@synerise/ds-dropdown';
 import FormField from '@synerise/ds-form-field';
-import { useOnClickOutside } from '@synerise/ds-utils';
 import * as S from '../../ItemPicker.styles';
 import { useDefaultTexts } from '../../hooks/useDefaultTexts';
 import { ItemPickerList } from '../ItemPickerList/ItemPickerList';
@@ -30,10 +29,6 @@ export var ItemPickerNew = function ItemPickerNew(_ref) {
     tooltip = _ref.tooltip,
     tooltipConfig = _ref.tooltipConfig,
     rest = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var overlayRef = useRef(null);
-  useOnClickOutside(overlayRef, function () {
-    closeDropdown();
-  });
   var _useState = useState(selectedItem),
     selected = _useState[0],
     setSelected = _useState[1];
@@ -106,8 +101,7 @@ export var ItemPickerNew = function ItemPickerNew(_ref) {
       texts: allTexts,
       isVisible: visible,
       selectedItem: selected,
-      onItemSelect: handleItemSelect,
-      containerRef: overlayRef
+      onItemSelect: handleItemSelect
     }))
   }), trigger)));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-item-picker",
-  "version": "1.8.0",
+  "version": "1.8.2",
   "description": "ItemPicker UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -34,25 +34,25 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-alert": "^1.1.8",
-    "@synerise/ds-avatar": "^1.0.14",
-    "@synerise/ds-button": "^1.4.3",
-    "@synerise/ds-dropdown": "^1.0.16",
-    "@synerise/ds-empty-states": "^1.0.12",
+    "@synerise/ds-alert": "^1.1.9",
+    "@synerise/ds-avatar": "^1.0.15",
+    "@synerise/ds-button": "^1.4.4",
+    "@synerise/ds-dropdown": "^1.0.17",
+    "@synerise/ds-empty-states": "^1.0.13",
     "@synerise/ds-flag": "^1.0.2",
-    "@synerise/ds-form-field": "^1.1.9",
-    "@synerise/ds-icon": "^1.5.4",
-    "@synerise/ds-information-card": "^1.0.20",
-    "@synerise/ds-list-item": "^1.0.14",
+    "@synerise/ds-form-field": "^1.1.10",
+    "@synerise/ds-icon": "^1.6.0",
+    "@synerise/ds-information-card": "^1.0.21",
+    "@synerise/ds-list-item": "^1.0.15",
     "@synerise/ds-loader": "^1.0.6",
-    "@synerise/ds-popconfirm": "^1.0.15",
-    "@synerise/ds-result": "^1.0.15",
-    "@synerise/ds-scrollbar": "^1.1.2",
-    "@synerise/ds-search": "^1.2.3",
-    "@synerise/ds-search-bar": "^1.3.5",
-    "@synerise/ds-short-cuts": "^1.0.14",
-    "@synerise/ds-skeleton": "^1.0.15",
-    "@synerise/ds-tooltip": "^1.1.12",
+    "@synerise/ds-popconfirm": "^1.0.16",
+    "@synerise/ds-result": "^1.0.16",
+    "@synerise/ds-scrollbar": "^1.1.3",
+    "@synerise/ds-search": "^1.2.4",
+    "@synerise/ds-search-bar": "^1.3.6",
+    "@synerise/ds-short-cuts": "^1.0.15",
+    "@synerise/ds-skeleton": "^1.0.16",
+    "@synerise/ds-tooltip": "^1.1.13",
     "@synerise/ds-utils": "^1.3.1",
     "lodash": "^4.17.21",
     "react-window": "^1.8.5",
@@ -64,5 +64,5 @@
     "react-intl": ">=3.12.0 <= 6.8",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "c059915199be3bfd7659518239783b17006dba8a"
+  "gitHead": "f7c362a4f370d86b51df9aba9e91ac8f7fe4ed8f"
 }