@ktnpm_devops/react-component 0.4.0 → 0.5.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 (372) hide show
  1. package/dist/charts/Sparkline/Sparkline.d.ts +4 -0
  2. package/dist/charts/Sparkline/Sparkline.d.ts.map +1 -0
  3. package/dist/charts/Sparkline/Sparkline.types.d.ts +15 -0
  4. package/dist/charts/Sparkline/Sparkline.types.d.ts.map +1 -0
  5. package/dist/charts/Sparkline/index.d.ts +3 -0
  6. package/dist/charts/Sparkline/index.d.ts.map +1 -0
  7. package/dist/composites/Accordion/Accordion.d.ts +5 -0
  8. package/dist/composites/Accordion/Accordion.d.ts.map +1 -0
  9. package/dist/composites/Accordion/Accordion.types.d.ts +15 -0
  10. package/dist/composites/Accordion/Accordion.types.d.ts.map +1 -0
  11. package/dist/composites/Accordion/index.d.ts +3 -0
  12. package/dist/composites/Accordion/index.d.ts.map +1 -0
  13. package/dist/composites/DatePickerDropdown/DatePickerDropdown.d.ts +7 -0
  14. package/dist/composites/DatePickerDropdown/DatePickerDropdown.d.ts.map +1 -0
  15. package/dist/composites/DatePickerDropdown/DatePickerDropdown.types.d.ts +20 -0
  16. package/dist/composites/DatePickerDropdown/DatePickerDropdown.types.d.ts.map +1 -0
  17. package/dist/composites/DatePickerDropdown/index.d.ts +3 -0
  18. package/dist/composites/DatePickerDropdown/index.d.ts.map +1 -0
  19. package/dist/composites/FilterDropdown/FilterDropdown.d.ts +7 -0
  20. package/dist/composites/FilterDropdown/FilterDropdown.d.ts.map +1 -0
  21. package/dist/composites/FilterDropdown/FilterDropdown.types.d.ts +29 -0
  22. package/dist/composites/FilterDropdown/FilterDropdown.types.d.ts.map +1 -0
  23. package/dist/composites/FilterDropdown/index.d.ts +3 -0
  24. package/dist/composites/FilterDropdown/index.d.ts.map +1 -0
  25. package/dist/constants.d.ts +2 -0
  26. package/dist/constants.d.ts.map +1 -1
  27. package/dist/data/HeatmapMatrix/HeatmapMatrix.d.ts +4 -0
  28. package/dist/data/HeatmapMatrix/HeatmapMatrix.d.ts.map +1 -0
  29. package/dist/data/HeatmapMatrix/HeatmapMatrix.types.d.ts +40 -0
  30. package/dist/data/HeatmapMatrix/HeatmapMatrix.types.d.ts.map +1 -0
  31. package/dist/data/HeatmapMatrix/index.d.ts +3 -0
  32. package/dist/data/HeatmapMatrix/index.d.ts.map +1 -0
  33. package/dist/index.cjs +49 -29
  34. package/dist/index.cjs.map +1 -1
  35. package/dist/index.d.ts +16 -0
  36. package/dist/index.d.ts.map +1 -1
  37. package/dist/index.js +50 -30
  38. package/dist/index.js.map +1 -1
  39. package/dist/index10.cjs +14 -15
  40. package/dist/index10.cjs.map +1 -1
  41. package/dist/index10.js +15 -16
  42. package/dist/index10.js.map +1 -1
  43. package/dist/index11.cjs +15 -4
  44. package/dist/index11.cjs.map +1 -1
  45. package/dist/index11.js +15 -4
  46. package/dist/index11.js.map +1 -1
  47. package/dist/index12.cjs +4 -16
  48. package/dist/index12.cjs.map +1 -1
  49. package/dist/index12.js +4 -16
  50. package/dist/index12.js.map +1 -1
  51. package/dist/index13.cjs +16 -10
  52. package/dist/index13.cjs.map +1 -1
  53. package/dist/index13.js +16 -10
  54. package/dist/index13.js.map +1 -1
  55. package/dist/index14.cjs +10 -100
  56. package/dist/index14.cjs.map +1 -1
  57. package/dist/index14.js +11 -101
  58. package/dist/index14.js.map +1 -1
  59. package/dist/index15.cjs +100 -20
  60. package/dist/index15.cjs.map +1 -1
  61. package/dist/index15.js +101 -21
  62. package/dist/index15.js.map +1 -1
  63. package/dist/index16.cjs +20 -43
  64. package/dist/index16.cjs.map +1 -1
  65. package/dist/index16.js +21 -44
  66. package/dist/index16.js.map +1 -1
  67. package/dist/index17.cjs +38 -85
  68. package/dist/index17.cjs.map +1 -1
  69. package/dist/index17.js +40 -87
  70. package/dist/index17.js.map +1 -1
  71. package/dist/index18.cjs +85 -153
  72. package/dist/index18.cjs.map +1 -1
  73. package/dist/index18.js +86 -154
  74. package/dist/index18.js.map +1 -1
  75. package/dist/index19.cjs +150 -128
  76. package/dist/index19.cjs.map +1 -1
  77. package/dist/index19.js +150 -128
  78. package/dist/index19.js.map +1 -1
  79. package/dist/index20.cjs +121 -106
  80. package/dist/index20.cjs.map +1 -1
  81. package/dist/index20.js +122 -107
  82. package/dist/index20.js.map +1 -1
  83. package/dist/index21.cjs +121 -17
  84. package/dist/index21.cjs.map +1 -1
  85. package/dist/index21.js +121 -17
  86. package/dist/index21.js.map +1 -1
  87. package/dist/index22.cjs +17 -8
  88. package/dist/index22.cjs.map +1 -1
  89. package/dist/index22.js +18 -9
  90. package/dist/index22.js.map +1 -1
  91. package/dist/index23.cjs +152 -119
  92. package/dist/index23.cjs.map +1 -1
  93. package/dist/index23.js +153 -120
  94. package/dist/index23.js.map +1 -1
  95. package/dist/index24.cjs +125 -33
  96. package/dist/index24.cjs.map +1 -1
  97. package/dist/index24.js +126 -34
  98. package/dist/index24.js.map +1 -1
  99. package/dist/index25.cjs +71 -218
  100. package/dist/index25.cjs.map +1 -1
  101. package/dist/index25.js +73 -220
  102. package/dist/index25.js.map +1 -1
  103. package/dist/index26.cjs +6 -32
  104. package/dist/index26.cjs.map +1 -1
  105. package/dist/index26.js +7 -33
  106. package/dist/index26.js.map +1 -1
  107. package/dist/index27.cjs +120 -67
  108. package/dist/index27.cjs.map +1 -1
  109. package/dist/index27.js +121 -68
  110. package/dist/index27.js.map +1 -1
  111. package/dist/index28.cjs +37 -58
  112. package/dist/index28.cjs.map +1 -1
  113. package/dist/index28.js +38 -59
  114. package/dist/index28.js.map +1 -1
  115. package/dist/index29.cjs +208 -137
  116. package/dist/index29.cjs.map +1 -1
  117. package/dist/index29.js +209 -138
  118. package/dist/index29.js.map +1 -1
  119. package/dist/index30.cjs +32 -6
  120. package/dist/index30.cjs.map +1 -1
  121. package/dist/index30.js +33 -7
  122. package/dist/index30.js.map +1 -1
  123. package/dist/index31.cjs +78 -17
  124. package/dist/index31.cjs.map +1 -1
  125. package/dist/index31.js +78 -17
  126. package/dist/index31.js.map +1 -1
  127. package/dist/index32.cjs +55 -73
  128. package/dist/index32.cjs.map +1 -1
  129. package/dist/index32.js +57 -75
  130. package/dist/index32.js.map +1 -1
  131. package/dist/index33.cjs +145 -135
  132. package/dist/index33.cjs.map +1 -1
  133. package/dist/index33.js +146 -136
  134. package/dist/index33.js.map +1 -1
  135. package/dist/index34.cjs +66 -99
  136. package/dist/index34.cjs.map +1 -1
  137. package/dist/index34.js +68 -101
  138. package/dist/index34.js.map +1 -1
  139. package/dist/index35.cjs +8 -6
  140. package/dist/index35.cjs.map +1 -1
  141. package/dist/index35.js +8 -6
  142. package/dist/index35.js.map +1 -1
  143. package/dist/index36.cjs +16 -215
  144. package/dist/index36.cjs.map +1 -1
  145. package/dist/index36.js +16 -215
  146. package/dist/index36.js.map +1 -1
  147. package/dist/index37.cjs +76 -7
  148. package/dist/index37.cjs.map +1 -1
  149. package/dist/index37.js +78 -9
  150. package/dist/index37.js.map +1 -1
  151. package/dist/index38.cjs +145 -16
  152. package/dist/index38.cjs.map +1 -1
  153. package/dist/index38.js +144 -15
  154. package/dist/index38.js.map +1 -1
  155. package/dist/index39.cjs +66 -16
  156. package/dist/index39.cjs.map +1 -1
  157. package/dist/index39.js +65 -15
  158. package/dist/index39.js.map +1 -1
  159. package/dist/index40.cjs +105 -23
  160. package/dist/index40.cjs.map +1 -1
  161. package/dist/index40.js +104 -22
  162. package/dist/index40.js.map +1 -1
  163. package/dist/index41.cjs +49 -16
  164. package/dist/index41.cjs.map +1 -1
  165. package/dist/index41.js +48 -15
  166. package/dist/index41.js.map +1 -1
  167. package/dist/index42.cjs +8 -7
  168. package/dist/index42.cjs.map +1 -1
  169. package/dist/index42.js +7 -6
  170. package/dist/index42.js.map +1 -1
  171. package/dist/index43.cjs +218 -7
  172. package/dist/index43.cjs.map +1 -1
  173. package/dist/index43.js +217 -6
  174. package/dist/index43.js.map +1 -1
  175. package/dist/index44.cjs +10 -28
  176. package/dist/index44.cjs.map +1 -1
  177. package/dist/index44.js +9 -27
  178. package/dist/index44.js.map +1 -1
  179. package/dist/index45.cjs +19 -16
  180. package/dist/index45.cjs.map +1 -1
  181. package/dist/index45.js +18 -15
  182. package/dist/index45.js.map +1 -1
  183. package/dist/index46.cjs +67 -21
  184. package/dist/index46.cjs.map +1 -1
  185. package/dist/index46.js +66 -20
  186. package/dist/index46.js.map +1 -1
  187. package/dist/index47.cjs +15 -21
  188. package/dist/index47.cjs.map +1 -1
  189. package/dist/index47.js +15 -21
  190. package/dist/index47.js.map +1 -1
  191. package/dist/index48.cjs +6 -67
  192. package/dist/index48.cjs.map +1 -1
  193. package/dist/index48.js +5 -66
  194. package/dist/index48.js.map +1 -1
  195. package/dist/index49.cjs +18 -75
  196. package/dist/index49.cjs.map +1 -1
  197. package/dist/index49.js +19 -76
  198. package/dist/index49.js.map +1 -1
  199. package/dist/index50.cjs +15 -36
  200. package/dist/index50.cjs.map +1 -1
  201. package/dist/index50.js +15 -36
  202. package/dist/index50.js.map +1 -1
  203. package/dist/index51.cjs +69 -33
  204. package/dist/index51.cjs.map +1 -1
  205. package/dist/index51.js +68 -32
  206. package/dist/index51.js.map +1 -1
  207. package/dist/index52.cjs +22 -13
  208. package/dist/index52.cjs.map +1 -1
  209. package/dist/index52.js +23 -14
  210. package/dist/index52.js.map +1 -1
  211. package/dist/index53.cjs +13 -34
  212. package/dist/index53.cjs.map +1 -1
  213. package/dist/index53.js +13 -34
  214. package/dist/index53.js.map +1 -1
  215. package/dist/index54.cjs +11 -2
  216. package/dist/index54.cjs.map +1 -1
  217. package/dist/index54.js +11 -2
  218. package/dist/index54.js.map +1 -1
  219. package/dist/index55.cjs +20 -5
  220. package/dist/index55.cjs.map +1 -1
  221. package/dist/index55.js +21 -6
  222. package/dist/index55.js.map +1 -1
  223. package/dist/index56.cjs +2 -38
  224. package/dist/index56.cjs.map +1 -1
  225. package/dist/index56.js +3 -39
  226. package/dist/index56.js.map +1 -1
  227. package/dist/index57.cjs +1 -1
  228. package/dist/index57.js +1 -1
  229. package/dist/index58.cjs +34 -13
  230. package/dist/index58.cjs.map +1 -1
  231. package/dist/index58.js +34 -13
  232. package/dist/index58.js.map +1 -1
  233. package/dist/index59.cjs +13 -52
  234. package/dist/index59.cjs.map +1 -1
  235. package/dist/index59.js +14 -53
  236. package/dist/index59.js.map +1 -1
  237. package/dist/index60.cjs +16 -64
  238. package/dist/index60.cjs.map +1 -1
  239. package/dist/index60.js +16 -64
  240. package/dist/index60.js.map +1 -1
  241. package/dist/index61.cjs +16 -19
  242. package/dist/index61.cjs.map +1 -1
  243. package/dist/index61.js +17 -20
  244. package/dist/index61.js.map +1 -1
  245. package/dist/index62.cjs +10 -16
  246. package/dist/index62.cjs.map +1 -1
  247. package/dist/index62.js +11 -17
  248. package/dist/index62.js.map +1 -1
  249. package/dist/index63.cjs +13 -28
  250. package/dist/index63.cjs.map +1 -1
  251. package/dist/index63.js +14 -29
  252. package/dist/index63.js.map +1 -1
  253. package/dist/index64.cjs +16 -13
  254. package/dist/index64.cjs.map +1 -1
  255. package/dist/index64.js +17 -14
  256. package/dist/index64.js.map +1 -1
  257. package/dist/index65.cjs +48 -36
  258. package/dist/index65.cjs.map +1 -1
  259. package/dist/index65.js +48 -36
  260. package/dist/index65.js.map +1 -1
  261. package/dist/index66.cjs +43 -134
  262. package/dist/index66.cjs.map +1 -1
  263. package/dist/index66.js +42 -133
  264. package/dist/index66.js.map +1 -1
  265. package/dist/index67.cjs +43 -37
  266. package/dist/index67.cjs.map +1 -1
  267. package/dist/index67.js +43 -37
  268. package/dist/index67.js.map +1 -1
  269. package/dist/index68.cjs +24 -39
  270. package/dist/index68.cjs.map +1 -1
  271. package/dist/index68.js +25 -40
  272. package/dist/index68.js.map +1 -1
  273. package/dist/index69.cjs +2 -50
  274. package/dist/index69.cjs.map +1 -1
  275. package/dist/index69.js +3 -51
  276. package/dist/index69.js.map +1 -1
  277. package/dist/index70.cjs +27 -0
  278. package/dist/index70.cjs.map +1 -0
  279. package/dist/index70.js +27 -0
  280. package/dist/index70.js.map +1 -0
  281. package/dist/index71.cjs +27 -0
  282. package/dist/index71.cjs.map +1 -0
  283. package/dist/index71.js +27 -0
  284. package/dist/index71.js.map +1 -0
  285. package/dist/index72.cjs +12 -0
  286. package/dist/index72.cjs.map +1 -0
  287. package/dist/index72.js +12 -0
  288. package/dist/index72.js.map +1 -0
  289. package/dist/index73.cjs +39 -0
  290. package/dist/index73.cjs.map +1 -0
  291. package/dist/index73.js +39 -0
  292. package/dist/index73.js.map +1 -0
  293. package/dist/index74.cjs +36 -0
  294. package/dist/index74.cjs.map +1 -0
  295. package/dist/index74.js +36 -0
  296. package/dist/index74.js.map +1 -0
  297. package/dist/index75.cjs +72 -0
  298. package/dist/index75.cjs.map +1 -0
  299. package/dist/index75.js +72 -0
  300. package/dist/index75.js.map +1 -0
  301. package/dist/index76.cjs +27 -0
  302. package/dist/index76.cjs.map +1 -0
  303. package/dist/index76.js +27 -0
  304. package/dist/index76.js.map +1 -0
  305. package/dist/index77.cjs +136 -0
  306. package/dist/index77.cjs.map +1 -0
  307. package/dist/index77.js +136 -0
  308. package/dist/index77.js.map +1 -0
  309. package/dist/index78.cjs +48 -0
  310. package/dist/index78.cjs.map +1 -0
  311. package/dist/index78.js +48 -0
  312. package/dist/index78.js.map +1 -0
  313. package/dist/index79.cjs +87 -0
  314. package/dist/index79.cjs.map +1 -0
  315. package/dist/index79.js +87 -0
  316. package/dist/index79.js.map +1 -0
  317. package/dist/index80.cjs +60 -0
  318. package/dist/index80.cjs.map +1 -0
  319. package/dist/index80.js +60 -0
  320. package/dist/index80.js.map +1 -0
  321. package/dist/index81.cjs +36 -0
  322. package/dist/index81.cjs.map +1 -0
  323. package/dist/index81.js +36 -0
  324. package/dist/index81.js.map +1 -0
  325. package/dist/index82.cjs +33 -0
  326. package/dist/index82.cjs.map +1 -0
  327. package/dist/index82.js +33 -0
  328. package/dist/index82.js.map +1 -0
  329. package/dist/index83.cjs +42 -0
  330. package/dist/index83.cjs.map +1 -0
  331. package/dist/index83.js +42 -0
  332. package/dist/index83.js.map +1 -0
  333. package/dist/index84.cjs +60 -0
  334. package/dist/index84.cjs.map +1 -0
  335. package/dist/index84.js +60 -0
  336. package/dist/index84.js.map +1 -0
  337. package/dist/index85.cjs +12 -0
  338. package/dist/index85.cjs.map +1 -0
  339. package/dist/index85.js +12 -0
  340. package/dist/index85.js.map +1 -0
  341. package/dist/index86.cjs +18 -0
  342. package/dist/index86.cjs.map +1 -0
  343. package/dist/index86.js +18 -0
  344. package/dist/index86.js.map +1 -0
  345. package/dist/index9.cjs +45 -14
  346. package/dist/index9.cjs.map +1 -1
  347. package/dist/index9.js +46 -15
  348. package/dist/index9.js.map +1 -1
  349. package/dist/primitives/SegmentedControl/SegmentedControl.d.ts +8 -0
  350. package/dist/primitives/SegmentedControl/SegmentedControl.d.ts.map +1 -0
  351. package/dist/primitives/SegmentedControl/SegmentedControl.types.d.ts +25 -0
  352. package/dist/primitives/SegmentedControl/SegmentedControl.types.d.ts.map +1 -0
  353. package/dist/primitives/SegmentedControl/index.d.ts +3 -0
  354. package/dist/primitives/SegmentedControl/index.d.ts.map +1 -0
  355. package/dist/primitives/StatCard/StatCard.d.ts +4 -0
  356. package/dist/primitives/StatCard/StatCard.d.ts.map +1 -0
  357. package/dist/primitives/StatCard/StatCard.types.d.ts +16 -0
  358. package/dist/primitives/StatCard/StatCard.types.d.ts.map +1 -0
  359. package/dist/primitives/StatCard/index.d.ts +3 -0
  360. package/dist/primitives/StatCard/index.d.ts.map +1 -0
  361. package/dist/primitives/Toast/Toast.d.ts +5 -0
  362. package/dist/primitives/Toast/Toast.d.ts.map +1 -0
  363. package/dist/primitives/Toast/Toast.types.d.ts +28 -0
  364. package/dist/primitives/Toast/Toast.types.d.ts.map +1 -0
  365. package/dist/primitives/Toast/ToastProvider.d.ts +5 -0
  366. package/dist/primitives/Toast/ToastProvider.d.ts.map +1 -0
  367. package/dist/primitives/Toast/index.d.ts +4 -0
  368. package/dist/primitives/Toast/index.d.ts.map +1 -0
  369. package/dist/style.css +561 -0
  370. package/dist/styles.cjs +1 -0
  371. package/dist/styles.mjs +1 -0
  372. package/package.json +8 -3
