@reportportal/ui-kit 0.0.1-alpha.7 → 0.0.1-alpha.70

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 (152) hide show
  1. package/LICENSE +201 -201
  2. package/README.md +255 -3
  3. package/dist/arrowUp-4a5caee7.js +6 -0
  4. package/dist/baseIconButton-251479f7.js +25 -0
  5. package/dist/baseIconButton.js +7 -0
  6. package/dist/bubblesLoader-a7e709d4.js +17 -0
  7. package/dist/bubblesLoader.js +1 -1
  8. package/dist/button-33bc880f.js +64 -0
  9. package/dist/button.js +1 -1
  10. package/dist/calendarArrow-3e1339ea.js +6 -0
  11. package/dist/checkbox-aa91985d.js +73 -0
  12. package/dist/checkbox.js +1 -1
  13. package/dist/close-4b33d7c1.js +5 -0
  14. package/dist/common/hooks/useOnClickOutside.d.ts +1 -0
  15. package/dist/common/types.d.ts +3 -0
  16. package/dist/components/baseIconButton/baseIconButton.d.ts +9 -0
  17. package/dist/components/baseIconButton/index.d.ts +5 -0
  18. package/dist/components/bubblesLoader/bubblesLoader.d.ts +1 -0
  19. package/dist/components/bubblesLoader/index.d.ts +1 -0
  20. package/dist/components/button/button.d.ts +4 -4
  21. package/dist/components/button/index.d.ts +3 -2
  22. package/dist/components/checkbox/checkbox.d.ts +3 -0
  23. package/dist/components/checkbox/index.d.ts +1 -0
  24. package/dist/components/datePicker/datePicker.d.ts +25 -0
  25. package/dist/components/datePicker/header/datePickerHeader.d.ts +16 -0
  26. package/dist/components/datePicker/header/index.d.ts +4 -0
  27. package/dist/components/datePicker/index.d.ts +5 -0
  28. package/dist/components/datePicker/utils.d.ts +4 -0
  29. package/dist/components/dropdown/constants.d.ts +5 -0
  30. package/dist/components/dropdown/dropdown.d.ts +13 -5
  31. package/dist/components/dropdown/dropdownOption/dropdownOption.d.ts +1 -0
  32. package/dist/components/dropdown/dropdownOption/index.d.ts +1 -0
  33. package/dist/components/dropdown/index.d.ts +1 -0
  34. package/dist/components/dropdown/types.d.ts +3 -0
  35. package/dist/components/dropdown/utils.d.ts +2 -1
  36. package/dist/components/fieldLabel/fieldLabel.d.ts +7 -0
  37. package/dist/components/fieldLabel/index.d.ts +1 -0
  38. package/dist/components/fieldNumber/constants.d.ts +1 -0
  39. package/dist/components/fieldNumber/fieldNumber.d.ts +3 -2
  40. package/dist/components/fieldNumber/index.d.ts +1 -0
  41. package/dist/components/fieldText/fieldText.d.ts +13 -5
  42. package/dist/components/fieldText/index.d.ts +1 -0
  43. package/dist/components/fieldText/types.d.ts +5 -0
  44. package/dist/components/fieldTextFlex/fieldTextFlex.d.ts +16 -0
  45. package/dist/components/fieldTextFlex/index.d.ts +4 -0
  46. package/dist/components/icons/index.d.ts +48 -0
  47. package/dist/components/index.d.ts +11 -1
  48. package/dist/components/maxValueDisplay/index.d.ts +4 -0
  49. package/dist/components/maxValueDisplay/maxValueDisplay.d.ts +8 -0
  50. package/dist/components/maxValueDisplay/utils/index.d.ts +1 -0
  51. package/dist/components/maxValueDisplay/utils/isPositiveInteger.d.ts +1 -0
  52. package/dist/components/modal/modal.d.ts +7 -2
  53. package/dist/components/modal/modalContent/modalContent.d.ts +2 -0
  54. package/dist/components/modal/modalFooter/modalFooter.d.ts +1 -0
  55. package/dist/components/modal/modalHeader/modalHeader.d.ts +2 -1
  56. package/dist/components/pagination/index.d.ts +5 -0
  57. package/dist/components/pagination/itemsCounter/index.d.ts +1 -0
  58. package/dist/components/pagination/itemsCounter/itemCounter.d.ts +10 -0
  59. package/dist/components/pagination/pageControls/activePage/activePage.d.ts +13 -0
  60. package/dist/components/pagination/pageControls/activePage/index.d.ts +1 -0
  61. package/dist/components/pagination/pageControls/activePage/pageSelector/index.d.ts +1 -0
  62. package/dist/components/pagination/pageControls/activePage/pageSelector/pageSelector.d.ts +11 -0
  63. package/dist/components/pagination/pageControls/index.d.ts +1 -0
  64. package/dist/components/pagination/pageControls/pageControls.d.ts +17 -0
  65. package/dist/components/pagination/pageControls/pageNavigator/bar/bar.d.ts +12 -0
  66. package/dist/components/pagination/pageControls/pageNavigator/bar/index.d.ts +1 -0
  67. package/dist/components/pagination/pageControls/pageNavigator/index.d.ts +1 -0
  68. package/dist/components/pagination/pageControls/pageNavigator/pageNavigator.d.ts +12 -0
  69. package/dist/components/pagination/pageSizeControl/index.d.ts +1 -0
  70. package/dist/components/pagination/pageSizeControl/pageSizeControl.d.ts +11 -0
  71. package/dist/components/pagination/pageSizeControl/sizeSelector/index.d.ts +1 -0
  72. package/dist/components/pagination/pageSizeControl/sizeSelector/sizeSelector.d.ts +9 -0
  73. package/dist/components/pagination/pagination.d.ts +23 -0
  74. package/dist/components/pagination/types.d.ts +2 -0
  75. package/dist/components/popover/index.d.ts +1 -0
  76. package/dist/components/popover/popover.d.ts +20 -0
  77. package/dist/components/radio/index.d.ts +5 -0
  78. package/dist/components/radio/radio.d.ts +17 -0
  79. package/dist/components/radio/radioGroup.d.ts +9 -0
  80. package/dist/components/spinLoader/index.d.ts +4 -0
  81. package/dist/components/spinLoader/spinLoader.d.ts +8 -0
  82. package/dist/components/systemAlert/index.d.ts +1 -0
  83. package/dist/components/systemAlert/systemAlert.d.ts +4 -0
  84. package/dist/components/systemAlert/types.d.ts +16 -0
  85. package/dist/components/systemMessage/index.d.ts +1 -0
  86. package/dist/components/systemMessage/systemMessage.d.ts +1 -0
  87. package/dist/components/table/constants.d.ts +2 -0
  88. package/dist/components/table/index.d.ts +4 -0
  89. package/dist/components/table/table.d.ts +4 -0
  90. package/dist/components/table/types.d.ts +52 -0
  91. package/dist/components/table/utils.d.ts +6 -0
  92. package/dist/components/themeProvider/index.d.ts +1 -0
  93. package/dist/components/themeProvider/themeProvider.d.ts +3 -1
  94. package/dist/components/toggle/index.d.ts +1 -0
  95. package/dist/components/toggle/toggle.d.ts +1 -0
  96. package/dist/components/tooltip/index.d.ts +1 -0
  97. package/dist/components/tooltip/tooltip.d.ts +23 -0
  98. package/dist/datePicker-382ef010.js +201 -0
  99. package/dist/datePicker.js +28 -0
  100. package/dist/dropdown-0260bb66.js +5 -0
  101. package/dist/dropdown-13d7d50e.js +278 -0
  102. package/dist/dropdown.js +6 -4
  103. package/dist/fieldLabel.js +18 -0
  104. package/dist/fieldNumber-2542b311.js +128 -0
  105. package/dist/fieldNumber.js +4 -3
  106. package/dist/fieldText-e605a521.js +158 -0
  107. package/dist/fieldText.js +6 -2
  108. package/dist/fieldTextFlex-9e616f66.js +78 -0
  109. package/dist/fieldTextFlex.js +10 -0
  110. package/dist/fonts/OpenSans/OpenSans-Bold.ttf +0 -0
  111. package/dist/fonts/OpenSans/OpenSans-Medium.ttf +0 -0
  112. package/dist/icons.js +60 -0
  113. package/dist/index.js +103 -23
  114. package/dist/maxValueDisplay-9be01a75.js +13 -0
  115. package/dist/maxValueDisplay.js +6 -0
  116. package/dist/modal.js +115 -97
  117. package/dist/openEye-7b9cf080.js +7 -0
  118. package/dist/pagination-ecbc9940.js +345 -0
  119. package/dist/pagination.js +20 -0
  120. package/dist/plus-0929dda4.js +6 -0
  121. package/dist/popover.js +99 -0
  122. package/dist/prevPage-87faf576.js +6 -0
  123. package/dist/radio-62546efa.js +76 -0
  124. package/dist/{icon.js → radio.js} +4 -4
  125. package/dist/spinLoader-c4a53718.js +11 -0
  126. package/dist/spinLoader.js +7 -0
  127. package/dist/style.css +1 -1
  128. package/dist/success-dc1914aa.js +7 -0
  129. package/dist/systemAlert.js +63 -0
  130. package/dist/{systemMessage-62c3133d.js → systemMessage-924fdaa6.js} +14 -14
  131. package/dist/systemMessage.js +1 -1
  132. package/dist/table-20aa2cdf.js +142 -0
  133. package/dist/table.js +11 -0
  134. package/dist/themeProvider-46c2be7b.js +23 -0
  135. package/dist/themeProvider.js +4 -3
  136. package/dist/toggle-304107fa.js +59 -0
  137. package/dist/toggle.js +1 -1
  138. package/dist/tooltip.js +101 -0
  139. package/package.json +53 -17
  140. package/dist/bubblesLoader-9bec3797.js +0 -17
  141. package/dist/button-d4944dbc.js +0 -64
  142. package/dist/checkbox-fdc44740.js +0 -68
  143. package/dist/clear-4963efcd.js +0 -5
  144. package/dist/components/icon/icon.d.ts +0 -11
  145. package/dist/components/icon/icons.d.ts +0 -21
  146. package/dist/components/icon/index.d.ts +0 -3
  147. package/dist/dropdown-45e7bc7d.js +0 -204
  148. package/dist/fieldNumber-27e69676.js +0 -132
  149. package/dist/fieldText-c7085849.js +0 -99
  150. package/dist/icon-71262f5c.js +0 -26
  151. package/dist/themeProvider-5800417e.js +0 -19
  152. package/dist/toggle-5b3d8333.js +0 -67
