@mw-kit/mw-ui 1.8.22 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/components/Input/components/Select/hooks/Select/interfaces.d.ts +1 -0
  2. package/dist/components/Input/components/Select/hooks/SelectMultiple/interfaces.d.ts +1 -0
  3. package/dist/components/Popup/hooks/fallbackPlacements/index.d.ts +3 -0
  4. package/dist/components/Popup/hooks/index.d.ts +2 -0
  5. package/dist/components/Popup/hooks/open/index.d.ts +3 -0
  6. package/dist/components/Popup/index.d.ts +6 -0
  7. package/dist/components/Popup/styles.d.ts +9 -0
  8. package/dist/components/Popup/types.d.ts +17 -0
  9. package/dist/components/Select/components/Apply/index.d.ts +7 -0
  10. package/dist/components/Select/components/Apply/styles.d.ts +1 -0
  11. package/dist/components/Select/components/Scroll/index.d.ts +20 -0
  12. package/dist/components/Select/components/Scroll/styles.d.ts +9 -0
  13. package/dist/components/Select/components/Search/index.d.ts +7 -0
  14. package/dist/components/Select/components/Search/styles.d.ts +1 -0
  15. package/dist/components/Select/constants.d.ts +2 -0
  16. package/dist/components/Select/hooks/index.d.ts +5 -0
  17. package/dist/components/Select/hooks/useAsyncOptions/index.d.ts +8 -0
  18. package/dist/components/Select/hooks/useFloatingMenu/index.d.ts +50 -0
  19. package/dist/components/Select/hooks/useListNavigation/index.d.ts +13 -0
  20. package/dist/components/Select/hooks/useRuleIndex/index.d.ts +11 -0
  21. package/dist/components/Select/hooks/useVirtualizedOptions/index.d.ts +13 -0
  22. package/dist/components/Select/index.d.ts +6 -0
  23. package/dist/components/Select/instances/index.d.ts +3 -0
  24. package/dist/components/Select/instances/multi/index.d.ts +3 -0
  25. package/dist/components/Select/instances/single/index.d.ts +3 -0
  26. package/dist/components/Select/instances/styles.d.ts +3 -0
  27. package/dist/components/Select/instances/types.d.ts +12 -0
  28. package/dist/components/Select/styles.d.ts +14 -0
  29. package/dist/components/Select/types.d.ts +75 -0
  30. package/dist/components/index.d.ts +1 -0
  31. package/dist/hooks/index.d.ts +3 -0
  32. package/dist/hooks/useDebouncedCallback/index.d.ts +8 -0
  33. package/dist/hooks/useDebouncedState/index.d.ts +5 -0
  34. package/dist/index.d.mts +85 -3
  35. package/dist/index.js +2399 -521
  36. package/dist/index.mjs +2418 -520
  37. package/dist/interfaces.d.ts +2 -1
  38. package/package.json +5 -1
  39. /package/dist/hooks/{onClickOut.d.ts → useOnClickOut/index.d.ts} +0 -0
@@ -1,6 +1,7 @@
1
1
  import type { GenericObject } from '../../../../../../interfaces';
2
2
  import type { CommonContext, CommonProps, Option } from '../interfaces';
