@synerise/ds-utils 0.28.2 → 0.29.1

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.
 
+## [0.29.1](https://github.com/synerise/synerise-design/compare/@synerise/ds-utils@0.29.0...@synerise/ds-utils@0.29.1) (2024-09-11)
+
+
+### Bug Fixes
+
+* **context-selector:** updated search logic ([dfadc02](https://github.com/synerise/synerise-design/commit/dfadc02928651905f31c58a374d48368b8375eb3))
+
+
+
+
+
+# [0.29.0](https://github.com/synerise/synerise-design/compare/@synerise/ds-utils@0.28.2...@synerise/ds-utils@0.29.0) (2024-09-03)
+
+
+### Features
+
+* **storybook7:** added filter stories ([eb4f165](https://github.com/synerise/synerise-design/commit/eb4f165077eac361d4c4e4deab48842edd191825))
+
+
+
+
+
 ## [0.28.2](https://github.com/synerise/synerise-design/compare/@synerise/ds-utils@0.28.1...@synerise/ds-utils@0.28.2) (2024-08-06)
 
 **Note:** Version bump only for package @synerise/ds-utils

package/dist/index.d.ts

@@ -14,8 +14,10 @@ export { default as usePrevious } from './usePrevious/usePrevious';
 export { default as useElementInView } from './useElementInView/useElementInView';
 export { default as useOverscrollBlock } from './useOverscrollBlock/useOverscrollBlock';
 export { default as useResizeToFit } from './useResizeToFit/useResizeToFit';
+export * from './useSearchResults';
 export * from './omitKeys/omitKeys';
 export * from './useTraceUpdate';
 export * from './getPopupContainer';
 export declare const NOOP: () => void;
 export type { HandledEventsType } from './useOnClickOutside/useOnClickOutside';
+export type { LiteralStringUnion } from './types/types';

package/dist/index.js

@@ -14,6 +14,7 @@ export { default as usePrevious } from './usePrevious/usePrevious';
 export { default as useElementInView } from './useElementInView/useElementInView';
 export { default as useOverscrollBlock } from './useOverscrollBlock/useOverscrollBlock';
 export { default as useResizeToFit } from './useResizeToFit/useResizeToFit';
+export * from './useSearchResults';
 export * from './omitKeys/omitKeys';
 export * from './useTraceUpdate';
 export * from './getPopupContainer';

package/dist/types/types.d.ts

@@ -0,0 +1,4 @@
+/**
+ *  Allows creating a literal string union type with auto-completion in IDEs
+ */
+export type LiteralStringUnion<T extends string> = T | (string & {});

package/dist/types/types.js

@@ -0,0 +1 @@
+export {};

package/dist/useSearchResults/index.d.ts

@@ -0,0 +1,2 @@
+export * from './search.utils';
+export * from './useSearchResults';

package/dist/useSearchResults/index.js

@@ -0,0 +1,2 @@
+export * from './search.utils';
+export * from './useSearchResults';

package/dist/useSearchResults/search.utils.d.ts

@@ -0,0 +1,5 @@
+import { ReactText } from 'react';
+import { BaseGroupType } from './useSearchResults';
+export declare const isItemInGroup: <GroupType extends BaseGroupType<GroupType>>(groupId?: ReactText, currentGroup?: GroupType | undefined) => boolean;
+export declare const getActiveTabGroup: <GroupType extends BaseGroupType<GroupType>>(tabIndex: number, groups?: GroupType[] | undefined) => GroupType | undefined;
+export declare const getGroupName: <GroupType extends BaseGroupType<GroupType>>(groupId: ReactText, groups: BaseGroupType<GroupType>[]) => string | undefined;

package/dist/useSearchResults/search.utils.js

@@ -0,0 +1,18 @@
+export var isItemInGroup = function isItemInGroup(groupId, currentGroup) {
+  if (!currentGroup || !groupId) return true;
+  return currentGroup.subGroups ? (currentGroup == null ? void 0 : currentGroup.subGroups.findIndex(function (group) {
+    return group.id === groupId;
+  })) > -1 : groupId === currentGroup.id;
+};
+export var getActiveTabGroup = function getActiveTabGroup(tabIndex, groups) {
+  return groups && groups[tabIndex];
+};
+export var getGroupName = function getGroupName(groupId, groups) {
+  var _groups$flatMap$find;
+
+  return (_groups$flatMap$find = groups.flatMap(function (group) {
+    return group.subGroups ? group.subGroups : group;
+  }).find(function (group) {
+    return group.id === groupId;
+  })) == null ? void 0 : _groups$flatMap$find.name;
+};

package/dist/useSearchResults/useSearchResults.d.ts

@@ -0,0 +1,17 @@
+import { ReactText } from 'react';
+export type BaseItemType = {
+    id: ReactText | null;
+    groupId?: ReactText;
+    subtitle?: string;
+    name: string;
+};
+export type BaseGroupType<SubGroupType> = {
+    id: ReactText;
+    name: string;
+    subGroups?: SubGroupType[];
+};
+export declare const useSearchResults: <ItemType extends BaseItemType, GroupType extends BaseGroupType<GroupType>, GroupedListItemType>(items: ItemType[], groups: GroupType[], activeTab: number, groupByGroupName: (items: ItemType[], max?: number) => GroupedListItemType[], activeGroup?: GroupType | undefined, searchQuery?: string, maxSearchResultsInGroup?: number) => {
+    searchResults: GroupedListItemType[];
+    getActiveTabGroup: <GroupType_1 extends BaseGroupType<GroupType_1>>(tabIndex: number, groups?: GroupType_1[] | undefined) => GroupType_1 | undefined;
+    getGroupName: <GroupType_2 extends BaseGroupType<GroupType_2>>(groupId: ReactText, groups: BaseGroupType<GroupType_2>[]) => string | undefined;
+};

package/dist/useSearchResults/useSearchResults.js

@@ -0,0 +1,64 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+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 { useMemo } from 'react';
+import { getActiveTabGroup, getGroupName, isItemInGroup } from './search.utils';
+export var useSearchResults = function useSearchResults(items, groups, activeTab, groupByGroupName, activeGroup, searchQuery, maxSearchResultsInGroup) {
+  var showGroupedResults = useMemo(function () {
+    var _getActiveTabGroup;
+
+    return activeTab && !activeGroup ? Boolean((_getActiveTabGroup = getActiveTabGroup(activeTab, groups)) == null ? void 0 : _getActiveTabGroup.subGroups) : Boolean(activeTab === 0 && !activeGroup);
+  }, [activeTab, activeGroup, groups]);
+  var groupOrder = useMemo(function () {
+    return groups.flatMap(function (group) {
+      return group.subGroups ? group.subGroups.map(function (subgroup) {
+        return subgroup.id;
+      }) : group.id;
+    });
+  }, [groups]);
+  var searchResults = useMemo(function () {
+    if (!searchQuery) return [];
+    var result = [];
+    var itemsNumber = items.length;
+
+    for (var i = 0; i < itemsNumber; i += 1) {
+      var item = items[i];
+      var itemInTab = !activeTab || isItemInGroup(item.groupId, getActiveTabGroup(activeTab, groups));
+      var itemInGroup = !activeGroup || item.groupId === activeGroup.id;
+
+      if (itemInGroup && itemInTab) {
+        var _item$name, _item$subtitle;
+
+        var searchQueryInLowerCase = searchQuery.toLowerCase();
+        var isMatchingName = (_item$name = item.name) == null ? void 0 : _item$name.toLowerCase().includes(searchQueryInLowerCase);
+        var isMatchingSubtitle = (_item$subtitle = item.subtitle) == null ? void 0 : _item$subtitle.toLowerCase().includes(searchQueryInLowerCase);
+        var matching = !searchQuery || isMatchingName || isMatchingSubtitle;
+
+        if (matching) {
+          result.push(_objectSpread({
+            groupName: showGroupedResults && item.groupId ? getGroupName(item.groupId, groups) : undefined
+          }, item));
+        }
+      }
+    }
+
+    if (groupOrder && groupOrder.length) {
+      result.sort(function (a, b) {
+        return a.groupId !== undefined && b.groupId !== undefined ? groupOrder.indexOf(a.groupId) - groupOrder.indexOf(b.groupId) : 0;
+      });
+    }
+
+    return result;
+  }, [activeGroup, activeTab, groupOrder, groups, items, searchQuery, showGroupedResults]);
+  var groupedSearchResults = useMemo(function () {
+    return groupByGroupName(searchResults, showGroupedResults ? maxSearchResultsInGroup : undefined);
+  }, [groupByGroupName, searchResults, showGroupedResults, maxSearchResultsInGroup]);
+  return {
+    searchResults: groupedSearchResults,
+    getActiveTabGroup: getActiveTabGroup,
+    getGroupName: getGroupName
+  };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-utils",
-  "version": "0.28.2",
+  "version": "0.29.1",
   "description": "Utils UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "synerise/synerise-design",
@@ -40,5 +40,5 @@
     "react": ">=16.9.0 <= 17.0.2",
     "styled-components": "5.0.1"
   },
-  "gitHead": "14a9cfb86e5d548d5511ed7cdb23088dcb8b9a2d"
+  "gitHead": "fcf3fa64e906cf9fefb37a61ee28218c8eed9b73"
 }