@reportportal/ui-kit 0.0.1-alpha.6 → 0.0.1-alpha.61

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 (150) 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-33c88abf.js +62 -0
  9. package/dist/button.js +1 -1
  10. package/dist/calendarArrow-3e1339ea.js +6 -0
  11. package/dist/checkbox-9a6c7ce1.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 +1 -1
  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 +2 -1
  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 +37 -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 +19 -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/index.d.ts +4 -0
  88. package/dist/components/table/table.d.ts +4 -0
  89. package/dist/components/table/types.d.ts +54 -0
  90. package/dist/components/table/utils.d.ts +4 -0
  91. package/dist/components/themeProvider/index.d.ts +1 -0
  92. package/dist/components/themeProvider/themeProvider.d.ts +3 -1
  93. package/dist/components/toggle/index.d.ts +1 -0
  94. package/dist/components/toggle/toggle.d.ts +1 -0
  95. package/dist/components/tooltip/index.d.ts +1 -0
  96. package/dist/components/tooltip/tooltip.d.ts +23 -0
  97. package/dist/datePicker-a2b6acf5.js +201 -0
  98. package/dist/datePicker.js +28 -0
  99. package/dist/dropdown-0260bb66.js +5 -0
  100. package/dist/dropdown-29285346.js +278 -0
  101. package/dist/dropdown.js +6 -4
  102. package/dist/fieldLabel.js +13 -0
  103. package/dist/fieldNumber-d81e551e.js +125 -0
  104. package/dist/fieldNumber.js +3 -3
  105. package/dist/fieldText-1ab17a11.js +158 -0
  106. package/dist/fieldText.js +6 -2
  107. package/dist/fieldTextFlex-314741ad.js +78 -0
  108. package/dist/fieldTextFlex.js +9 -0
  109. package/dist/icons.js +49 -0
  110. package/dist/index.js +92 -23
  111. package/dist/maxValueDisplay-9be01a75.js +13 -0
  112. package/dist/maxValueDisplay.js +6 -0
  113. package/dist/modal.js +114 -96
  114. package/dist/openEye-7b9cf080.js +7 -0
  115. package/dist/pagination-7c6ebae2.js +345 -0
  116. package/dist/pagination.js +20 -0
  117. package/dist/plus-0929dda4.js +6 -0
  118. package/dist/popover.js +95 -0
  119. package/dist/prevPage-87faf576.js +6 -0
  120. package/dist/radio-bccc84f2.js +76 -0
  121. package/dist/{icon.js → radio.js} +4 -4
  122. package/dist/spinLoader-c4a53718.js +11 -0
  123. package/dist/spinLoader.js +7 -0
  124. package/dist/style.css +1 -1
  125. package/dist/success-dc1914aa.js +7 -0
  126. package/dist/systemAlert.js +63 -0
  127. package/dist/systemMessage-1ced6079.js +30 -0
  128. package/dist/systemMessage.js +1 -1
  129. package/dist/table-32fc8c70.js +144 -0
  130. package/dist/table.js +11 -0
  131. package/dist/themeProvider-46c2be7b.js +23 -0
  132. package/dist/themeProvider.js +4 -3
  133. package/dist/toggle-1a3aacb5.js +59 -0
  134. package/dist/toggle.js +1 -1
  135. package/dist/tooltip.js +101 -0
  136. package/package.json +53 -17
  137. package/dist/bubblesLoader-9bec3797.js +0 -17
  138. package/dist/button-d4944dbc.js +0 -64
  139. package/dist/checkbox-fdc44740.js +0 -68
  140. package/dist/clear-4963efcd.js +0 -5
  141. package/dist/components/icon/icon.d.ts +0 -11
  142. package/dist/components/icon/icons.d.ts +0 -21
  143. package/dist/components/icon/index.d.ts +0 -3
  144. package/dist/dropdown-45e7bc7d.js +0 -204
  145. package/dist/fieldNumber-8417cd65.js +0 -132
  146. package/dist/fieldText-c7085849.js +0 -99
  147. package/dist/icon-71262f5c.js +0 -26
  148. package/dist/systemMessage-62c3133d.js +0 -30
  149. package/dist/themeProvider-5800417e.js +0 -19
  150. package/dist/toggle-5b3d8333.js +0 -67