3
3
  export interface SelectProps<T extends GenericObject = GenericObject> extends CommonProps<T> {
4
+ /** @deprecated use MwSelect instead */
4
5
  type: 'select';
5
6
  name?: string;
6
7
  setValue: (value: string, option: Option<T>['data']) => void;
@@ -2,6 +2,7 @@ import type { GenericObject } from '../../../../../../interfaces';
2
2
  import type { CommonContext, CommonProps, Option } from '../interfaces';
3
3
  import type { Limits } from './utils';
4
4
  export interface SelectProps<T extends GenericObject = GenericObject> extends CommonProps<T> {
5
+ /** @deprecated use MwSelect instead */
5
6
  type: 'select-multiple';
6
7
  setValue: (value: string[], data: Option<T>['data'][]) => void;
7
8
  value: (Pick<Option<T>, 'value' | 'data'> | string)[];
@@ -0,0 +1,3 @@
1
+ import type { PopupPlacement, PopupProps } from '../../types';
2
+ declare const useFallbackPlacements: (props: PopupProps) => PopupPlacement[];
3
+ export default useFallbackPlacements;
@@ -0,0 +1,2 @@
1
+ export { default as useFallbackPlacements } from './fallbackPlacements';
2
+ export { default as useOpen } from './open';
@@ -0,0 +1,3 @@
1
+ import type { PopupProps } from '../../types';
2
+ declare const useOpen: (props: PopupProps) => readonly [boolean | undefined, (nextOpen: boolean) => void];
3
+ export default useOpen;
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ import type { PopupProps } from './types';
3
+ declare const Popup: <T extends React.ElementType = "div">(props: PopupProps<T> & {
4
+ enabled?: boolean;
5
+ }) => JSX.Element;
6
+ export default Popup;
@@ -0,0 +1,9 @@
1
+ import type { PopupProps } from './types';
2
+ export declare const TooltipArrow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
3
+ $placement: PopupProps["placement"];
4
+ $arrow?: Exclude<PopupProps["arrow"], "none">;
5
+ }>> & string;
6
+ export declare const TooltipSurface: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
7
+ $placement: PopupProps["placement"];
8
+ $background?: PopupProps["background"];
9
+ }>> & string;
@@ -0,0 +1,17 @@
1
+ export type PopupProps<T extends React.ElementType = 'div'> = {
2
+ content: React.FunctionComponent;
3
+ placement: PopupPlacement;
4
+ on?: 'hover' | 'click';
5
+ triggerType?: T;
6
+ triggerProps?: React.ComponentPropsWithRef<T>;
7
+ renderTrigger: (props: React.ComponentPropsWithRef<T>) => React.ReactNode;
8
+ offset?: number;
9
+ shift?: number;
10
+ background?: 'light' | 'dark';
11
+ arrow?: 'flattened' | 'pointed' | 'none';
12
+ closeOnClip?: boolean;
13
+ open?: boolean;
14
+ setOpen?: (open: boolean) => void;
15
+ fallbackPlacements?: PopupPlacement[];
16
+ };
17
+ export type PopupPlacement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
@@ -0,0 +1,7 @@
1
+ import type { SelectMultiProps } from '../../types';
2
+ type ApplyProps = Pick<Required<SelectMultiProps<unknown>>, 'setValue' | 'clearable' | 'applyRules'> & {
3
+ onClose: () => void;
4
+ draft: Map<string, unknown>;
5
+ };
6
+ declare const Apply: ({ setValue, clearable, applyRules, onClose, draft, }: ApplyProps) => import("react/jsx-runtime").JSX.Element;
7
+ export default Apply;
@@ -0,0 +1 @@
1
+ export declare const ApplyButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
@@ -0,0 +1,20 @@
1
+ import React from 'react';
2
+ import type { VirtualItem, Virtualizer } from '@tanstack/react-virtual';
3
+ import type { SelectKeyBuilder, SelectOptionComponent, SelectRule } from '../../types';
4
+ declare const Scroll: React.ForwardRefExoticComponent<{
5
+ menuId: string;
6
+ options: unknown[];
7
+ virtualItems: VirtualItem[];
8
+ loading: boolean;
9
+ totalSize: number;
10
+ measureElement: Virtualizer<Element, Element>["measureElement"];
11
+ OptionComponent: SelectOptionComponent<unknown>;
12
+ onClickOption: (index: number) => void;
13
+ onMouseEnterOption: (index: number) => void;
14
+ activeIndex: number;
15
+ getKey: SelectKeyBuilder<unknown>;
16
+ getIsSelected: (key: string) => boolean;
17
+ getFailedRuleByKey: Map<string, SelectRule<unknown>>["get"];
18
+ mode: "single" | "multi";
19
+ } & Pick<React.HTMLAttributes<HTMLDivElement>, "aria-multiselectable"> & React.RefAttributes<HTMLDivElement>>;
20
+ export default Scroll;
@@ -0,0 +1,9 @@
1
+ export declare const ListContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
2
+ export declare const ListScroll: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
3
+ export declare const ListInner: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
4
+ export declare const EmptyMessage: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
5
+ export declare const MultiHighlight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
6
+ export declare const SingleHighlight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
7
+ export declare const OptionRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
8
+ $active: boolean;
9
+ }>> & string;
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ declare const Search: React.ForwardRefExoticComponent<{
3
+ menuId: string;
4
+ value: [string, (input: string) => void];
5
+ activeIndex: number;
6
+ } & Required<Pick<React.HTMLAttributes<HTMLInputElement>, "onKeyDown">> & React.RefAttributes<HTMLInputElement>>;
7
+ export default Search;
@@ -0,0 +1 @@
1
+ export declare const SearchContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
@@ -0,0 +1,2 @@
1
+ export declare const SEARCH_DEBOUNCE_MS = 500;
2
+ export declare const MENU_EXIT_MS = 250;
@@ -0,0 +1,5 @@
1
+ export { default as useAsyncOptions } from './useAsyncOptions';
2
+ export { default as useFloatingMenu } from './useFloatingMenu';
3
+ export { default as useListNavigation } from './useListNavigation';
4
+ export { default as useRuleIndex } from './useRuleIndex';
5
+ export { default as useVirtualizedOptions } from './useVirtualizedOptions';
@@ -0,0 +1,8 @@
1
+ import type { SelectOptionsLoader } from '../../types';
2
+ declare const useAsyncOptions: <Option>(loader: SelectOptionsLoader<Option>) => {
3
+ readonly options: Option[];
4
+ readonly loading: boolean;
5
+ readonly paginate: () => void;
6
+ readonly searchInput: readonly [string, (input: string) => void];
7
+ };
8
+ export default useAsyncOptions;
@@ -0,0 +1,50 @@
1
+ type UseFloatingMenuParams = {
2
+ open: boolean;
3
+ onOpenChange: (open: boolean) => void;
4
+ };
5
+ declare const useFloatingMenu: ({ open, onOpenChange }: UseFloatingMenuParams) => {
6
+ floating: {
7
+ placement: import("@floating-ui/utils").Placement;
8
+ strategy: import("@floating-ui/utils").Strategy;
9
+ middlewareData: import("@floating-ui/core").MiddlewareData;
10
+ x: number;
11
+ y: number;
12
+ isPositioned: boolean;
13
+ update: () => void;
14
+ floatingStyles: React.CSSProperties;
15
+ refs: {
16
+ reference: import("react").MutableRefObject<import("@floating-ui/react-dom").ReferenceType | null>;
17
+ floating: React.MutableRefObject<HTMLElement | null>;
18
+ setReference: (node: import("@floating-ui/react-dom").ReferenceType | null) => void;
19
+ setFloating: (node: HTMLElement | null) => void;
20
+ } & import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
21
+ elements: {
22
+ reference: import("@floating-ui/react-dom").ReferenceType | null;
23
+ floating: HTMLElement | null;
24
+ } & import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
25
+ context: {
26
+ x: number;
27
+ y: number;
28
+ placement: import("@floating-ui/utils").Placement;
29
+ strategy: import("@floating-ui/utils").Strategy;
30
+ middlewareData: import("@floating-ui/core").MiddlewareData;
31
+ isPositioned: boolean;
32
+ update: () => void;
33
+ floatingStyles: React.CSSProperties;
34
+ open: boolean;
35
+ onOpenChange: (open: boolean, event?: Event, reason?: import("@floating-ui/react").OpenChangeReason) => void;
36
+ events: import("@floating-ui/react").FloatingEvents;
37
+ dataRef: React.MutableRefObject<import("@floating-ui/react").ContextData>;
38
+ nodeId: string | undefined;
39
+ floatingId: string | undefined;
40
+ refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
41
+ elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
42
+ };
43
+ };
44
+ transition: {
45
+ isMounted: boolean;
46
+ status: "open" | "close" | "initial" | "unmounted";
47
+ };
48
+ interactions: import("@floating-ui/react").UseInteractionsReturn;
49
+ };
50
+ export default useFloatingMenu;
@@ -0,0 +1,13 @@
1
+ import type { KeyboardEvent } from 'react';
2
+ type Params = {
3
+ itemCount: number;
4
+ isItemDisabled: (index: number) => boolean;
5
+ onSelect: (index: number) => void;
6
+ scrollToIndex?: (index: number) => void;
7
+ };
8
+ declare const useListNavigation: ({ itemCount, isItemDisabled, onSelect, scrollToIndex, }: Params) => {
9
+ activeIndex: number;
10
+ onMouseEnter: (index: number) => void;
11
+ onKeyDown: (event: KeyboardEvent) => void;
12
+ };
13
+ export default useListNavigation;
@@ -0,0 +1,11 @@
1
+ import type { SelectKeyBuilder, SelectRule, SelectRules } from '../../types';
2
+ type UseRuleIndexParams<Option> = {
3
+ options: readonly Option[];
4
+ getKey: SelectKeyBuilder<Option>;
5
+ rules?: SelectRules<Option>;
6
+ };
7
+ declare const useRuleIndex: <Option>({ options, getKey, rules, }: UseRuleIndexParams<Option>) => {
8
+ getFailedRuleByKey: (key: string) => SelectRule<Option> | undefined;
9
+ enabledCount: number;
10
+ };
11
+ export default useRuleIndex;
@@ -0,0 +1,13 @@
1
+ import type { CommonSelectProps } from '../../types';
2
+ type Params = {
3
+ optionsLength: number;
4
+ loading: boolean;
5
+ onPaginate: () => void;
6
+ } & Pick<CommonSelectProps<unknown>, 'overscan' | 'estimateSize'>;
7
+ declare const useVirtualizedOptions: (params: Params) => {
8
+ listRef: import("react").MutableRefObject<HTMLDivElement | null>;
9
+ searchRef: import("react").MutableRefObject<HTMLInputElement | null>;
10
+ rowVirtualizer: import("@tanstack/virtual-core").Virtualizer<HTMLDivElement, Element>;
11
+ virtualItems: import("@tanstack/virtual-core").VirtualItem[];
12
+ };
13
+ export default useVirtualizedOptions;
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ import type { SelectProps } from './types';
3
+ declare const _default: (<Option>(props: SelectProps<Option>) => JSX.Element) & {
4
+ OptionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
5
+ };
6
+ export default _default;
@@ -0,0 +1,3 @@
1
+ import type { SelectProps, UseSelect } from './types';
2
+ declare const useSelect: (props: SelectProps<unknown>) => ReturnType<UseSelect>;
3
+ export default useSelect;
@@ -0,0 +1,3 @@
1
+ import type { SelectMultiProps, UseSelect } from '../types';
2
+ declare const useMultiSelect: UseSelect<SelectMultiProps<unknown>>;
3
+ export default useMultiSelect;
@@ -0,0 +1,3 @@
1
+ import type { SelectSingleProps, UseSelect } from '../types';
2
+ declare const useSingleSelect: UseSelect<SelectSingleProps<unknown>>;
3
+ export default useSingleSelect;
@@ -0,0 +1,3 @@
1
+ export declare const Header: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
2
+ export declare const DraftSwitch: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
3
+ export declare const SelectAllButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
@@ -0,0 +1,12 @@
1
+ import type { CommonSelectProps, SelectButtonProps } from '../types';
2
+ export type UseSelect<Props extends CommonSelectProps<unknown> = CommonSelectProps<unknown>> = (props: Props) => {
3
+ placeholder: React.ReactNode;
4
+ isEmpty: boolean;
5
+ onClear: () => void;
6
+ Component: React.FunctionComponent<Props & {
7
+ menuId: string;
8
+ onClose: () => void;
9
+ }>;
10
+ buttonProps: SelectButtonProps;
11
+ };
12
+ export * from '../types';
@@ -0,0 +1,14 @@
1
+ export declare const FloatingWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
2
+ type TriggerProps = {
3
+ $empty: boolean;
4
+ $open: boolean;
5
+ $viewMode: boolean | undefined;
6
+ };
7
+ export declare const Trigger: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, TriggerProps>> & string;
8
+ export declare const TriggerValue: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
9
+ type LabelProps = {
10
+ $viewMode: boolean | undefined;
11
+ };
12
+ export declare const Label: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, LabelProps>> & string;
13
+ export declare const OptionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
14
+ export {};
@@ -0,0 +1,75 @@
1
+ import type React from 'react';
2
+ import type { ReactVirtualizerOptions } from '@tanstack/react-virtual';
3
+ export type SelectOptionsLoader<Option> = (search: string, page: number, cursor: Option | null) => Promise<{
4
+ options: Option[];
5
+ last: boolean;
6
+ } | null>;
7
+ export type SelectOptionsFinder<Option> = (search: string, options: Option[]) => Option[];
8
+ export type SelectKeyBuilder<Option> = (option: Option) => string;
9
+ export type SelectRuleComponent<Option> = React.FunctionComponent<{
10
+ option: Option;
11
+ }>;
12
+ export type SelectRule<Option, Id extends string = string> = {
13
+ id: Id;
14
+ allow: (option: Option) => boolean;
15
+ Component?: SelectRuleComponent<Option>;
16
+ };
17
+ export type SelectRules<T> = readonly SelectRule<T, string>[];
18
+ export type SelectApplyRuleComponent<Option> = React.FunctionComponent<{
19
+ value: Option[];
20
+ }>;
21
+ export type SelectApplyRule<Option, Id extends string = string> = {
22
+ id: Id;
23
+ allow: (option: Option[]) => boolean;
24
+ Component?: SelectApplyRuleComponent<Option>;
25
+ };
26
+ export type SelectApplyRules<T> = readonly SelectApplyRule<T, string>[];
27
+ export type SelectOptionComponent<Option> = React.FunctionComponent<{
28
+ option: Option;
29
+ isActive: boolean;
30
+ isSelected: boolean;
31
+ isDisabled: boolean;
32
+ }>;
33
+ export type SelectButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'value' | 'role' | 'aria-haspopup' | 'aria-expanded' | 'aria-controls' | 'aria-readonly' | 'aria-invalid' | 'aria-required'>;
34
+ export type CommonSelectProps<Option> = SelectButtonProps & {
35
+ label?: React.ReactNode;
36
+ loader: SelectOptionsLoader<Option>;
37
+ getKey: SelectKeyBuilder<Option>;
38
+ OptionComponent: SelectOptionComponent<Option>;
39
+ rules?: SelectRules<Option>;
40
+ placeholder?: string;
41
+ required?: boolean;
42
+ invalid?: boolean;
43
+ clearable?: boolean;
44
+ readOnly?: boolean;
45
+ viewMode?: boolean;
46
+ /**
47
+ * The number of items to render above and below the visible area.
48
+ * The default is 2.
49
+ * @see https://tanstack.com/virtual/latest/docs/api/virtualizer#overscan
50
+ */
51
+ overscan?: ReactVirtualizerOptions<Element, Element>['overscan'];
52
+ /**
53
+ * This function is passed the index of each item and should return the actual size (or estimated size if you will be dynamically measuring items with virtualItem.measureElement) for each item.
54
+ * The default is 46.
55
+ * @see https://tanstack.com/virtual/latest/docs/api/virtualizer#estimatesize
56
+ */
57
+ estimateSize?: ReactVirtualizerOptions<Element, Element>['estimateSize'] | number;
58
+ height?: number;
59
+ };
60
+ export type SelectSingleProps<Option> = CommonSelectProps<Option> & {
61
+ value: Option | null;
62
+ setValue: (value: Option | null) => void;
63
+ ValueComponent?: SelectOptionComponent<Option>;
64
+ };
65
+ export type SelectMultiProps<Option> = CommonSelectProps<Option> & {
66
+ value: Option[];
67
+ setValue: (value: Option[]) => void;
68
+ finder: SelectOptionsFinder<Option>;
69
+ applyRules?: SelectApplyRules<Option>;
70
+ };
71
+ export type SelectProps<Option> = ({
72
+ type: 'single-select';
73
+ } & SelectSingleProps<Option>) | ({
74
+ type: 'multi-select';
75
+ } & SelectMultiProps<Option>);
@@ -17,6 +17,7 @@ export { default as MwModal } from './Modal';
17
17
  export { default as MwPlaceholder } from './Placeholder';
