@true-engineering/true-react-common-ui-kit 4.0.0-alpha31 → 4.0.0-alpha32

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@true-engineering/true-react-common-ui-kit",
-  "version": "4.0.0-alpha31",
+  "version": "4.0.0-alpha32",
   "description": "True Engineering React UI Kit with theming support",
   "author": "True Engineering (https://trueengineering.ru)",
   "keywords": [

package/src/components/Select/Select.tsx

@@ -17,6 +17,7 @@ import { Portal } from 'react-overlays';
 import clsx from 'clsx';
 import { debounce } from 'ts-debounce';
 import {
+  applyAction,
   createFilter,
   getArray,
   getTestId,
@@ -39,14 +40,14 @@ import {
   defaultIsOptionDisabled,
   getDefaultConvertToIdFunction,
 } from './helpers';
-import { IChangeSelectEvent, IMultipleSelectValue } from './types';
+import { IChangeSelectEvent, IMultipleSelectValue, ISelectFooter } from './types';
 import { getInputStyles, ISelectStyles, useStyles } from './Select.styles';
 
 export interface ISelectProps<Value>
   extends Omit<IInputProps, 'value' | 'onChange' | 'onBlur' | 'type' | 'tweakStyles'>,
     ICommonProps<ISelectStyles> {
   header?: ReactNode;
-  footer?: ReactNode;
+  footer?: ISelectFooter<Value>;
   defaultOptionLabel?: ReactNode;
   allOptionsLabel?: string;
   noMatchesLabel?: string;
@@ -194,7 +195,7 @@ export function Select<Value>(
 
   const filteredOptions = useMemo(() => {
     if (optionsMode !== 'search') {
-      return options;
+      return options as Value[];
     }
 
     const filter =
@@ -554,7 +555,7 @@ export function Select<Value>(
           allOptionsLabel={shouldShowAllOption && allOptionsLabel}
           areAllOptionsSelected={areAllOptionsSelected}
           customListHeader={customHeader}
-          customListFooter={footer}
+          customListFooter={applyAction(footer, { filteredOptions })}
           noMatchesLabel={noMatchesLabel}
           focusedIndex={focusedListCellIndex}
           activeValue={value}

package/src/components/Select/types.ts

@@ -1,6 +1,9 @@
 import { ChangeEvent, KeyboardEvent } from 'react';
+import { IRenderNode } from '../../types';
 import { IChangeInputEvent } from '../Input';
 
 export type IMultipleSelectValue<Value> = Array<NonNullable<Value>>;
 
 export type IChangeSelectEvent = IChangeInputEvent | ChangeEvent<HTMLElement> | KeyboardEvent;
+
+export type ISelectFooter<T> = IRenderNode<{ filteredOptions: T[] }>;