@true-engineering/true-react-common-ui-kit 1.3.1 → 1.4.1

package/dist/components/Input/Input.d.ts

@@ -1,6 +1,6 @@
-import { FormEvent, FocusEvent, KeyboardEvent, ClipboardEvent } from 'react';
+import { FormEvent, FocusEvent, KeyboardEvent, ClipboardEvent, ReactElement } from 'react';
 import { Props as ReactInputMaskProps } from 'react-input-mask';
-import { IIconProps } from '../Icon';
+import { IIconType } from '../Icon';
 import { ICommonProps } from '../../types';
 import { InputStyles } from './Input.styles';
 export declare const DEFAULT_SIZE = 6;
@@ -25,7 +25,7 @@ export interface IInputProps extends ICommonProps {
     isLoading?: boolean;
     isAutoSizeable?: boolean;
     defaultSize?: number;
-    iconType?: IIconProps['type'];
+    iconType?: IIconType | ReactElement;
     units?: string;
     name?: string;
     mask?: ReactInputMaskProps['mask'];

package/dist/components/ScrollIntoViewIfNeeded/ScrollIntoViewIfNeeded.d.ts

@@ -180,7 +180,7 @@ export declare class ScrollIntoViewIfNeeded extends PureComponent<IScrollIntoVie
         'aria-expanded'?: (boolean | "false" | "true") | undefined;
         'aria-flowto'?: string | undefined;
         'aria-grabbed'?: (boolean | "false" | "true") | undefined;
-        'aria-haspopup'?: boolean | "grid" | "menu" | "listbox" | "false" | "true" | "dialog" | "tree" | undefined;
+        'aria-haspopup'?: boolean | "grid" | "menu" | "dialog" | "listbox" | "false" | "true" | "tree" | undefined;
         'aria-hidden'?: (boolean | "false" | "true") | undefined;
         'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
         'aria-keyshortcuts'?: string | undefined;

package/dist/components/Select/Select.d.ts

@@ -1,9 +1,10 @@
-import { ReactNode } from 'react';
+import { ReactNode, SyntheticEvent } from 'react';
 import { IInputProps } from '../Input';
 import { IIconType } from '../Icon';
 import { IDropdownWithPopperOptions } from '../../types';
 import { SelectStyles } from './Select.styles';
-export interface ISelectProps<Value> extends Omit<IInputProps, 'value' | 'onChange' | 'type'> {
+import { ISearchInputProps } from '../SearchInput';
+export interface ISelectProps<Value> extends Omit<IInputProps, 'value' | 'onChange' | 'onBlur' | 'type'> {
     tweakStyles?: SelectStyles;
     defaultOptionLabel?: string;
     noMatchesLabel?: string;
@@ -16,8 +17,12 @@ export interface ISelectProps<Value> extends Omit<IInputProps, 'value' | 'onChan
     options: Value[];
     value: Value | undefined;
     shouldScrollToList?: boolean;
+    searchInput?: {
+        shouldRenderInList: true;
+    } & Pick<ISearchInputProps, 'placeholder'>;
     isOptionDisabled?(option: Value): boolean;
     onChange(value: Value | undefined): void;
+    onBlur?(event: Event | SyntheticEvent): void;
     onType?(value: string): Promise<void>;
     optionsFilter?(options: Value[], query: string): Value[];
     onOpen?(): void;
@@ -26,4 +31,4 @@ export interface ISelectProps<Value> extends Omit<IInputProps, 'value' | 'onChan
     convertValueToReactNode?(value: Value, isDisabled: boolean): ReactNode;
     convertValueToId?(value: Value): string | undefined;
 }
-export declare function Select<Value>({ options, value, defaultOptionLabel, debounceTime, optionsMode, noMatchesLabel, loadingLabel, tweakStyles, testId, isDisabled, dropdownOptions, minSymbolsCountToOpenList, dropdownIcon, shouldScrollToList, onChange, onFocus, onBlur, onType, onOpen, isOptionDisabled, compareValuesOnChange, convertValueToString, convertValueToId, convertValueToReactNode, optionsFilter, ...inputProps }: ISelectProps<Value>): JSX.Element;
+export declare function Select<Value>({ options, value, defaultOptionLabel, debounceTime, optionsMode, noMatchesLabel, loadingLabel, tweakStyles, testId, isDisabled, dropdownOptions, minSymbolsCountToOpenList, dropdownIcon, shouldScrollToList, searchInput, onChange, onFocus, onBlur, onType, onOpen, isOptionDisabled, compareValuesOnChange, convertValueToString, convertValueToId, convertValueToReactNode, optionsFilter, ...inputProps }: ISelectProps<Value>): JSX.Element;

package/dist/components/Select/Select.styles.d.ts

@@ -57,5 +57,15 @@ export declare const styles: {
         };
     };
     tweakSelectList: {};
+    tweakSearchInput: {
+        tweakInput: {
+            inputWrapper: {
+                height: number;
+                borderRadius: number;
+                border: string;
+                backgroundColor: string;
+            };
+        };
+    };
 };
 export declare type SelectStyles = ComponentStyles<typeof styles>;