18
18
  export { default as MwProgressBar } from './ProgressBar';
19
19
  export { default as MwScrollContainer } from './ScrollContainer';
20
+ export { default as MwSelect } from './Select';
20
21
  export { default as MwSignature } from './Signature';
21
22
  export { default as MwTabs } from './Tabs';
22
23
  export { default as MwTextArea } from './TextArea';
@@ -0,0 +1,3 @@
1
+ export { default as useDebouncedCallback } from './useDebouncedCallback';
2
+ export { default as useDebouncedState } from './useDebouncedState';
3
+ export { default as useOnClickOut } from './useOnClickOut';
@@ -0,0 +1,8 @@
1
+ export type DebouncedFunction<T extends (...args: never[]) => unknown> = {
2
+ (...args: Parameters<T>): void;
3
+ cancel: () => void;
4
+ flush: () => void;
5
+ };
6
+ export declare const debounce: <T extends (...args: never[]) => unknown>(fn: T, delay: number) => DebouncedFunction<T>;
7
+ export declare const useDebouncedCallback: <T extends (...args: never[]) => unknown>(callback: T, delay: number) => DebouncedFunction<T>;
8
+ export default useDebouncedCallback;
@@ -0,0 +1,5 @@
1
+ declare const useDebouncedState: <T>(initial: T, onUpdate: () => void, ms: number) => {
2
+ readonly current: readonly [T, (input: T) => void];
3
+ readonly debounced: readonly [T, (value: T) => void];
4
+ };
5
+ export default useDebouncedState;
package/dist/index.d.mts CHANGED
@@ -4,6 +4,8 @@ import * as React$1 from 'react';
4
4
  import React__default, { TextareaHTMLAttributes } from 'react';