@@ -0,0 +1,54 @@
1
+ import { ReactNode } from 'react';
2
+
3
+ export interface Column {
4
+ key: string;
5
+ header: string;
6
+ }
7
+ export interface PrimaryColumn extends Column {
8
+ primary: boolean;
9
+ }
10
+ export interface FixedColumn extends Column {
11
+ width: string | number;
12
+ align?: 'left' | 'center' | 'right';
13
+ }
14
+ export interface RowConfigs {
15
+ size?: 'small' | 'medium' | 'large';
16
+ }
17
+ export interface DetailedCellData {
18
+ content: string | number;
19
+ component: ReactNode;
20
+ }
21
+ export interface MetaData {
22
+ [key: string]: any;
23
+ }
24
+ export interface RowData {
25
+ id: string | number;
26
+ [key: string]: DetailedCellData | RowConfigs | string | number | any;
27
+ rowConfigs?: RowConfigs;
28
+ metaData?: MetaData;
29
+ }
30
+ export declare enum SortDirection {
31
+ ASC = "asc",
32
+ DESC = "desc"
33
+ }
34
+ export interface SortConfig {
35
+ key: string;
36
+ direction: SortDirection;
37
+ }
38
+ export interface TableComponentProps {
39
+ data: RowData[];
40
+ primaryColumn: Column;
41
+ fixedColumns: FixedColumn[];
42
+ renderRowActions?: (metaData?: MetaData) => ReactNode;
43
+ selectable?: boolean;
44
+ className?: string;
45
+ headerClassName?: string;
46
+ rowClassName?: string;
47
+ selectedRowIds?: (string | number)[];
48
+ sortingDirection?: SortDirection;
49
+ sortingColumn?: Column;
50
+ sortableColumns?: string[];
51
+ onChangeSorting?: (sortConfig?: SortConfig) => void;
52
+ onToggleRowSelection?: (id: string | number) => void;
53
+ onToggleAllRowsSelection?: () => void;
54
+ }
@@ -0,0 +1,4 @@
1
+ import { Column, RowData, SortConfig } from './types';
2
+
3
+ export declare const sortTableData: (tableData: RowData[], sortConfig?: SortConfig) => RowData[];
4
+ export declare const getColumnsKeys: (columns: Column[]) => string[];
@@ -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 S, 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-1ab17a11.js";
6
+ import { a as E, S as G } from "./calendarArrow-3e1339ea.js";
7
+ import { D as T } from "./dropdown-29285346.js";
8
+ import { registerLocale as H } from "react-datepicker";
9
+ const pe = (r, s) => {
10
+ H(r, s);
11
+ }, V = (r, s = 20) => {
12
+ const l = r + s;
13
+ return new Array(l - r).fill(void 0).map((g, o) => r - o);
14
+ }, O = "_header_a3cjx_1", W = "_disabled_a3cjx_25", q = "_dropdown_a3cjx_8", z = {
15
+ header: O,
16
+ "dropdowns-wrapper": "_dropdowns-wrapper_a3cjx_8",
17
+ "button-prev": "_button-prev_a3cjx_13",
18
+ "button-next": "_button-next_a3cjx_14",
19
+ disabled: W,
20
+ dropdown: q,
21
+ "month-dropdown": "_month-dropdown_a3cjx_44",
22
+ "toggle-button": "_toggle-button_a3cjx_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: x
39
+ }) => {
40
+ const p = r.getFullYear(), C = r.getMonth(), f = P(() => {
41
+ const e = Array(12).keys(), c = new Intl.DateTimeFormat(x, {
42
+ month: "long"
43
+ }), d = (m) => c.format(new Date(p, m));
44
+ return Array.from(e, d).reduce((m, j, A) => m.concat({
45
+ value: A,
46
+ label: j
47
+ }), []);
48
+ }, []), N = P(() => (i.length > 0 ? i : V(p)).reduce(
49
+ (c, d) => c.concat({ value: d, label: `${d}` }),
50
+ []
51
+ ), [i]), v = (e) => {
52
+ l(e);
53
+ }, y = (e) => {
54
+ s(e);
55
+ };
56
+ return /* @__PURE__ */ S(U, { children: [
57
+ b && /* @__PURE__ */ t("div", { className: a(w), children: b }),
58
+ /* @__PURE__ */ S("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__ */ S("div", { className: a("dropdowns-wrapper"), children: [
72
+ /* @__PURE__ */ t(
73
+ T,
74
+ {
75
+ options: f,
76
+ value: C,
77
+ onChange: v,
78
+ transparentBackground: !0,
79
+ className: a("dropdown", "month-dropdown"),
80
+ toggleButtonClassName: a("toggle-button")
81
+ }
82
+ ),
83
+ /* @__PURE__ */ t(
84
+ T,
85
+ {
86
+ options: N,
87
+ value: p,
88
+ onChange: y,
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_1jr94_5", Q = "_date_1jr94_90", X = "_disabled_1jr94_202", Z = "_popper_1jr94_210", ee = "_input_1jr94_214", oe = {
110
+ calendar: K,
111
+ "current-date": "_current-date_1jr94_89",
112
+ date: Q,
113
+ "selected-range": "_selected-range_1jr94_119",
114
+ "end-date": "_end-date_1jr94_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: x = "",
133
+ calendarClassName: p = "",
134
+ fixedHeight: C = !1,
135
+ language: f = ne,
136
+ yearsOptions: N = [],
137
+ placeholder: v = L.toUpperCase(),
138
+ dateFormat: y = L,
139
+ selects: e = "start",
140
+ value: c = null
141
+ }) => {
142
+ const d = B(null), k = n == null ? void 0 : n.toDateString(), m = o == null ? void 0 : o.toDateString(), j = o && n && o > n, A = (u) => {
143
+ const F = u.toDateString(), Y = F === k, M = j && F === m, I = n && o && u > n && u < o;
144
+ return _("date", {
145
+ "current-date": Y,
146
+ "selected-range": I && !M,
147
+ "end-date": M && j,
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(G, {}),
160
+ ref: d
161
+ }
162
+ ),
163
+ placeholderText: v,
164
+ selected: c,
165
+ startDate: n,
166
+ endDate: o,
167
+ minDate: e === "end" ? n : void 0,
168
+ disabled: s,
169
+ shouldCloseOnSelect: i,
170
+ fixedHeight: C,
171
+ locale: f,
172
+ showPopperArrow: !1,
173
+ dayClassName: A,
174
+ calendarClassName: _(p, "calendar"),
175
+ renderCustomHeader: (u) => /* @__PURE__ */ t(
176
+ J,
177
+ {
178
+ ...u,
179
+ headerNodes: h,
180
+ customClassName: b,
181
+ yearsOptions: N,
182
+ locale: f
183
+ }
184
+ ),
185
+ onChange: r,
186
+ onBlur: l,
187
+ onFocus: g,
188
+ customTimeInput: w,
189
+ showTimeInput: !!w,
190
+ popperClassName: _(x, "popper"),
191
+ dateFormat: y,
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-a2b6acf5.js";
2
+ import { r as v } from "./datePicker-a2b6acf5.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-1ab17a11.js";
8
+ import "./openEye-7b9cf080.js";
9
+ import "./button-33c88abf.js";
10
+ import "./spinLoader-c4a53718.js";
11
+ import "./maxValueDisplay-9be01a75.js";
12
+ import "./fieldLabel.js";
13
+ import "./calendarArrow-3e1339ea.js";
14
+ import "./dropdown-29285346.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-9a6c7ce1.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 ue } from "@floating-ui/react-dom";
5
+ import { useSelect as j } from "downshift";
6
+ import { Scrollbars as ye } from "rc-scrollbars";
7
+ import { u as pe } from "./useOnClickOutside-c332f7d3.js";
8
+ import { K as u } from "./keyCodes-f63c0e11.js";
9
+ import { B as me } from "./baseIconButton-251479f7.js";
10
+ import { S as be } from "./dropdown-0260bb66.js";
11
+ import { FieldLabel as Ce } from "./fieldLabel.js";
12
+ import { C as Oe } from "./checkbox-9a6c7ce1.js";
13
+ const Ne = "_disabled_t3cjj_12", De = "_hidden_t3cjj_16", Ee = "_hover_t3cjj_22", we = {
14
+ "dropdown-option": "_dropdown-option_t3cjj_1",
15
+ disabled: Ne,
16
+ hidden: De,
17
+ hover: Ee,
18
+ "single-option": "_single-option_t3cjj_35",
19
+ "sub-option": "_sub-option_t3cjj_42"
20
+ }, z = J.bind(we), G = _e(
21
+ (r, t) => {
22
+ const {
23
+ option: { value: n, disabled: l, hidden: v, label: y, title: c, groupRef: a },
24
+ selected: K,
25
+ onChange: p,
26
+ render: b,
27
+ highlightHovered: C,
28
+ onMouseEnter: A,
29
+ multiSelect: m,
30
+ isPartiallyChecked: O = !1
31
+ } = r, x = (N) => {
32
+ (N.target instanceof HTMLDivElement || N.target instanceof HTMLInputElement) && (p == null || p(n));
33
+ };
34
+ return /* @__PURE__ */ f(
35
+ "div",
36
+ {
37
+ className: z("dropdown-option", {
38
+ disabled: l,
39
+ hidden: v,
40
+ hover: C
41
+ }),
42
+ title: c,
43
+ onClick: x,
44
+ ref: t,
45
+ onMouseEnter: A,
46
+ children: [
47
+ m && /* @__PURE__ */ d(Oe, { value: !!K, partiallyChecked: O }),
48
+ /* @__PURE__ */ d("div", { className: z("single-option", { "sub-option": !!a }), children: b ? b(r) : y })
49
+ ]
50
+ }
51
+ );
52
+ }
53
+ ), ve = [
54
+ u.ENTER_KEY_CODE,
55
+ u.SPACE_KEY_CODE,
56
+ u.ARROW_DOWN_KEY_CODE
57
+ ], Ke = [u.ESCAPE_KEY_CODE, u.TAB_KEY_CODE];
58
+ var g = /* @__PURE__ */ ((r) => (r.ON_KEY_DOWN = "onKeyDown", r.ON_CLICK = "onClick", r))(g || {});
59
+ const Ae = (r, t) => {
60
+ const n = Array.isArray(t) ? t : [t];
61
+ return r.findIndex(({ value: l }) => n.includes(l));
62
+ }, xe = (r, t) => (r % t + t) % t, P = (r, t = 0, n = 1) => {
63
+ if (!r[t].disabled)
64
+ return t;
65
+ const l = r.length;
66
+ return P(
67
+ r,
68
+ xe(t + n, l),
69
+ n
70
+ );
71
+ }, Ie = (r, t) => P(r, t), ke = (r, t) => P(r, t, -1), je = "_container_1yr7u_1", Pe = "_icon_1yr7u_7", Ye = "_arrow_1yr7u_13", Re = "_dropdown_1yr7u_19", Te = "_disabled_1yr7u_36", He = "_value_1yr7u_43", Me = "_error_1yr7u_46", We = "_touched_1yr7u_46", Le = "_opened_1yr7u_50", Se = "_placeholder_1yr7u_83", Ve = "_ghost_1yr7u_118", $e = "_divider_1yr7u_132", Ue = {
72
+ container: je,
73
+ icon: Pe,
74
+ arrow: Ye,
75
+ dropdown: Re,
76
+ "transparent-background": "_transparent-background_1yr7u_33",
77
+ disabled: Te,
78
+ value: He,
79
+ error: Me,
80
+ touched: We,
81
+ opened: Le,
82
+ placeholder: Se,
83
+ "mobile-disabled": "_mobile-disabled_1yr7u_87",
84
+ "select-list": "_select-list_1yr7u_92",
85
+ "limited-width": "_limited-width_1yr7u_109",
86
+ "options-container": "_options-container_1yr7u_113",
87
+ ghost: Ve,
88
+ divider: $e
89
+ }, o = J.bind(Ue), at = ({
90
+ multiSelect: r = !1,
91
+ value: t = r ? [] : "",
92
+ options: n = [],
93
+ disabled: l = !1,
94
+ error: v,
95
+ onChange: y,
96
+ onFocus: c,
97
+ onBlur: a,
98
+ mobileDisabled: K,
99
+ title: p,
100
+ touched: b = !1,
101
+ icon: C,
102
+ variant: A,
103
+ placeholder: m = "",
104
+ label: O = "",
105
+ renderOption: x,
106
+ transparentBackground: N = !1,
107
+ className: Q,
108
+ toggleButtonClassName: X,
109
+ isListWidthLimited: Z = !1,
110
+ optionAll: Y = { value: "all", label: "All" },
111
+ isOptionAllVisible: R = !1,
112
+ onSelectAll: F = () => {
113
+ },
114
+ formatDisplayedValue: T,
115
+ notScrollable: B = !1,
116
+ footer: H
117
+ }) => {
118
+ const [_, h] = q(!1), M = he(null), [ee, D] = q(null), I = r && Array.isArray(t) ? n.filter((e) => t.includes(e.value)) : null, { refs: W, floatingStyles: te } = fe({
119
+ placement: "bottom-start",
120
+ middleware: [
121
+ ge(5),
122
+ ue({
123
+ fallbackPlacements: ["bottom-start", "top-start", "bottom", "top"]
124
+ })
125
+ ]
126
+ }), re = () => {
127
+ if (R && Array.isArray(t)) {
128
+ const e = n.map((s) => s.value);
129
+ y(t.length === n.length ? [] : e), F();
130
+ }
131
+ };
132
+ pe(M, () => {
133
+ _ && (h(!1), a == null || a());
134
+ });
135
+ const L = (e) => {
136
+ if (!e.disabled) {
137
+ if (r) {
138
+ const s = Array.isArray(t) ? [...t] : [], i = s.indexOf(e.value);
139
+ i === -1 ? s.push(e.value) : s.splice(i, 1), y(s);
140
+ } else
141
+ y(e.value);
142
+ h((s) => r || !s);
143
+ }
144
+ }, ne = () => n.find(({ value: e }) => e === t), S = Ae(n, t), {
145
+ getToggleButtonProps: se,
146
+ getLabelProps: ae,
147
+ getMenuProps: de,
148
+ getItemProps: ie,
149
+ setHighlightedIndex: E,
150
+ highlightedIndex: V,
151
+ selectedItem: w
152
+ } = j({
153
+ items: n,
154
+ itemToString: (e) => (e != null && e.label ? String(e.label) : m) || "",
155
+ selectedItem: ne(),
156
+ isOpen: _,
157
+ circularNavigation: !0,
158
+ defaultHighlightedIndex: S,
159
+ onHighlightedIndexChange: (e) => {
160
+ switch (e.type) {
161
+ case j.stateChangeTypes.MenuKeyDownArrowUp:
162
+ return D(g.ON_KEY_DOWN), E(ke(n, e.highlightedIndex)), e;
163
+ case j.stateChangeTypes.MenuKeyDownArrowDown:
164
+ return D(g.ON_KEY_DOWN), E(Ie(n, e.highlightedIndex)), e;
165
+ default:
166
+ return e;
167
+ }
168
+ }
169
+ }), le = () => {
170
+ l || (h((e) => !e), _ ? a == null || a() : c == null || c(), D(g.ON_CLICK));
171
+ }, k = (() => {
172
+ if (r && Array.isArray(t) && n.length === t.length)
173
+ return Y.label;
174
+ const e = n.reduce((s, i) => ((Array.isArray(t) && t.includes(i.value) || i.value === t) && s.push(i.label), s), []);
175
+ if (e.length > 0)
176
+ return e.join(", ");
177
+ if (!t && t !== !1 && t !== 0 || Array.isArray(t) && !t.length)
178
+ return m;
179
+ })(), oe = (e) => {
180
+ const { keyCode: s } = e;
181
+ ve.includes(s) && !_ && (e.preventDefault(), E(S), h(!0), c == null || c(), D(g.ON_KEY_DOWN));
182
+ }, ce = (e) => {
183
+ const { keyCode: s } = e;
184
+ if (s === u.ENTER_KEY_CODE) {
185
+ const i = n[V];
186
+ L(i), r || (h(!1), a == null || a());
187
+ return;
188
+ }
189
+ Ke.includes(s) && (e.stopPropagation(), h(!1), a == null || a());
190
+ }, $ = () => /* @__PURE__ */ f("div", { className: o("options-container"), children: [
191
+ r && R && Array.isArray(t) && /* @__PURE__ */ f(U, { children: [
192
+ /* @__PURE__ */ d(
193
+ G,
194
+ {
195
+ option: Y,
196
+ selected: t.length === n.length,
197
+ onChange: re,
198
+ multiSelect: r,
199
+ isPartiallyChecked: !!t.length
200
+ }
201
+ ),
202
+ /* @__PURE__ */ d("div", { className: o("divider") }),
203
+ " "
204
+ ] }),
205
+ n.map((e, s) => /* @__PURE__ */ d(
206
+ G,
207
+ {
208
+ ...ie({
209
+ item: e,
210
+ index: s
211
+ }),
212
+ multiSelect: r,
213
+ selected: r ? I == null ? void 0 : I.some((i) => i.value === e.value) : e.value === ((w == null ? void 0 : w.value) ?? w),
214
+ option: { title: e.label, ...e },
215
+ highlightHovered: V === s && ee !== g.ON_CLICK,
216
+ render: x,
217
+ onChange: e.disabled ? null : () => L(e),
218
+ onMouseEnter: () => E(s)
219
+ },
220
+ e.value
221
+ )),
222
+ H && /* @__PURE__ */ f(U, { children: [
223
+ /* @__PURE__ */ d("div", { className: o("divider") }),
224
+ H
225
+ ] })
226
+ ] });
227
+ return /* @__PURE__ */ f("div", { ref: M, className: o("container", Q), title: p, children: [
228
+ O && /* @__PURE__ */ d(Ce, { ...ae(), children: O }),
229
+ /* @__PURE__ */ f(
230
+ "button",
231
+ {
232
+ disabled: l,
233
+ ...se({
234
+ className: o("dropdown", A, X, {
235
+ "transparent-background": N,
236
+ opened: _,
237
+ disabled: l,
238
+ error: v,
239
+ touched: b,
240
+ "mobile-disabled": K
241
+ }),
242
+ onClick: le,
243
+ onKeyDown: oe,
244
+ ref: W.setReference
245
+ }),
246
+ type: "button",
247
+ children: [
248
+ C && /* @__PURE__ */ d("span", { className: o("icon"), children: C }),
249
+ /* @__PURE__ */ d(
250
+ "span",
251
+ {
252
+ className: o("value", {
253
+ placeholder: k === m
254
+ }),
255
+ children: T ? T(k) : k
256
+ }
257
+ ),
258
+ /* @__PURE__ */ d(me, { 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: W.setFloating
270
+ }),
271
+ children: B ? $() : /* @__PURE__ */ d(ye, { autoHeight: !0, autoHeightMax: 216, hideTracksWhenNotNeeded: !0, children: $() })
272
+ }
273
+ )
274
+ ] });
275
+ };
276
+ export {
277
+ at 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-29285346.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-9a6c7ce1.js";
12
14
  export {
13
15
  r as Dropdown,
14
16
  r as default
@@ -0,0 +1,13 @@
1
+ import { jsxs as i, jsx as t } from "react/jsx-runtime";
2
+ import { c as d } from "./bind-06a7ff84.js";
3
+ const c = "_asterisk_1hktw_11", r = "_disabled_1hktw_17", o = {
4
+ "field-label": "_field-label_1hktw_1",
5
+ asterisk: c,
6
+ disabled: r
7
+ }, s = d.bind(o), _ = ({ children: e, isRequired: l = !1, ...a }) => /* @__PURE__ */ i("label", { className: s("field-label"), ...a, children: [
8
+ e,
9
+ l && /* @__PURE__ */ t("span", { className: s("asterisk"), children: "*" })
10
+ ] });
11
+ export {
12
+ _ as FieldLabel
13
+ };