@@ -0,0 +1,2 @@
1
+ export declare const ASC = "asc";
2
+ export declare const DESC = "desc";
@@ -0,0 +1,4 @@
1
+ import { Table } from './table';
2
+
3
+ export { Table };
4
+ export default Table;
@@ -0,0 +1,4 @@
1
+ import { FC } from 'react';
2
+ import { TableComponentProps } from './types';
3
+
4
+ export declare const Table: FC<TableComponentProps>;
@@ -0,0 +1,52 @@
1
+ import { ReactNode } from 'react';
2
+ import { ASC, DESC } from './constants';
3
+
4
+ export interface Column {
5
+ key: string;
6
+ header: string;
7
+ }
8
+ export interface PrimaryColumn extends Column {
9
+ primary: boolean;
10
+ }
11
+ export interface FixedColumn extends Column {
12
+ width: string | number;
13
+ align?: 'left' | 'center' | 'right';
14
+ }
15
+ export interface RowConfigs {
16
+ size?: 'small' | 'medium' | 'large';
17
+ }
18
+ export interface DetailedCellData {
19
+ content: string | number;
20
+ component: ReactNode;
21
+ }
22
+ export interface MetaData {
23
+ [key: string]: any;
24
+ }
25
+ export interface RowData {
26
+ id: string | number;
27
+ [key: string]: DetailedCellData | RowConfigs | string | number | any;
28
+ rowConfigs?: RowConfigs;
29
+ metaData?: MetaData;
30
+ }
31
+ export type SortingDirection = typeof ASC | typeof DESC | Uppercase<typeof ASC | typeof DESC>;
32
+ export interface SortConfig {
33
+ key: string;
34
+ direction: SortingDirection;
35
+ }
36
+ export interface TableComponentProps {
37
+ data: RowData[];
38
+ primaryColumn: Column;
39
+ fixedColumns: FixedColumn[];
40
+ renderRowActions?: (metaData?: MetaData) => ReactNode;
41
+ selectable?: boolean;
42
+ className?: string;
43
+ headerClassName?: string;
44
+ rowClassName?: string;
45
+ selectedRowIds?: (string | number)[];
46
+ sortingDirection?: SortingDirection;
47
+ sortingColumn?: Column;
48
+ sortableColumns?: string[];
49
+ onChangeSorting?: (sortConfig?: SortConfig) => void;
50
+ onToggleRowSelection?: (id: string | number) => void;
51
+ onToggleAllRowsSelection?: () => void;
52
+ }
@@ -0,0 +1,6 @@
1
+ import { Column, RowData, SortConfig, SortingDirection } from './types';
2
+
3
+ export declare const isAsc: (direction: SortingDirection) => boolean;
4
+ export declare const sortTableData: (tableData: RowData[], sortConfig?: SortConfig) => RowData[];
5
+ export declare const getColumnsKeys: (columns: Column[]) => string[];
6
+ export declare const toggleDirection: (direction: SortingDirection) => "desc" | "asc";
@@ -1,3 +1,4 @@
1
1
  import { ThemeProvider } from './themeProvider';