5
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
6
  import { PopupProps, SemanticICONS } from 'semantic-ui-react';
7
+ import * as styled_components_dist_types from 'styled-components/dist/types';
8
+ import { ReactVirtualizerOptions } from '@tanstack/react-virtual';
7
9
  import SignatureCanvas, { SignatureCanvasProps } from 'react-signature-canvas';
8
10
 
9
11
  type TransitionFunction = 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'linear' | 'step-start' | 'step-end' | `cubic-bezier(${number}, ${number}, ${number}, ${number})` | `frames(${number})` | `steps(${number})` | `steps(${number}, ${'jump-start' | 'jump-end' | 'jump-none' | 'jump-both' | 'start' | 'end'})`;
@@ -855,8 +857,82 @@ interface TabsProps<T = EmptyObject, C extends string = string> extends Omit<Rea
855
857
  }
856
858
  type TabsComponent = <T = EmptyObject, C extends string = string>(props: TabsProps<T, C>) => JSX.Element;
857
859
 
858
- type Element = JSX.Element | string | number | boolean | null;
859
- type ReactNode = Element | Element[];
860
+ type SelectOptionsLoader<Option> = (search: string, page: number, cursor: Option | null) => Promise<{
861
+ options: Option[];
862
+ last: boolean;
863
+ } | null>;
864
+ type SelectOptionsFinder<Option> = (search: string, options: Option[]) => Option[];
865
+ type SelectKeyBuilder<Option> = (option: Option) => string;
866
+ type SelectRuleComponent<Option> = React__default.FunctionComponent<{
867
+ option: Option;
868
+ }>;
869
+ type SelectRule<Option, Id extends string = string> = {
870
+ id: Id;
871
+ allow: (option: Option) => boolean;
872
+ Component?: SelectRuleComponent<Option>;
873
+ };
874
+ type SelectRules<T> = readonly SelectRule<T, string>[];
875
+ type SelectApplyRuleComponent<Option> = React__default.FunctionComponent<{
876
+ value: Option[];
877
+ }>;
878
+ type SelectApplyRule<Option, Id extends string = string> = {
879
+ id: Id;
880
+ allow: (option: Option[]) => boolean;
881
+ Component?: SelectApplyRuleComponent<Option>;
882
+ };
883
+ type SelectApplyRules<T> = readonly SelectApplyRule<T, string>[];
884
+ type SelectOptionComponent<Option> = React__default.FunctionComponent<{
885
+ option: Option;
886
+ isActive: boolean;
887
+ isSelected: boolean;
888
+ isDisabled: boolean;
889
+ }>;
890
+ type SelectButtonProps = Omit<React__default.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'value' | 'role' | 'aria-haspopup' | 'aria-expanded' | 'aria-controls' | 'aria-readonly' | 'aria-invalid' | 'aria-required'>;
891
+ type CommonSelectProps<Option> = SelectButtonProps & {
892
+ label?: React__default.ReactNode;
893
+ loader: SelectOptionsLoader<Option>;
894
+ getKey: SelectKeyBuilder<Option>;
895
+ OptionComponent: SelectOptionComponent<Option>;
896
+ rules?: SelectRules<Option>;
897
+ placeholder?: string;
898
+ required?: boolean;
899
+ invalid?: boolean;
900
+ clearable?: boolean;
901
+ readOnly?: boolean;
902
+ viewMode?: boolean;
903
+ /**
904
+ * The number of items to render above and below the visible area.
905
+ * The default is 2.
906
+ * @see https://tanstack.com/virtual/latest/docs/api/virtualizer#overscan
907
+ */
908
+ overscan?: ReactVirtualizerOptions<Element, Element>['overscan'];
909
+ /**
910
+ * This function is passed the index of each item and should return the actual size (or estimated size if you will be dynamically measuring items with virtualItem.measureElement) for each item.
911
+ * The default is 46.
912
+ * @see https://tanstack.com/virtual/latest/docs/api/virtualizer#estimatesize
913
+ */
914
+ estimateSize?: ReactVirtualizerOptions<Element, Element>['estimateSize'] | number;
915
+ height?: number;
916
+ };
917
+ type SelectSingleProps<Option> = CommonSelectProps<Option> & {
918
+ value: Option | null;
919
+ setValue: (value: Option | null) => void;
920
+ ValueComponent?: SelectOptionComponent<Option>;
921
+ };
922
+ type SelectMultiProps<Option> = CommonSelectProps<Option> & {
923
+ value: Option[];
924
+ setValue: (value: Option[]) => void;
925
+ finder: SelectOptionsFinder<Option>;
926
+ applyRules?: SelectApplyRules<Option>;
927
+ };
928
+ type SelectProps$3<Option> = ({
929
+ type: 'single-select';
930
+ } & SelectSingleProps<Option>) | ({
931
+ type: 'multi-select';
932
+ } & SelectMultiProps<Option>);
933
+
934
+ type Element$1 = JSX.Element | string | number | boolean | null;
935
+ type ReactNode = Element$1 | Element$1[];
860
936
  type GenericObject = Record<string | number | symbol, any>;
