@reportportal/ui-kit 0.0.1-alpha.3 → 0.0.1-alpha.31
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.
- package/LICENSE +201 -201
- package/README.md +229 -3
- package/dist/baseIconButton-b6adc843.js +25 -0
- package/dist/baseIconButton.js +7 -0
- package/dist/bind-06a7ff84.js +41 -0
- package/dist/bubblesLoader-a7e709d4.js +17 -0
- package/dist/bubblesLoader.js +7 -0
- package/dist/button-33c88abf.js +62 -0
- package/dist/button.js +2 -2
- package/dist/checkbox-9a6c7ce1.js +73 -0
- package/dist/checkbox.js +3 -3
- package/dist/common/constants/keyCodes.d.ts +24 -0
- package/dist/components/bubblesLoader/bubblesLoader.d.ts +7 -0
- package/dist/components/bubblesLoader/index.d.ts +3 -0
- package/dist/components/button/button.d.ts +2 -3
- package/dist/components/button/index.d.ts +2 -2
- package/dist/components/checkbox/checkbox.d.ts +2 -1
- package/dist/components/datePicker/datePicker.d.ts +24 -0
- package/dist/components/datePicker/header/datePickerHeader.d.ts +15 -0
- package/dist/components/datePicker/header/index.d.ts +3 -0
- package/dist/components/datePicker/index.d.ts +3 -0
- package/dist/components/datePicker/utils.d.ts +3 -0
- package/dist/components/dropdown/constants.d.ts +7 -0
- package/dist/components/dropdown/dropdown.d.ts +24 -0
- package/dist/components/dropdown/dropdownOption/dropdownOption.d.ts +3 -0
- package/dist/components/dropdown/dropdownOption/index.d.ts +3 -0
- package/dist/components/dropdown/index.d.ts +3 -0
- package/dist/components/dropdown/types.d.ts +20 -0
- package/dist/components/dropdown/utils.d.ts +4 -0
- package/dist/components/fieldNumber/constants.d.ts +4 -0
- package/dist/components/fieldNumber/fieldNumber.d.ts +18 -0
- package/dist/components/fieldNumber/index.d.ts +3 -0
- package/dist/components/fieldText/fieldText.d.ts +8 -3
- package/dist/components/fieldTextFlex/fieldTextFlex.d.ts +14 -0
- package/dist/components/fieldTextFlex/index.d.ts +3 -0
- package/dist/components/icons/baseIconButton/baseIconButton.d.ts +8 -0
- package/dist/components/icons/baseIconButton/index.d.ts +4 -0
- package/dist/components/icons/index.d.ts +15 -0
- package/dist/components/index.d.ts +13 -0
- package/dist/components/modal/modal.d.ts +6 -2
- package/dist/components/modal/modalContent/modalContent.d.ts +1 -0
- package/dist/components/modal/modalHeader/modalHeader.d.ts +1 -1
- package/dist/components/pagination/index.d.ts +4 -0
- package/dist/components/pagination/itemsCounter/index.d.ts +1 -0
- package/dist/components/pagination/itemsCounter/itemCounter.d.ts +9 -0
- package/dist/components/pagination/pageControls/activePage/activePage.d.ts +12 -0
- package/dist/components/pagination/pageControls/activePage/index.d.ts +1 -0
- package/dist/components/pagination/pageControls/activePage/pageSelector/index.d.ts +1 -0
- package/dist/components/pagination/pageControls/activePage/pageSelector/pageSelector.d.ts +10 -0
- package/dist/components/pagination/pageControls/index.d.ts +1 -0
- package/dist/components/pagination/pageControls/pageControls.d.ts +16 -0
- package/dist/components/pagination/pageControls/pageNavigator/bar/bar.d.ts +11 -0
- package/dist/components/pagination/pageControls/pageNavigator/bar/index.d.ts +1 -0
- package/dist/components/pagination/pageControls/pageNavigator/index.d.ts +1 -0
- package/dist/components/pagination/pageControls/pageNavigator/pageNavigator.d.ts +11 -0
- package/dist/components/pagination/pageSizeControl/index.d.ts +1 -0
- package/dist/components/pagination/pageSizeControl/pageSizeControl.d.ts +10 -0
- package/dist/components/pagination/pageSizeControl/sizeSelector/index.d.ts +1 -0
- package/dist/components/pagination/pageSizeControl/sizeSelector/sizeSelector.d.ts +8 -0
- package/dist/components/pagination/pagination.d.ts +22 -0
- package/dist/components/pagination/types.d.ts +2 -0
- package/dist/components/popover/index.d.ts +1 -0
- package/dist/components/popover/popover.d.ts +18 -0
- package/dist/components/radio/index.d.ts +4 -0
- package/dist/components/radio/radio.d.ts +16 -0
- package/dist/components/radio/radioGroup.d.ts +8 -0
- package/dist/components/spinLoader/index.d.ts +3 -0
- package/dist/components/spinLoader/spinLoader.d.ts +7 -0
- package/dist/components/table/index.d.ts +3 -0
- package/dist/components/table/table.d.ts +3 -0
- package/dist/components/table/types.d.ts +49 -0
- package/dist/components/table/utils.d.ts +3 -0
- package/dist/components/themeProvider/themeProvider.d.ts +2 -1
- package/dist/components/toggle/index.d.ts +3 -0
- package/dist/components/toggle/toggle.d.ts +11 -0
- package/dist/components/tooltip/index.d.ts +1 -0
- package/dist/components/tooltip/tooltip.d.ts +19 -0
- package/dist/dropdown-c21b0d67.js +216 -0
- package/dist/dropdown.js +14 -0
- package/dist/fieldNumber-1f286b40.js +127 -0
- package/dist/fieldNumber.js +10 -0
- package/dist/fieldText-14bf032f.js +133 -0
- package/dist/fieldText.js +3 -2
- package/dist/fieldTextFlex-5bddf46a.js +67 -0
- package/dist/fieldTextFlex.js +8 -0
- package/dist/index-54e3bfc2.js +147 -0
- package/dist/index.js +245 -16
- package/dist/keyCodes-f63c0e11.js +4 -0
- package/dist/modal.js +14 -135
- package/dist/pagination-ac3ea7c4.js +346 -0
- package/dist/pagination.js +14 -0
- package/dist/popover.js +95 -0
- package/dist/radio-bccc84f2.js +76 -0
- package/dist/radio.js +9 -0
- package/dist/style.css +1 -1
- package/dist/systemMessage-1ced6079.js +30 -0
- package/dist/systemMessage.js +2 -2
- package/dist/table-cb8f9516.js +147 -0
- package/dist/table.js +11 -0
- package/dist/themeProvider-46c2be7b.js +23 -0
- package/dist/themeProvider.js +4 -3
- package/dist/toggle-4cdbcc42.js +59 -0
- package/dist/toggle.js +9 -0
- package/dist/tooltip.js +96 -0
- package/dist/useOnClickOutside-c332f7d3.js +16 -0
- package/package.json +96 -66
- package/dist/button-15f7c4a6.js +0 -64
- package/dist/checkbox-e6a5c84a.js +0 -70
- package/dist/common/constants/key-codes.d.ts +0 -5
- package/dist/fieldText-dc43f641.js +0 -99
- package/dist/key-codes-abbe7725.js +0 -4
- package/dist/systemMessage-dd6e4795.js +0 -30
- package/dist/themeProvider-5800417e.js +0 -19
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChangePage } from '../../types';
|
|
3
|
+
interface ActivePageProps {
|
|
4
|
+
activePage: number;
|
|
5
|
+
totalPages: number;
|
|
6
|
+
pageText: string;
|
|
7
|
+
goToText: string;
|
|
8
|
+
goActionText: string;
|
|
9
|
+
changePage: ChangePage;
|
|
10
|
+
}
|
|
11
|
+
export declare const ActivePage: FC<ActivePageProps>;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { ActivePage } from './activePage';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { PageSelector } from './pageSelector';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChangePage } from '../../../types';
|
|
3
|
+
interface PageSelectorProps {
|
|
4
|
+
pageText: string;
|
|
5
|
+
goActionText: string;
|
|
6
|
+
totalPages: number;
|
|
7
|
+
selectPage: ChangePage;
|
|
8
|
+
}
|
|
9
|
+
export declare const PageSelector: FC<PageSelectorProps>;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { PageControls } from './pageControls';
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChangePage } from '../types';
|
|
3
|
+
type PageControlsCaptions = {
|
|
4
|
+
page: string;
|
|
5
|
+
goTo: string;
|
|
6
|
+
goAction: string;
|
|
7
|
+
of: string;
|
|
8
|
+
};
|
|
9
|
+
export interface PageControlsProps {
|
|
10
|
+
activePage: number;
|
|
11
|
+
totalPages: number;
|
|
12
|
+
changePage: ChangePage;
|
|
13
|
+
captions: PageControlsCaptions;
|
|
14
|
+
}
|
|
15
|
+
export declare const PageControls: FC<PageControlsProps>;
|
|
16
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Bar } from './bar';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { PageNavigator } from './pageNavigator';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChangePage } from '../../types';
|
|
3
|
+
export interface PageNavigatorProps {
|
|
4
|
+
activePage: number;
|
|
5
|
+
totalPages: number;
|
|
6
|
+
changePage: ChangePage;
|
|
7
|
+
captions: {
|
|
8
|
+
goTo: string;
|
|
9
|
+
};
|
|
10
|
+
}
|
|
11
|
+
export declare const PageNavigator: FC<PageNavigatorProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { PageSizeControl } from './pageSizeControl';
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChangePageSize } from '../types';
|
|
3
|
+
interface PageSizeControlProps {
|
|
4
|
+
size: number;
|
|
5
|
+
sizeOptions: number[];
|
|
6
|
+
perPageText: string;
|
|
7
|
+
changeSize: ChangePageSize;
|
|
8
|
+
}
|
|
9
|
+
export declare const PageSizeControl: FC<PageSizeControlProps>;
|
|
10
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { SizeSelector } from './sizeSelector';
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ChangePageSize, ChangePage } from './types';
|
|
3
|
+
type PaginationCaptions = {
|
|
4
|
+
items?: string;
|
|
5
|
+
of?: string;
|
|
6
|
+
page?: string;
|
|
7
|
+
goTo?: string;
|
|
8
|
+
goAction?: string;
|
|
9
|
+
perPage?: string;
|
|
10
|
+
};
|
|
11
|
+
export interface PaginationProps {
|
|
12
|
+
activePage: number;
|
|
13
|
+
totalPages: number;
|
|
14
|
+
pageSize: number;
|
|
15
|
+
totalItems: number;
|
|
16
|
+
pageSizeOptions: number[];
|
|
17
|
+
changePage: ChangePage;
|
|
18
|
+
changePageSize: ChangePageSize;
|
|
19
|
+
captions?: PaginationCaptions;
|
|
20
|
+
}
|
|
21
|
+
export declare const Pagination: FC<PaginationProps>;
|
|
22
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Popover } from './popover';
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
|
+
import { Placement } from '@floating-ui/react';
|
|
3
|
+
interface PopoverProps {
|
|
4
|
+
className?: string;
|
|
5
|
+
content: ReactNode;
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
placement?: Placement;
|
|
8
|
+
fallbackPlacements?: Placement[];
|
|
9
|
+
title?: string;
|
|
10
|
+
arrowOffset?: number;
|
|
11
|
+
safeZone?: number;
|
|
12
|
+
arrowColor?: string;
|
|
13
|
+
dataAutomationId?: string;
|
|
14
|
+
isOpened?: boolean;
|
|
15
|
+
setIsOpened?: (isOpened: boolean) => void;
|
|
16
|
+
}
|
|
17
|
+
export declare const Popover: FC<PopoverProps>;
|
|
18
|
+
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ChangeEventHandler, HTMLAttributes, ReactNode, FC } from 'react';
|
|
2
|
+
export type RadioValue = string | number;
|
|
3
|
+
export type RadioOption = {
|
|
4
|
+
value: RadioValue;
|
|
5
|
+
label: string;
|
|
6
|
+
disabled: boolean;
|
|
7
|
+
};
|
|
8
|
+
export interface RadioProps extends HTMLAttributes<HTMLInputElement> {
|
|
9
|
+
option: RadioOption;
|
|
10
|
+
value?: RadioValue;
|
|
11
|
+
children?: ReactNode;
|
|
12
|
+
className?: string;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
onChange?: ChangeEventHandler<HTMLInputElement>;
|
|
15
|
+
}
|
|
16
|
+
export declare const Radio: FC<RadioProps>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { RadioProps } from './index';
|
|
3
|
+
import { RadioOption } from './radio';
|
|
4
|
+
interface RadioGroupProps extends Omit<RadioProps, 'option'> {
|
|
5
|
+
options: RadioOption[];
|
|
6
|
+
}
|
|
7
|
+
export declare const RadioGroup: FC<RadioGroupProps>;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export interface Column {
|
|
3
|
+
key: string;
|
|
4
|
+
header: string;
|
|
5
|
+
}
|
|
6
|
+
export interface PrimaryColumn extends Column {
|
|
7
|
+
primary: boolean;
|
|
8
|
+
}
|
|
9
|
+
export interface FixedColumn extends Column {
|
|
10
|
+
width: string | number;
|
|
11
|
+
align?: 'left' | 'center' | 'right';
|
|
12
|
+
}
|
|
13
|
+
export interface RowConfigs {
|
|
14
|
+
size?: 'small' | 'medium' | 'large';
|
|
15
|
+
}
|
|
16
|
+
export interface DetailedCellData {
|
|
17
|
+
content: string | number;
|
|
18
|
+
component: ReactNode;
|
|
19
|
+
}
|
|
20
|
+
export interface RowData {
|
|
21
|
+
id: string | number;
|
|
22
|
+
[key: string]: DetailedCellData | RowConfigs | string | number | any;
|
|
23
|
+
rowConfigs?: RowConfigs;
|
|
24
|
+
}
|
|
25
|
+
export declare enum SortDirection {
|
|
26
|
+
ASC = "asc",
|
|
27
|
+
DESC = "desc"
|
|
28
|
+
}
|
|
29
|
+
export interface SortConfig {
|
|
30
|
+
key: string;
|
|
31
|
+
direction: SortDirection;
|
|
32
|
+
}
|
|
33
|
+
export interface TableComponentProps {
|
|
34
|
+
data: RowData[];
|
|
35
|
+
primaryColumn: Column;
|
|
36
|
+
fixedColumns: FixedColumn[];
|
|
37
|
+
rowActionMenu?: ReactNode;
|
|
38
|
+
selectable?: boolean;
|
|
39
|
+
className?: string;
|
|
40
|
+
headerClassName?: string;
|
|
41
|
+
rowClassName?: string;
|
|
42
|
+
selectedRowIds?: (string | number)[];
|
|
43
|
+
sortingDirection?: SortDirection;
|
|
44
|
+
sortingColumn?: Column;
|
|
45
|
+
sortableColumns?: string[];
|
|
46
|
+
onChangeSorting?: (sortConfig?: SortConfig) => void;
|
|
47
|
+
onToggleRowSelection?: (id: string | number) => void;
|
|
48
|
+
onToggleAllRowsSelection?: () => void;
|
|
49
|
+
}
|
|
@@ -7,6 +7,7 @@ interface IThemeProviderProps {
|
|
|
7
7
|
children?: ReactNode;
|
|
8
8
|
theme?: ThemeKey;
|
|
9
9
|
customThemes?: ITheme;
|
|
10
|
+
className?: string;
|
|
10
11
|
}
|
|
11
|
-
export declare function ThemeProvider({ children, theme, customThemes, }: IThemeProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare function ThemeProvider({ children, theme, customThemes, className, }: IThemeProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
12
13
|
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { ChangeEventHandler, FC, HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
interface ToggleProps extends HTMLAttributes<HTMLInputElement> {
|
|
3
|
+
value: boolean;
|
|
4
|
+
title?: string;
|
|
5
|
+
children?: ReactNode;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
className?: string;
|
|
8
|
+
onChange?: ChangeEventHandler<HTMLInputElement>;
|
|
9
|
+
}
|
|
10
|
+
export declare const Toggle: FC<ToggleProps>;
|
|
11
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Tooltip } from './tooltip';
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { FC, ReactNode } from 'react';
|
|
2
|
+
import { Placement } from '@floating-ui/react';
|
|
3
|
+
interface TooltipProps {
|
|
4
|
+
content: ReactNode;
|
|
5
|
+
children: ReactNode;
|
|
6
|
+
wrapperClassName?: string;
|
|
7
|
+
contentClassName?: string;
|
|
8
|
+
dynamicWidth?: boolean;
|
|
9
|
+
width?: number;
|
|
10
|
+
minWidth?: number;
|
|
11
|
+
placement?: Placement;
|
|
12
|
+
dataAutomationId?: string;
|
|
13
|
+
arrowColor?: string;
|
|
14
|
+
safeZone?: number;
|
|
15
|
+
zIndex?: number;
|
|
16
|
+
mainAxis?: boolean;
|
|
17
|
+
}
|
|
18
|
+
export declare const Tooltip: FC<TooltipProps>;
|
|
19
|
+
export {};
|
|
@@ -0,0 +1,216 @@
|
|
|
1
|
+
import { jsx as d, jsxs as L } from "react/jsx-runtime";
|
|
2
|
+
import * as R from "react";
|
|
3
|
+
import { forwardRef as B, useState as Y, useRef as ee } from "react";
|
|
4
|
+
import { c as A } from "./bind-06a7ff84.js";
|
|
5
|
+
import { useFloating as te, offset as ne, flip as oe } from "@floating-ui/react-dom";
|
|
6
|
+
import { useSelect as N } from "downshift";
|
|
7
|
+
import { Scrollbars as se } from "rc-scrollbars";
|
|
8
|
+
import { u as ae } from "./useOnClickOutside-c332f7d3.js";
|
|
9
|
+
import { K as h } from "./keyCodes-f63c0e11.js";
|
|
10
|
+
import { B as de } from "./baseIconButton-b6adc843.js";
|
|
11
|
+
const le = (t) => /* @__PURE__ */ R.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ R.createElement("path", { d: "M14.2174 5.82426C14.3736 5.66805 14.3736 5.41479 14.2174 5.25858L14.0759 5.11716C13.9197 4.96095 13.6665 4.96095 13.5103 5.11716L8.16726 10.4602L2.82426 5.11716C2.66805 4.96095 2.41479 4.96095 2.25858 5.11716L2.11716 5.25858C1.96095 5.41479 1.96095 5.66805 2.11716 5.82426L7.89176 11.5989C8.04797 11.7551 8.30124 11.7551 8.45745 11.5989L8.88171 11.1746L8.87436 11.1673L14.2174 5.82426Z", fill: "#A2AAB5" })), re = "_disabled_f4c9h_11", ie = "_hidden_f4c9h_15", ce = "_selected_f4c9h_21", _e = "_hover_f4c9h_24", he = {
|
|
12
|
+
"dropdown-option": "_dropdown-option_f4c9h_1",
|
|
13
|
+
disabled: re,
|
|
14
|
+
hidden: ie,
|
|
15
|
+
selected: ce,
|
|
16
|
+
hover: _e,
|
|
17
|
+
"single-option": "_single-option_f4c9h_37",
|
|
18
|
+
"sub-option": "_sub-option_f4c9h_45"
|
|
19
|
+
}, P = A.bind(he), fe = B(
|
|
20
|
+
(t, n) => {
|
|
21
|
+
const {
|
|
22
|
+
option: { value: a, disabled: f, hidden: w, label: l, title: o, groupRef: O },
|
|
23
|
+
selected: b,
|
|
24
|
+
onChange: g,
|
|
25
|
+
render: p,
|
|
26
|
+
highlightHovered: E,
|
|
27
|
+
onMouseEnter: m
|
|
28
|
+
} = t, D = () => {
|
|
29
|
+
g && g(a);
|
|
30
|
+
};
|
|
31
|
+
return /* @__PURE__ */ d(
|
|
32
|
+
"div",
|
|
33
|
+
{
|
|
34
|
+
className: P("dropdown-option", {
|
|
35
|
+
selected: b,
|
|
36
|
+
disabled: f,
|
|
37
|
+
hidden: w,
|
|
38
|
+
hover: E
|
|
39
|
+
}),
|
|
40
|
+
title: o,
|
|
41
|
+
onClick: D,
|
|
42
|
+
ref: n,
|
|
43
|
+
onMouseEnter: m,
|
|
44
|
+
children: /* @__PURE__ */ d("div", { className: P("single-option", { "sub-option": !!O }), children: p ? p(t) : l })
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
}
|
|
48
|
+
), pe = [
|
|
49
|
+
h.ENTER_KEY_CODE,
|
|
50
|
+
h.SPACE_KEY_CODE,
|
|
51
|
+
h.ARROW_DOWN_KEY_CODE
|
|
52
|
+
], ge = [h.ESCAPE_KEY_CODE, h.TAB_KEY_CODE];
|
|
53
|
+
var _ = /* @__PURE__ */ ((t) => (t.ON_KEY_DOWN = "onKeyDown", t.ON_CLICK = "onClick", t))(_ || {});
|
|
54
|
+
const me = (t, n) => t.map(({ value: a }) => a).indexOf(n), ue = (t, n) => (t % n + n) % n, K = (t, n = 0, a = 1) => {
|
|
55
|
+
if (!t[n].disabled)
|
|
56
|
+
return n;
|
|
57
|
+
const f = t.length;
|
|
58
|
+
return K(
|
|
59
|
+
t,
|
|
60
|
+
ue(n + a, f),
|
|
61
|
+
a
|
|
62
|
+
);
|
|
63
|
+
}, ve = (t, n) => K(t, n), Ce = (t, n) => K(t, n, -1), we = "_container_vh03o_1", Oe = "_icon_vh03o_7", be = "_arrow_vh03o_13", Ee = "_dropdown_vh03o_19", De = "_disabled_vh03o_36", Ne = "_value_vh03o_43", Ke = "_error_vh03o_46", ye = "_touched_vh03o_46", xe = "_opened_vh03o_50", Ie = "_placeholder_vh03o_72", ke = "_ghost_vh03o_118", Se = {
|
|
64
|
+
container: we,
|
|
65
|
+
icon: Oe,
|
|
66
|
+
arrow: be,
|
|
67
|
+
dropdown: Ee,
|
|
68
|
+
"transparent-background": "_transparent-background_vh03o_33",
|
|
69
|
+
disabled: De,
|
|
70
|
+
value: Ne,
|
|
71
|
+
error: Ke,
|
|
72
|
+
touched: ye,
|
|
73
|
+
opened: xe,
|
|
74
|
+
placeholder: Ie,
|
|
75
|
+
"mobile-disabled": "_mobile-disabled_vh03o_87",
|
|
76
|
+
"select-list": "_select-list_vh03o_92",
|
|
77
|
+
"limited-width": "_limited-width_vh03o_109",
|
|
78
|
+
"options-container": "_options-container_vh03o_113",
|
|
79
|
+
ghost: ke
|
|
80
|
+
}, i = A.bind(Se), je = ({
|
|
81
|
+
value: t = "",
|
|
82
|
+
options: n = [],
|
|
83
|
+
disabled: a = !1,
|
|
84
|
+
error: f,
|
|
85
|
+
onChange: w,
|
|
86
|
+
onFocus: l,
|
|
87
|
+
onBlur: o,
|
|
88
|
+
mobileDisabled: O,
|
|
89
|
+
title: b,
|
|
90
|
+
touched: g = !1,
|
|
91
|
+
icon: p,
|
|
92
|
+
variant: E,
|
|
93
|
+
placeholder: m = "",
|
|
94
|
+
renderOption: D,
|
|
95
|
+
transparentBackground: T = !1,
|
|
96
|
+
className: W,
|
|
97
|
+
toggleButtonClassName: H,
|
|
98
|
+
isListWidthLimited: M = !1
|
|
99
|
+
}) => {
|
|
100
|
+
const [r, c] = Y(!1), y = ee(null), [$, u] = Y(null), { refs: x, floatingStyles: j } = te({
|
|
101
|
+
middleware: [
|
|
102
|
+
ne(5),
|
|
103
|
+
oe({
|
|
104
|
+
fallbackPlacements: ["bottom", "top"]
|
|
105
|
+
})
|
|
106
|
+
]
|
|
107
|
+
});
|
|
108
|
+
ae(y, () => {
|
|
109
|
+
r && (c(!1), o == null || o());
|
|
110
|
+
});
|
|
111
|
+
const I = (e) => {
|
|
112
|
+
e.disabled || (w(e.value), c((s) => !s));
|
|
113
|
+
}, V = () => n.find(({ value: e }) => e === t), k = me(n, t), {
|
|
114
|
+
getToggleButtonProps: U,
|
|
115
|
+
getMenuProps: Z,
|
|
116
|
+
getItemProps: q,
|
|
117
|
+
setHighlightedIndex: v,
|
|
118
|
+
highlightedIndex: S,
|
|
119
|
+
selectedItem: C
|
|
120
|
+
} = N({
|
|
121
|
+
items: n,
|
|
122
|
+
itemToString: (e) => (e != null && e.label ? String(e.label) : m) || "",
|
|
123
|
+
selectedItem: V(),
|
|
124
|
+
isOpen: r,
|
|
125
|
+
circularNavigation: !0,
|
|
126
|
+
defaultHighlightedIndex: k,
|
|
127
|
+
onHighlightedIndexChange: (e) => {
|
|
128
|
+
switch (e.type) {
|
|
129
|
+
case N.stateChangeTypes.MenuKeyDownArrowUp:
|
|
130
|
+
return u(_.ON_KEY_DOWN), v(Ce(n, e.highlightedIndex)), e;
|
|
131
|
+
case N.stateChangeTypes.MenuKeyDownArrowDown:
|
|
132
|
+
return u(_.ON_KEY_DOWN), v(ve(n, e.highlightedIndex)), e;
|
|
133
|
+
default:
|
|
134
|
+
return e;
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
}), z = () => {
|
|
138
|
+
a || (c((e) => !e), r ? o == null || o() : l == null || l(), u(_.ON_CLICK));
|
|
139
|
+
}, G = () => {
|
|
140
|
+
if (!t && t !== !1 && t !== 0)
|
|
141
|
+
return m;
|
|
142
|
+
let e = t;
|
|
143
|
+
return n.forEach((s) => {
|
|
144
|
+
s.value === t && (e = s.label);
|
|
145
|
+
}), e;
|
|
146
|
+
}, J = (e) => {
|
|
147
|
+
const { keyCode: s } = e;
|
|
148
|
+
pe.includes(s) && !r && (e.preventDefault(), v(k), c(!0), l == null || l(), u(_.ON_KEY_DOWN));
|
|
149
|
+
}, Q = (e) => {
|
|
150
|
+
const { keyCode: s } = e;
|
|
151
|
+
if (s === h.ENTER_KEY_CODE) {
|
|
152
|
+
const F = n[S];
|
|
153
|
+
I(F), c(!1), o == null || o();
|
|
154
|
+
return;
|
|
155
|
+
}
|
|
156
|
+
ge.includes(s) && (e.stopPropagation(), c(!1), o == null || o());
|
|
157
|
+
}, X = () => /* @__PURE__ */ d("div", { className: i("options-container"), children: n.map((e, s) => /* @__PURE__ */ d(
|
|
158
|
+
fe,
|
|
159
|
+
{
|
|
160
|
+
...q({
|
|
161
|
+
item: e,
|
|
162
|
+
index: s
|
|
163
|
+
}),
|
|
164
|
+
selected: e.value === ((C == null ? void 0 : C.value) ?? C),
|
|
165
|
+
option: { title: e.label, ...e },
|
|
166
|
+
highlightHovered: S === s && $ !== _.ON_CLICK,
|
|
167
|
+
render: D,
|
|
168
|
+
onChange: e.disabled ? null : () => I(e),
|
|
169
|
+
onMouseEnter: () => v(s)
|
|
170
|
+
},
|
|
171
|
+
e.value
|
|
172
|
+
)) });
|
|
173
|
+
return /* @__PURE__ */ L("div", { ref: y, className: i("container", W), title: b, children: [
|
|
174
|
+
/* @__PURE__ */ L(
|
|
175
|
+
"button",
|
|
176
|
+
{
|
|
177
|
+
disabled: a,
|
|
178
|
+
...U({
|
|
179
|
+
className: i("dropdown", E, H, {
|
|
180
|
+
"transparent-background": T,
|
|
181
|
+
opened: r,
|
|
182
|
+
disabled: a,
|
|
183
|
+
error: f,
|
|
184
|
+
touched: g,
|
|
185
|
+
"mobile-disabled": O
|
|
186
|
+
}),
|
|
187
|
+
onClick: z,
|
|
188
|
+
onKeyDown: J,
|
|
189
|
+
ref: x.setReference
|
|
190
|
+
}),
|
|
191
|
+
type: "button",
|
|
192
|
+
children: [
|
|
193
|
+
p && /* @__PURE__ */ d("span", { className: i("icon"), children: p }),
|
|
194
|
+
/* @__PURE__ */ d("span", { className: i("value", { placeholder: !t }), children: G() }),
|
|
195
|
+
/* @__PURE__ */ d(de, { className: i("arrow"), tabIndex: -1, children: /* @__PURE__ */ d(le, {}) })
|
|
196
|
+
]
|
|
197
|
+
}
|
|
198
|
+
),
|
|
199
|
+
r && /* @__PURE__ */ d(
|
|
200
|
+
"div",
|
|
201
|
+
{
|
|
202
|
+
style: j,
|
|
203
|
+
className: i("select-list", { opened: r, "limited-width": M }),
|
|
204
|
+
...Z({
|
|
205
|
+
onKeyDown: Q,
|
|
206
|
+
ref: x.setFloating
|
|
207
|
+
}),
|
|
208
|
+
children: /* @__PURE__ */ d(se, { autoHeight: !0, autoHeightMax: 216, hideTracksWhenNotNeeded: !0, children: X() })
|
|
209
|
+
}
|
|
210
|
+
)
|
|
211
|
+
] });
|
|
212
|
+
};
|
|
213
|
+
export {
|
|
214
|
+
je as D,
|
|
215
|
+
le as S
|
|
216
|
+
};
|
package/dist/dropdown.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { D as r } from "./dropdown-c21b0d67.js";
|
|
2
|
+
import "react/jsx-runtime";
|
|
3
|
+
import "react";
|
|
4
|
+
import "./bind-06a7ff84.js";
|
|
5
|
+
import "@floating-ui/react-dom";
|
|
6
|
+
import "downshift";
|
|
7
|
+
import "rc-scrollbars";
|
|
8
|
+
import "./useOnClickOutside-c332f7d3.js";
|
|
9
|
+
import "./keyCodes-f63c0e11.js";
|
|
10
|
+
import "./baseIconButton-b6adc843.js";
|
|
11
|
+
export {
|
|
12
|
+
r as Dropdown,
|
|
13
|
+
r as default
|
|
14
|
+
};
|