package/dist/index29.js CHANGED
@@ -1,157 +1,228 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import { useMemo } from "react";
3
- import ReactECharts from "echarts-for-react";
4
- import { clsx } from "./index38.js";
5
- import { MAX_SANKEY_NODES, CHART_COLORS } from "./index48.js";
6
- import styles from "./index56.js";
7
- const COLOR_METRIC_OPTIONS = [
8
- { value: "deviation", label: "Deviation" },
9
- { value: "severity", label: "Severity" },
10
- { value: "origin", label: "Origin" },
11
- { value: "persistence", label: "Persistence" }
12
- ];
13
- const WIDTH_METRIC_OPTIONS = [
14
- { value: "slots", label: "Slots" },
15
- { value: "distinct_objects", label: "Distinct Objects" }
16
- ];
17
- const buildNodes = (rows) => {
18
- const seen = /* @__PURE__ */ new Set();
19
- const nodes = [];
20
- for (const row of rows) {
21
- if (!seen.has(row.source)) {
22
- seen.add(row.source);
23
- nodes.push({ name: row.source });
24
- }
25
- if (!seen.has(row.target)) {
26
- seen.add(row.target);
27
- nodes.push({ name: row.target });
28
- }
29
- }
30
- return nodes;
2
+ import { useState, useRef, useMemo, useCallback, useEffect } from "react";
3
+ import { clsx } from "./index47.js";
4
+ import { useClickOutside } from "./index4.js";
5
+ import { SVG_STROKE_WIDTH, SVG_VIEWBOX, ICON_SIZE } from "./index51.js";
6
+ import styles from "./index79.js";
7
+ const arraysMatch = (a, b) => {
8
+ if (a.length !== b.length) return false;
9
+ const set = new Set(b);
10
+ return a.every((v) => set.has(v));
31
11
  };
32
- const SankeyChartCard = ({
33
- title,
34
- rows,
12
+ const MultiSelectDropdown = ({
13
+ label,
14
+ options,
15
+ selected,
16
+ onApply,
35
17
  isLoading = false,
36
18
  error = null,
37
- onRetry,
38
- onChartReady,
39
- actions,
40
- className,
41
- colorMetric = "deviation",
42
- widthMetric = "slots",
43
- onColorMetricChange,
44
- onWidthMetricChange,
45
- onNodeClick,
46
- onNodeContextMenu,
47
- maxNodes = MAX_SANKEY_NODES
19
+ allowCustomValues = false,
20
+ customTriggerLabel,
21
+ selectionMode
48
22
  }) => {
49
- const isTruncated = rows.length > maxNodes;
50
- const visibleRows = isTruncated ? rows.slice(0, maxNodes) : rows;
51
- const option = useMemo(() => {
52
- const nodes = buildNodes(visibleRows);
53
- const links = visibleRows.map((row) => ({
54
- source: row.source,
55
- target: row.target,
56
- value: row.value,
57
- lineStyle: row.color ? { color: row.color } : void 0
58
- }));
59
- return {
60
- tooltip: { trigger: "item" },
61
- series: [
62
- {
63
- type: "sankey",
64
- data: nodes.map((node, i) => ({
65
- ...node,
66
- itemStyle: { color: CHART_COLORS[i % CHART_COLORS.length] }
67
- })),
68
- links,
69
- emphasis: { focus: "adjacency" },
70
- lineStyle: { color: "gradient", curveness: 0.5 }
71
- }
72
- ]
73
- };
74
- }, [visibleRows]);
75
- const handleChartReady = (instance) => {
76
- if (onNodeClick) {
77
- instance.on("click", (params) => {
78
- const p = params;
79
- if (p.dataType === "node" && p.name) {
80
- onNodeClick({ name: p.name, type: "node" });
81
- }
23
+ const [isOpen, setIsOpen] = useState(false);
24
+ const [searchTerm, setSearchTerm] = useState("");
25
+ const containerRef = useRef(null);
26
+ const normalizedOptions = useMemo(() => {
27
+ const map = /* @__PURE__ */ new Map();
28
+ options.forEach((opt) => map.set(opt.value, opt));
29
+ if (Array.isArray(selected)) {
30
+ selected.forEach((v) => {
31
+ if (v && !map.has(v)) map.set(v, { value: v });
82
32
  });
83
33
  }
84
- if (onNodeContextMenu) {
85
- instance.on("contextmenu", (params) => {
86
- var _a, _b;
87
- const p = params;
88
- if (p.dataType === "node" && p.name) {
89
- onNodeContextMenu(
90
- { name: p.name, type: "node" },
91
- { x: ((_a = p.event) == null ? void 0 : _a.offsetX) ?? 0, y: ((_b = p.event) == null ? void 0 : _b.offsetY) ?? 0 }
92
- );
93
- }
94
- });
34
+ return Array.from(map.values());
35
+ }, [options, selected]);
36
+ const filteredOptions = useMemo(() => {
37
+ if (!searchTerm.trim()) return normalizedOptions;
38
+ const term = searchTerm.trim().toLowerCase();
39
+ return normalizedOptions.filter((opt) => {
40
+ const lbl = opt.label ?? opt.value;
41
+ return lbl.toLowerCase().includes(term) || opt.value.toLowerCase().includes(term);
42
+ });
43
+ }, [normalizedOptions, searchTerm]);
44
+ const allOptionValues = useMemo(() => normalizedOptions.map((o) => o.value), [normalizedOptions]);
45
+ const initialSelection = useMemo(
46
+ () => Array.isArray(selected) && selected.length ? Array.from(new Set(selected)) : allOptionValues,
47
+ [selected, allOptionValues]
48
+ );
49
+ const [pendingSelection, setPendingSelection] = useState(initialSelection);
50
+ const closeAndReset = useCallback(() => {
51
+ setIsOpen(false);
52
+ setPendingSelection(initialSelection);
53
+ setSearchTerm("");
54
+ }, [initialSelection]);
55
+ useClickOutside(containerRef, closeAndReset);
56
+ useEffect(() => {
57
+ if (isOpen) {
58
+ setPendingSelection(initialSelection);
59
+ setSearchTerm("");
60
+ }
61
+ }, [isOpen, initialSelection]);
62
+ useEffect(() => {
63
+ if (!isOpen) setPendingSelection(initialSelection);
64
+ }, [initialSelection, isOpen]);
65
+ const handleToggleOption = (value) => {
66
+ setPendingSelection((prev) => {
67
+ const unique = Array.from(new Set(prev));
68
+ return unique.includes(value) ? unique.filter((v) => v !== value) : [...unique, value];
69
+ });
70
+ };
71
+ const handleSelectAll = () => {
72
+ if (filteredOptions.length === 0) {
73
+ setPendingSelection([]);
74
+ return;
95
75
  }
96
- onChartReady == null ? void 0 : onChartReady(instance);
76
+ setPendingSelection(filteredOptions.map((o) => o.value));
77
+ };
78
+ const handleClearAll = () => setPendingSelection([]);
79
+ const handleApply = () => {
80
+ const unique = Array.from(new Set(pendingSelection));
81
+ const mode = unique.length === 0 || unique.length === normalizedOptions.length ? "all" : "custom";
82
+ onApply(unique, { selectionMode: mode });
83
+ setIsOpen(false);
84
+ };
85
+ const handleCancel = () => {
86
+ setPendingSelection(Array.from(new Set(Array.isArray(selected) ? selected : [])));
87
+ setIsOpen(false);
88
+ };
89
+ const pendingSet = useMemo(() => new Set(pendingSelection), [pendingSelection]);
90
+ const selectedSet = useMemo(() => new Set(Array.isArray(selected) ? selected : []), [selected]);
91
+ const hasChanges = !arraysMatch(Array.from(pendingSet), Array.from(selectedSet));
92
+ const totalOptions = normalizedOptions.length;
93
+ const selectedSize = selectedSet.size;
94
+ const pendingSize = pendingSet.size;
95
+ const isSelectedAll = selectedSize === 0 || selectedSize === totalOptions;
96
+ const isPendingAll = pendingSize === 0 || pendingSize === totalOptions;
97
+ const selectedCountValue = isSelectedAll ? totalOptions : selectedSize;
98
+ const pendingCountValue = isPendingAll ? totalOptions : pendingSize;
99
+ const isActiveFilter = selectionMode !== void 0 ? selectionMode === "custom" : !isSelectedAll;
100
+ const getSelectedLabel = () => {
101
+ if (isSelectedAll) return "All";
102
+ if (selectedSize === 1) {
103
+ const val = Array.from(selectedSet)[0];
104
+ const opt = normalizedOptions.find((o) => o.value === val);
105
+ return (opt == null ? void 0 : opt.label) || (opt == null ? void 0 : opt.value) || String(selectedCountValue);
106
+ }
107
+ return String(selectedCountValue);
108
+ };
109
+ const shouldDisableControls = isLoading || options.length === 0;
110
+ const normalizedSearch = searchTerm.trim();
111
+ const canCreateCustom = allowCustomValues && normalizedSearch.length > 0 && !normalizedOptions.some((o) => o.value.toLowerCase() === normalizedSearch.toLowerCase());
112
+ const handleCreateCustom = () => {
113
+ if (!normalizedSearch) return;
114
+ setPendingSelection((prev) => Array.from(/* @__PURE__ */ new Set([...prev, normalizedSearch])));
115
+ setSearchTerm("");
97
116
  };
98
- const hasToolbar = onColorMetricChange || onWidthMetricChange;
99
- return /* @__PURE__ */ jsxs("div", { className: clsx(styles.root, className), children: [
100
- /* @__PURE__ */ jsxs("header", { className: styles.header, children: [
101
- /* @__PURE__ */ jsx("h3", { className: styles.title, children: title }),
102
- actions && /* @__PURE__ */ jsx("div", { className: styles.headerActions, children: actions })
103
- ] }),
104
- hasToolbar && /* @__PURE__ */ jsxs("div", { className: styles.toolbar, children: [
105
- onColorMetricChange && /* @__PURE__ */ jsxs("label", { children: [
106
- /* @__PURE__ */ jsx("span", { className: styles.toolbarLabel, children: "Color: " }),
117
+ const handleClearFilter = (e) => {
118
+ e.preventDefault();
119
+ e.stopPropagation();
120
+ onApply([], { selectionMode: "all" });
121
+ };
122
+ return /* @__PURE__ */ jsxs("div", { className: styles.root, ref: containerRef, children: [
123
+ /* @__PURE__ */ jsx(
124
+ "button",
125
+ {
126
+ type: "button",
127
+ className: clsx(styles.trigger, { [styles.active]: isOpen }),
128
+ onClick: () => setIsOpen((prev) => !prev),
129
+ "aria-expanded": isOpen,
130
+ "aria-haspopup": "listbox",
131
+ children: /* @__PURE__ */ jsxs("div", { className: styles.triggerContent, children: [
132
+ /* @__PURE__ */ jsx("svg", { className: styles.chevron, width: ICON_SIZE.MD, height: ICON_SIZE.MD, viewBox: SVG_VIEWBOX, fill: "none", stroke: "currentColor", strokeWidth: SVG_STROKE_WIDTH, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" }) }),
133
+ /* @__PURE__ */ jsx("span", { className: styles.label, children: label }),
134
+ /* @__PURE__ */ jsxs("div", { className: styles.valueGroup, children: [
135
+ /* @__PURE__ */ jsx("span", { className: styles.value, children: customTriggerLabel || getSelectedLabel() }),
136
+ isActiveFilter && /* @__PURE__ */ jsx("span", { className: styles.badge, children: selectedCountValue }),
137
+ isActiveFilter && /* @__PURE__ */ jsx(
138
+ "div",
139
+ {
140
+ role: "button",
141
+ tabIndex: 0,
142
+ className: styles.clear,
143
+ onClick: handleClearFilter,
144
+ onKeyDown: (e) => {
145
+ if (e.key === "Enter" || e.key === " ") {
146
+ e.preventDefault();
147
+ handleClearFilter(e);
148
+ }
149
+ },
150
+ "aria-label": `Clear ${label} filter`,
151
+ children: /* @__PURE__ */ jsxs("svg", { width: ICON_SIZE.SM, height: ICON_SIZE.SM, viewBox: SVG_VIEWBOX, fill: "none", stroke: "currentColor", strokeWidth: SVG_STROKE_WIDTH, strokeLinecap: "round", strokeLinejoin: "round", children: [
152
+ /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
153
+ /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
154
+ ] })
155
+ }
156
+ )
157
+ ] })
158
+ ] })
159
+ }
160
+ ),
161
+ isOpen && /* @__PURE__ */ jsxs("div", { className: styles.panel, role: "dialog", "aria-label": `${label} filter`, children: [
162
+ /* @__PURE__ */ jsxs("div", { className: styles.header, children: [
107
163
  /* @__PURE__ */ jsx(
108
- "select",
164
+ "input",
109
165
  {
110
- className: styles.toolbarSelect,
111
- value: colorMetric,
112
- onChange: (e) => onColorMetricChange(e.target.value),
113
- children: COLOR_METRIC_OPTIONS.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.value, children: opt.label }, opt.value))
166
+ type: "search",
167
+ className: styles.search,
168
+ placeholder: `Search ${label.toLowerCase()}`,
169
+ value: searchTerm,
170
+ onChange: (e) => setSearchTerm(e.target.value),
171
+ disabled: shouldDisableControls
114
172
  }
115
- )
173
+ ),
174
+ /* @__PURE__ */ jsxs("div", { className: styles.headerActions, children: [
175
+ /* @__PURE__ */ jsx("button", { type: "button", className: styles.chip, onClick: handleSelectAll, disabled: shouldDisableControls, children: "Select all" }),
176
+ /* @__PURE__ */ jsx("button", { type: "button", className: clsx(styles.chip, styles.chipGhost), onClick: handleClearAll, disabled: pendingSize === 0, children: "Deselect all" })
177
+ ] })
116
178
  ] }),
117
- onWidthMetricChange && /* @__PURE__ */ jsxs("label", { children: [
118
- /* @__PURE__ */ jsx("span", { className: styles.toolbarLabel, children: "Width: " }),
119
- /* @__PURE__ */ jsx(
120
- "select",
121
- {
122
- className: styles.toolbarSelect,
123
- value: widthMetric,
124
- onChange: (e) => onWidthMetricChange(e.target.value),
125
- children: WIDTH_METRIC_OPTIONS.map((opt) => /* @__PURE__ */ jsx("option", { value: opt.value, children: opt.label }, opt.value))
126
- }
127
- )
179
+ /* @__PURE__ */ jsxs("div", { className: styles.list, role: "listbox", children: [
180
+ isLoading && /* @__PURE__ */ jsx("p", { className: styles.status, children: "Loading options..." }),
181
+ !isLoading && error && /* @__PURE__ */ jsx("p", { className: clsx(styles.status, styles.statusError), children: error }),
182
+ !isLoading && !error && filteredOptions.length === 0 && /* @__PURE__ */ jsx("p", { className: styles.status, children: "No matches" }),
183
+ !isLoading && !error && filteredOptions.map((opt) => {
184
+ const checked = pendingSet.has(opt.value);
185
+ return /* @__PURE__ */ jsxs("label", { className: styles.option, children: [
186
+ /* @__PURE__ */ jsx(
187
+ "input",
188
+ {
189
+ type: "checkbox",
190
+ checked,
191
+ onChange: () => handleToggleOption(opt.value),
192
+ "aria-checked": checked
193
+ }
194
+ ),
195
+ /* @__PURE__ */ jsxs("span", { className: styles.optionLabel, children: [
196
+ opt.label ?? opt.value,
197
+ opt.count !== void 0 && /* @__PURE__ */ jsx("span", { className: styles.optionCount, children: opt.count })
198
+ ] })
199
+ ] }, opt.value);
200
+ }),
201
+ !isLoading && !error && canCreateCustom && /* @__PURE__ */ jsxs("button", { type: "button", className: styles.create, onClick: handleCreateCustom, children: [
202
+ 'Use "',
203
+ normalizedSearch,
204
+ '"'
205
+ ] })
206
+ ] }),
207
+ /* @__PURE__ */ jsxs("div", { className: styles.footer, children: [
208
+ /* @__PURE__ */ jsxs("span", { className: styles.selection, children: [
209
+ isPendingAll ? "All selected" : `${pendingCountValue} selected`,
210
+ hasChanges && /* @__PURE__ */ jsxs("span", { className: styles.selectionDelta, children: [
211
+ "(",
212
+ pendingCountValue - selectedCountValue >= 0 ? "+" : "",
213
+ pendingCountValue - selectedCountValue,
214
+ ")"
215
+ ] })
216
+ ] }),
217
+ /* @__PURE__ */ jsxs("div", { className: styles.footerActions, children: [
218
+ /* @__PURE__ */ jsx("button", { type: "button", className: clsx(styles.chip, styles.chipGhost), onClick: handleCancel, children: "Cancel" }),
219
+ /* @__PURE__ */ jsx("button", { type: "button", className: styles.chip, onClick: handleApply, disabled: !hasChanges, children: "Apply" })
220
+ ] })
128
221
  ] })
129
- ] }),
130
- isTruncated && /* @__PURE__ */ jsxs("div", { className: styles.warning, children: [
131
- "Showing ",
132
- maxNodes,
133
- " of ",
134
- rows.length,
135
- " flows. Some data has been truncated."
136
- ] }),
137
- isLoading && /* @__PURE__ */ jsx("div", { className: styles.loading, children: "Loading chart..." }),
138
- !isLoading && error && /* @__PURE__ */ jsxs("div", { className: styles.error, children: [
139
- /* @__PURE__ */ jsx("span", { children: error }),
140
- onRetry && /* @__PURE__ */ jsx("button", { type: "button", className: styles.retryButton, onClick: onRetry, children: "Retry" })
141
- ] }),
142
- !isLoading && !error && rows.length === 0 && /* @__PURE__ */ jsx("div", { className: styles.empty, children: "No flow data available." }),
143
- !isLoading && !error && rows.length > 0 && /* @__PURE__ */ jsx("div", { className: styles.chartContainer, children: /* @__PURE__ */ jsx(
144
- ReactECharts,
145
- {
146
- option,
147
- style: { height: "100%", minHeight: "25rem" },
148
- onChartReady: handleChartReady
149
- }
150
- ) })
222
+ ] })
151
223
  ] });
152
224
  };
153
- SankeyChartCard.displayName = "SankeyChartCard";
154
225
  export {
155
- SankeyChartCard
226
+ MultiSelectDropdown
156
227
  };
157
228
  //# sourceMappingURL=index29.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index29.js","sources":["../src/charts/SankeyChartCard/SankeyChartCard.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport ReactECharts from 'echarts-for-react';\nimport clsx from 'clsx';\nimport type { SankeyChartCardProps } from './SankeyChartCard.types';\nimport type { EChartsInstance, SankeyColorMetric, SankeyWidthMetric } from '../../types/chart.types';\nimport { MAX_SANKEY_NODES, CHART_COLORS } from '../../constants';\nimport styles from './SankeyChartCard.module.css';\n\n/** Colour metric labels for the toolbar selector. */\nconst COLOR_METRIC_OPTIONS: { value: SankeyColorMetric; label: string }[] = [\n { value: 'deviation', label: 'Deviation' },\n { value: 'severity', label: 'Severity' },\n { value: 'origin', label: 'Origin' },\n { value: 'persistence', label: 'Persistence' },\n];\n\n/** Width metric labels for the toolbar selector. */\nconst WIDTH_METRIC_OPTIONS: { value: SankeyWidthMetric; label: string }[] = [\n { value: 'slots', label: 'Slots' },\n { value: 'distinct_objects', label: 'Distinct Objects' },\n];\n\n/** Build a unique node list from source/target pairs. */\nconst buildNodes = (rows: SankeyChartCardProps['rows']) => {\n const seen = new Set<string>();\n const nodes: { name: string }[] = [];\n\n for (const row of rows) {\n if (!seen.has(row.source)) {\n seen.add(row.source);\n nodes.push({ name: row.source });\n }\n if (!seen.has(row.target)) {\n seen.add(row.target);\n nodes.push({ name: row.target });\n }\n }\n\n return nodes;\n};\n\nexport const SankeyChartCard = ({\n title,\n rows,\n isLoading = false,\n error = null,\n onRetry,\n onChartReady,\n actions,\n className,\n colorMetric = 'deviation',\n widthMetric = 'slots',\n onColorMetricChange,\n onWidthMetricChange,\n onNodeClick,\n onNodeContextMenu,\n maxNodes = MAX_SANKEY_NODES,\n}: SankeyChartCardProps) => {\n const isTruncated = rows.length > maxNodes;\n const visibleRows = isTruncated ? rows.slice(0, maxNodes) : rows;\n\n const option = useMemo(() => {\n const nodes = buildNodes(visibleRows);\n const links = visibleRows.map((row) => ({\n source: row.source,\n target: row.target,\n value: row.value,\n lineStyle: row.color ? { color: row.color } : undefined,\n }));\n\n return {\n tooltip: { trigger: 'item' as const },\n series: [\n {\n type: 'sankey' as const,\n data: nodes.map((node, i) => ({\n ...node,\n itemStyle: { color: CHART_COLORS[i % CHART_COLORS.length] },\n })),\n links,\n emphasis: { focus: 'adjacency' as const },\n lineStyle: { color: 'gradient' as const, curveness: 0.5 },\n },\n ],\n };\n }, [visibleRows]);\n\n const handleChartReady = (instance: EChartsInstance) => {\n if (onNodeClick) {\n instance.on('click', (params: unknown) => {\n const p = params as { dataType?: string; name?: string };\n if (p.dataType === 'node' && p.name) {\n onNodeClick({ name: p.name, type: 'node' });\n }\n });\n }\n\n if (onNodeContextMenu) {\n instance.on('contextmenu', (params: unknown) => {\n const p = params as { dataType?: string; name?: string; event?: { offsetX?: number; offsetY?: number } };\n if (p.dataType === 'node' && p.name) {\n onNodeContextMenu(\n { name: p.name, type: 'node' },\n { x: p.event?.offsetX ?? 0, y: p.event?.offsetY ?? 0 },\n );\n }\n });\n }\n\n onChartReady?.(instance);\n };\n\n const hasToolbar = onColorMetricChange || onWidthMetricChange;\n\n return (\n <div className={clsx(styles.root, className)}>\n <header className={styles.header}>\n <h3 className={styles.title}>{title}</h3>\n {actions && <div className={styles.headerActions}>{actions}</div>}\n </header>\n\n {hasToolbar && (\n <div className={styles.toolbar}>\n {onColorMetricChange && (\n <label>\n <span className={styles.toolbarLabel}>Color: </span>\n <select\n className={styles.toolbarSelect}\n value={colorMetric}\n onChange={(e) => onColorMetricChange(e.target.value as SankeyColorMetric)}\n >\n {COLOR_METRIC_OPTIONS.map((opt) => (\n <option key={opt.value} value={opt.value}>\n {opt.label}\n </option>\n ))}\n </select>\n </label>\n )}\n {onWidthMetricChange && (\n <label>\n <span className={styles.toolbarLabel}>Width: </span>\n <select\n className={styles.toolbarSelect}\n value={widthMetric}\n onChange={(e) => onWidthMetricChange(e.target.value as SankeyWidthMetric)}\n >\n {WIDTH_METRIC_OPTIONS.map((opt) => (\n <option key={opt.value} value={opt.value}>\n {opt.label}\n </option>\n ))}\n </select>\n </label>\n )}\n </div>\n )}\n\n {isTruncated && (\n <div className={styles.warning}>\n Showing {maxNodes} of {rows.length} flows. Some data has been truncated.\n </div>\n )}\n\n {isLoading && <div className={styles.loading}>Loading chart...</div>}\n\n {!isLoading && error && (\n <div className={styles.error}>\n <span>{error}</span>\n {onRetry && (\n <button type=\"button\" className={styles.retryButton} onClick={onRetry}>\n Retry\n </button>\n )}\n </div>\n )}\n\n {!isLoading && !error && rows.length === 0 && (\n <div className={styles.empty}>No flow data available.</div>\n )}\n\n {!isLoading && !error && rows.length > 0 && (\n <div className={styles.chartContainer}>\n <ReactECharts\n option={option}\n style={{ height: '100%', minHeight: '25rem' }}\n onChartReady={handleChartReady}\n />\n </div>\n )}\n </div>\n );\n};\n\nSankeyChartCard.displayName = 'SankeyChartCard';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index29.js","sources":["../src/composites/MultiSelectDropdown/MultiSelectDropdown.tsx"],"sourcesContent":["import { useState, useRef, useEffect, useMemo, useCallback } from 'react';\nimport clsx from 'clsx';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { ICON_SIZE, SVG_VIEWBOX, SVG_STROKE_WIDTH } from '../../constants';\nimport styles from './MultiSelectDropdown.module.css';\n\nexport interface MultiSelectOption {\n value: string;\n label?: string;\n count?: number;\n}\n\nexport interface MultiSelectDropdownProps {\n /** Label displayed on the trigger button. */\n label: string;\n /** Available options. */\n options: MultiSelectOption[];\n /** Currently selected values (controlled). */\n selected: string[];\n /** Called when the user applies a new selection. */\n onApply: (values: string[], metadata: { selectionMode: 'all' | 'custom' }) => void;\n /** Show loading indicator and disable controls. */\n isLoading?: boolean;\n /** Error message to display in the option list. */\n error?: string | null;\n /** Allow creating options from the search term. */\n allowCustomValues?: boolean;\n /** Override the trigger value label. */\n customTriggerLabel?: string;\n /** Explicit selection mode override. */\n selectionMode?: 'all' | 'custom';\n}\n\nconst arraysMatch = (a: string[], b: string[]): boolean => {\n if (a.length !== b.length) return false;\n const set = new Set(b);\n return a.every((v) => set.has(v));\n};\n\nexport const MultiSelectDropdown = ({\n label,\n options,\n selected,\n onApply,\n isLoading = false,\n error = null,\n allowCustomValues = false,\n customTriggerLabel,\n selectionMode,\n}: MultiSelectDropdownProps) => {\n const [isOpen, setIsOpen] = useState(false);\n const [searchTerm, setSearchTerm] = useState('');\n const containerRef = useRef<HTMLDivElement>(null);\n\n const normalizedOptions = useMemo<MultiSelectOption[]>(() => {\n const map = new Map<string, MultiSelectOption>();\n options.forEach((opt) => map.set(opt.value, opt));\n if (Array.isArray(selected)) {\n selected.forEach((v) => {\n if (v && !map.has(v)) map.set(v, { value: v });\n });\n }\n return Array.from(map.values());\n }, [options, selected]);\n\n const filteredOptions = useMemo<MultiSelectOption[]>(() => {\n if (!searchTerm.trim()) return normalizedOptions;\n const term = searchTerm.trim().toLowerCase();\n return normalizedOptions.filter((opt) => {\n const lbl = opt.label ?? opt.value;\n return lbl.toLowerCase().includes(term) || opt.value.toLowerCase().includes(term);\n });\n }, [normalizedOptions, searchTerm]);\n\n const allOptionValues = useMemo(() => normalizedOptions.map((o) => o.value), [normalizedOptions]);\n\n const initialSelection = useMemo(\n () => (Array.isArray(selected) && selected.length ? Array.from(new Set(selected)) : allOptionValues),\n [selected, allOptionValues],\n );\n\n const [pendingSelection, setPendingSelection] = useState<string[]>(initialSelection);\n\n const closeAndReset = useCallback(() => {\n setIsOpen(false);\n setPendingSelection(initialSelection);\n setSearchTerm('');\n }, [initialSelection]);\n\n useClickOutside(containerRef, closeAndReset);\n\n useEffect(() => {\n if (isOpen) {\n setPendingSelection(initialSelection);\n setSearchTerm('');\n }\n }, [isOpen, initialSelection]);\n\n useEffect(() => {\n if (!isOpen) setPendingSelection(initialSelection);\n }, [initialSelection, isOpen]);\n\n const handleToggleOption = (value: string) => {\n setPendingSelection((prev) => {\n const unique = Array.from(new Set(prev));\n return unique.includes(value) ? unique.filter((v) => v !== value) : [...unique, value];\n });\n };\n\n const handleSelectAll = () => {\n if (filteredOptions.length === 0) {\n setPendingSelection([]);\n return;\n }\n setPendingSelection(filteredOptions.map((o) => o.value));\n };\n\n const handleClearAll = () => setPendingSelection([]);\n\n const handleApply = () => {\n const unique = Array.from(new Set(pendingSelection));\n const mode: 'all' | 'custom' =\n unique.length === 0 || unique.length === normalizedOptions.length ? 'all' : 'custom';\n onApply(unique, { selectionMode: mode });\n setIsOpen(false);\n };\n\n const handleCancel = () => {\n setPendingSelection(Array.from(new Set(Array.isArray(selected) ? selected : [])));\n setIsOpen(false);\n };\n\n const pendingSet = useMemo(() => new Set(pendingSelection), [pendingSelection]);\n const selectedSet = useMemo(() => new Set(Array.isArray(selected) ? selected : []), [selected]);\n const hasChanges = !arraysMatch(Array.from(pendingSet), Array.from(selectedSet));\n\n const totalOptions = normalizedOptions.length;\n const selectedSize = selectedSet.size;\n const pendingSize = pendingSet.size;\n const isSelectedAll = selectedSize === 0 || selectedSize === totalOptions;\n const isPendingAll = pendingSize === 0 || pendingSize === totalOptions;\n const selectedCountValue = isSelectedAll ? totalOptions : selectedSize;\n const pendingCountValue = isPendingAll ? totalOptions : pendingSize;\n\n const isActiveFilter = selectionMode !== undefined ? selectionMode === 'custom' : !isSelectedAll;\n\n const getSelectedLabel = (): string => {\n if (isSelectedAll) return 'All';\n if (selectedSize === 1) {\n const val = Array.from(selectedSet)[0];\n const opt = normalizedOptions.find((o) => o.value === val);\n return opt?.label || opt?.value || String(selectedCountValue);\n }\n return String(selectedCountValue);\n };\n\n const shouldDisableControls = isLoading || options.length === 0;\n\n const normalizedSearch = searchTerm.trim();\n const canCreateCustom =\n allowCustomValues &&\n normalizedSearch.length > 0 &&\n !normalizedOptions.some((o) => o.value.toLowerCase() === normalizedSearch.toLowerCase());\n\n const handleCreateCustom = () => {\n if (!normalizedSearch) return;\n setPendingSelection((prev) => Array.from(new Set([...prev, normalizedSearch])));\n setSearchTerm('');\n };\n\n const handleClearFilter = (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onApply([], { selectionMode: 'all' });\n };\n\n return (\n <div className={styles.root} ref={containerRef}>\n <button\n type=\"button\"\n className={clsx(styles.trigger, { [styles.active]: isOpen })}\n onClick={() => setIsOpen((prev) => !prev)}\n aria-expanded={isOpen}\n aria-haspopup=\"listbox\"\n >\n <div className={styles.triggerContent}>\n <svg className={styles.chevron} width={ICON_SIZE.MD} height={ICON_SIZE.MD} viewBox={SVG_VIEWBOX} fill=\"none\" stroke=\"currentColor\" strokeWidth={SVG_STROKE_WIDTH} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n <polyline points=\"6 9 12 15 18 9\" />\n </svg>\n <span className={styles.label}>{label}</span>\n <div className={styles.valueGroup}>\n <span className={styles.value}>{customTriggerLabel || getSelectedLabel()}</span>\n {isActiveFilter && (\n <span className={styles.badge}>{selectedCountValue}</span>\n )}\n {isActiveFilter && (\n <div\n role=\"button\"\n tabIndex={0}\n className={styles.clear}\n onClick={handleClearFilter}\n onKeyDown={(e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n handleClearFilter(e as unknown as React.MouseEvent);\n }\n }}\n aria-label={`Clear ${label} filter`}\n >\n <svg width={ICON_SIZE.SM} height={ICON_SIZE.SM} viewBox={SVG_VIEWBOX} fill=\"none\" stroke=\"currentColor\" strokeWidth={SVG_STROKE_WIDTH} strokeLinecap=\"round\" strokeLinejoin=\"round\">\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n </svg>\n </div>\n )}\n </div>\n </div>\n </button>\n\n {isOpen && (\n <div className={styles.panel} role=\"dialog\" aria-label={`${label} filter`}>\n <div className={styles.header}>\n <input\n type=\"search\"\n className={styles.search}\n placeholder={`Search ${label.toLowerCase()}`}\n value={searchTerm}\n onChange={(e) => setSearchTerm(e.target.value)}\n disabled={shouldDisableControls}\n />\n <div className={styles.headerActions}>\n <button type=\"button\" className={styles.chip} onClick={handleSelectAll} disabled={shouldDisableControls}>\n Select all\n </button>\n <button type=\"button\" className={clsx(styles.chip, styles.chipGhost)} onClick={handleClearAll} disabled={pendingSize === 0}>\n Deselect all\n </button>\n </div>\n </div>\n\n <div className={styles.list} role=\"listbox\">\n {isLoading && <p className={styles.status}>Loading options...</p>}\n {!isLoading && error && <p className={clsx(styles.status, styles.statusError)}>{error}</p>}\n {!isLoading && !error && filteredOptions.length === 0 && (\n <p className={styles.status}>No matches</p>\n )}\n {!isLoading &&\n !error &&\n filteredOptions.map((opt) => {\n const checked = pendingSet.has(opt.value);\n return (\n <label key={opt.value} className={styles.option}>\n <input\n type=\"checkbox\"\n checked={checked}\n onChange={() => handleToggleOption(opt.value)}\n aria-checked={checked}\n />\n <span className={styles.optionLabel}>\n {opt.label ?? opt.value}\n {opt.count !== undefined && (\n <span className={styles.optionCount}>{opt.count}</span>\n )}\n </span>\n </label>\n );\n })}\n {!isLoading && !error && canCreateCustom && (\n <button type=\"button\" className={styles.create} onClick={handleCreateCustom}>\n Use &quot;{normalizedSearch}&quot;\n </button>\n )}\n </div>\n\n <div className={styles.footer}>\n <span className={styles.selection}>\n {isPendingAll ? 'All selected' : `${pendingCountValue} selected`}\n {hasChanges && (\n <span className={styles.selectionDelta}>\n ({pendingCountValue - selectedCountValue >= 0 ? '+' : ''}\n {pendingCountValue - selectedCountValue})\n </span>\n )}\n </span>\n <div className={styles.footerActions}>\n <button type=\"button\" className={clsx(styles.chip, styles.chipGhost)} onClick={handleCancel}>\n Cancel\n </button>\n <button type=\"button\" className={styles.chip} onClick={handleApply} disabled={!hasChanges}>\n Apply\n </button>\n </div>\n </div>\n </div>\n )}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
package/dist/index30.cjs CHANGED
@@ -2,11 +2,37 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const jsxRuntime = require("react/jsx-runtime");
4
4
  const react = require("react");
5
- const clsx = require("./index38.cjs");
6
- const Select_module = require("./index57.cjs");
7
- const Select = react.forwardRef(
8
- ({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("select", { ref, className: clsx.clsx(Select_module.default.root, className), ...props, children })
5
+ const clsx = require("./index47.cjs");
6
+ const NavItem_module = require("./index70.cjs");
7
+ const NavItem = react.forwardRef(
8
+ ({ icon, label, active = false, badge, collapsed = false, disabled = false, href, onClick, className }, ref) => {
9
+ const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
10
+ icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: NavItem_module.default.icon, children: icon }),
11
+ !collapsed && /* @__PURE__ */ jsxRuntime.jsx("span", { className: NavItem_module.default.label, children: label }),
12
+ !collapsed && badge !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: NavItem_module.default.badge, children: badge })
13
+ ] });
14
+ const sharedProps = {
15
+ className: clsx.clsx(NavItem_module.default.root, { [NavItem_module.default.active]: active, [NavItem_module.default.collapsed]: collapsed, [NavItem_module.default.disabled]: disabled }, className),
16
+ "aria-current": active ? "page" : void 0,
17
+ "aria-disabled": disabled || void 0,
18
+ title: collapsed ? label : void 0
19
+ };
20
+ if (href && !disabled) {
21
+ return /* @__PURE__ */ jsxRuntime.jsx("a", { ref, href, ...sharedProps, children: content });
22
+ }
23
+ return /* @__PURE__ */ jsxRuntime.jsx(
24
+ "button",
25
+ {
26
+ ref,
27
+ type: "button",
28
+ onClick: disabled ? void 0 : onClick,
29
+ disabled,
30
+ ...sharedProps,
31
+ children: content
32
+ }
33
+ );
34
+ }
9
35
  );
10
- Select.displayName = "Select";
11
- exports.Select = Select;
36
+ NavItem.displayName = "NavItem";
37
+ exports.NavItem = NavItem;
12
38
  //# sourceMappingURL=index30.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index30.cjs","sources":["../src/primitives/Select/Select.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport clsx from 'clsx';\nimport styles from './Select.module.css';\n\nexport interface SelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {}\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n ({ className, children, ...props }, ref) => (\n <select ref={ref} className={clsx(styles.root, className)} {...props}>\n {children}\n </select>\n ),\n);\n\nSelect.displayName = 'Select';\n"],"names":["forwardRef","jsx","clsx","styles"],"mappings":";;;;;;AAMO,MAAM,SAASA,MAAAA;AAAAA,EACpB,CAAC,EAAE,WAAW,UAAU,GAAG,MAAA,GAAS,QAClCC,2BAAAA,IAAC,YAAO,KAAU,WAAWC,KAAAA,KAAKC,sBAAO,MAAM,SAAS,GAAI,GAAG,OAC5D,SAAA,CACH;AAEJ;AAEA,OAAO,cAAc;;"}
1
+ {"version":3,"file":"index30.cjs","sources":["../src/primitives/NavItem/NavItem.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport clsx from 'clsx';\nimport type { NavItemProps } from './NavItem.types';\nimport styles from './NavItem.module.css';\n\nexport const NavItem = forwardRef<HTMLElement, NavItemProps>(\n ({ icon, label, active = false, badge, collapsed = false, disabled = false, href, onClick, className }, ref) => {\n const content = (\n <>\n {icon && <span className={styles.icon}>{icon}</span>}\n {!collapsed && <span className={styles.label}>{label}</span>}\n {!collapsed && badge !== undefined && (\n <span className={styles.badge}>{badge}</span>\n )}\n </>\n );\n\n const sharedProps = {\n className: clsx(styles.root, { [styles.active]: active, [styles.collapsed]: collapsed, [styles.disabled]: disabled }, className),\n 'aria-current': active ? ('page' as const) : undefined,\n 'aria-disabled': disabled || undefined,\n title: collapsed ? label : undefined,\n };\n\n if (href && !disabled) {\n return (\n <a ref={ref as React.Ref<HTMLAnchorElement>} href={href} {...sharedProps}>\n {content}\n </a>\n );\n }\n\n return (\n <button\n ref={ref as React.Ref<HTMLButtonElement>}\n type=\"button\"\n onClick={disabled ? undefined : onClick}\n disabled={disabled}\n {...sharedProps}\n >\n {content}\n </button>\n );\n },\n);\n\nNavItem.displayName = 'NavItem';\n"],"names":["forwardRef","jsxs","Fragment","jsx","styles","clsx"],"mappings":";;;;;;AAKO,MAAM,UAAUA,MAAAA;AAAAA,EACrB,CAAC,EAAE,MAAM,OAAO,SAAS,OAAO,OAAO,YAAY,OAAO,WAAW,OAAO,MAAM,SAAS,UAAA,GAAa,QAAQ;AAC9G,UAAM,UACJC,2BAAAA,KAAAC,WAAAA,UAAA,EACG,UAAA;AAAA,MAAA,QAAQC,2BAAAA,IAAC,QAAA,EAAK,WAAWC,eAAAA,QAAO,MAAO,UAAA,MAAK;AAAA,MAC5C,CAAC,aAAaD,+BAAC,UAAK,WAAWC,eAAAA,QAAO,OAAQ,UAAA,OAAM;AAAA,MACpD,CAAC,aAAa,UAAU,yCACtB,QAAA,EAAK,WAAWA,eAAAA,QAAO,OAAQ,UAAA,MAAA,CAAM;AAAA,IAAA,GAE1C;AAGF,UAAM,cAAc;AAAA,MAClB,WAAWC,KAAAA,KAAKD,uBAAO,MAAM,EAAE,CAACA,eAAAA,QAAO,MAAM,GAAG,QAAQ,CAACA,eAAAA,QAAO,SAAS,GAAG,WAAW,CAACA,eAAAA,QAAO,QAAQ,GAAG,SAAA,GAAY,SAAS;AAAA,MAC/H,gBAAgB,SAAU,SAAmB;AAAA,MAC7C,iBAAiB,YAAY;AAAA,MAC7B,OAAO,YAAY,QAAQ;AAAA,IAAA;AAG7B,QAAI,QAAQ,CAAC,UAAU;AACrB,4CACG,KAAA,EAAE,KAA0C,MAAa,GAAG,aAC1D,UAAA,SACH;AAAA,IAEJ;AAEA,WACED,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,SAAS,WAAW,SAAY;AAAA,QAChC;AAAA,QACC,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEA,QAAQ,cAAc;;"}
package/dist/index30.js CHANGED
@@ -1,12 +1,38 @@
1
- import { jsx } from "react/jsx-runtime";
1
+ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
2
  import { forwardRef } from "react";
3
- import { clsx } from "./index38.js";
4
- import styles from "./index57.js";
5
- const Select = forwardRef(
6
- ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("select", { ref, className: clsx(styles.root, className), ...props, children })
3
+ import { clsx } from "./index47.js";
4
+ import styles from "./index70.js";
5
+ const NavItem = forwardRef(
6
+ ({ icon, label, active = false, badge, collapsed = false, disabled = false, href, onClick, className }, ref) => {
7
+ const content = /* @__PURE__ */ jsxs(Fragment, { children: [
8
+ icon && /* @__PURE__ */ jsx("span", { className: styles.icon, children: icon }),
9
+ !collapsed && /* @__PURE__ */ jsx("span", { className: styles.label, children: label }),
10
+ !collapsed && badge !== void 0 && /* @__PURE__ */ jsx("span", { className: styles.badge, children: badge })
11
+ ] });
12
+ const sharedProps = {
13
+ className: clsx(styles.root, { [styles.active]: active, [styles.collapsed]: collapsed, [styles.disabled]: disabled }, className),
14
+ "aria-current": active ? "page" : void 0,
15
+ "aria-disabled": disabled || void 0,
16
+ title: collapsed ? label : void 0
17
+ };
18
+ if (href && !disabled) {
19
+ return /* @__PURE__ */ jsx("a", { ref, href, ...sharedProps, children: content });
20
+ }
21
+ return /* @__PURE__ */ jsx(
22
+ "button",
23
+ {
24
+ ref,
25
+ type: "button",
26
+ onClick: disabled ? void 0 : onClick,
27
+ disabled,
28
+ ...sharedProps,
29
+ children: content
30
+ }
31
+ );
32
+ }
7
33
  );
8
- Select.displayName = "Select";
34
+ NavItem.displayName = "NavItem";
9
35
  export {
10
- Select
36
+ NavItem
11
37
  };
12
38
  //# sourceMappingURL=index30.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index30.js","sources":["../src/primitives/Select/Select.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport clsx from 'clsx';\nimport styles from './Select.module.css';\n\nexport interface SelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {}\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n ({ className, children, ...props }, ref) => (\n <select ref={ref} className={clsx(styles.root, className)} {...props}>\n {children}\n </select>\n ),\n);\n\nSelect.displayName = 'Select';\n"],"names":[],"mappings":";;;;AAMO,MAAM,SAAS;AAAA,EACpB,CAAC,EAAE,WAAW,UAAU,GAAG,MAAA,GAAS,QAClC,oBAAC,YAAO,KAAU,WAAW,KAAK,OAAO,MAAM,SAAS,GAAI,GAAG,OAC5D,SAAA,CACH;AAEJ;AAEA,OAAO,cAAc;"}
1
+ {"version":3,"file":"index30.js","sources":["../src/primitives/NavItem/NavItem.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport clsx from 'clsx';\nimport type { NavItemProps } from './NavItem.types';\nimport styles from './NavItem.module.css';\n\nexport const NavItem = forwardRef<HTMLElement, NavItemProps>(\n ({ icon, label, active = false, badge, collapsed = false, disabled = false, href, onClick, className }, ref) => {\n const content = (\n <>\n {icon && <span className={styles.icon}>{icon}</span>}\n {!collapsed && <span className={styles.label}>{label}</span>}\n {!collapsed && badge !== undefined && (\n <span className={styles.badge}>{badge}</span>\n )}\n </>\n );\n\n const sharedProps = {\n className: clsx(styles.root, { [styles.active]: active, [styles.collapsed]: collapsed, [styles.disabled]: disabled }, className),\n 'aria-current': active ? ('page' as const) : undefined,\n 'aria-disabled': disabled || undefined,\n title: collapsed ? label : undefined,\n };\n\n if (href && !disabled) {\n return (\n <a ref={ref as React.Ref<HTMLAnchorElement>} href={href} {...sharedProps}>\n {content}\n </a>\n );\n }\n\n return (\n <button\n ref={ref as React.Ref<HTMLButtonElement>}\n type=\"button\"\n onClick={disabled ? undefined : onClick}\n disabled={disabled}\n {...sharedProps}\n >\n {content}\n </button>\n );\n },\n);\n\nNavItem.displayName = 'NavItem';\n"],"names":[],"mappings":";;;;AAKO,MAAM,UAAU;AAAA,EACrB,CAAC,EAAE,MAAM,OAAO,SAAS,OAAO,OAAO,YAAY,OAAO,WAAW,OAAO,MAAM,SAAS,UAAA,GAAa,QAAQ;AAC9G,UAAM,UACJ,qBAAA,UAAA,EACG,UAAA;AAAA,MAAA,QAAQ,oBAAC,QAAA,EAAK,WAAW,OAAO,MAAO,UAAA,MAAK;AAAA,MAC5C,CAAC,aAAa,oBAAC,UAAK,WAAW,OAAO,OAAQ,UAAA,OAAM;AAAA,MACpD,CAAC,aAAa,UAAU,8BACtB,QAAA,EAAK,WAAW,OAAO,OAAQ,UAAA,MAAA,CAAM;AAAA,IAAA,GAE1C;AAGF,UAAM,cAAc;AAAA,MAClB,WAAW,KAAK,OAAO,MAAM,EAAE,CAAC,OAAO,MAAM,GAAG,QAAQ,CAAC,OAAO,SAAS,GAAG,WAAW,CAAC,OAAO,QAAQ,GAAG,SAAA,GAAY,SAAS;AAAA,MAC/H,gBAAgB,SAAU,SAAmB;AAAA,MAC7C,iBAAiB,YAAY;AAAA,MAC7B,OAAO,YAAY,QAAQ;AAAA,IAAA;AAG7B,QAAI,QAAQ,CAAC,UAAU;AACrB,iCACG,KAAA,EAAE,KAA0C,MAAa,GAAG,aAC1D,UAAA,SACH;AAAA,IAEJ;AAEA,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,SAAS,WAAW,SAAY;AAAA,QAChC;AAAA,QACC,GAAG;AAAA,QAEH,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;AAEA,QAAQ,cAAc;"}