861
937
  type EmptyObject = Record<string, never>;
862
938
  type SpacingOrZero = keyof typeof spacings | '0';
@@ -1390,6 +1466,7 @@ interface RangeProps extends Omit<React__default.InputHTMLAttributes<HTMLInputEl
1390
1466
  }
1391
1467
 
1392
1468
  interface SelectProps$2<T extends GenericObject = GenericObject> extends CommonProps$1<T> {
1469
+ /** @deprecated use MwSelect instead */
1393
1470
  type: 'select';
1394
1471
  name?: string;
1395
1472
  setValue: (value: string, option: Option$1<T>['data']) => void;
@@ -1399,6 +1476,7 @@ interface SelectProps$2<T extends GenericObject = GenericObject> extends CommonP
1399
1476
  }
1400
1477
 
1401
1478
  interface SelectProps$1<T extends GenericObject = GenericObject> extends CommonProps$1<T> {
1479
+ /** @deprecated use MwSelect instead */
1402
1480
  type: 'select-multiple';
1403
1481
  setValue: (value: string[], data: Option$1<T>['data'][]) => void;
1404
1482
  value: (Pick<Option$1<T>, 'value' | 'data'> | string)[];
@@ -1567,6 +1645,10 @@ declare const ProgressBar: ({ type, value, ...props }: ProgressBarProps) => reac
1567
1645
 
1568
1646
  declare const ScrollContainer: React__default.ForwardRefExoticComponent<ScrollContainerProps & React__default.RefAttributes<HTMLDivElement>>;
1569
1647
 
1648
+ declare const _default: (<Option>(props: SelectProps$3<Option>) => JSX.Element) & {
1649
+ OptionContainer: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
1650
+ };
1651
+
1570
1652
  type SignatureInputProps = {
1571
1653
  setValue: (base64: string) => void;
1572
1654
  value: string;
@@ -1631,4 +1713,4 @@ declare const ThemeProvider: (props: React.PropsWithChildren<{
1631
1713
  assetBaseUrl: string;
1632
1714
  }>) => react_jsx_runtime.JSX.Element;
1633
1715
 
1634
- export { AbsoluteContainer as MwAbsoluteContainer, AppliedFilters as MwAppliedFilters, Button as MwButton, Calendar as MwCalendar, Card as MwCard, EllipsisContainer as MwEllipsisContainer, Filters as MwFilters, Form as MwForm, Grid as MwGrid, Icon as MwIcon, Indicator as MwIndicator, Input as MwInput, Link as MwLink, Loader as MwLoader, Menu as MwMenu, Modal as MwModal, Placeholder as MwPlaceholder, ProgressBar as MwProgressBar, ScrollContainer as MwScrollContainer, SignatureInput as MwSignature, Tabs as MwTabs, TextArea as MwTextArea, Toast as MwToast, Transition as MwTransition, Zoom as MwZoom, ThemeProvider, theme, useTransition as useMwTransition };
1716
+ export { AbsoluteContainer as MwAbsoluteContainer, AppliedFilters as MwAppliedFilters, Button as MwButton, Calendar as MwCalendar, Card as MwCard, EllipsisContainer as MwEllipsisContainer, Filters as MwFilters, Form as MwForm, Grid as MwGrid, Icon as MwIcon, Indicator as MwIndicator, Input as MwInput, Link as MwLink, Loader as MwLoader, Menu as MwMenu, Modal as MwModal, Placeholder as MwPlaceholder, ProgressBar as MwProgressBar, ScrollContainer as MwScrollContainer, _default as MwSelect, SignatureInput as MwSignature, Tabs as MwTabs, TextArea as MwTextArea, Toast as MwToast, Transition as MwTransition, Zoom as MwZoom, ThemeProvider, theme, useTransition as useMwTransition };