package/dist/components/Select/SelectList/SelectList.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { ReactNode, MouseEvent } from 'react';
 import { ICommonProps } from '../../../types';
 import { SelectListStyles } from './SelectList.styles';
 export interface ISelectListProps<Value> extends ICommonProps {
@@ -12,10 +12,11 @@ export interface ISelectListProps<Value> extends ICommonProps {
     defaultOptionLabel?: string;
     testId?: string;
     shouldScrollToList?: boolean;
-    onOptionClick(index: number): void;
+    customListHeader?: ReactNode;
+    onOptionClick(index: number, event: MouseEvent<HTMLElement>): void;
     isOptionDisabled(value: Value): boolean;
     convertValueToString(value: Value): string | undefined;
     convertValueToReactNode?(value: Value, isDisabled: boolean): ReactNode;
     convertValueToId?(value: Value): string | undefined;
 }
-export declare function SelectList<Value>({ options, focusedIndex, activeValue, defaultOptionLabel, noMatchesLabel, isLoading, loadingLabel, tweakStyles, testId, shouldScrollToList, isOptionDisabled, onOptionClick, convertValueToString, convertValueToReactNode, convertValueToId, }: ISelectListProps<Value>): JSX.Element;
+export declare function SelectList<Value>({ options, focusedIndex, activeValue, defaultOptionLabel, noMatchesLabel, isLoading, loadingLabel, tweakStyles, testId, shouldScrollToList, customListHeader, isOptionDisabled, onOptionClick, convertValueToString, convertValueToReactNode, convertValueToId, }: ISelectListProps<Value>): JSX.Element;

package/dist/components/Select/SelectList/SelectList.styles.d.ts

@@ -7,6 +7,15 @@ export declare const styles: {
         boxSizing: string;
         padding: number[];
         fontSize: number;
+        overflow: string;
+    };
+    withListHeader: {
+        paddingTop: number;
+    };
+    listHeader: {
+        '& + $list': {
+            borderTop: (string | number)[];
+        };
     };
     list: {
         height: string;

package/dist/helpers/snippets.d.ts

@@ -0,0 +1,3 @@
+import { IIconType } from '../components';
+import { ReactElement, ReactNode } from 'react';
+export declare const renderIcon: (icon: IIconType | ReactElement) => ReactNode;

package/dist/helpers/utils.d.ts

@@ -1,4 +1,5 @@
 export declare const transformToKebab: (string: string) => string;
+export declare const hasExactParent: (element: Element, parent: Element) => boolean;
 export declare const getParentNode: (element: Element | ShadowRoot) => Element;
 export declare const getStyleComputedProperty: (element: Element) => Partial<CSSStyleDeclaration>;
 export declare const getScrollParent: (element: Element | Document) => Element;

package/dist/hooks/use-dropdown.d.ts

@@ -3,9 +3,9 @@ import usePopper, { VirtualElement } from 'react-overlays/usePopper';
 import { IDropdownWithPopperOptions } from '../types';
 export declare const useDropdown: ({ isOpen, onDropdownClose, referenceElement, dropdownElement, options, dependenciesForPositionUpdating, }: {
     isOpen: boolean;
-    onDropdownClose: () => void;
     referenceElement: VirtualElement | null | undefined;
     dropdownElement: HTMLElement | null | undefined;
     options?: IDropdownWithPopperOptions | undefined;
     dependenciesForPositionUpdating?: DependencyList | undefined;
+    onDropdownClose(event: Event): void;
 }) => ReturnType<typeof usePopper> | undefined;

package/dist/index.d.ts

@@ -3,3 +3,4 @@ export * from './components';
 export * from './hooks';
 export * from './types';
 export * from './helpers';
+export * from './helpers/snippets';