@react-spectrum/s2 3.0.0-nightly-4b8b33a02-250211 → 3.0.0-nightly-260eb700f-250213

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 (422) hide show
  1. package/dist/Accordion.cjs +3 -3
  2. package/dist/Accordion.cjs.map +1 -1
  3. package/dist/Accordion.css +2 -2
  4. package/dist/Accordion.css.map +1 -1
  5. package/dist/Accordion.mjs +3 -3
  6. package/dist/Accordion.mjs.map +1 -1
  7. package/dist/ActionBar.cjs +47 -47
  8. package/dist/ActionBar.css +51 -51
  9. package/dist/ActionBar.mjs +47 -47
  10. package/dist/ActionButton.cjs +97 -97
  11. package/dist/ActionButton.cjs.map +1 -1
  12. package/dist/ActionButton.css +96 -96
  13. package/dist/ActionButton.css.map +1 -1
  14. package/dist/ActionButton.mjs +97 -97
  15. package/dist/ActionButton.mjs.map +1 -1
  16. package/dist/ActionButtonGroup.cjs +11 -11
  17. package/dist/ActionButtonGroup.css +9 -9
  18. package/dist/ActionButtonGroup.mjs +11 -11
  19. package/dist/ActionMenu.cjs.map +1 -1
  20. package/dist/ActionMenu.mjs.map +1 -1
  21. package/dist/AlertDialog.cjs +3 -3
  22. package/dist/AlertDialog.css +3 -3
  23. package/dist/AlertDialog.mjs +3 -3
  24. package/dist/Avatar.cjs +17 -17
  25. package/dist/Avatar.cjs.map +1 -1
  26. package/dist/Avatar.css +14 -14
  27. package/dist/Avatar.css.map +1 -1
  28. package/dist/Avatar.mjs +17 -17
  29. package/dist/Avatar.mjs.map +1 -1
  30. package/dist/AvatarGroup.cjs +100 -100
  31. package/dist/AvatarGroup.cjs.map +1 -1
  32. package/dist/AvatarGroup.css +34 -34
  33. package/dist/AvatarGroup.css.map +1 -1
  34. package/dist/AvatarGroup.mjs +100 -100
  35. package/dist/AvatarGroup.mjs.map +1 -1
  36. package/dist/Badge.cjs +68 -92
  37. package/dist/Badge.cjs.map +1 -1
  38. package/dist/Badge.css +92 -164
  39. package/dist/Badge.css.map +1 -1
  40. package/dist/Badge.mjs +68 -92
  41. package/dist/Badge.mjs.map +1 -1
  42. package/dist/Breadcrumbs.cjs +115 -115
  43. package/dist/Breadcrumbs.cjs.map +1 -1
  44. package/dist/Breadcrumbs.css +89 -89
  45. package/dist/Breadcrumbs.css.map +1 -1
  46. package/dist/Breadcrumbs.mjs +115 -115
  47. package/dist/Breadcrumbs.mjs.map +1 -1
  48. package/dist/Button.cjs +152 -236
  49. package/dist/Button.cjs.map +1 -1
  50. package/dist/Button.css +165 -309
  51. package/dist/Button.css.map +1 -1
  52. package/dist/Button.mjs +152 -236
  53. package/dist/Button.mjs.map +1 -1
  54. package/dist/ButtonGroup.cjs +19 -19
  55. package/dist/ButtonGroup.cjs.map +1 -1
  56. package/dist/ButtonGroup.css +15 -15
  57. package/dist/ButtonGroup.css.map +1 -1
  58. package/dist/ButtonGroup.mjs +19 -19
  59. package/dist/ButtonGroup.mjs.map +1 -1
  60. package/dist/Card.cjs +261 -264
  61. package/dist/Card.cjs.map +1 -1
  62. package/dist/Card.css +198 -210
  63. package/dist/Card.css.map +1 -1
  64. package/dist/Card.mjs +261 -264
  65. package/dist/Card.mjs.map +1 -1
  66. package/dist/CardView.cjs +15 -15
  67. package/dist/CardView.cjs.map +1 -1
  68. package/dist/CardView.css +18 -18
  69. package/dist/CardView.css.map +1 -1
  70. package/dist/CardView.mjs +15 -15
  71. package/dist/CardView.mjs.map +1 -1
  72. package/dist/CenterBaseline.cjs +1 -1
  73. package/dist/CenterBaseline.css +2 -2
  74. package/dist/CenterBaseline.mjs +1 -1
  75. package/dist/Checkbox.cjs +73 -124
  76. package/dist/Checkbox.cjs.map +1 -1
  77. package/dist/Checkbox.css +81 -201
  78. package/dist/Checkbox.css.map +1 -1
  79. package/dist/Checkbox.mjs +73 -124
  80. package/dist/Checkbox.mjs.map +1 -1
  81. package/dist/CheckboxGroup.cjs +49 -49
  82. package/dist/CheckboxGroup.cjs.map +1 -1
  83. package/dist/CheckboxGroup.css +41 -41
  84. package/dist/CheckboxGroup.css.map +1 -1
  85. package/dist/CheckboxGroup.mjs +49 -49
  86. package/dist/CheckboxGroup.mjs.map +1 -1
  87. package/dist/ClearButton.cjs +15 -15
  88. package/dist/ClearButton.css +17 -17
  89. package/dist/ClearButton.mjs +15 -15
  90. package/dist/CloseButton.cjs +35 -35
  91. package/dist/CloseButton.cjs.map +1 -1
  92. package/dist/CloseButton.css +33 -33
  93. package/dist/CloseButton.css.map +1 -1
  94. package/dist/CloseButton.mjs +35 -35
  95. package/dist/CloseButton.mjs.map +1 -1
  96. package/dist/ColorArea.cjs +22 -22
  97. package/dist/ColorArea.cjs.map +1 -1
  98. package/dist/ColorArea.css +15 -15
  99. package/dist/ColorArea.css.map +1 -1
  100. package/dist/ColorArea.mjs +22 -22
  101. package/dist/ColorArea.mjs.map +1 -1
  102. package/dist/ColorField.cjs +38 -38
  103. package/dist/ColorField.cjs.map +1 -1
  104. package/dist/ColorField.css +32 -32
  105. package/dist/ColorField.css.map +1 -1
  106. package/dist/ColorField.mjs +38 -38
  107. package/dist/ColorField.mjs.map +1 -1
  108. package/dist/ColorHandle.cjs +21 -27
  109. package/dist/ColorHandle.cjs.map +1 -1
  110. package/dist/ColorHandle.css +45 -93
  111. package/dist/ColorHandle.css.map +1 -1
  112. package/dist/ColorHandle.mjs +21 -27
  113. package/dist/ColorHandle.mjs.map +1 -1
  114. package/dist/ColorSlider.cjs +52 -52
  115. package/dist/ColorSlider.cjs.map +1 -1
  116. package/dist/ColorSlider.css +51 -51
  117. package/dist/ColorSlider.css.map +1 -1
  118. package/dist/ColorSlider.mjs +52 -52
  119. package/dist/ColorSlider.mjs.map +1 -1
  120. package/dist/ColorSwatch.cjs +24 -27
  121. package/dist/ColorSwatch.cjs.map +1 -1
  122. package/dist/ColorSwatch.css +29 -41
  123. package/dist/ColorSwatch.css.map +1 -1
  124. package/dist/ColorSwatch.mjs +24 -27
  125. package/dist/ColorSwatch.mjs.map +1 -1
  126. package/dist/ColorSwatchPicker.cjs +23 -23
  127. package/dist/ColorSwatchPicker.css +48 -60
  128. package/dist/ColorSwatchPicker.css.map +1 -1
  129. package/dist/ColorSwatchPicker.mjs +23 -23
  130. package/dist/ColorWheel.cjs +22 -22
  131. package/dist/ColorWheel.cjs.map +1 -1
  132. package/dist/ColorWheel.css +16 -16
  133. package/dist/ColorWheel.css.map +1 -1
  134. package/dist/ColorWheel.mjs +22 -22
  135. package/dist/ColorWheel.mjs.map +1 -1
  136. package/dist/ComboBox.cjs +80 -80
  137. package/dist/ComboBox.css +88 -88
  138. package/dist/ComboBox.mjs +80 -80
  139. package/dist/Content.cjs.map +1 -1
  140. package/dist/Content.mjs.map +1 -1
  141. package/dist/ContextualHelp.cjs +5 -5
  142. package/dist/ContextualHelp.cjs.map +1 -1
  143. package/dist/ContextualHelp.css +38 -38
  144. package/dist/ContextualHelp.css.map +1 -1
  145. package/dist/ContextualHelp.mjs +5 -5
  146. package/dist/ContextualHelp.mjs.map +1 -1
  147. package/dist/CustomDialog.cjs +31 -31
  148. package/dist/CustomDialog.css +25 -25
  149. package/dist/CustomDialog.mjs +31 -31
  150. package/dist/Dialog.cjs +17 -17
  151. package/dist/Dialog.css +64 -64
  152. package/dist/Dialog.mjs +17 -17
  153. package/dist/Disclosure.cjs +108 -111
  154. package/dist/Disclosure.cjs.map +1 -1
  155. package/dist/Disclosure.css +112 -124
  156. package/dist/Disclosure.css.map +1 -1
  157. package/dist/Disclosure.mjs +108 -111
  158. package/dist/Disclosure.mjs.map +1 -1
  159. package/dist/Divider.cjs +26 -26
  160. package/dist/Divider.cjs.map +1 -1
  161. package/dist/Divider.css +16 -16
  162. package/dist/Divider.css.map +1 -1
  163. package/dist/Divider.mjs +26 -26
  164. package/dist/Divider.mjs.map +1 -1
  165. package/dist/DropZone.cjs +47 -56
  166. package/dist/DropZone.cjs.map +1 -1
  167. package/dist/DropZone.css +56 -80
  168. package/dist/DropZone.css.map +1 -1
  169. package/dist/DropZone.mjs +47 -56
  170. package/dist/DropZone.mjs.map +1 -1
  171. package/dist/Field.cjs +150 -204
  172. package/dist/Field.cjs.map +1 -1
  173. package/dist/Field.css +150 -246
  174. package/dist/Field.css.map +1 -1
  175. package/dist/Field.mjs +150 -204
  176. package/dist/Field.mjs.map +1 -1
  177. package/dist/Form.cjs +10 -10
  178. package/dist/Form.cjs.map +1 -1
  179. package/dist/Form.css +9 -9
  180. package/dist/Form.css.map +1 -1
  181. package/dist/Form.mjs +10 -10
  182. package/dist/Form.mjs.map +1 -1
  183. package/dist/FullscreenDialog.cjs +5 -5
  184. package/dist/FullscreenDialog.css +72 -72
  185. package/dist/FullscreenDialog.mjs +5 -5
  186. package/dist/IllustratedMessage.cjs +134 -134
  187. package/dist/IllustratedMessage.cjs.map +1 -1
  188. package/dist/IllustratedMessage.css +69 -69
  189. package/dist/IllustratedMessage.css.map +1 -1
  190. package/dist/IllustratedMessage.mjs +134 -134
  191. package/dist/IllustratedMessage.mjs.map +1 -1
  192. package/dist/Image.cjs +12 -12
  193. package/dist/Image.cjs.map +1 -1
  194. package/dist/Image.css +13 -13
  195. package/dist/Image.css.map +1 -1
  196. package/dist/Image.mjs +12 -12
  197. package/dist/Image.mjs.map +1 -1
  198. package/dist/InlineAlert.cjs +77 -104
  199. package/dist/InlineAlert.cjs.map +1 -1
  200. package/dist/InlineAlert.css +77 -149
  201. package/dist/InlineAlert.css.map +1 -1
  202. package/dist/InlineAlert.mjs +77 -104
  203. package/dist/InlineAlert.mjs.map +1 -1
  204. package/dist/Link.cjs +31 -31
  205. package/dist/Link.cjs.map +1 -1
  206. package/dist/Link.css +30 -30
  207. package/dist/Link.css.map +1 -1
  208. package/dist/Link.mjs +31 -31
  209. package/dist/Link.mjs.map +1 -1
  210. package/dist/Menu.cjs +269 -268
  211. package/dist/Menu.cjs.map +1 -1
  212. package/dist/Menu.css +158 -154
  213. package/dist/Menu.css.map +1 -1
  214. package/dist/Menu.mjs +269 -268
  215. package/dist/Menu.mjs.map +1 -1
  216. package/dist/Meter.cjs +85 -85
  217. package/dist/Meter.cjs.map +1 -1
  218. package/dist/Meter.css +81 -81
  219. package/dist/Meter.css.map +1 -1
  220. package/dist/Meter.mjs +85 -85
  221. package/dist/Meter.mjs.map +1 -1
  222. package/dist/Modal.cjs +48 -48
  223. package/dist/Modal.css +46 -46
  224. package/dist/Modal.mjs +48 -48
  225. package/dist/NumberField.cjs +115 -115
  226. package/dist/NumberField.cjs.map +1 -1
  227. package/dist/NumberField.css +114 -114
  228. package/dist/NumberField.css.map +1 -1
  229. package/dist/NumberField.mjs +115 -115
  230. package/dist/NumberField.mjs.map +1 -1
  231. package/dist/Picker.cjs +177 -194
  232. package/dist/Picker.cjs.map +1 -1
  233. package/dist/Picker.css +167 -223
  234. package/dist/Picker.css.map +1 -1
  235. package/dist/Picker.mjs +177 -194
  236. package/dist/Picker.mjs.map +1 -1
  237. package/dist/Popover.cjs +79 -85
  238. package/dist/Popover.cjs.map +1 -1
  239. package/dist/Popover.css +65 -89
  240. package/dist/Popover.css.map +1 -1
  241. package/dist/Popover.mjs +79 -85
  242. package/dist/Popover.mjs.map +1 -1
  243. package/dist/ProgressBar.cjs +98 -98
  244. package/dist/ProgressBar.cjs.map +1 -1
  245. package/dist/ProgressBar.css +92 -92
  246. package/dist/ProgressBar.css.map +1 -1
  247. package/dist/ProgressBar.mjs +98 -98
  248. package/dist/ProgressBar.mjs.map +1 -1
  249. package/dist/ProgressCircle.cjs +17 -17
  250. package/dist/ProgressCircle.cjs.map +1 -1
  251. package/dist/ProgressCircle.css +15 -15
  252. package/dist/ProgressCircle.css.map +1 -1
  253. package/dist/ProgressCircle.mjs +17 -17
  254. package/dist/ProgressCircle.mjs.map +1 -1
  255. package/dist/Provider.cjs +4 -4
  256. package/dist/Provider.css +5 -5
  257. package/dist/Provider.mjs +4 -4
  258. package/dist/Radio.cjs +80 -152
  259. package/dist/Radio.cjs.map +1 -1
  260. package/dist/Radio.css +96 -240
  261. package/dist/Radio.css.map +1 -1
  262. package/dist/Radio.mjs +80 -152
  263. package/dist/Radio.mjs.map +1 -1
  264. package/dist/RadioGroup.cjs +47 -47
  265. package/dist/RadioGroup.cjs.map +1 -1
  266. package/dist/RadioGroup.css +41 -41
  267. package/dist/RadioGroup.css.map +1 -1
  268. package/dist/RadioGroup.mjs +47 -47
  269. package/dist/RadioGroup.mjs.map +1 -1
  270. package/dist/RangeSlider.cjs.map +1 -1
  271. package/dist/RangeSlider.mjs.map +1 -1
  272. package/dist/SearchField.cjs +42 -42
  273. package/dist/SearchField.cjs.map +1 -1
  274. package/dist/SearchField.css +47 -47
  275. package/dist/SearchField.css.map +1 -1
  276. package/dist/SearchField.mjs +42 -42
  277. package/dist/SearchField.mjs.map +1 -1
  278. package/dist/SegmentedControl.cjs +89 -101
  279. package/dist/SegmentedControl.cjs.map +1 -1
  280. package/dist/SegmentedControl.css +92 -140
  281. package/dist/SegmentedControl.css.map +1 -1
  282. package/dist/SegmentedControl.mjs +89 -101
  283. package/dist/SegmentedControl.mjs.map +1 -1
  284. package/dist/Slider.cjs +196 -229
  285. package/dist/Slider.cjs.map +1 -1
  286. package/dist/Slider.css +149 -221
  287. package/dist/Slider.css.map +1 -1
  288. package/dist/Slider.mjs +196 -229
  289. package/dist/Slider.mjs.map +1 -1
  290. package/dist/StatusLight.cjs +56 -56
  291. package/dist/StatusLight.cjs.map +1 -1
  292. package/dist/StatusLight.css +59 -59
  293. package/dist/StatusLight.css.map +1 -1
  294. package/dist/StatusLight.mjs +56 -56
  295. package/dist/StatusLight.mjs.map +1 -1
  296. package/dist/Switch.cjs +74 -107
  297. package/dist/Switch.cjs.map +1 -1
  298. package/dist/Switch.css +69 -141
  299. package/dist/Switch.css.map +1 -1
  300. package/dist/Switch.mjs +74 -107
  301. package/dist/Switch.mjs.map +1 -1
  302. package/dist/TableView.cjs +253 -280
  303. package/dist/TableView.cjs.map +1 -1
  304. package/dist/TableView.css +163 -199
  305. package/dist/TableView.css.map +1 -1
  306. package/dist/TableView.mjs +253 -280
  307. package/dist/TableView.mjs.map +1 -1
  308. package/dist/Tabs.cjs +112 -124
  309. package/dist/Tabs.cjs.map +1 -1
  310. package/dist/Tabs.css +84 -108
  311. package/dist/Tabs.css.map +1 -1
  312. package/dist/Tabs.mjs +112 -124
  313. package/dist/Tabs.mjs.map +1 -1
  314. package/dist/TabsPicker.cjs +105 -105
  315. package/dist/TabsPicker.css +111 -111
  316. package/dist/TabsPicker.mjs +105 -105
  317. package/dist/TagGroup.cjs +148 -148
  318. package/dist/TagGroup.cjs.map +1 -1
  319. package/dist/TagGroup.css +134 -134
  320. package/dist/TagGroup.css.map +1 -1
  321. package/dist/TagGroup.mjs +148 -148
  322. package/dist/TagGroup.mjs.map +1 -1
  323. package/dist/TextField.cjs +59 -59
  324. package/dist/TextField.cjs.map +1 -1
  325. package/dist/TextField.css +62 -62
  326. package/dist/TextField.css.map +1 -1
  327. package/dist/TextField.mjs +59 -59
  328. package/dist/TextField.mjs.map +1 -1
  329. package/dist/ToggleButton.cjs +3 -3
  330. package/dist/ToggleButton.cjs.map +1 -1
  331. package/dist/ToggleButton.css +12 -12
  332. package/dist/ToggleButton.css.map +1 -1
  333. package/dist/ToggleButton.mjs +3 -3
  334. package/dist/ToggleButton.mjs.map +1 -1
  335. package/dist/ToggleButtonGroup.cjs.map +1 -1
  336. package/dist/ToggleButtonGroup.mjs.map +1 -1
  337. package/dist/Tooltip.cjs +57 -60
  338. package/dist/Tooltip.cjs.map +1 -1
  339. package/dist/Tooltip.css +71 -83
  340. package/dist/Tooltip.css.map +1 -1
  341. package/dist/Tooltip.mjs +57 -60
  342. package/dist/Tooltip.mjs.map +1 -1
  343. package/dist/TreeView.cjs +217 -244
  344. package/dist/TreeView.cjs.map +1 -1
  345. package/dist/TreeView.css +166 -190
  346. package/dist/TreeView.css.map +1 -1
  347. package/dist/TreeView.mjs +220 -244
  348. package/dist/TreeView.mjs.map +1 -1
  349. package/dist/main.cjs +1 -0
  350. package/dist/main.cjs.map +1 -1
  351. package/dist/module.mjs +2 -2
  352. package/dist/module.mjs.map +1 -1
  353. package/dist/types.d.ts +77 -72
  354. package/dist/types.d.ts.map +1 -1
  355. package/icons/Icon.cjs.map +1 -1
  356. package/icons/Icon.mjs.map +1 -1
  357. package/icons/Skeleton.cjs +2 -2
  358. package/icons/Skeleton.cjs.map +1 -1
  359. package/icons/Skeleton.css +5 -5
  360. package/icons/Skeleton.css.map +1 -1
  361. package/icons/Skeleton.mjs +2 -2
  362. package/icons/Skeleton.mjs.map +1 -1
  363. package/package.json +21 -21
  364. package/src/Accordion.tsx +1 -1
  365. package/src/ActionButton.tsx +2 -2
  366. package/src/ActionMenu.tsx +1 -1
  367. package/src/Avatar.tsx +1 -1
  368. package/src/AvatarGroup.tsx +1 -1
  369. package/src/Breadcrumbs.tsx +4 -4
  370. package/src/Button.tsx +4 -4
  371. package/src/ButtonGroup.tsx +1 -1
  372. package/src/CardView.tsx +1 -1
  373. package/src/Checkbox.tsx +1 -1
  374. package/src/CheckboxGroup.tsx +2 -2
  375. package/src/CloseButton.tsx +1 -1
  376. package/src/ColorArea.tsx +1 -1
  377. package/src/ColorField.tsx +1 -1
  378. package/src/ColorSlider.tsx +1 -1
  379. package/src/ColorSwatch.tsx +1 -1
  380. package/src/ColorWheel.tsx +1 -1
  381. package/src/Content.tsx +7 -7
  382. package/src/ContextualHelp.tsx +2 -2
  383. package/src/Disclosure.tsx +1 -1
  384. package/src/Divider.tsx +1 -1
  385. package/src/DropZone.tsx +2 -2
  386. package/src/Field.tsx +1 -1
  387. package/src/Form.tsx +2 -2
  388. package/src/Icon.tsx +2 -2
  389. package/src/IllustratedMessage.tsx +1 -1
  390. package/src/Image.tsx +1 -1
  391. package/src/Link.tsx +2 -2
  392. package/src/Menu.tsx +4 -3
  393. package/src/Meter.tsx +1 -1
  394. package/src/NumberField.tsx +1 -1
  395. package/src/Picker.tsx +2 -1
  396. package/src/ProgressBar.tsx +1 -1
  397. package/src/ProgressCircle.tsx +1 -1
  398. package/src/RadioGroup.tsx +2 -2
  399. package/src/RangeSlider.tsx +1 -1
  400. package/src/SearchField.tsx +1 -1
  401. package/src/SegmentedControl.tsx +2 -2
  402. package/src/Skeleton.tsx +1 -1
  403. package/src/Slider.tsx +1 -1
  404. package/src/StatusLight.tsx +2 -2
  405. package/src/Switch.tsx +1 -1
  406. package/src/TableView.tsx +1 -1
  407. package/src/Tabs.tsx +16 -16
  408. package/src/TagGroup.tsx +2 -2
  409. package/src/TextField.tsx +2 -2
  410. package/src/ToggleButton.tsx +2 -2
  411. package/src/ToggleButtonGroup.tsx +1 -1
  412. package/src/Tooltip.tsx +3 -3
  413. package/src/TreeView.tsx +97 -144
  414. package/src/index.ts +1 -1
  415. package/style/__tests__/style-macro.test.js +18 -18
  416. package/style/dist/spectrum-theme.cjs +10 -20
  417. package/style/dist/spectrum-theme.cjs.map +1 -1
  418. package/style/dist/spectrum-theme.mjs +10 -20
  419. package/style/dist/spectrum-theme.mjs.map +1 -1
  420. package/style/dist/types.d.ts +0 -4
  421. package/style/dist/types.d.ts.map +1 -1
  422. package/style/spectrum-theme.ts +11 -19
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/s2/src/TreeView.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonGroupContext} from './ActionButtonGroup';\nimport {ActionMenuContext} from './ActionMenu';\nimport {\n Button,\n ButtonContext,\n Collection,\n Provider,\n TreeItemProps as RACTreeItemProps,\n TreeProps as RACTreeProps,\n UNSTABLE_ListLayout,\n UNSTABLE_Tree,\n UNSTABLE_TreeItem,\n UNSTABLE_TreeItemContent,\n UNSTABLE_Virtualizer,\n useContextProps\n} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {Checkbox} from './Checkbox';\nimport Chevron from '../ui-icons/Chevron';\nimport {colorMix, fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {DOMRef, Key} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {isAndroid} from '@react-aria/utils';\nimport {raw} from '../style/style-macro' with {type: 'macro'};\nimport React, {createContext, forwardRef, isValidElement, JSXElementConstructor, ReactElement, useContext, useMemo, useRef} from 'react';\nimport {Text, TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocale} from 'react-aria';\n\ninterface S2TreeProps {\n // Only detatched is supported right now with the current styles from Spectrum\n isDetached?: boolean,\n onAction?: (key: Key) => void,\n // not fully supported yet\n isEmphasized?: boolean\n}\n\nexport interface TreeViewProps extends Omit<RACTreeProps<any>, 'style' | 'className' | 'onRowAction' | 'selectionBehavior' | 'onScroll' | 'onCellAction' | 'dragAndDropHooks'>, UnsafeStyles, S2TreeProps {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight\n}\n\nexport interface TreeViewItemProps<T extends object = object> extends Omit<RACTreeItemProps, 'className' | 'style'> {\n /** Whether this item has children, even if not loaded yet. */\n hasChildItems?: boolean,\n /** A list of child tree item objects used when dynamically rendering the tree item children. */\n childItems?: Iterable<T>\n}\n\ninterface TreeRendererContextValue {\n renderer?: (item) => ReactElement<any, string | JSXElementConstructor<any>>\n}\nconst TreeRendererContext = createContext<TreeRendererContextValue>({});\n\nfunction useTreeRendererContext(): TreeRendererContextValue {\n return useContext(TreeRendererContext)!;\n}\n\n\nlet InternalTreeContext = createContext<{isDetached?: boolean, isEmphasized?: boolean}>({});\n\n// TODO: the below is needed so the borders of the top and bottom row isn't cut off if the TreeView is wrapped within a container by always reserving the 2px needed for the\n// keyboard focus ring. Perhaps find a different way of rendering the outlines since the top of the item doesn't\n// scroll into view due to how the ring is offset. Alternatively, have the tree render the top/bottom outline like it does in Listview\nconst tree = style({\n userSelect: 'none',\n minHeight: 0,\n minWidth: 0,\n width: 'full',\n overflow: 'auto',\n boxSizing: 'border-box',\n justifyContent: {\n isEmpty: 'center'\n },\n alignItems: {\n isEmpty: 'center'\n },\n height: {\n isEmpty: 'full'\n },\n '--indent': {\n type: 'width',\n value: 16\n }\n}, getAllowedOverrides({height: true}));\n\nfunction TreeView(props: TreeViewProps, ref: DOMRef<HTMLDivElement>) {\n let {children, isDetached, isEmphasized} = props;\n\n let renderer;\n if (typeof children === 'function') {\n renderer = children;\n }\n\n let domRef = useDOMRef(ref);\n\n let layout = useMemo(() => {\n return new UNSTABLE_ListLayout({\n rowHeight: isDetached ? 42 : 40\n });\n }, [isDetached]);\n\n return (\n <UNSTABLE_Virtualizer layout={layout}>\n <TreeRendererContext.Provider value={{renderer}}>\n <InternalTreeContext.Provider value={{isDetached, isEmphasized}}>\n <UNSTABLE_Tree\n {...props}\n className={({isEmpty}) => tree({isEmpty, isDetached}, props.styles)}\n selectionBehavior=\"toggle\"\n ref={domRef}>\n {props.children}\n </UNSTABLE_Tree>\n </InternalTreeContext.Provider>\n </TreeRendererContext.Provider>\n </UNSTABLE_Virtualizer>\n );\n}\n\nconst selectedBackground = lightDark(colorMix('gray-25', 'informative-900', 10), colorMix('gray-25', 'informative-700', 10));\nconst selectedActiveBackground = lightDark(colorMix('gray-25', 'informative-900', 15), colorMix('gray-25', 'informative-700', 15));\n\nconst rowBackgroundColor = {\n default: '--s2-container-bg',\n isFocusVisibleWithin: colorMix('gray-25', 'gray-900', 7),\n isHovered: colorMix('gray-25', 'gray-900', 7),\n isPressed: colorMix('gray-25', 'gray-900', 10),\n isSelected: {\n default: colorMix('gray-25', 'gray-900', 7),\n isEmphasized: selectedBackground,\n isFocusVisibleWithin: {\n default: colorMix('gray-25', 'gray-900', 10),\n isEmphasized: selectedActiveBackground\n },\n isHovered: {\n default: colorMix('gray-25', 'gray-900', 10),\n isEmphasized: selectedActiveBackground\n },\n isPressed: {\n default: colorMix('gray-25', 'gray-900', 10),\n isEmphasized: selectedActiveBackground\n }\n },\n forcedColors: {\n default: 'Background'\n }\n} as const;\n\nconst treeRow = style({\n position: 'relative',\n display: 'flex',\n height: 40,\n width: 'full',\n boxSizing: 'border-box',\n font: 'ui',\n color: 'body',\n outlineStyle: 'none',\n cursor: {\n default: 'default',\n isLink: 'pointer'\n },\n '--rowBackgroundColor': {\n type: 'backgroundColor',\n value: rowBackgroundColor\n },\n '--rowFocusIndicatorColor': {\n type: 'outlineColor',\n value: {\n default: 'focus-ring',\n forcedColors: 'Highlight'\n }\n }\n});\n\n\nconst treeCellGrid = style({\n display: 'grid',\n width: 'full',\n alignContent: 'center',\n alignItems: 'center',\n gridTemplateColumns: ['minmax(0, auto)', 'minmax(0, auto)', 'minmax(0, auto)', 40, 'minmax(0, auto)', '1fr', 'minmax(0, auto)', 'auto'],\n gridTemplateRows: '1fr',\n gridTemplateAreas: [\n 'drag-handle checkbox level-padding expand-button icon content actions actionmenu'\n ],\n backgroundColor: '--rowBackgroundColor',\n paddingEnd: 4, // account for any focus rings on the last item in the cell\n color: {\n isDisabled: {\n default: 'gray-400',\n forcedColors: 'GrayText'\n }\n },\n '--rowSelectedBorderColor': {\n type: 'outlineColor',\n value: {\n default: 'gray-800',\n isFocusVisible: 'focus-ring',\n forcedColors: 'Highlight'\n }\n },\n '--rowForcedFocusBorderColor': {\n type: 'outlineColor',\n value: {\n default: 'focus-ring',\n forcedColors: 'Highlight'\n }\n },\n borderTopColor: {\n default: 'transparent',\n isSelected: {\n isFirst: 'transparent'\n },\n isDetached: {\n default: 'transparent',\n isSelected: '--rowSelectedBorderColor'\n }\n },\n borderInlineEndColor: {\n default: 'transparent',\n isSelected: 'transparent',\n isDetached: {\n default: 'transparent',\n isSelected: '--rowSelectedBorderColor'\n }\n },\n borderBottomColor: {\n default: 'transparent',\n isSelected: 'transparent',\n isNextSelected: 'transparent',\n isNextFocused: 'transparent',\n isDetached: {\n default: 'transparent',\n isSelected: '--rowSelectedBorderColor'\n }\n },\n borderInlineStartColor: {\n default: 'transparent',\n isSelected: 'transparent',\n isDetached: {\n default: 'transparent',\n isSelected: '--rowSelectedBorderColor'\n }\n },\n borderTopWidth: {\n default: 0,\n isFirst: {\n default: 1,\n forcedColors: 0\n },\n isDetached: 1\n },\n borderBottomWidth: {\n default: 0,\n isDetached: 1\n },\n borderStartWidth: {\n default: 0,\n isDetached: 1\n },\n borderEndWidth: {\n default: 0,\n isDetached: 1\n },\n borderRadius: {\n isDetached: 'default'\n },\n borderStyle: 'solid'\n});\n\nconst treeCheckbox = style({\n gridArea: 'checkbox',\n marginStart: 12,\n marginEnd: 0,\n paddingEnd: 0\n});\n\nconst treeIcon = style({\n gridArea: 'icon',\n marginEnd: 'text-to-visual',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst treeContent = style({\n gridArea: 'content',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n});\n\nconst treeActions = style({\n gridArea: 'actions',\n flexGrow: 0,\n flexShrink: 0,\n /* TODO: I made this one up, confirm desired behavior. These paddings are to make sure the action group has enough padding for the focus ring */\n marginStart: 2,\n marginEnd: 4\n});\n\nconst treeActionMenu = style({\n gridArea: 'actionmenu'\n});\n\nconst cellFocus = {\n outlineStyle: {\n default: 'none',\n isFocusVisible: 'solid'\n },\n outlineOffset: -2,\n outlineWidth: 2,\n outlineColor: 'focus-ring',\n borderRadius: '[6px]'\n} as const;\n\nconst treeRowFocusIndicator = raw(`\n &:before {\n content: \"\";\n display: inline-block;\n position: sticky;\n inset-inline-start: 0;\n width: 3px;\n height: 100%;\n margin-inline-end: -3px;\n margin-block-end: 1px;\n z-index: 3;\n background-color: var(--rowFocusIndicatorColor);\n }`\n);\n\n\nexport const TreeViewItem = <T extends object>(props: TreeViewItemProps<T>) => {\n let {\n children,\n childItems,\n hasChildItems,\n href\n } = props;\n\n let content;\n let nestedRows;\n let {renderer} = useTreeRendererContext();\n let {isDetached, isEmphasized} = useContext(InternalTreeContext);\n\n if (typeof children === 'string') {\n content = <Text>{children}</Text>;\n } else {\n content = [];\n nestedRows = [];\n React.Children.forEach(children, node => {\n if (isValidElement(node) && node.type === TreeViewItem) {\n nestedRows.push(node);\n } else {\n content.push(node);\n }\n });\n }\n\n if (childItems != null && renderer) {\n nestedRows = (\n <Collection items={childItems}>\n {renderer}\n </Collection>\n );\n }\n\n return (\n <UNSTABLE_TreeItem\n {...props}\n className={(renderProps) => treeRow({...renderProps, isLink: !!href, isEmphasized}) + (renderProps.isFocusVisible && !isDetached ? ' ' + treeRowFocusIndicator : '')}>\n <UNSTABLE_TreeItemContent>\n {({isExpanded, hasChildRows, selectionMode, selectionBehavior, isDisabled, isFocusVisible, isSelected, id, state}) => {\n let isNextSelected = false;\n let isNextFocused = false;\n let keyAfter = state.collection.getKeyAfter(id);\n if (keyAfter != null) {\n isNextSelected = state.selectionManager.isSelected(keyAfter);\n }\n let isFirst = state.collection.getFirstKey() === id;\n return (\n <div className={treeCellGrid({isDisabled, isNextSelected, isSelected, isFirst, isNextFocused, isDetached})}>\n {selectionMode !== 'none' && selectionBehavior === 'toggle' && (\n // TODO: add transition?\n <div className={treeCheckbox}>\n <Checkbox\n isEmphasized={isEmphasized}\n slot=\"selection\" />\n </div>\n )}\n <div\n className={style({\n gridArea: 'level-padding',\n width: '[calc(calc(var(--tree-item-level, 0) - 1) * var(--indent))]'\n })} />\n {/* TODO: revisit when we do async loading, at the moment hasChildItems will only cause the chevron to be rendered, no aria/data attributes indicating the row's expandability are added */}\n {(hasChildRows || hasChildItems) && <ExpandableRowChevron isDisabled={isDisabled} isExpanded={isExpanded} />}\n <Provider\n values={[\n [TextContext, {styles: treeContent}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: treeIcon}),\n styles: style({size: fontRelative(20), flexShrink: 0})\n }],\n [ActionButtonGroupContext, {styles: treeActions}],\n [ActionMenuContext, {styles: treeActionMenu, isQuiet: true}]\n ]}>\n {content}\n </Provider>\n {isFocusVisible && isDetached && <div role=\"presentation\" className={style({...cellFocus, position: 'absolute', inset: 0})({isFocusVisible: true})} />}\n </div>\n );\n }}\n </UNSTABLE_TreeItemContent>\n {nestedRows}\n </UNSTABLE_TreeItem>\n );\n};\n\ninterface ExpandableRowChevronProps {\n isExpanded?: boolean,\n isDisabled?: boolean,\n isRTL?: boolean\n}\n\nconst expandButton = style<ExpandableRowChevronProps>({\n gridArea: 'expand-button',\n height: 'full',\n aspectRatio: 'square',\n display: 'flex',\n flexWrap: 'wrap',\n alignContent: 'center',\n justifyContent: 'center',\n outlineStyle: 'none',\n cursor: 'default',\n transform: {\n isExpanded: {\n default: 'rotate(90deg)',\n isRTL: 'rotate(-90deg)'\n }\n },\n transition: 'default',\n backgroundColor: 'transparent',\n borderStyle: 'none'\n});\n\nfunction ExpandableRowChevron(props: ExpandableRowChevronProps) {\n let expandButtonRef = useRef<HTMLButtonElement>(null);\n let [fullProps, ref] = useContextProps({...props, slot: 'chevron'}, expandButtonRef, ButtonContext);\n let {isExpanded, isDisabled} = fullProps;\n let {direction} = useLocale();\n\n return (\n <Button\n {...props}\n ref={ref}\n slot=\"chevron\"\n // Override tabindex so that grid keyboard nav skips over it. Needs -1 so android talkback can actually \"focus\" it\n excludeFromTabOrder={isAndroid() && !isDisabled}\n preventFocusOnPress\n className={renderProps => expandButton({...renderProps, isExpanded, isRTL: direction === 'rtl'})}>\n <Chevron\n className={style({\n scale: {\n direction: {\n ltr: '1',\n rtl: '-1'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n })({direction})} />\n </Button>\n );\n}\n\n/**\n * A tree view provides users with a way to navigate nested hierarchical information.\n */\nconst _TreeView = forwardRef(TreeView);\nexport {_TreeView as TreeView};\n"],"names":[],"version":3,"file":"TreeView.cjs.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/s2/src/TreeView.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButtonGroupContext} from './ActionButtonGroup';\nimport {ActionMenuContext} from './ActionMenu';\nimport {\n Button,\n ButtonContext,\n Provider,\n TreeItemProps as RACTreeItemProps,\n TreeProps as RACTreeProps,\n TreeItemContentProps,\n UNSTABLE_ListLayout,\n UNSTABLE_Tree,\n UNSTABLE_TreeItem,\n UNSTABLE_TreeItemContent,\n UNSTABLE_Virtualizer,\n useContextProps\n} from 'react-aria-components';\nimport {centerBaseline} from './CenterBaseline';\nimport {Checkbox} from './Checkbox';\nimport Chevron from '../ui-icons/Chevron';\nimport {colorMix, fontRelative, lightDark, style} from '../style' with {type: 'macro'};\nimport {DOMRef, Key} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {IconContext} from './Icon';\nimport {isAndroid} from '@react-aria/utils';\nimport {raw} from '../style/style-macro' with {type: 'macro'};\nimport React, {createContext, forwardRef, JSXElementConstructor, ReactElement, ReactNode, useContext, useMemo, useRef} from 'react';\nimport {TextContext} from './Content';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useLocale} from 'react-aria';\nimport {useScale} from './utils';\n\ninterface S2TreeProps {\n // Only detatched is supported right now with the current styles from Spectrum\n isDetached?: boolean,\n onAction?: (key: Key) => void,\n // not fully supported yet\n isEmphasized?: boolean\n}\n\nexport interface TreeViewProps extends Omit<RACTreeProps<any>, 'style' | 'className' | 'onRowAction' | 'selectionBehavior' | 'onScroll' | 'onCellAction' | 'dragAndDropHooks'>, UnsafeStyles, S2TreeProps {\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight\n}\n\nexport interface TreeViewItemProps<T extends object = object> extends Omit<RACTreeItemProps, 'className' | 'style'> {\n /** Whether this item has children, even if not loaded yet. */\n hasChildItems?: boolean,\n /** A list of child tree item objects used when dynamically rendering the tree item children. */\n childItems?: Iterable<T>\n}\n\ninterface TreeRendererContextValue {\n renderer?: (item) => ReactElement<any, string | JSXElementConstructor<any>>\n}\nconst TreeRendererContext = createContext<TreeRendererContextValue>({});\n\n\nlet InternalTreeContext = createContext<{isDetached?: boolean, isEmphasized?: boolean}>({});\n\n// TODO: the below is needed so the borders of the top and bottom row isn't cut off if the TreeView is wrapped within a container by always reserving the 2px needed for the\n// keyboard focus ring. Perhaps find a different way of rendering the outlines since the top of the item doesn't\n// scroll into view due to how the ring is offset. Alternatively, have the tree render the top/bottom outline like it does in Listview\nconst tree = style({\n userSelect: 'none',\n minHeight: 0,\n minWidth: 0,\n width: 'full',\n overflow: 'auto',\n boxSizing: 'border-box',\n justifyContent: {\n isEmpty: 'center'\n },\n alignItems: {\n isEmpty: 'center'\n },\n height: {\n isEmpty: 'full'\n },\n '--indent': {\n type: 'width',\n value: 16\n }\n}, getAllowedOverrides({height: true}));\n\nfunction TreeView(props: TreeViewProps, ref: DOMRef<HTMLDivElement>) {\n let {children, isDetached, isEmphasized} = props;\n let scale = useScale();\n\n let renderer;\n if (typeof children === 'function') {\n renderer = children;\n }\n\n let domRef = useDOMRef(ref);\n\n let rowHeight = isDetached ? 44 : 40;\n if (scale === 'large') {\n rowHeight = isDetached ? 54 : 50;\n }\n let layout = useMemo(() => {\n return new UNSTABLE_ListLayout({\n rowHeight\n });\n }, [rowHeight]);\n\n return (\n <UNSTABLE_Virtualizer layout={layout}>\n <TreeRendererContext.Provider value={{renderer}}>\n <InternalTreeContext.Provider value={{isDetached, isEmphasized}}>\n <UNSTABLE_Tree\n {...props}\n className={({isEmpty}) => tree({isEmpty, isDetached}, props.styles)}\n selectionBehavior=\"toggle\"\n ref={domRef}>\n {props.children}\n </UNSTABLE_Tree>\n </InternalTreeContext.Provider>\n </TreeRendererContext.Provider>\n </UNSTABLE_Virtualizer>\n );\n}\n\nconst selectedBackground = lightDark(colorMix('gray-25', 'informative-900', 10), colorMix('gray-25', 'informative-700', 10));\nconst selectedActiveBackground = lightDark(colorMix('gray-25', 'informative-900', 15), colorMix('gray-25', 'informative-700', 15));\n\nconst rowBackgroundColor = {\n default: '--s2-container-bg',\n isFocusVisibleWithin: colorMix('gray-25', 'gray-900', 7),\n isHovered: colorMix('gray-25', 'gray-900', 7),\n isPressed: colorMix('gray-25', 'gray-900', 10),\n isSelected: {\n default: colorMix('gray-25', 'gray-900', 7),\n isEmphasized: selectedBackground,\n isFocusVisibleWithin: {\n default: colorMix('gray-25', 'gray-900', 10),\n isEmphasized: selectedActiveBackground\n },\n isHovered: {\n default: colorMix('gray-25', 'gray-900', 10),\n isEmphasized: selectedActiveBackground\n },\n isPressed: {\n default: colorMix('gray-25', 'gray-900', 10),\n isEmphasized: selectedActiveBackground\n }\n },\n forcedColors: {\n default: 'Background'\n }\n} as const;\n\nconst treeRow = style({\n position: 'relative',\n display: 'flex',\n height: 40,\n width: 'full',\n boxSizing: 'border-box',\n font: 'ui',\n color: 'body',\n outlineStyle: 'none',\n cursor: {\n default: 'default',\n isLink: 'pointer'\n },\n '--rowBackgroundColor': {\n type: 'backgroundColor',\n value: rowBackgroundColor\n },\n '--rowFocusIndicatorColor': {\n type: 'outlineColor',\n value: {\n default: 'focus-ring',\n forcedColors: 'Highlight'\n }\n }\n});\n\n\nconst treeCellGrid = style({\n display: 'grid',\n width: 'full',\n height: 'full',\n alignContent: 'center',\n alignItems: 'center',\n gridTemplateColumns: ['auto', 'auto', 'auto', 'auto', 'auto', '1fr', 'minmax(0, auto)', 'auto'],\n gridTemplateRows: '1fr',\n gridTemplateAreas: [\n 'drag-handle checkbox level-padding expand-button icon content actions actionmenu'\n ],\n backgroundColor: '--rowBackgroundColor',\n paddingEnd: 4, // account for any focus rings on the last item in the cell\n color: {\n isDisabled: {\n default: 'gray-400',\n forcedColors: 'GrayText'\n }\n },\n '--rowSelectedBorderColor': {\n type: 'outlineColor',\n value: {\n default: 'gray-800',\n isFocusVisible: 'focus-ring',\n forcedColors: 'Highlight'\n }\n },\n '--rowForcedFocusBorderColor': {\n type: 'outlineColor',\n value: {\n default: 'focus-ring',\n forcedColors: 'Highlight'\n }\n },\n borderColor: {\n isDetached: {\n default: 'transparent',\n isSelected: '--rowSelectedBorderColor'\n }\n },\n borderWidth: {\n isDetached: 1\n },\n borderRadius: {\n isDetached: 'default'\n },\n borderStyle: {\n isDetached: 'solid'\n }\n});\n\nconst treeCheckbox = style({\n gridArea: 'checkbox',\n marginStart: 12,\n marginEnd: 0,\n paddingEnd: 0\n});\n\nconst treeIcon = style({\n gridArea: 'icon',\n marginEnd: 'text-to-visual',\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst treeContent = style({\n gridArea: 'content',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n});\n\nconst treeActions = style({\n gridArea: 'actions',\n /* TODO: I made this one up, confirm desired behavior. These paddings are to make sure the action group has enough padding for the focus ring */\n marginStart: 2,\n marginEnd: 4\n});\n\nconst treeActionMenu = style({\n gridArea: 'actionmenu'\n});\n\nconst cellFocus = {\n outlineStyle: {\n default: 'none',\n isFocusVisible: 'solid'\n },\n outlineOffset: -2,\n outlineWidth: 2,\n outlineColor: 'focus-ring',\n borderRadius: '[6px]'\n} as const;\n\nconst treeRowFocusIndicator = raw(`\n &:before {\n content: \"\";\n display: inline-block;\n position: sticky;\n inset-inline-start: 0;\n width: 3px;\n height: 100%;\n margin-inline-end: -3px;\n margin-block-end: 1px;\n z-index: 3;\n background-color: var(--rowFocusIndicatorColor);\n }`\n);\n\nexport const TreeViewItem = <T extends object>(props: TreeViewItemProps<T>) => {\n let {\n href\n } = props;\n let {isDetached, isEmphasized} = useContext(InternalTreeContext);\n\n return (\n <UNSTABLE_TreeItem\n {...props}\n className={(renderProps) => treeRow({\n ...renderProps,\n isLink: !!href, isEmphasized\n }) + (renderProps.isFocusVisible && !isDetached ? ' ' + treeRowFocusIndicator : '')} />\n );\n};\n\nexport const TreeItemContent = (props: Omit<TreeItemContentProps, 'children'> & {children: ReactNode}) => {\n let {\n children\n } = props;\n let {isDetached, isEmphasized} = useContext(InternalTreeContext);\n let scale = useScale();\n\n return (\n <UNSTABLE_TreeItemContent>\n {({isExpanded, hasChildItems, selectionMode, selectionBehavior, isDisabled, isFocusVisible, isSelected, id, state}) => {\n let isNextSelected = false;\n let isNextFocused = false;\n let keyAfter = state.collection.getKeyAfter(id);\n if (keyAfter != null) {\n isNextSelected = state.selectionManager.isSelected(keyAfter);\n }\n let isFirst = state.collection.getFirstKey() === id;\n return (\n <div className={treeCellGrid({isDisabled, isNextSelected, isSelected, isFirst, isNextFocused, isDetached})}>\n {selectionMode !== 'none' && selectionBehavior === 'toggle' && (\n // TODO: add transition?\n <div className={treeCheckbox}>\n <Checkbox\n isEmphasized={isEmphasized}\n slot=\"selection\" />\n </div>\n )}\n <div\n className={style({\n gridArea: 'level-padding',\n width: '[calc(calc(var(--tree-item-level, 0) - 1) * var(--indent))]'\n })} />\n {/* TODO: revisit when we do async loading, at the moment hasChildItems will only cause the chevron to be rendered, no aria/data attributes indicating the row's expandability are added */}\n <ExpandableRowChevron isDisabled={isDisabled} isExpanded={isExpanded} scale={scale} isHidden={!(hasChildItems)} />\n <Provider\n values={[\n [TextContext, {styles: treeContent}],\n [IconContext, {\n render: centerBaseline({slot: 'icon', styles: treeIcon}),\n styles: style({size: fontRelative(20), flexShrink: 0})\n }],\n [ActionButtonGroupContext, {styles: treeActions}],\n [ActionMenuContext, {styles: treeActionMenu, isQuiet: true}]\n ]}>\n {children}\n </Provider>\n {isFocusVisible && isDetached && <div role=\"presentation\" className={style({...cellFocus, position: 'absolute', inset: 0})({isFocusVisible: true})} />}\n </div>\n );\n }}\n </UNSTABLE_TreeItemContent>\n );\n};\n\ninterface ExpandableRowChevronProps {\n isExpanded?: boolean,\n isDisabled?: boolean,\n isRTL?: boolean,\n scale: 'medium' | 'large',\n isHidden?: boolean\n}\n\nconst expandButton = style<ExpandableRowChevronProps>({\n gridArea: 'expand-button',\n color: {\n default: '[inherit]',\n isDisabled: {\n default: 'disabled',\n forcedColors: 'GrayText'\n }\n },\n height: 40,\n width: 40,\n display: 'flex',\n flexWrap: 'wrap',\n alignContent: 'center',\n justifyContent: 'center',\n outlineStyle: 'none',\n cursor: 'default',\n transform: {\n isExpanded: {\n default: 'rotate(90deg)',\n isRTL: 'rotate(-90deg)'\n }\n },\n padding: 0,\n transition: 'default',\n backgroundColor: 'transparent',\n borderStyle: 'none',\n disableTapHighlight: true,\n visibility: {\n isHidden: 'hidden'\n }\n});\n\nfunction ExpandableRowChevron(props: ExpandableRowChevronProps) {\n let expandButtonRef = useRef<HTMLButtonElement>(null);\n let [fullProps, ref] = useContextProps({...props, slot: 'chevron'}, expandButtonRef, ButtonContext);\n let {isExpanded, isDisabled, scale, isHidden} = fullProps;\n let {direction} = useLocale();\n isDisabled = isDisabled || isHidden;\n\n return (\n <Button\n {...props}\n ref={ref}\n slot=\"chevron\"\n // Override tabindex so that grid keyboard nav skips over it. Needs -1 so android talkback can actually \"focus\" it\n excludeFromTabOrder={isAndroid() && !isDisabled}\n preventFocusOnPress\n className={renderProps => expandButton({...renderProps, isExpanded, isRTL: direction === 'rtl', scale, isHidden})}>\n <Chevron\n className={style({\n scale: {\n direction: {\n ltr: '1',\n rtl: '-1'\n }\n },\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n })({direction})} />\n </Button>\n );\n}\n\n/**\n * A tree view provides users with a way to navigate nested hierarchical information.\n */\nconst _TreeView = forwardRef(TreeView);\nexport {_TreeView as TreeView};\n"],"names":[],"version":3,"file":"TreeView.cjs.map"}