2
+
2
3
  export { ThemeProvider };
3
4
  export default ThemeProvider;
@@ -1,4 +1,5 @@
1
1
  import { ReactNode } from 'react';
2
+
2
3
  type ThemeKey = 'light' | 'dark' | string;
3
4
  interface ITheme {
4
5
  [themeKey: ThemeKey]: string;
@@ -7,6 +8,7 @@ interface IThemeProviderProps {
7
8
  children?: ReactNode;
8
9
  theme?: ThemeKey;
9
10
  customThemes?: ITheme;
11
+ className?: string;
10
12
  }
11
- export declare function ThemeProvider({ children, theme, customThemes, }: IThemeProviderProps): import("react/jsx-runtime").JSX.Element;
13
+ export declare function ThemeProvider({ children, theme, customThemes, className, }: IThemeProviderProps): import("react/jsx-runtime").JSX.Element;
12
14
  export {};
@@ -1,3 +1,4 @@
1
1
  import { Toggle } from './toggle';
2
+
2
3
  export { Toggle };
3
4
  export default Toggle;
@@ -1,4 +1,5 @@
1
1
  import { ChangeEventHandler, FC, HTMLAttributes, ReactNode } from 'react';
2
+
2
3
  interface ToggleProps extends HTMLAttributes<HTMLInputElement> {
3
4
  value: boolean;
4
5
  title?: string;
@@ -0,0 +1 @@
1
+ export { Tooltip } from './tooltip';
@@ -0,0 +1,23 @@
1
+ import { FC, ReactNode } from 'react';
2
+ import { Placement } from '@floating-ui/react';
3
+
4
+ interface TooltipProps {
5
+ content: ReactNode;
6
+ children: ReactNode;
7
+ wrapperClassName?: string;
8
+ tooltipClassName?: string;
9
+ contentClassName?: string;
10
+ dynamicWidth?: boolean;
11
+ width?: number;
12
+ minWidth?: number;
13
+ placement?: Placement;
14
+ dataAutomationId?: string;
15
+ arrowColor?: string;
16
+ safeZone?: number;
17
+ zIndex?: number;
18
+ mainAxis?: boolean;
19
+ portalRoot?: Element;
20
+ isFloating?: boolean;
21
+ }
22
+ export declare const Tooltip: FC<TooltipProps>;
23
+ export {};
@@ -0,0 +1,201 @@
1
+ import { jsxs as x, Fragment as U, jsx as t } from "react/jsx-runtime";
2
+ import $ from "react-datepicker/dist/es/index.js";
3
+ import { c as R } from "./bind-06a7ff84.js";
4
+ import { useMemo as P, useRef as B } from "react";
5
+ import { F as D } from "./fieldText-e605a521.js";
6
+ import { a as E, S as j } from "./calendarArrow-3e1339ea.js";
7
+ import { D as T } from "./dropdown-13d7d50e.js";
8
+ import { registerLocale as G } from "react-datepicker";
9
+ const pe = (r, s) => {
10
+ G(r, s);
11
+ }, H = (r, s = 20) => {
12
+ const l = r + s;
13
+ return new Array(l - r).fill(void 0).map((g, o) => r - o);
14
+ }, V = "_header_1q16i_1", O = "_disabled_1q16i_25", W = "_dropdown_1q16i_8", z = {
15
+ header: V,
16
+ "dropdowns-wrapper": "_dropdowns-wrapper_1q16i_8",
17
+ "button-prev": "_button-prev_1q16i_13",
18
+ "button-next": "_button-next_1q16i_14",
19
+ disabled: O,
20
+ dropdown: W,
21
+ "month-dropdown": "_month-dropdown_1q16i_44",
22
+ "toggle-button": "_toggle-button_1q16i_47"
23
+ }, a = R.bind(z), J = ({
24
+ date: r = /* @__PURE__ */ new Date(),
25
+ changeYear: s = () => {
26
+ },
27
+ changeMonth: l = () => {
28
+ },
29
+ decreaseMonth: g = () => {
30
+ },
31
+ increaseMonth: o = () => {
32
+ },
33
+ prevMonthButtonDisabled: n = !1,
34
+ nextMonthButtonDisabled: h = !1,
35
+ headerNodes: b = null,
36
+ customClassName: w = "",
37
+ yearsOptions: i = [],
38
+ locale: C
39
+ }) => {
40
+ const p = r.getFullYear(), N = r.getMonth(), f = P(() => {
41
+ const e = Array(12).keys(), d = new Intl.DateTimeFormat(C, {
42
+ month: "long"
43
+ }), c = (m) => d.format(new Date(p, m));
44
+ return Array.from(e, c).reduce((m, k, S) => m.concat({
45
+ value: S,
46
+ label: k
47
+ }), []);
48
+ }, []), v = P(() => (i.length > 0 ? i : H(p)).reduce(
49
+ (d, c) => d.concat({ value: c, label: `${c}` }),
50
+ []
51
+ ), [i]), y = (e) => {
52
+ l(e);
53
+ }, A = (e) => {
54
+ s(e);
55
+ };
56
+ return /* @__PURE__ */ x(U, { children: [
57
+ b && /* @__PURE__ */ t("div", { className: a(w), children: b }),
58
+ /* @__PURE__ */ x("div", { className: a("header"), children: [
59
+ /* @__PURE__ */ t(
60
+ "button",
61
+ {
62
+ "aria-label": "Previous Months",
63
+ disabled: n,
64
+ onClick: (e) => {
65
+ e.stopPropagation(), g();
66
+ },
67
+ className: a("button-prev", { disabled: n }),
68
+ children: /* @__PURE__ */ t(E, {})
69
+ }
70
+ ),
71
+ /* @__PURE__ */ x("div", { className: a("dropdowns-wrapper"), children: [
72
+ /* @__PURE__ */ t(
73
+ T,
74
+ {
75
+ options: f,
76
+ value: N,
77
+ onChange: y,
78
+ transparentBackground: !0,
79
+ className: a("dropdown", "month-dropdown"),
80
+ toggleButtonClassName: a("toggle-button")
81
+ }
82
+ ),
83
+ /* @__PURE__ */ t(
84
+ T,
85
+ {
86
+ options: v,
87
+ value: p,
88
+ onChange: A,
89
+ transparentBackground: !0,
90
+ className: a("dropdown"),
91
+ toggleButtonClassName: a("toggle-button")
92
+ }
93
+ )
94
+ ] }),
95
+ /* @__PURE__ */ t(
96
+ "button",
97
+ {
98
+ "aria-label": "Next Months",
99
+ disabled: h,
100
+ onClick: (e) => {
101
+ e.stopPropagation(), o();
102
+ },
103
+ className: a("button-next", { disabled: h }),
104
+ children: /* @__PURE__ */ t(E, {})
105
+ }
106
+ )
107
+ ] })
108
+ ] });
109
+ }, K = "_calendar_1pok6_5", Q = "_date_1pok6_90", X = "_disabled_1pok6_202", Z = "_popper_1pok6_210", ee = "_input_1pok6_214", oe = {
110
+ calendar: K,
111
+ "current-date": "_current-date_1pok6_89",
112
+ date: Q,
113
+ "selected-range": "_selected-range_1pok6_119",
114
+ "end-date": "_end-date_1pok6_119",
115
+ disabled: X,
116
+ popper: Z,
117
+ input: ee
118
+ }, _ = R.bind(oe), ne = "en", L = "MM-dd-yyyy", me = ({
119
+ onChange: r = () => {
120
+ },
121
+ disabled: s = !1,
122
+ onBlur: l = () => {
123
+ },
124
+ onFocus: g = () => {
125
+ },
126
+ endDate: o = void 0,
127
+ startDate: n = void 0,
128
+ headerNodes: h = null,
129
+ customClassName: b = "",
130
+ customTimeInput: w = void 0,
131
+ shouldCloseOnSelect: i = !0,
132
+ popperClassName: C = "",
133
+ calendarClassName: p = "",
134
+ fixedHeight: N = !1,
135
+ language: f = ne,
136
+ yearsOptions: v = [],
137
+ placeholder: y = L.toUpperCase(),
138
+ dateFormat: A = L,
139
+ selects: e = "start",
140
+ value: d = null
141
+ }) => {
142
+ const c = B(null), F = n == null ? void 0 : n.toDateString(), m = o == null ? void 0 : o.toDateString(), k = o && n && o > n, S = (u) => {
143
+ const M = u.toDateString(), Y = M === F, q = k && M === m, I = n && o && u > n && u < o;
144
+ return _("date", {
145
+ "current-date": Y,
146
+ "selected-range": I && !q,
147
+ "end-date": q && k,
148
+ disabled: s
149
+ });
150
+ };
151
+ return /* @__PURE__ */ t(
152
+ $,
153
+ {
154
+ customInput: /* @__PURE__ */ t(
155
+ D,
156
+ {
157
+ className: _("input"),
158
+ defaultWidth: !1,
159
+ endIcon: /* @__PURE__ */ t(j, {}),
160
+ ref: c
161
+ }
162
+ ),
163
+ placeholderText: y,
164
+ selected: d,
165
+ startDate: n,
166
+ endDate: o,
167
+ minDate: e === "end" ? n : void 0,
168
+ disabled: s,
169
+ shouldCloseOnSelect: i,
170
+ fixedHeight: N,
171
+ locale: f,
172
+ showPopperArrow: !1,
173
+ dayClassName: S,
174
+ calendarClassName: _(p, "calendar"),
175
+ renderCustomHeader: (u) => /* @__PURE__ */ t(
176
+ J,
177
+ {
178
+ ...u,
179
+ headerNodes: h,
180
+ customClassName: b,
181
+ yearsOptions: v,
182
+ locale: f
183
+ }
184
+ ),
185
+ onChange: r,
186
+ onBlur: l,
187
+ onFocus: g,
188
+ customTimeInput: w,
189
+ showTimeInput: !!w,
190
+ popperClassName: _(C, "popper"),
191
+ dateFormat: A,
192
+ selectsStart: e === "start",
193
+ selectsEnd: e === "end",
194
+ className: _("datepicker")
195
+ }
196
+ );
197
+ };
198
+ export {
199
+ me as D,
200
+ pe as r
201
+ };
@@ -0,0 +1,28 @@
1
+ import { D as t } from "./datePicker-382ef010.js";
2
+ import { r as v } from "./datePicker-382ef010.js";
3
+ import "react/jsx-runtime";
4
+ import "react-datepicker/dist/es/index.js";
5
+ import "./bind-06a7ff84.js";
6
+ import "react";
7
+ import "./fieldText-e605a521.js";
8
+ import "./openEye-7b9cf080.js";
9
+ import "./button-33bc880f.js";
10
+ import "./spinLoader-c4a53718.js";
11
+ import "./maxValueDisplay-9be01a75.js";
12
+ import "./fieldLabel.js";
13
+ import "./calendarArrow-3e1339ea.js";
14
+ import "./dropdown-13d7d50e.js";
15
+ import "@floating-ui/react-dom";
16
+ import "downshift";
17
+ import "rc-scrollbars";
18
+ import "./useOnClickOutside-c332f7d3.js";
19
+ import "./keyCodes-f63c0e11.js";
20
+ import "./baseIconButton-251479f7.js";
21
+ import "./dropdown-0260bb66.js";
22
+ import "./checkbox-aa91985d.js";
23
+ import "react-datepicker";
24
+ export {
25
+ t as DatePicker,
26
+ t as default,
27
+ v as registerDatePickerLocale
28
+ };
@@ -0,0 +1,5 @@
1
+ import * as e from "react";
2
+ const o = (t) => /* @__PURE__ */ e.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.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" }));
3
+ export {
4
+ o as S
5
+ };
@@ -0,0 +1,278 @@
1
+ import { jsxs as f, jsx as d, Fragment as U } from "react/jsx-runtime";
2
+ import { forwardRef as _e, useState as q, useRef as he } from "react";
3
+ import { c as J } from "./bind-06a7ff84.js";
4
+ import { useFloating as fe, offset as ge, flip as pe } from "@floating-ui/react-dom";
5
+ import { useSelect as P } from "downshift";
6
+ import { Scrollbars as me } from "rc-scrollbars";
7
+ import { u as ue } from "./useOnClickOutside-c332f7d3.js";
8
+ import { K as p } from "./keyCodes-f63c0e11.js";
9
+ import { B as ye } from "./baseIconButton-251479f7.js";
10
+ import { S as be } from "./dropdown-0260bb66.js";
11
+ import { FieldLabel as xe } from "./fieldLabel.js";
12
+ import { C as Ce } from "./checkbox-aa91985d.js";
13
+ const Oe = "_disabled_1a01l_12", ke = "_hidden_1a01l_16", Ne = "_hover_1a01l_22", De = {
14
+ "dropdown-option": "_dropdown-option_1a01l_1",
15
+ disabled: Oe,
16
+ hidden: ke,
17
+ hover: Ne,
18
+ "single-option": "_single-option_1a01l_35",
19
+ "sub-option": "_sub-option_1a01l_42"
20
+ }, z = J.bind(De), G = _e(
21
+ (n, t) => {
22
+ const {
23
+ option: { value: r, disabled: i, hidden: E, label: m, title: c, groupRef: s },
24
+ selected: w,
25
+ onChange: u,
26
+ render: b,
27
+ highlightHovered: x,
28
+ onMouseEnter: v,
29
+ multiSelect: y,
30
+ isPartiallyChecked: C = !1
31
+ } = n, K = (O) => {
32
+ (O.target instanceof HTMLDivElement || O.target instanceof HTMLInputElement) && (u == null || u(r));
33
+ };
34
+ return /* @__PURE__ */ f(
35
+ "div",
36
+ {
37
+ className: z("dropdown-option", {
38
+ disabled: i,
39
+ hidden: E,
40
+ hover: x
41
+ }),
42
+ title: c,
43
+ onClick: K,
44
+ ref: t,
45
+ onMouseEnter: v,
46
+ children: [
47
+ y && /* @__PURE__ */ d(Ce, { value: !!w, partiallyChecked: C }),
48
+ /* @__PURE__ */ d("div", { className: z("single-option", { "sub-option": !!s }), children: b ? b(n) : m })
49
+ ]
50
+ }
51
+ );
52
+ }
53
+ ), Ee = [
54
+ p.ENTER_KEY_CODE,
55
+ p.SPACE_KEY_CODE,
56
+ p.ARROW_DOWN_KEY_CODE
57
+ ], we = [p.ESCAPE_KEY_CODE, p.TAB_KEY_CODE];
58
+ var g = /* @__PURE__ */ ((n) => (n.ON_KEY_DOWN = "onKeyDown", n.ON_CLICK = "onClick", n))(g || {});
59
+ const ve = (n, t) => {
60
+ const r = Array.isArray(t) ? t : [t];
61
+ return n.findIndex(({ value: i }) => r.includes(i));
62
+ }, Ke = (n, t) => (n % t + t) % t, Y = (n, t = 0, r = 1) => {
63
+ if (!n[t].disabled)
64
+ return t;
65
+ const i = n.length;
66
+ return Y(
67
+ n,
68
+ Ke(t + r, i),
69
+ r
70
+ );
71
+ }, Ae = (n, t) => Y(n, t), Ie = (n, t) => Y(n, t, -1), Pe = "_container_1xhk2_1", Ye = "_icon_1xhk2_7", Re = "_arrow_1xhk2_13", Te = "_dropdown_1xhk2_19", He = "_disabled_1xhk2_36", Me = "_value_1xhk2_43", We = "_error_1xhk2_46", Le = "_touched_1xhk2_46", Se = "_opened_1xhk2_50", je = "_placeholder_1xhk2_83", Ve = "_ghost_1xhk2_118", $e = "_divider_1xhk2_132", Ue = {
72
+ container: Pe,
73
+ icon: Ye,
74
+ arrow: Re,
75
+ dropdown: Te,
76
+ "transparent-background": "_transparent-background_1xhk2_33",
77
+ disabled: He,
78
+ value: Me,
79
+ error: We,
80
+ touched: Le,
81
+ opened: Se,
82
+ placeholder: je,
83
+ "mobile-disabled": "_mobile-disabled_1xhk2_87",
84
+ "select-list": "_select-list_1xhk2_92",
85
+ "limited-width": "_limited-width_1xhk2_109",
86
+ "options-container": "_options-container_1xhk2_113",
87
+ ghost: Ve,
88
+ divider: $e
89
+ }, o = J.bind(Ue), st = ({
90
+ multiSelect: n = !1,
91
+ value: t = n ? [] : "",
92
+ options: r = [],
93
+ disabled: i = !1,
94
+ error: E,
95
+ onChange: m,
96
+ onFocus: c,
97
+ onBlur: s,
98
+ mobileDisabled: w,
99
+ title: u,
100
+ touched: b = !1,
101
+ icon: x,
102
+ variant: v,
103
+ placeholder: y = "",
104
+ label: C = "",
105
+ renderOption: K,
106
+ transparentBackground: O = !1,
107
+ className: Q,
108
+ toggleButtonClassName: X,
109
+ isListWidthLimited: Z = !1,
110
+ optionAll: R = { value: "all", label: "All" },
111
+ isOptionAllVisible: T = !1,
112
+ onSelectAll: F = () => {
113
+ },
114
+ formatDisplayedValue: H,
115
+ notScrollable: B = !1,
116
+ footer: M
117
+ }) => {
118
+ const [_, h] = q(!1), W = he(null), [ee, k] = q(null), A = n && Array.isArray(t) ? r.filter((e) => t.includes(e.value)) : null, { refs: L, floatingStyles: te } = fe({
119
+ placement: "bottom-start",
120
+ middleware: [
121
+ ge(5),
122
+ pe({
123
+ fallbackPlacements: ["bottom-start", "top-start", "bottom", "top"]
124
+ })
125
+ ]
126
+ }), ne = () => {
127
+ if (T && Array.isArray(t)) {
128
+ const e = r.map((a) => a.value);
129
+ m(t.length === r.length ? [] : e), F();
130
+ }
131
+ };
132
+ ue(W, () => {
133
+ _ && (h(!1), s == null || s());
134
+ });
135
+ const S = (e) => {
136
+ if (!e.disabled) {
137
+ if (n) {
138
+ const a = Array.isArray(t) ? [...t] : [], l = a.indexOf(e.value);
139
+ l === -1 ? a.push(e.value) : a.splice(l, 1), m(a);
140
+ } else
141
+ m(e.value);
142
+ h((a) => n || !a);
143
+ }
144
+ }, re = () => r.find(({ value: e }) => e === t), j = ve(r, t), {
145
+ getToggleButtonProps: ae,
146
+ getLabelProps: se,
147
+ getMenuProps: de,
148
+ getItemProps: le,
149
+ setHighlightedIndex: N,
150
+ highlightedIndex: V,
151
+ selectedItem: D
152
+ } = P({
153
+ items: r,
154
+ itemToString: (e) => (e != null && e.label ? String(e.label) : y) || "",
155
+ selectedItem: re(),
156
+ isOpen: _,
157
+ circularNavigation: !0,
158
+ defaultHighlightedIndex: j,
159
+ onHighlightedIndexChange: (e) => {
160
+ switch (e.type) {
161
+ case P.stateChangeTypes.MenuKeyDownArrowUp:
162
+ return k(g.ON_KEY_DOWN), N(Ie(r, e.highlightedIndex)), e;
163
+ case P.stateChangeTypes.MenuKeyDownArrowDown:
164
+ return k(g.ON_KEY_DOWN), N(Ae(r, e.highlightedIndex)), e;
165
+ default:
166
+ return e;
167
+ }
168
+ }
169
+ }), ie = () => {
170
+ i || (h((e) => !e), _ ? s == null || s() : c == null || c(), k(g.ON_CLICK));
171
+ }, I = (() => {
172
+ if (n && Array.isArray(t) && r.length === t.length)
173
+ return R.label;
174
+ const e = r.reduce((a, l) => ((Array.isArray(t) && t.includes(l.value) || l.value === t) && a.push(l.label), a), []);
175
+ if (e.length > 0)
176
+ return e.join(", ");
177
+ if (!t && t !== !1 && t !== 0 || Array.isArray(t) && !t.length)
178
+ return y;
179
+ })(), oe = (e) => {
180
+ const { keyCode: a } = e;
181
+ Ee.includes(a) && !_ && (e.preventDefault(), N(j), h(!0), c == null || c(), k(g.ON_KEY_DOWN));
182
+ }, ce = (e) => {
183
+ const { keyCode: a } = e;
184
+ if (a === p.ENTER_KEY_CODE) {
185
+ const l = r[V];
186
+ S(l), n || (h(!1), s == null || s());
187
+ return;
188
+ }
189
+ we.includes(a) && (e.stopPropagation(), h(!1), s == null || s());
190
+ }, $ = () => /* @__PURE__ */ f("div", { className: o("options-container"), children: [
191
+ n && T && Array.isArray(t) && /* @__PURE__ */ f(U, { children: [
192
+ /* @__PURE__ */ d(
193
+ G,
194
+ {
195
+ option: R,
196
+ selected: t.length === r.length,
197
+ onChange: ne,
198
+ multiSelect: n,
199
+ isPartiallyChecked: !!t.length
200
+ }
201
+ ),
202
+ /* @__PURE__ */ d("div", { className: o("divider") }),
203
+ " "
204
+ ] }),
205
+ r.map((e, a) => /* @__PURE__ */ d(
206
+ G,
207
+ {
208
+ ...le({
209
+ item: e,
210
+ index: a
211
+ }),
212
+ multiSelect: n,
213
+ selected: n ? A == null ? void 0 : A.some((l) => l.value === e.value) : e.value === ((D == null ? void 0 : D.value) ?? D),
214
+ option: { title: e.label, ...e },
215
+ highlightHovered: V === a && ee !== g.ON_CLICK,
216
+ render: K,
217
+ onChange: e.disabled ? null : () => S(e),
218
+ onMouseEnter: () => N(a)
219
+ },
220
+ e.value
221
+ )),
222
+ M && /* @__PURE__ */ f(U, { children: [
223
+ /* @__PURE__ */ d("div", { className: o("divider") }),
224
+ M
225
+ ] })
226
+ ] });
227
+ return /* @__PURE__ */ f("div", { ref: W, className: o("container", Q), title: u, children: [
228
+ C && /* @__PURE__ */ d(xe, { ...se(), children: C }),
229
+ /* @__PURE__ */ f(
230
+ "button",
231
+ {
232
+ disabled: i,
233
+ ...ae({
234
+ className: o("dropdown", v, X, {
235
+ "transparent-background": O,
236
+ opened: _,
237
+ disabled: i,
238
+ error: E,
239
+ touched: b,
240
+ "mobile-disabled": w
241
+ }),
242
+ onClick: ie,
243
+ onKeyDown: oe,
244
+ ref: L.setReference
245
+ }),
246
+ type: "button",
247
+ children: [
248
+ x && /* @__PURE__ */ d("span", { className: o("icon"), children: x }),
249
+ /* @__PURE__ */ d(
250
+ "span",
251
+ {
252
+ className: o("value", {
253
+ placeholder: I === y
254
+ }),
255
+ children: H ? H(I) : I
256
+ }
257
+ ),
258
+ /* @__PURE__ */ d(ye, { className: o("arrow"), tabIndex: -1, children: /* @__PURE__ */ d(be, {}) })
259
+ ]
260
+ }
261
+ ),
262
+ _ && /* @__PURE__ */ d(
263
+ "div",
264
+ {
265
+ style: te,
266
+ className: o("select-list", { opened: _, "limited-width": Z }),
267
+ ...de({
268
+ onKeyDown: ce,
269
+ ref: L.setFloating
270
+ }),
271
+ children: B ? $() : /* @__PURE__ */ d(me, { autoHeight: !0, autoHeightMax: 216, hideTracksWhenNotNeeded: !0, children: $() })
272
+ }
273
+ )
274
+ ] });
275
+ };
276
+ export {
277
+ st as D
278
+ };
package/dist/dropdown.js CHANGED
@@ -1,14 +1,16 @@
1
- import { D as r } from "./dropdown-45e7bc7d.js";
1
+ import { D as r } from "./dropdown-13d7d50e.js";
2
2
  import "react/jsx-runtime";
3
3
  import "react";
4
4
  import "./bind-06a7ff84.js";
5
- import "react-popper";
5
+ import "@floating-ui/react-dom";
6
6
  import "downshift";
7
7
  import "rc-scrollbars";
8
8
  import "./useOnClickOutside-c332f7d3.js";
9
9
  import "./keyCodes-f63c0e11.js";
10
- import "./icon-71262f5c.js";
11
- import "./clear-4963efcd.js";
10
+ import "./baseIconButton-251479f7.js";
11
+ import "./dropdown-0260bb66.js";
12
+ import "./fieldLabel.js";
13
+ import "./checkbox-aa91985d.js";
12
14
  export {
13
15
  r as Dropdown,
14
16
  r as default