@payloadcms/ui 4.0.0-internal.cea8867 → 4.0.0-internal.d1cc1d3

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 (319) hide show
  1. package/dist/css/app.css +121 -0
  2. package/dist/css/forms.css +0 -6
  3. package/dist/css/spacing.css +11 -3
  4. package/dist/css/z-index.css +10 -0
  5. package/dist/elements/AddNewRelation/index.css +0 -1
  6. package/dist/elements/AppHeader/index.css +0 -3
  7. package/dist/elements/AppHeader/index.d.ts.map +1 -1
  8. package/dist/elements/AppHeader/index.js +5 -1
  9. package/dist/elements/AppHeader/index.js.map +1 -1
  10. package/dist/elements/ArrayAction/index.d.ts +2 -0
  11. package/dist/elements/ArrayAction/index.d.ts.map +1 -1
  12. package/dist/elements/ArrayAction/index.js +65 -24
  13. package/dist/elements/ArrayAction/index.js.map +1 -1
  14. package/dist/elements/BulkUpload/EditMany/DrawerContent.js +2 -2
  15. package/dist/elements/BulkUpload/EditMany/DrawerContent.js.map +1 -1
  16. package/dist/elements/BulkUpload/FileSidebar/index.css +4 -0
  17. package/dist/elements/BulkUpload/FormsManager/createFormData.d.ts +2 -2
  18. package/dist/elements/BulkUpload/FormsManager/createFormData.d.ts.map +1 -1
  19. package/dist/elements/BulkUpload/FormsManager/createFormData.js +4 -15
  20. package/dist/elements/BulkUpload/FormsManager/createFormData.js.map +1 -1
  21. package/dist/elements/BulkUpload/FormsManager/index.d.ts.map +1 -1
  22. package/dist/elements/BulkUpload/FormsManager/index.js +1 -1
  23. package/dist/elements/BulkUpload/FormsManager/index.js.map +1 -1
  24. package/dist/elements/ClipboardAction/clipboardUtilities.d.ts +8 -1
  25. package/dist/elements/ClipboardAction/clipboardUtilities.d.ts.map +1 -1
  26. package/dist/elements/ClipboardAction/clipboardUtilities.js +40 -8
  27. package/dist/elements/ClipboardAction/clipboardUtilities.js.map +1 -1
  28. package/dist/elements/ClipboardAction/clipboardUtilities.spec.js +120 -0
  29. package/dist/elements/ClipboardAction/clipboardUtilities.spec.js.map +1 -0
  30. package/dist/elements/ClipboardAction/index.d.ts.map +1 -1
  31. package/dist/elements/ClipboardAction/index.js +17 -1
  32. package/dist/elements/ClipboardAction/index.js.map +1 -1
  33. package/dist/elements/ClipboardAction/isClipboardDataValid.spec.js +144 -0
  34. package/dist/elements/ClipboardAction/isClipboardDataValid.spec.js.map +1 -0
  35. package/dist/elements/ClipboardAction/types.d.ts +3 -0
  36. package/dist/elements/ClipboardAction/types.d.ts.map +1 -1
  37. package/dist/elements/ClipboardAction/types.js.map +1 -1
  38. package/dist/elements/ClipboardAction/useCanPasteClipboard.d.ts +10 -0
  39. package/dist/elements/ClipboardAction/useCanPasteClipboard.d.ts.map +1 -0
  40. package/dist/elements/ClipboardAction/useCanPasteClipboard.js +21 -0
  41. package/dist/elements/ClipboardAction/useCanPasteClipboard.js.map +1 -0
  42. package/dist/elements/CodeEditor/index.css +0 -5
  43. package/dist/elements/CommandPalette/index.css +0 -7
  44. package/dist/elements/CreateDocumentButton/index.d.ts.map +1 -1
  45. package/dist/elements/CreateDocumentButton/index.js +4 -1
  46. package/dist/elements/CreateDocumentButton/index.js.map +1 -1
  47. package/dist/elements/DatePicker/DatePicker.d.ts.map +1 -1
  48. package/dist/elements/DatePicker/DatePicker.js +1 -0
  49. package/dist/elements/DatePicker/DatePicker.js.map +1 -1
  50. package/dist/elements/DatePicker/index.css +1 -1
  51. package/dist/elements/DeleteDocument/index.d.ts.map +1 -1
  52. package/dist/elements/DeleteDocument/index.js +16 -1
  53. package/dist/elements/DeleteDocument/index.js.map +1 -1
  54. package/dist/elements/EditMany/DrawerContent.js +2 -2
  55. package/dist/elements/EditMany/DrawerContent.js.map +1 -1
  56. package/dist/elements/FieldSelect/reduceFieldOptions.d.ts.map +1 -1
  57. package/dist/elements/FieldSelect/reduceFieldOptions.js +3 -1
  58. package/dist/elements/FieldSelect/reduceFieldOptions.js.map +1 -1
  59. package/dist/elements/FieldSelect/reduceFieldOptions.spec.js +143 -0
  60. package/dist/elements/FieldSelect/reduceFieldOptions.spec.js.map +1 -0
  61. package/dist/elements/FileDetails/StaticFileDetails/index.css +8 -9
  62. package/dist/elements/FileManager/FilePreview/index.css +3 -3
  63. package/dist/elements/FileManager/index.css +36 -23
  64. package/dist/elements/FileManager/index.d.ts +1 -1
  65. package/dist/elements/FileManager/index.d.ts.map +1 -1
  66. package/dist/elements/FileManager/index.js +15 -4
  67. package/dist/elements/FileManager/index.js.map +1 -1
  68. package/dist/elements/Hierarchy/ColumnBrowser/ColumnItem/index.css +0 -1
  69. package/dist/elements/Hierarchy/Tree/HierarchySidebarTab.d.ts.map +1 -1
  70. package/dist/elements/Hierarchy/Tree/HierarchySidebarTab.js +109 -89
  71. package/dist/elements/Hierarchy/Tree/HierarchySidebarTab.js.map +1 -1
  72. package/dist/elements/Hierarchy/Tree/HierarchySidebarTab.server.d.ts.map +1 -1
  73. package/dist/elements/Hierarchy/Tree/HierarchySidebarTab.server.js +2 -0
  74. package/dist/elements/Hierarchy/Tree/HierarchySidebarTab.server.js.map +1 -1
  75. package/dist/elements/Hierarchy/Tree/TreeNode/index.css +0 -1
  76. package/dist/elements/InputStepper/index.css +0 -1
  77. package/dist/elements/Locked/index.css +0 -8
  78. package/dist/elements/Locked/index.d.ts.map +1 -1
  79. package/dist/elements/Locked/index.js +70 -64
  80. package/dist/elements/Locked/index.js.map +1 -1
  81. package/dist/elements/MiniCarousel/index.css +39 -37
  82. package/dist/elements/Nav/SidebarTabs/index.client.d.ts.map +1 -1
  83. package/dist/elements/Nav/SidebarTabs/index.client.js +12 -5
  84. package/dist/elements/Nav/SidebarTabs/index.client.js.map +1 -1
  85. package/dist/elements/Nav/SidebarTabs/index.css +0 -5
  86. package/dist/elements/Nav/SidebarTabs/renderTabServerFn.d.ts +1 -0
  87. package/dist/elements/Nav/SidebarTabs/renderTabServerFn.d.ts.map +1 -1
  88. package/dist/elements/Nav/SidebarTabs/renderTabServerFn.js +2 -1
  89. package/dist/elements/Nav/SidebarTabs/renderTabServerFn.js.map +1 -1
  90. package/dist/elements/NavGroup/index.css +0 -1
  91. package/dist/elements/PreviewButton/index.d.ts +1 -2
  92. package/dist/elements/PreviewButton/index.d.ts.map +1 -1
  93. package/dist/elements/PreviewButton/index.js +11 -5
  94. package/dist/elements/PreviewButton/index.js.map +1 -1
  95. package/dist/elements/PreviewSizes/index.css +8 -9
  96. package/dist/elements/ReactSelect/ClearIndicator/index.css +0 -1
  97. package/dist/elements/ReactSelect/DefaultMenuPortal.d.ts +7 -0
  98. package/dist/elements/ReactSelect/DefaultMenuPortal.d.ts.map +1 -0
  99. package/dist/elements/ReactSelect/DefaultMenuPortal.js +120 -0
  100. package/dist/elements/ReactSelect/DefaultMenuPortal.js.map +1 -0
  101. package/dist/elements/ReactSelect/MultiValue/index.css +0 -1
  102. package/dist/elements/ReactSelect/MultiValueLabel/index.css +2 -2
  103. package/dist/elements/ReactSelect/getMenuListStyles.d.ts +1 -1
  104. package/dist/elements/ReactSelect/getMenuListStyles.d.ts.map +1 -1
  105. package/dist/elements/ReactSelect/getMenuListStyles.js +13 -5
  106. package/dist/elements/ReactSelect/getMenuListStyles.js.map +1 -1
  107. package/dist/elements/ReactSelect/getMenuStyles.d.ts +10 -0
  108. package/dist/elements/ReactSelect/getMenuStyles.d.ts.map +1 -0
  109. package/dist/elements/ReactSelect/getMenuStyles.js +21 -0
  110. package/dist/elements/ReactSelect/getMenuStyles.js.map +1 -0
  111. package/dist/elements/ReactSelect/index.css +7 -3
  112. package/dist/elements/ReactSelect/index.d.ts.map +1 -1
  113. package/dist/elements/ReactSelect/index.js +24 -101
  114. package/dist/elements/ReactSelect/index.js.map +1 -1
  115. package/dist/elements/ReactSelect/types.d.ts +1 -2
  116. package/dist/elements/ReactSelect/types.d.ts.map +1 -1
  117. package/dist/elements/ReactSelect/types.js.map +1 -1
  118. package/dist/elements/RelationshipTable/Pagination.d.ts +0 -1
  119. package/dist/elements/RelationshipTable/Pagination.d.ts.map +1 -1
  120. package/dist/elements/RelationshipTable/Pagination.js +27 -77
  121. package/dist/elements/RelationshipTable/Pagination.js.map +1 -1
  122. package/dist/elements/RelationshipTable/index.css +0 -2
  123. package/dist/elements/RelationshipTable/index.d.ts +1 -0
  124. package/dist/elements/RelationshipTable/index.d.ts.map +1 -1
  125. package/dist/elements/RelationshipTable/index.js +36 -3
  126. package/dist/elements/RelationshipTable/index.js.map +1 -1
  127. package/dist/elements/RenderTitle/index.css +4 -0
  128. package/dist/elements/RenderTitle/index.d.ts.map +1 -1
  129. package/dist/elements/RenderTitle/index.js +18 -13
  130. package/dist/elements/RenderTitle/index.js.map +1 -1
  131. package/dist/elements/SelectRow/index.d.ts +4 -3
  132. package/dist/elements/SelectRow/index.d.ts.map +1 -1
  133. package/dist/elements/SelectRow/index.js +10 -7
  134. package/dist/elements/SelectRow/index.js.map +1 -1
  135. package/dist/elements/SidebarToggle/index.css +0 -17
  136. package/dist/elements/SortColumn/index.d.ts.map +1 -1
  137. package/dist/elements/SortColumn/index.js +42 -38
  138. package/dist/elements/SortColumn/index.js.map +1 -1
  139. package/dist/elements/Table/OrderableRow.d.ts +3 -1
  140. package/dist/elements/Table/OrderableRow.d.ts.map +1 -1
  141. package/dist/elements/Table/OrderableRow.js +17 -1
  142. package/dist/elements/Table/OrderableRow.js.map +1 -1
  143. package/dist/elements/Table/OrderableTable.d.ts.map +1 -1
  144. package/dist/elements/Table/OrderableTable.js +19 -2
  145. package/dist/elements/Table/OrderableTable.js.map +1 -1
  146. package/dist/elements/Table/index.css +1 -0
  147. package/dist/elements/TableSection/index.css +0 -1
  148. package/dist/elements/Thumbnail/index.d.ts +1 -1
  149. package/dist/elements/Thumbnail/index.d.ts.map +1 -1
  150. package/dist/elements/Thumbnail/index.js.map +1 -1
  151. package/dist/elements/TimezonePicker/index.d.ts.map +1 -1
  152. package/dist/elements/TimezonePicker/index.js +5 -1
  153. package/dist/elements/TimezonePicker/index.js.map +1 -1
  154. package/dist/elements/Tooltip/index.css +15 -34
  155. package/dist/elements/Tooltip/index.d.ts +11 -3
  156. package/dist/elements/Tooltip/index.d.ts.map +1 -1
  157. package/dist/elements/Tooltip/index.js +151 -85
  158. package/dist/elements/Tooltip/index.js.map +1 -1
  159. package/dist/elements/Upload/index.css +0 -5
  160. package/dist/exports/client/index.d.ts +3 -0
  161. package/dist/exports/client/index.d.ts.map +1 -1
  162. package/dist/exports/client/index.js +1 -1
  163. package/dist/exports/client/index.js.map +3 -3
  164. package/dist/exports/layouts.d.ts +1 -0
  165. package/dist/exports/layouts.d.ts.map +1 -1
  166. package/dist/exports/layouts.js +1 -0
  167. package/dist/exports/layouts.js.map +1 -1
  168. package/dist/exports/shared/index.d.ts +1 -0
  169. package/dist/exports/shared/index.d.ts.map +1 -1
  170. package/dist/exports/shared/index.js +2 -2
  171. package/dist/exports/shared/index.js.map +4 -4
  172. package/dist/fields/Array/ArrayRow.d.ts.map +1 -1
  173. package/dist/fields/Array/ArrayRow.js +97 -160
  174. package/dist/fields/Array/ArrayRow.js.map +1 -1
  175. package/dist/fields/Blocks/BlockRow.d.ts.map +1 -1
  176. package/dist/fields/Blocks/BlockRow.js +134 -195
  177. package/dist/fields/Blocks/BlockRow.js.map +1 -1
  178. package/dist/fields/Blocks/RowActions.d.ts +2 -0
  179. package/dist/fields/Blocks/RowActions.d.ts.map +1 -1
  180. package/dist/fields/Blocks/RowActions.js +23 -20
  181. package/dist/fields/Blocks/RowActions.js.map +1 -1
  182. package/dist/fields/Blocks/index.js +3 -3
  183. package/dist/fields/Blocks/index.js.map +1 -1
  184. package/dist/fields/Checkbox/Input.d.ts +2 -0
  185. package/dist/fields/Checkbox/Input.d.ts.map +1 -1
  186. package/dist/fields/Checkbox/Input.js +32 -26
  187. package/dist/fields/Checkbox/Input.js.map +1 -1
  188. package/dist/fields/Checkbox/index.css +37 -73
  189. package/dist/fields/FieldError/index.css +0 -9
  190. package/dist/fields/FieldError/index.d.ts.map +1 -1
  191. package/dist/fields/FieldError/index.js +19 -9
  192. package/dist/fields/FieldError/index.js.map +1 -1
  193. package/dist/fields/Join/index.css +9 -0
  194. package/dist/fields/Join/index.d.ts.map +1 -1
  195. package/dist/fields/Join/index.js +13 -9
  196. package/dist/fields/Join/index.js.map +1 -1
  197. package/dist/fields/RadioGroup/index.css +0 -7
  198. package/dist/fields/Relationship/Input.d.ts.map +1 -1
  199. package/dist/fields/Relationship/Input.js +32 -14
  200. package/dist/fields/Relationship/Input.js.map +1 -1
  201. package/dist/fields/Relationship/select-components/MultiValueLabel/index.css +1 -1
  202. package/dist/fields/Slug/index.css +0 -1
  203. package/dist/fields/Slug/index.d.ts.map +1 -1
  204. package/dist/fields/Slug/index.js +75 -111
  205. package/dist/fields/Slug/index.js.map +1 -1
  206. package/dist/fields/Upload/index.css +19 -4
  207. package/dist/forms/Form/fieldReducer.d.ts.map +1 -1
  208. package/dist/forms/Form/fieldReducer.js +3 -1
  209. package/dist/forms/Form/fieldReducer.js.map +1 -1
  210. package/dist/forms/Form/index.d.ts.map +1 -1
  211. package/dist/forms/Form/index.js +9 -15
  212. package/dist/forms/Form/index.js.map +1 -1
  213. package/dist/forms/Form/types.d.ts +1 -1
  214. package/dist/forms/Form/types.d.ts.map +1 -1
  215. package/dist/forms/Form/types.js.map +1 -1
  216. package/dist/forms/RenderFields/index.css +16 -2
  217. package/dist/forms/WatchChildErrors/index.d.ts.map +1 -1
  218. package/dist/forms/WatchChildErrors/index.js +2 -2
  219. package/dist/forms/WatchChildErrors/index.js.map +1 -1
  220. package/dist/forms/fieldSchemasToFormState/addFieldStatePromise.js +1 -1
  221. package/dist/forms/fieldSchemasToFormState/addFieldStatePromise.js.map +1 -1
  222. package/dist/forms/fieldSchemasToFormState/renderField.d.ts.map +1 -1
  223. package/dist/forms/fieldSchemasToFormState/renderField.js +1 -3
  224. package/dist/forms/fieldSchemasToFormState/renderField.js.map +1 -1
  225. package/dist/layouts/Root/index.d.ts +1 -1
  226. package/dist/layouts/Root/index.d.ts.map +1 -1
  227. package/dist/layouts/Root/index.js +8 -2
  228. package/dist/layouts/Root/index.js.map +1 -1
  229. package/dist/layouts/Root/viewport.d.ts +1 -0
  230. package/dist/layouts/Root/viewport.d.ts.map +1 -1
  231. package/dist/layouts/Root/viewport.js +4 -1
  232. package/dist/layouts/Root/viewport.js.map +1 -1
  233. package/dist/providers/DocumentTitle/index.d.ts +1 -0
  234. package/dist/providers/DocumentTitle/index.d.ts.map +1 -1
  235. package/dist/providers/DocumentTitle/index.js +2 -0
  236. package/dist/providers/DocumentTitle/index.js.map +1 -1
  237. package/dist/providers/Embed/index.d.ts +24 -0
  238. package/dist/providers/Embed/index.d.ts.map +1 -0
  239. package/dist/providers/Embed/index.js +105 -0
  240. package/dist/providers/Embed/index.js.map +1 -0
  241. package/dist/providers/FormErrorHandler/index.d.ts +20 -0
  242. package/dist/providers/FormErrorHandler/index.d.ts.map +1 -0
  243. package/dist/providers/FormErrorHandler/index.js +6 -0
  244. package/dist/providers/FormErrorHandler/index.js.map +1 -0
  245. package/dist/providers/Root/index.d.ts +1 -0
  246. package/dist/providers/Root/index.d.ts.map +1 -1
  247. package/dist/providers/Root/index.js +33 -27
  248. package/dist/providers/Root/index.js.map +1 -1
  249. package/dist/providers/SidebarTabs/index.d.ts +3 -2
  250. package/dist/providers/SidebarTabs/index.d.ts.map +1 -1
  251. package/dist/providers/SidebarTabs/index.js.map +1 -1
  252. package/dist/providers/TableColumns/buildColumnState/index.d.ts.map +1 -1
  253. package/dist/providers/TableColumns/buildColumnState/index.js +1 -1
  254. package/dist/providers/TableColumns/buildColumnState/index.js.map +1 -1
  255. package/dist/providers/TableColumns/buildColumnState/index.spec.js +40 -0
  256. package/dist/providers/TableColumns/buildColumnState/index.spec.js.map +1 -0
  257. package/dist/providers/Theme/index.d.ts +3 -0
  258. package/dist/providers/Theme/index.d.ts.map +1 -1
  259. package/dist/providers/Theme/index.js +107 -95
  260. package/dist/providers/Theme/index.js.map +1 -1
  261. package/dist/providers/UploadHandlers/index.d.ts +2 -7
  262. package/dist/providers/UploadHandlers/index.d.ts.map +1 -1
  263. package/dist/providers/UploadHandlers/index.js +102 -42
  264. package/dist/providers/UploadHandlers/index.js.map +1 -1
  265. package/dist/styles.css +23 -10
  266. package/dist/utilities/combineFieldLabel.d.ts.map +1 -1
  267. package/dist/utilities/combineFieldLabel.js +5 -1
  268. package/dist/utilities/combineFieldLabel.js.map +1 -1
  269. package/dist/utilities/generateFieldID.d.ts +1 -1
  270. package/dist/utilities/generateFieldID.d.ts.map +1 -1
  271. package/dist/utilities/generateFieldID.js +2 -2
  272. package/dist/utilities/generateFieldID.js.map +1 -1
  273. package/dist/utilities/getRequestEmbed.d.ts +14 -0
  274. package/dist/utilities/getRequestEmbed.d.ts.map +1 -0
  275. package/dist/utilities/getRequestEmbed.js +10 -0
  276. package/dist/utilities/getRequestEmbed.js.map +1 -0
  277. package/dist/utilities/handleServerFunctions.d.ts +32 -8
  278. package/dist/utilities/handleServerFunctions.d.ts.map +1 -1
  279. package/dist/utilities/handleServerFunctions.js +17 -37
  280. package/dist/utilities/handleServerFunctions.js.map +1 -1
  281. package/dist/utilities/renderTable.d.ts.map +1 -1
  282. package/dist/utilities/renderTable.js +18 -2
  283. package/dist/utilities/renderTable.js.map +1 -1
  284. package/dist/utilities/serverFunctionRegistry.d.ts +12 -7
  285. package/dist/utilities/serverFunctionRegistry.d.ts.map +1 -1
  286. package/dist/utilities/serverFunctionRegistry.js +25 -7
  287. package/dist/utilities/serverFunctionRegistry.js.map +1 -1
  288. package/dist/utilities/slugify.d.ts.map +1 -1
  289. package/dist/utilities/slugify.js +49 -6
  290. package/dist/utilities/slugify.js.map +1 -1
  291. package/dist/views/Dashboard/Default/ModularDashboard/index.css +0 -8
  292. package/dist/views/Dashboard/Default/ModularDashboard/renderWidget/RenderWidget.js +4 -4
  293. package/dist/views/Dashboard/Default/ModularDashboard/renderWidget/RenderWidget.js.map +1 -1
  294. package/dist/views/Dashboard/Default/ModularDashboard/renderWidget/renderWidgetServerFn.js +10 -10
  295. package/dist/views/Dashboard/Default/ModularDashboard/renderWidget/renderWidgetServerFn.js.map +1 -1
  296. package/dist/views/Edit/index.css +61 -53
  297. package/dist/views/HierarchyList/index.css +1 -1
  298. package/dist/views/List/index.css +1 -1
  299. package/dist/views/List/index.d.ts.map +1 -1
  300. package/dist/views/List/index.js +4 -0
  301. package/dist/views/List/index.js.map +1 -1
  302. package/dist/views/Logout/index.d.ts.map +1 -1
  303. package/dist/views/Logout/index.js +11 -0
  304. package/dist/views/Logout/index.js.map +1 -1
  305. package/dist/views/Root/index.d.ts +12 -1
  306. package/dist/views/Root/index.d.ts.map +1 -1
  307. package/dist/views/Root/index.js +10 -3
  308. package/dist/views/Root/index.js.map +1 -1
  309. package/package.json +7 -11
  310. package/dist/elements/RelationshipTable/Pagination.css +0 -39
  311. package/dist/scss/app.scss +0 -183
  312. package/dist/scss/colors.scss +0 -191
  313. package/dist/scss/custom.css +0 -1
  314. package/dist/scss/queries.scss +0 -27
  315. package/dist/scss/styles.scss +0 -9
  316. package/dist/scss/svg.scss +0 -10
  317. package/dist/scss/toastify.scss +0 -61
  318. package/dist/scss/vars.scss +0 -192
  319. package/dist/scss/z-index.scss +0 -9
@@ -12,7 +12,7 @@ import { IDLabel } from '../IDLabel/index.js';
12
12
  import './index.css';
13
13
  const baseClass = 'render-title';
14
14
  export const RenderTitle = props => {
15
- const $ = _c(14);
15
+ const $ = _c(16);
16
16
  const {
17
17
  className,
18
18
  element: t0,
@@ -28,6 +28,7 @@ export const RenderTitle = props => {
28
28
  isInitializing
29
29
  } = useDocumentInfo();
30
30
  const {
31
+ isPlaceholder,
31
32
  title: titleFromContext
32
33
  } = useDocumentTitle();
33
34
  const {
@@ -41,9 +42,10 @@ export const RenderTitle = props => {
41
42
  } = t2;
42
43
  const title = titleFromProps || titleFromContext || fallback;
43
44
  const idAsTitle = title === id;
45
+ const showPlaceholder = !titleFromProps && isPlaceholder;
44
46
  const Tag = element;
45
47
  let t3;
46
- if ($[0] !== Tag || $[1] !== adminRoute || $[2] !== className || $[3] !== collectionSlug || $[4] !== globalSlug || $[5] !== id || $[6] !== idAsTitle || $[7] !== isInitializing || $[8] !== renderAsLink || $[9] !== title) {
48
+ if ($[0] !== Tag || $[1] !== adminRoute || $[2] !== className || $[3] !== collectionSlug || $[4] !== globalSlug || $[5] !== id || $[6] !== idAsTitle || $[7] !== isInitializing || $[8] !== renderAsLink || $[9] !== showPlaceholder || $[10] !== title) {
47
49
  const EmptySpace = _jsx(Fragment, {
48
50
  children: "\xA0"
49
51
  });
@@ -52,17 +54,19 @@ export const RenderTitle = props => {
52
54
  path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`
53
55
  }) : null;
54
56
  const t4 = idAsTitle && `${baseClass}--has-id`;
55
- let t5;
56
- if ($[11] !== className || $[12] !== t4) {
57
- t5 = [className, baseClass, t4].filter(Boolean);
58
- $[11] = className;
59
- $[12] = t4;
60
- $[13] = t5;
57
+ const t5 = showPlaceholder && `${baseClass}--placeholder`;
58
+ let t6;
59
+ if ($[12] !== className || $[13] !== t4 || $[14] !== t5) {
60
+ t6 = [className, baseClass, t4, t5].filter(Boolean);
61
+ $[12] = className;
62
+ $[13] = t4;
63
+ $[14] = t5;
64
+ $[15] = t6;
61
65
  } else {
62
- t5 = $[13];
66
+ t6 = $[15];
63
67
  }
64
68
  t3 = _jsx(Tag, {
65
- className: t5.join(" "),
69
+ className: t6.join(" "),
66
70
  "data-doc-id": id,
67
71
  title,
68
72
  children: isInitializing ? EmptySpace : idAsTitle ? _jsx(IDLabel, {
@@ -83,10 +87,11 @@ export const RenderTitle = props => {
83
87
  $[6] = idAsTitle;
84
88
  $[7] = isInitializing;
85
89
  $[8] = renderAsLink;
86
- $[9] = title;
87
- $[10] = t3;
90
+ $[9] = showPlaceholder;
91
+ $[10] = title;
92
+ $[11] = t3;
88
93
  } else {
89
- t3 = $[10];
94
+ t3 = $[11];
90
95
  }
91
96
  return t3;
92
97
  };
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","formatAdminURL","React","Fragment","Link","useConfig","useDocumentInfo","useDocumentTitle","IDLabel","baseClass","RenderTitle","props","$","className","element","t0","fallback","renderAsLink","title","titleFromProps","undefined","id","collectionSlug","globalSlug","isInitializing","titleFromContext","config","t1","routes","t2","admin","adminRoute","idAsTitle","Tag","t3","EmptySpace","_jsx","children","docPath","path","t4","t5","filter","Boolean","join","href"],"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport { formatAdminURL } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nimport { Link } from '../../elements/Link/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../providers/DocumentTitle/index.js'\nimport { IDLabel } from '../IDLabel/index.js'\nimport './index.css'\n\nconst baseClass = 'render-title'\n\nexport type RenderTitleProps = {\n className?: string\n element?: React.ElementType\n fallback?: string\n fallbackToID?: boolean\n /**\n * When true, renders the title as a link to the document. Useful inside drawers\n * to navigate to the full document view.\n */\n renderAsLink?: boolean\n title?: string\n}\n\nexport const RenderTitle: React.FC<RenderTitleProps> = (props) => {\n const { className, element = 'h1', fallback, renderAsLink, title: titleFromProps } = props\n\n const { id, collectionSlug, globalSlug, isInitializing } = useDocumentInfo()\n const { title: titleFromContext } = useDocumentTitle()\n const {\n config: {\n routes: { admin: adminRoute },\n },\n } = useConfig()\n\n const title = titleFromProps || titleFromContext || fallback\n\n const idAsTitle = title === id\n\n const Tag = element\n\n // Render and invisible character to prevent layout shift when the title populates from context\n const EmptySpace = <Fragment>&nbsp;</Fragment>\n\n const docPath =\n renderAsLink && id && (collectionSlug || globalSlug)\n ? formatAdminURL({\n adminRoute,\n path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`,\n })\n : null\n\n return (\n <Tag\n className={[className, baseClass, idAsTitle && `${baseClass}--has-id`]\n .filter(Boolean)\n .join(' ')}\n data-doc-id={id}\n title={title}\n >\n {isInitializing ? (\n EmptySpace\n ) : idAsTitle ? (\n <IDLabel className={`${baseClass}__id`} id={id} />\n ) : docPath ? (\n <Link className={`${baseClass}__link`} href={docPath}>\n {title || EmptySpace}\n </Link>\n ) : (\n title || EmptySpace\n )}\n </Tag>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAEhC,SAASC,IAAI,QAAQ;AACrB,SAASC,SAAS,QAAQ;AAC1B,SAASC,eAAe,QAAQ;AAChC,SAASC,gBAAgB,QAAQ;AACjC,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAelB,OAAO,MAAMC,WAAA,GAA0CC,KAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EACrD;IAAAa,SAAA;IAAAC,OAAA,EAAAC,EAAA;IAAAC,QAAA;IAAAC,YAAA;IAAAC,KAAA,EAAAC;EAAA,IAAqFR,KAAA;EAAlE,MAAAG,OAAA,GAAAC,EAAc,KAAAK,SAAA,GAAJ,IAAI,GAAdL,EAAc;EAEjC;IAAAM,EAAA;IAAAC,cAAA;IAAAC,UAAA;IAAAC;EAAA,IAA2DlB,eAAA;EAC3D;IAAAY,KAAA,EAAAO;EAAA,IAAoClB,gBAAA;EACpC;IAAAmB,MAAA,EAAAC;EAAA,IAIItB,SAAA;EAHM;IAAAuB,MAAA,EAAAC;EAAA,IAAAF,EAEP;EADS;IAAAG,KAAA,EAAAC;EAAA,IAAAF,EAAqB;EAIjC,MAAAX,KAAA,GAAcC,cAAA,IAAkBM,gBAAA,IAAoBT,QAAA;EAEpD,MAAAgB,SAAA,GAAkBd,KAAA,KAAUG,EAAA;EAE5B,MAAAY,GAAA,GAAYnB,OAAA;EAAA,IAAAoB,EAAA;EAAA,IAAAtB,CAAA,QAAAqB,GAAA,IAAArB,CAAA,QAAAmB,UAAA,IAAAnB,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAU,cAAA,IAAAV,CAAA,QAAAW,UAAA,IAAAX,CAAA,QAAAS,EAAA,IAAAT,CAAA,QAAAoB,SAAA,IAAApB,CAAA,QAAAY,cAAA,IAAAZ,CAAA,QAAAK,YAAA,IAAAL,CAAA,QAAAM,KAAA;IAGZ,MAAAiB,UAAA,GAAmBC,IAAA,CAAAjC,QAAA;MAAAkC,QAAA,EAAU;IAAA,C;IAE7B,MAAAC,OAAA,GACErB,YAAA,IAAgBI,EAAA,KAAOC,cAAA,IAAkBC,UAAS,IAC9CtB,cAAA;MAAA8B,UAAA;MAAAQ,IAAA,EAEQ,IAAIjB,cAAA,GAAiB,eAAeA,cAAA,EAAgB,GAAG,WAAWC,UAAA,EAAY,IAAIF,EAAA;IAAI,CAC9F,QACA;IAIgC,MAAAmB,EAAA,GAAAR,SAAA,IAAa,GAAAvB,SAAA,UAAsB;IAAA,IAAAgC,EAAA;IAAA,IAAA7B,CAAA,SAAAC,SAAA,IAAAD,CAAA,SAAA4B,EAAA;MAA1DC,EAAA,IAAC5B,SAAA,EAAAJ,SAAA,EAAsB+B,EAAmC,EAAAE,MAAA,CAAAC,OAC3D;MAAA/B,CAAA,OAAAC,SAAA;MAAAD,CAAA,OAAA4B,EAAA;MAAA5B,CAAA,OAAA6B,EAAA;IAAA;MAAAA,EAAA,GAAA7B,CAAA;IAAA;IAFZsB,EAAA,GAAAE,IAAA,CAACH,GAAA;MAAApB,SAAA,EACY4B,EACD,CAAAG,IAAA,CACF;MAAA,eACKvB,EAAA;MAAAH,KAAA;MAAAmB,QAAA,EAGZb,cAAA,GACCW,UAAA,GACEH,SAAA,GACFI,IAAA,CAAA5B,OAAA;QAAAK,SAAA,EAAoB,GAAAJ,SAAA,MAAkB;QAAAY;MAAA,C,IACpCiB,OAAA,GACFF,IAAA,CAAAhC,IAAA;QAAAS,SAAA,EAAiB,GAAAJ,SAAA,QAAoB;QAAAoC,IAAA,EAAQP,OAAA;QAAAD,QAAA,EAC1CnB,KAAA,IAASiB;MAAA,C,IAGZjB,KAAA,IAASiB;IAAA,C;;;;;;;;;;;;;;;SAhBbD,E;CAoBJ","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","formatAdminURL","React","Fragment","Link","useConfig","useDocumentInfo","useDocumentTitle","IDLabel","baseClass","RenderTitle","props","$","className","element","t0","fallback","renderAsLink","title","titleFromProps","undefined","id","collectionSlug","globalSlug","isInitializing","isPlaceholder","titleFromContext","config","t1","routes","t2","admin","adminRoute","idAsTitle","showPlaceholder","Tag","t3","EmptySpace","_jsx","children","docPath","path","t4","t5","t6","filter","Boolean","join","href"],"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport { formatAdminURL } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nimport { Link } from '../../elements/Link/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../providers/DocumentTitle/index.js'\nimport { IDLabel } from '../IDLabel/index.js'\nimport './index.css'\n\nconst baseClass = 'render-title'\n\nexport type RenderTitleProps = {\n className?: string\n element?: React.ElementType\n fallback?: string\n fallbackToID?: boolean\n /**\n * When true, renders the title as a link to the document. Useful inside drawers\n * to navigate to the full document view.\n */\n renderAsLink?: boolean\n title?: string\n}\n\nexport const RenderTitle: React.FC<RenderTitleProps> = (props) => {\n const { className, element = 'h1', fallback, renderAsLink, title: titleFromProps } = props\n\n const { id, collectionSlug, globalSlug, isInitializing } = useDocumentInfo()\n const { isPlaceholder, title: titleFromContext } = useDocumentTitle()\n const {\n config: {\n routes: { admin: adminRoute },\n },\n } = useConfig()\n\n const title = titleFromProps || titleFromContext || fallback\n\n const idAsTitle = title === id\n\n const showPlaceholder = !titleFromProps && isPlaceholder\n\n const Tag = element\n\n // Render and invisible character to prevent layout shift when the title populates from context\n const EmptySpace = <Fragment>&nbsp;</Fragment>\n\n const docPath =\n renderAsLink && id && (collectionSlug || globalSlug)\n ? formatAdminURL({\n adminRoute,\n path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`,\n })\n : null\n\n return (\n <Tag\n className={[\n className,\n baseClass,\n idAsTitle && `${baseClass}--has-id`,\n showPlaceholder && `${baseClass}--placeholder`,\n ]\n .filter(Boolean)\n .join(' ')}\n data-doc-id={id}\n title={title}\n >\n {isInitializing ? (\n EmptySpace\n ) : idAsTitle ? (\n <IDLabel className={`${baseClass}__id`} id={id} />\n ) : docPath ? (\n <Link className={`${baseClass}__link`} href={docPath}>\n {title || EmptySpace}\n </Link>\n ) : (\n title || EmptySpace\n )}\n </Tag>\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -3,9 +3,10 @@ import React from 'react';
3
3
  import './index.css';
4
4
  export declare const SelectRow: React.FC<{
5
5
  rowData: {
6
- _isLocked: boolean;
7
- _userEditing: User;
8
- id: string;
6
+ _isLocked?: boolean;
7
+ _userEditing?: User;
8
+ id: number | string;
9
9
  };
10
+ selectRowLabel: string;
10
11
  }>;
11
12
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SelectRow/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,OAAO,EAAE;QACP,SAAS,EAAE,OAAO,CAAA;QAClB,YAAY,EAAE,IAAI,CAAA;QAClB,EAAE,EAAE,MAAM,CAAA;KACX,CAAA;CACF,CAmBA,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SelectRow/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAEnC,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,OAAO,EAAE;QACP,SAAS,CAAC,EAAE,OAAO,CAAA;QACnB,YAAY,CAAC,EAAE,IAAI,CAAA;QACnB,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;KACpB,CAAA;IACD,cAAc,EAAE,MAAM,CAAA;CACvB,CAoBA,CAAA"}
@@ -10,9 +10,10 @@ import { Locked } from '../Locked/index.js';
10
10
  import './index.css';
11
11
  const baseClass = 'select-row';
12
12
  export const SelectRow = t0 => {
13
- const $ = _c(13);
13
+ const $ = _c(14);
14
14
  const {
15
- rowData
15
+ rowData,
16
+ selectRowLabel
16
17
  } = t0;
17
18
  const {
18
19
  user
@@ -73,18 +74,20 @@ export const SelectRow = t0 => {
73
74
  t5 = $[9];
74
75
  }
75
76
  let t6;
76
- if ($[10] !== t3 || $[11] !== t5) {
77
+ if ($[10] !== selectRowLabel || $[11] !== t3 || $[12] !== t5) {
77
78
  t6 = _jsx(CheckboxInput, {
79
+ "aria-label": selectRowLabel,
78
80
  checked: t3,
79
81
  className: t4.join(" "),
80
82
  onToggle: t5,
81
83
  variant: "muted"
82
84
  });
83
- $[10] = t3;
84
- $[11] = t5;
85
- $[12] = t6;
85
+ $[10] = selectRowLabel;
86
+ $[11] = t3;
87
+ $[12] = t5;
88
+ $[13] = t6;
86
89
  } else {
87
- t6 = $[12];
90
+ t6 = $[13];
88
91
  }
89
92
  return t6;
90
93
  };
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","React","CheckboxInput","useAuth","useSelection","Locked","baseClass","SelectRow","t0","$","rowData","user","selected","setSelection","t1","id","Symbol","for","_isLocked","_userEditing","documentIsLocked","_jsx","t2","get","t3","Boolean","t4","t5","t6","checked","className","join","onToggle","variant"],"sources":["../../../src/elements/SelectRow/index.tsx"],"sourcesContent":["'use client'\nimport type { User } from 'payload'\n\nimport React from 'react'\n\nimport { CheckboxInput } from '../../fields/Checkbox/Input.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useSelection } from '../../providers/Selection/index.js'\nimport { Locked } from '../Locked/index.js'\nimport './index.css'\n\nconst baseClass = 'select-row'\n\nexport const SelectRow: React.FC<{\n rowData: {\n _isLocked: boolean\n _userEditing: User\n id: string\n }\n}> = ({ rowData }) => {\n const { user } = useAuth()\n const { selected, setSelection } = useSelection()\n const { _isLocked, _userEditing } = rowData || {}\n\n const documentIsLocked = _isLocked && _userEditing\n\n if (documentIsLocked && _userEditing.id !== user?.id) {\n return <Locked user={_userEditing} />\n }\n\n return (\n <CheckboxInput\n checked={Boolean(selected.get(rowData.id))}\n className={[baseClass, `${baseClass}__checkbox`].join(' ')}\n onToggle={() => setSelection(rowData.id)}\n variant=\"muted\"\n />\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,OAAOC,KAAA,MAAW;AAElB,SAASC,aAAa,QAAQ;AAC9B,SAASC,OAAO,QAAQ;AACxB,SAASC,YAAY,QAAQ;AAC7B,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,SAAA,GAMRC,EAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EAAC;IAAAU;EAAA,IAAAF,EAAW;EACf;IAAAG;EAAA,IAAiBR,OAAA;EACjB;IAAAS,QAAA;IAAAC;EAAA,IAAmCT,YAAA;EAAA,IAAAU,EAAA;EAAA,IAAAL,CAAA,QAAAC,OAAA,IAAAD,CAAA,QAAAE,IAAA,EAAAI,EAAA;IAM1BD,EAAA,GAAAE,MAAA,CAAAC,GAAA,8B;;MALT;QAAAC,SAAA;QAAAC;MAAA,IAAoCT,OAAA,MAAY;MAEhD,MAAAU,gBAAA,GAAyBF,SAAA,IAAaC,YAAA;MAAA,IAElCC,gBAAA,IAAoBD,YAAA,CAAAJ,EAAA,KAAoBJ,IAAA,EAAAI,EAAM;QACzCD,EAAA,GAAAO,IAAA,CAAAhB,MAAA;UAAAM,IAAA,EAAcQ;QAAA,C;;;;;;;;;;;;;;;IAKFG,EAAA,GAAAV,QAAA,CAAAW,GAAA,CAAab,OAAA,CAAAK,EAAU;IAAAN,CAAA,MAAAC,OAAA,CAAAK,EAAA;IAAAN,CAAA,MAAAG,QAAA;IAAAH,CAAA,MAAAa,EAAA;EAAA;IAAAA,EAAA,GAAAb,CAAA;EAAA;EAA/B,MAAAe,EAAA,GAAAC,OAAA,CAAQH,EAAuB;EAAA,IAAAI,EAAA;EAAA,IAAAjB,CAAA,QAAAO,MAAA,CAAAC,GAAA;IAC7BS,EAAA,IAAApB,SAAA,EAAY,GAAAA,SAAA,YAAwB;IAACG,CAAA,MAAAiB,EAAA;EAAA;IAAAA,EAAA,GAAAjB,CAAA;EAAA;EAAA,IAAAkB,EAAA;EAAA,IAAAlB,CAAA,QAAAC,OAAA,CAAAK,EAAA,IAAAN,CAAA,QAAAI,YAAA;IACtCc,EAAA,GAAAA,CAAA,KAAMd,YAAA,CAAaH,OAAA,CAAAK,EAAU;IAAAN,CAAA,MAAAC,OAAA,CAAAK,EAAA;IAAAN,CAAA,MAAAI,YAAA;IAAAJ,CAAA,MAAAkB,EAAA;EAAA;IAAAA,EAAA,GAAAlB,CAAA;EAAA;EAAA,IAAAmB,EAAA;EAAA,IAAAnB,CAAA,SAAAe,EAAA,IAAAf,CAAA,SAAAkB,EAAA;IAHzCC,EAAA,GAAAP,IAAA,CAAAnB,aAAA;MAAA2B,OAAA,EACWL,EAA+B;MAAAM,SAAA,EAC7BJ,EAAqC,CAAAK,IAAA,CAAM;MAAAC,QAAA,EAC5CL,EAA6B;MAAAM,OAAA,EAC/B;IAAA,C;;;;;;;SAJVL,E;CAOJ","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","React","CheckboxInput","useAuth","useSelection","Locked","baseClass","SelectRow","t0","$","rowData","selectRowLabel","user","selected","setSelection","t1","id","Symbol","for","_isLocked","_userEditing","documentIsLocked","_jsx","t2","get","t3","Boolean","t4","t5","t6","checked","className","join","onToggle","variant"],"sources":["../../../src/elements/SelectRow/index.tsx"],"sourcesContent":["'use client'\nimport type { User } from 'payload'\n\nimport React from 'react'\n\nimport { CheckboxInput } from '../../fields/Checkbox/Input.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useSelection } from '../../providers/Selection/index.js'\nimport { Locked } from '../Locked/index.js'\nimport './index.css'\n\nconst baseClass = 'select-row'\n\nexport const SelectRow: React.FC<{\n rowData: {\n _isLocked?: boolean\n _userEditing?: User\n id: number | string\n }\n selectRowLabel: string\n}> = ({ rowData, selectRowLabel }) => {\n const { user } = useAuth()\n const { selected, setSelection } = useSelection()\n const { _isLocked, _userEditing } = rowData || {}\n\n const documentIsLocked = _isLocked && _userEditing\n\n if (documentIsLocked && _userEditing.id !== user?.id) {\n return <Locked user={_userEditing} />\n }\n\n return (\n <CheckboxInput\n aria-label={selectRowLabel}\n checked={Boolean(selected.get(rowData.id))}\n className={[baseClass, `${baseClass}__checkbox`].join(' ')}\n onToggle={() => setSelection(rowData.id)}\n variant=\"muted\"\n />\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,OAAOC,KAAA,MAAW;AAElB,SAASC,aAAa,QAAQ;AAC9B,SAASC,OAAO,QAAQ;AACxB,SAASC,YAAY,QAAQ;AAC7B,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,SAAA,GAORC,EAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EAAC;IAAAU,OAAA;IAAAC;EAAA,IAAAH,EAA2B;EAC/B;IAAAI;EAAA,IAAiBT,OAAA;EACjB;IAAAU,QAAA;IAAAC;EAAA,IAAmCV,YAAA;EAAA,IAAAW,EAAA;EAAA,IAAAN,CAAA,QAAAC,OAAA,IAAAD,CAAA,QAAAG,IAAA,EAAAI,EAAA;IAM1BD,EAAA,GAAAE,MAAA,CAAAC,GAAA,8B;;MALT;QAAAC,SAAA;QAAAC;MAAA,IAAoCV,OAAA,MAAY;MAEhD,MAAAW,gBAAA,GAAyBF,SAAA,IAAaC,YAAA;MAAA,IAElCC,gBAAA,IAAoBD,YAAA,CAAAJ,EAAA,KAAoBJ,IAAA,EAAAI,EAAM;QACzCD,EAAA,GAAAO,IAAA,CAAAjB,MAAA;UAAAO,IAAA,EAAcQ;QAAA,C;;;;;;;;;;;;;;;IAMFG,EAAA,GAAAV,QAAA,CAAAW,GAAA,CAAad,OAAA,CAAAM,EAAU;IAAAP,CAAA,MAAAC,OAAA,CAAAM,EAAA;IAAAP,CAAA,MAAAI,QAAA;IAAAJ,CAAA,MAAAc,EAAA;EAAA;IAAAA,EAAA,GAAAd,CAAA;EAAA;EAA/B,MAAAgB,EAAA,GAAAC,OAAA,CAAQH,EAAuB;EAAA,IAAAI,EAAA;EAAA,IAAAlB,CAAA,QAAAQ,MAAA,CAAAC,GAAA;IAC7BS,EAAA,IAAArB,SAAA,EAAY,GAAAA,SAAA,YAAwB;IAACG,CAAA,MAAAkB,EAAA;EAAA;IAAAA,EAAA,GAAAlB,CAAA;EAAA;EAAA,IAAAmB,EAAA;EAAA,IAAAnB,CAAA,QAAAC,OAAA,CAAAM,EAAA,IAAAP,CAAA,QAAAK,YAAA;IACtCc,EAAA,GAAAA,CAAA,KAAMd,YAAA,CAAaJ,OAAA,CAAAM,EAAU;IAAAP,CAAA,MAAAC,OAAA,CAAAM,EAAA;IAAAP,CAAA,MAAAK,YAAA;IAAAL,CAAA,MAAAmB,EAAA;EAAA;IAAAA,EAAA,GAAAnB,CAAA;EAAA;EAAA,IAAAoB,EAAA;EAAA,IAAApB,CAAA,SAAAE,cAAA,IAAAF,CAAA,SAAAgB,EAAA,IAAAhB,CAAA,SAAAmB,EAAA;IAJzCC,EAAA,GAAAP,IAAA,CAAApB,aAAA;MAAA,cACcS,cAAA;MAAAmB,OAAA,EACHL,EAA+B;MAAAM,SAAA,EAC7BJ,EAAqC,CAAAK,IAAA,CAAM;MAAAC,QAAA,EAC5CL,EAA6B;MAAAM,OAAA,EAC/B;IAAA,C;;;;;;;;SALVL,E;CAQJ","ignoreList":[]}
@@ -11,7 +11,6 @@
11
11
  color: var(--color-icon);
12
12
  cursor: pointer;
13
13
  outline: none;
14
- transition: background-color 100ms ease;
15
14
 
16
15
  &:hover {
17
16
  background: var(--color-bg-hover);
@@ -26,20 +25,4 @@
26
25
  outline-offset: -1px;
27
26
  }
28
27
  }
29
-
30
- .sidebar-toggle .tooltip {
31
- left: 0;
32
- top: 100%;
33
- bottom: auto;
34
- transform: translate3d(0, var(--spacer-1), 0);
35
- }
36
-
37
- .sidebar-toggle .tooltip::after {
38
- top: 0;
39
- left: var(--spacer-3);
40
- bottom: auto;
41
- transform: translate3d(-50%, -100%, 0);
42
- border-bottom: var(--caret-size) solid var(--color-bg-inverse);
43
- border-top: none;
44
- }
45
28
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SortColumn/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,aAAa,CAAA;AAEpB,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC7C,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IAC/B,QAAQ,CAAC,KAAK,CAAC,EAAE,WAAW,CAAA;IAC5B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB,CAAA;AAID,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA+DhD,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SortColumn/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,aAAa,CAAA;AAEpB,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC7C,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IAC/B,QAAQ,CAAC,KAAK,CAAC,EAAE,WAAW,CAAA;IAC5B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB,CAAA;AAID,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAoEhD,CAAA"}
@@ -10,7 +10,7 @@ import { useTranslation } from '../../providers/Translation/index.js';
10
10
  import './index.css';
11
11
  const baseClass = 'sort-column';
12
12
  export const SortColumn = props => {
13
- const $ = _c(20);
13
+ const $ = _c(21);
14
14
  const {
15
15
  name,
16
16
  appearance,
@@ -56,22 +56,29 @@ export const SortColumn = props => {
56
56
  descClasses = $[5];
57
57
  }
58
58
  const isSorted = sort === asc || sort === desc;
59
- const t1 = appearance && `${baseClass}--appearance-${appearance}`;
60
- const t2 = isSorted && `${baseClass}--sorted`;
61
- let t3;
62
- if ($[6] !== t1 || $[7] !== t2) {
63
- t3 = [baseClass, t1, t2].filter(Boolean);
64
- $[6] = t1;
65
- $[7] = t2;
66
- $[8] = t3;
67
- } else {
68
- t3 = $[8];
69
- }
70
- const t4 = t3.join(" ");
71
- let t5;
72
- if ($[9] !== Label || $[10] !== asc || $[11] !== ascClasses || $[12] !== desc || $[13] !== descClasses || $[14] !== disable || $[15] !== handleSortChange || $[16] !== label || $[17] !== t || $[18] !== t4) {
73
- t5 = _jsxs("div", {
74
- className: t4,
59
+ let t1;
60
+ if ($[6] !== Label || $[7] !== appearance || $[8] !== asc || $[9] !== ascClasses || $[10] !== desc || $[11] !== descClasses || $[12] !== disable || $[13] !== handleSortChange || $[14] !== isSorted || $[15] !== label || $[16] !== t) {
61
+ const descLabel = t("general:sortByLabelDirection", {
62
+ direction: t("general:descending"),
63
+ label
64
+ });
65
+ const ascLabel = t("general:sortByLabelDirection", {
66
+ direction: t("general:ascending"),
67
+ label
68
+ });
69
+ const t2 = appearance && `${baseClass}--appearance-${appearance}`;
70
+ const t3 = isSorted && `${baseClass}--sorted`;
71
+ let t4;
72
+ if ($[18] !== t2 || $[19] !== t3) {
73
+ t4 = [baseClass, t2, t3].filter(Boolean);
74
+ $[18] = t2;
75
+ $[19] = t3;
76
+ $[20] = t4;
77
+ } else {
78
+ t4 = $[20];
79
+ }
80
+ t1 = _jsxs("div", {
81
+ className: t4.join(" "),
75
82
  children: [_jsx("span", {
76
83
  className: `${baseClass}__label`,
77
84
  children: Label ?? _jsx(FieldLabel, {
@@ -82,23 +89,19 @@ export const SortColumn = props => {
82
89
  }), !disable && _jsxs("div", {
83
90
  className: `${baseClass}__buttons`,
84
91
  children: [_jsx("button", {
85
- "aria-label": t("general:sortByLabelDirection", {
86
- direction: t("general:descending"),
87
- label
88
- }),
92
+ "aria-label": descLabel,
89
93
  className: [...descClasses, `${baseClass}__button`].filter(Boolean).join(" "),
90
94
  onClick: () => void handleSortChange(desc),
95
+ title: descLabel,
91
96
  type: "button",
92
97
  children: _jsx(ChevronIcon, {
93
98
  size: 16
94
99
  })
95
100
  }), _jsx("button", {
96
- "aria-label": t("general:sortByLabelDirection", {
97
- direction: t("general:ascending"),
98
- label
99
- }),
101
+ "aria-label": ascLabel,
100
102
  className: [...ascClasses, `${baseClass}__button`].filter(Boolean).join(" "),
101
103
  onClick: () => void handleSortChange(asc),
104
+ title: ascLabel,
102
105
  type: "button",
103
106
  children: _jsx(ChevronIcon, {
104
107
  direction: "up",
@@ -107,20 +110,21 @@ export const SortColumn = props => {
107
110
  })]
108
111
  })]
109
112
  });
110
- $[9] = Label;
111
- $[10] = asc;
112
- $[11] = ascClasses;
113
- $[12] = desc;
114
- $[13] = descClasses;
115
- $[14] = disable;
116
- $[15] = handleSortChange;
117
- $[16] = label;
118
- $[17] = t;
119
- $[18] = t4;
120
- $[19] = t5;
113
+ $[6] = Label;
114
+ $[7] = appearance;
115
+ $[8] = asc;
116
+ $[9] = ascClasses;
117
+ $[10] = desc;
118
+ $[11] = descClasses;
119
+ $[12] = disable;
120
+ $[13] = handleSortChange;
121
+ $[14] = isSorted;
122
+ $[15] = label;
123
+ $[16] = t;
124
+ $[17] = t1;
121
125
  } else {
122
- t5 = $[19];
126
+ t1 = $[17];
123
127
  }
124
- return t5;
128
+ return t1;
125
129
  };
126
130
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","React","FieldLabel","ChevronIcon","useListQuery","useTranslation","baseClass","SortColumn","props","$","name","appearance","disable","t0","Label","label","undefined","handleSortChange","query","t","sort","desc","asc","ascClasses","push","descClasses","isSorted","t1","t2","t3","filter","Boolean","t4","join","t5","_jsxs","className","children","_jsx","hideLocale","unstyled","direction","onClick","type","size"],"sources":["../../../src/elements/SortColumn/index.tsx"],"sourcesContent":["'use client'\nimport type { StaticLabel } from 'payload'\n\nimport React from 'react'\n\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.css'\n\nexport type SortColumnProps = {\n readonly appearance?: 'condensed' | 'default'\n readonly disable?: boolean\n readonly Label: React.ReactNode\n readonly label?: StaticLabel\n readonly name: string\n}\n\nconst baseClass = 'sort-column'\n\nexport const SortColumn: React.FC<SortColumnProps> = (props) => {\n const { name, appearance, disable = false, Label, label } = props\n const { handleSortChange, query } = useListQuery()\n const { t } = useTranslation()\n\n const { sort } = query\n\n const desc = `-${name}`\n const asc = name\n\n const ascClasses = [`${baseClass}__asc`]\n if (sort === asc) {\n ascClasses.push(`${baseClass}--active`)\n }\n\n const descClasses = [`${baseClass}__desc`]\n if (sort === desc) {\n descClasses.push(`${baseClass}--active`)\n }\n\n const isSorted = sort === asc || sort === desc\n\n return (\n <div\n className={[\n baseClass,\n appearance && `${baseClass}--appearance-${appearance}`,\n isSorted && `${baseClass}--sorted`,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <span className={`${baseClass}__label`}>\n {Label ?? <FieldLabel hideLocale label={label} unstyled />}\n </span>\n {!disable && (\n <div className={`${baseClass}__buttons`}>\n <button\n aria-label={t('general:sortByLabelDirection', {\n direction: t('general:descending'),\n label,\n })}\n className={[...descClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n onClick={() => void handleSortChange(desc)}\n type=\"button\"\n >\n <ChevronIcon size={16} />\n </button>\n <button\n aria-label={t('general:sortByLabelDirection', {\n direction: t('general:ascending'),\n label,\n })}\n className={[...ascClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n onClick={() => void handleSortChange(asc)}\n type=\"button\"\n >\n <ChevronIcon direction=\"up\" size={16} />\n </button>\n </div>\n )}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","React","FieldLabel","ChevronIcon","useListQuery","useTranslation","baseClass","SortColumn","props","$","name","appearance","disable","t0","Label","label","undefined","handleSortChange","query","t","sort","desc","asc","ascClasses","push","descClasses","isSorted","t1","descLabel","direction","ascLabel","t2","t3","t4","filter","Boolean","_jsxs","className","join","children","_jsx","hideLocale","unstyled","onClick","title","type","size"],"sources":["../../../src/elements/SortColumn/index.tsx"],"sourcesContent":["'use client'\nimport type { StaticLabel } from 'payload'\n\nimport React from 'react'\n\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.css'\n\nexport type SortColumnProps = {\n readonly appearance?: 'condensed' | 'default'\n readonly disable?: boolean\n readonly Label: React.ReactNode\n readonly label?: StaticLabel\n readonly name: string\n}\n\nconst baseClass = 'sort-column'\n\nexport const SortColumn: React.FC<SortColumnProps> = (props) => {\n const { name, appearance, disable = false, Label, label } = props\n const { handleSortChange, query } = useListQuery()\n const { t } = useTranslation()\n\n const { sort } = query\n\n const desc = `-${name}`\n const asc = name\n\n const ascClasses = [`${baseClass}__asc`]\n if (sort === asc) {\n ascClasses.push(`${baseClass}--active`)\n }\n\n const descClasses = [`${baseClass}__desc`]\n if (sort === desc) {\n descClasses.push(`${baseClass}--active`)\n }\n\n const isSorted = sort === asc || sort === desc\n\n const descLabel = t('general:sortByLabelDirection', {\n direction: t('general:descending'),\n label,\n })\n const ascLabel = t('general:sortByLabelDirection', {\n direction: t('general:ascending'),\n label,\n })\n\n return (\n <div\n className={[\n baseClass,\n appearance && `${baseClass}--appearance-${appearance}`,\n isSorted && `${baseClass}--sorted`,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <span className={`${baseClass}__label`}>\n {Label ?? <FieldLabel hideLocale label={label} unstyled />}\n </span>\n {!disable && (\n <div className={`${baseClass}__buttons`}>\n <button\n aria-label={descLabel}\n className={[...descClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n onClick={() => void handleSortChange(desc)}\n title={descLabel}\n type=\"button\"\n >\n <ChevronIcon size={16} />\n </button>\n <button\n aria-label={ascLabel}\n className={[...ascClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n onClick={() => void handleSortChange(asc)}\n title={ascLabel}\n type=\"button\"\n >\n <ChevronIcon direction=\"up\" size={16} />\n </button>\n </div>\n )}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -6,8 +6,10 @@ export type Props = {
6
6
  readonly columns: Column[];
7
7
  readonly dragAttributes?: HTMLAttributes<unknown>;
8
8
  readonly dragListeners?: DraggableSyntheticListeners;
9
+ readonly isOrderable?: boolean;
10
+ readonly onDisabledDragAttempt?: () => void;
9
11
  readonly ref?: Ref<HTMLTableRowElement>;
10
12
  readonly rowId: number | string;
11
13
  } & HTMLAttributes<HTMLTableRowElement>;
12
- export declare const OrderableRow: ({ cellMap, columns, dragAttributes, dragListeners, rowId, ...rest }: Props) => import("react").JSX.Element;
14
+ export declare const OrderableRow: ({ cellMap, columns, dragAttributes, dragListeners, isOrderable, onDisabledDragAttempt, rowId, ...rest }: Props) => import("react").JSX.Element;
13
15
  //# sourceMappingURL=OrderableRow.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"OrderableRow.d.ts","sourceRoot":"","sources":["../../../src/elements/Table/OrderableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,eAAe,CAAA;AAChE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AACrC,OAAO,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAEhD,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACxC,QAAQ,CAAC,OAAO,EAAE,MAAM,EAAE,CAAA;IAC1B,QAAQ,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IACjD,QAAQ,CAAC,aAAa,CAAC,EAAE,2BAA2B,CAAA;IACpD,QAAQ,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAA;IACvC,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;CAChC,GAAG,cAAc,CAAC,mBAAmB,CAAC,CAAA;AAEvC,eAAO,MAAM,YAAY,wEAOtB,KAAK,gCA+BP,CAAA"}
1
+ {"version":3,"file":"OrderableRow.d.ts","sourceRoot":"","sources":["../../../src/elements/Table/OrderableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,eAAe,CAAA;AAChE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AACrC,OAAO,KAAK,EAAE,cAAc,EAAiB,GAAG,EAAE,MAAM,OAAO,CAAA;AAE/D,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACxC,QAAQ,CAAC,OAAO,EAAE,MAAM,EAAE,CAAA;IAC1B,QAAQ,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IACjD,QAAQ,CAAC,aAAa,CAAC,EAAE,2BAA2B,CAAA;IACpD,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3C,QAAQ,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAA;IACvC,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;CAChC,GAAG,cAAc,CAAC,mBAAmB,CAAC,CAAA;AAEvC,eAAO,MAAM,YAAY,4GAStB,KAAK,gCA+CP,CAAA"}
@@ -4,6 +4,8 @@ export const OrderableRow = ({
4
4
  columns,
5
5
  dragAttributes = {},
6
6
  dragListeners = {},
7
+ isOrderable = true,
8
+ onDisabledDragAttempt,
7
9
  rowId,
8
10
  ...rest
9
11
  }) => /*#__PURE__*/_jsx("tr", {
@@ -16,11 +18,25 @@ export const OrderableRow = ({
16
18
  const cell = col.renderedCells[cellMap[rowId]];
17
19
  // For drag handles, wrap in div with drag attributes
18
20
  if (accessor === '_dragHandle') {
21
+ // When not orderable, dnd-kit's own drag listeners are disabled, so pressing the keys
22
+ // it would normally use to start a drag does nothing silently. Intercept them here to
23
+ // tell the user why instead.
24
+ const dragHandleListeners = {
25
+ ...dragListeners,
26
+ onKeyDown: event => {
27
+ if (!isOrderable && (event.code === 'Space' || event.code === 'Enter')) {
28
+ event.preventDefault();
29
+ onDisabledDragAttempt?.();
30
+ return;
31
+ }
32
+ dragListeners?.onKeyDown?.(event);
33
+ }
34
+ };
19
35
  return /*#__PURE__*/_jsx("td", {
20
36
  className: `cell-${accessor}`,
21
37
  children: /*#__PURE__*/_jsx("div", {
22
38
  ...dragAttributes,
23
- ...dragListeners,
39
+ ...dragHandleListeners,
24
40
  children: cell
25
41
  })
26
42
  }, colIndex);
@@ -1 +1 @@
1
- {"version":3,"file":"OrderableRow.js","names":["OrderableRow","cellMap","columns","dragAttributes","dragListeners","rowId","rest","_jsx","map","col","colIndex","accessor","cell","renderedCells","className","isLinkedColumn","filter","Boolean","join"],"sources":["../../../src/elements/Table/OrderableRow.tsx"],"sourcesContent":["import type { DraggableSyntheticListeners } from '@dnd-kit/core'\nimport type { Column } from 'payload'\nimport type { HTMLAttributes, Ref } from 'react'\n\nexport type Props = {\n readonly cellMap: Record<string, number>\n readonly columns: Column[]\n readonly dragAttributes?: HTMLAttributes<unknown>\n readonly dragListeners?: DraggableSyntheticListeners\n readonly ref?: Ref<HTMLTableRowElement>\n readonly rowId: number | string\n} & HTMLAttributes<HTMLTableRowElement>\n\nexport const OrderableRow = ({\n cellMap,\n columns,\n dragAttributes = {},\n dragListeners = {},\n rowId,\n ...rest\n}: Props) => (\n <tr {...rest}>\n {columns.map((col, colIndex) => {\n const { accessor } = col\n\n // Use the cellMap to find which index in the renderedCells to use\n const cell = col.renderedCells[cellMap[rowId]]\n\n // For drag handles, wrap in div with drag attributes\n if (accessor === '_dragHandle') {\n return (\n <td className={`cell-${accessor}`} key={colIndex}>\n <div {...dragAttributes} {...dragListeners}>\n {cell}\n </div>\n </td>\n )\n }\n\n return (\n <td\n className={[`cell-${accessor}`, col.isLinkedColumn && 'cell--linked']\n .filter(Boolean)\n .join(' ')}\n key={colIndex}\n >\n {cell}\n </td>\n )\n })}\n </tr>\n)\n"],"mappings":";AAaA,OAAO,MAAMA,YAAA,GAAeA,CAAC;EAC3BC,OAAO;EACPC,OAAO;EACPC,cAAA,GAAiB,CAAC,CAAC;EACnBC,aAAA,GAAgB,CAAC,CAAC;EAClBC,KAAK;EACL,GAAGC;AAAA,CACG,kBACNC,IAAA,CAAC;EAAI,GAAGD,IAAI;YACTJ,OAAA,CAAQM,GAAG,CAAC,CAACC,GAAA,EAAKC,QAAA;IACjB,MAAM;MAAEC;IAAQ,CAAE,GAAGF,GAAA;IAErB;IACA,MAAMG,IAAA,GAAOH,GAAA,CAAII,aAAa,CAACZ,OAAO,CAACI,KAAA,CAAM,CAAC;IAE9C;IACA,IAAIM,QAAA,KAAa,eAAe;MAC9B,oBACEJ,IAAA,CAAC;QAAGO,SAAA,EAAW,QAAQH,QAAA,EAAU;kBAC/B,aAAAJ,IAAA,CAAC;UAAK,GAAGJ,cAAc;UAAG,GAAGC,aAAa;oBACvCQ;;SAFmCF,QAAA;IAM5C;IAEA,oBACEH,IAAA,CAAC;MACCO,SAAA,EAAW,CAAC,QAAQH,QAAA,EAAU,EAAEF,GAAA,CAAIM,cAAc,IAAI,eAAe,CAClEC,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;gBAGPN;OAFIF,QAAA;EAKX","ignoreList":[]}
1
+ {"version":3,"file":"OrderableRow.js","names":["OrderableRow","cellMap","columns","dragAttributes","dragListeners","isOrderable","onDisabledDragAttempt","rowId","rest","_jsx","map","col","colIndex","accessor","cell","renderedCells","dragHandleListeners","onKeyDown","event","code","preventDefault","className","isLinkedColumn","filter","Boolean","join"],"sources":["../../../src/elements/Table/OrderableRow.tsx"],"sourcesContent":["import type { DraggableSyntheticListeners } from '@dnd-kit/core'\nimport type { Column } from 'payload'\nimport type { HTMLAttributes, KeyboardEvent, Ref } from 'react'\n\nexport type Props = {\n readonly cellMap: Record<string, number>\n readonly columns: Column[]\n readonly dragAttributes?: HTMLAttributes<unknown>\n readonly dragListeners?: DraggableSyntheticListeners\n readonly isOrderable?: boolean\n readonly onDisabledDragAttempt?: () => void\n readonly ref?: Ref<HTMLTableRowElement>\n readonly rowId: number | string\n} & HTMLAttributes<HTMLTableRowElement>\n\nexport const OrderableRow = ({\n cellMap,\n columns,\n dragAttributes = {},\n dragListeners = {},\n isOrderable = true,\n onDisabledDragAttempt,\n rowId,\n ...rest\n}: Props) => (\n <tr {...rest}>\n {columns.map((col, colIndex) => {\n const { accessor } = col\n\n // Use the cellMap to find which index in the renderedCells to use\n const cell = col.renderedCells[cellMap[rowId]]\n\n // For drag handles, wrap in div with drag attributes\n if (accessor === '_dragHandle') {\n // When not orderable, dnd-kit's own drag listeners are disabled, so pressing the keys\n // it would normally use to start a drag does nothing silently. Intercept them here to\n // tell the user why instead.\n const dragHandleListeners = {\n ...dragListeners,\n onKeyDown: (event: KeyboardEvent) => {\n if (!isOrderable && (event.code === 'Space' || event.code === 'Enter')) {\n event.preventDefault()\n onDisabledDragAttempt?.()\n return\n }\n\n dragListeners?.onKeyDown?.(event)\n },\n }\n\n return (\n <td className={`cell-${accessor}`} key={colIndex}>\n <div {...dragAttributes} {...dragHandleListeners}>\n {cell}\n </div>\n </td>\n )\n }\n\n return (\n <td\n className={[`cell-${accessor}`, col.isLinkedColumn && 'cell--linked']\n .filter(Boolean)\n .join(' ')}\n key={colIndex}\n >\n {cell}\n </td>\n )\n })}\n </tr>\n)\n"],"mappings":";AAeA,OAAO,MAAMA,YAAA,GAAeA,CAAC;EAC3BC,OAAO;EACPC,OAAO;EACPC,cAAA,GAAiB,CAAC,CAAC;EACnBC,aAAA,GAAgB,CAAC,CAAC;EAClBC,WAAA,GAAc,IAAI;EAClBC,qBAAqB;EACrBC,KAAK;EACL,GAAGC;AAAA,CACG,kBACNC,IAAA,CAAC;EAAI,GAAGD,IAAI;YACTN,OAAA,CAAQQ,GAAG,CAAC,CAACC,GAAA,EAAKC,QAAA;IACjB,MAAM;MAAEC;IAAQ,CAAE,GAAGF,GAAA;IAErB;IACA,MAAMG,IAAA,GAAOH,GAAA,CAAII,aAAa,CAACd,OAAO,CAACM,KAAA,CAAM,CAAC;IAE9C;IACA,IAAIM,QAAA,KAAa,eAAe;MAC9B;MACA;MACA;MACA,MAAMG,mBAAA,GAAsB;QAC1B,GAAGZ,aAAa;QAChBa,SAAA,EAAYC,KAAA;UACV,IAAI,CAACb,WAAA,KAAgBa,KAAA,CAAMC,IAAI,KAAK,WAAWD,KAAA,CAAMC,IAAI,KAAK,OAAM,GAAI;YACtED,KAAA,CAAME,cAAc;YACpBd,qBAAA;YACA;UACF;UAEAF,aAAA,EAAea,SAAA,GAAYC,KAAA;QAC7B;MACF;MAEA,oBACET,IAAA,CAAC;QAAGY,SAAA,EAAW,QAAQR,QAAA,EAAU;kBAC/B,aAAAJ,IAAA,CAAC;UAAK,GAAGN,cAAc;UAAG,GAAGa,mBAAmB;oBAC7CF;;SAFmCF,QAAA;IAM5C;IAEA,oBACEH,IAAA,CAAC;MACCY,SAAA,EAAW,CAAC,QAAQR,QAAA,EAAU,EAAEF,GAAA,CAAIW,cAAc,IAAI,eAAe,CAClEC,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;gBAGPX;OAFIF,QAAA;EAKX","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"OrderableTable.d.ts","sourceRoot":"","sources":["../../../src/elements/Table/OrderableTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,EAAyB,MAAM,SAAS,CAAA;AAEpF,OAAO,aAAa,CAAA;AAIpB,OAAO,KAA8B,MAAM,OAAO,CAAA;AAalD,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC7C,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,UAAU,EAAE,sBAAsB,CAAA;IAC3C,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAC3B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAA;IACxC,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACnC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmM1C,CAAA"}
1
+ {"version":3,"file":"OrderableTable.d.ts","sourceRoot":"","sources":["../../../src/elements/Table/OrderableTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,EAAyB,MAAM,SAAS,CAAA;AAEpF,OAAO,aAAa,CAAA;AAIpB,OAAO,KAA8B,MAAM,OAAO,CAAA;AAiBlD,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,UAAU,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;IAC7C,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,UAAU,EAAE,sBAAsB,CAAA;IAC3C,QAAQ,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAC3B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAA;IACxC,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACnC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAgN1C,CAAA"}
@@ -9,11 +9,14 @@ import { toast } from 'sonner';
9
9
  import { useConfig } from '../../providers/Config/index.js';
10
10
  import { useListQuery } from '../../providers/ListQuery/index.js';
11
11
  import { useLocale } from '../../providers/Locale/index.js';
12
+ import { useTranslation } from '../../providers/Translation/index.js';
12
13
  import { DraggableSortableItem } from '../DraggableSortable/DraggableSortableItem/index.js';
13
14
  import { DraggableSortable } from '../DraggableSortable/index.js';
14
15
  import { OrderableRow } from './OrderableRow.js';
15
16
  import { OrderableRowDragPreview } from './OrderableRowDragPreview.js';
16
17
  const baseClass = 'table';
18
+ // A stable id so repeated attempts (e.g. holding Space) update the same toast instead of stacking new ones
19
+ const mustSortByOrderToastId = 'orderable-table-must-sort-by-order';
17
20
  export const OrderableTable = ({
18
21
  appearance = 'default',
19
22
  BeforeTable,
@@ -32,8 +35,12 @@ export const OrderableTable = ({
32
35
  const {
33
36
  code: localeCode
34
37
  } = useLocale();
38
+ const {
39
+ t
40
+ } = useTranslation();
35
41
  // Use the data from ListQueryProvider if available, otherwise use the props
36
42
  const serverData = listQueryData?.docs || initialData;
43
+ const isOrderable = query.sort === orderableFieldName || query.sort === `-${orderableFieldName}`;
37
44
  // Local state to track the current order of rows
38
45
  const [localData, setLocalData] = useState(serverData);
39
46
  // id -> index for each column
@@ -54,8 +61,10 @@ export const OrderableTable = ({
54
61
  moveFromIndex,
55
62
  moveToIndex
56
63
  }) => {
57
- if (query.sort !== orderableFieldName && query.sort !== `-${orderableFieldName}`) {
58
- toast.warning('To reorder the rows you must first sort them by the "Order" column');
64
+ if (!isOrderable) {
65
+ toast.warning(t('general:sortByOrderToReorder'), {
66
+ id: mustSortByOrderToastId
67
+ });
59
68
  setDragActiveRowId(undefined);
60
69
  return;
61
70
  }
@@ -127,6 +136,11 @@ export const OrderableTable = ({
127
136
  }) => {
128
137
  setDragActiveRowId(id);
129
138
  };
139
+ const handleDisabledDragAttempt = () => {
140
+ toast.warning(t('general:sortByOrderToReorder'), {
141
+ id: mustSortByOrderToastId
142
+ });
143
+ };
130
144
  const rowIds = localData.map(row => row.id ?? row._id);
131
145
  return /*#__PURE__*/_jsxs("div", {
132
146
  className: [baseClass, appearance && `${baseClass}--appearance-${appearance}`].filter(Boolean).join(' '),
@@ -146,6 +160,7 @@ export const OrderableTable = ({
146
160
  })
147
161
  }), /*#__PURE__*/_jsx("tbody", {
148
162
  children: localData.map((row_0, rowIndex) => /*#__PURE__*/_jsx(DraggableSortableItem, {
163
+ disabled: !isOrderable,
149
164
  id: rowIds[rowIndex],
150
165
  children: ({
151
166
  attributes,
@@ -160,6 +175,8 @@ export const OrderableTable = ({
160
175
  columns: activeColumns,
161
176
  dragAttributes: attributes,
162
177
  dragListeners: listeners,
178
+ isOrderable: isOrderable,
179
+ onDisabledDragAttempt: handleDisabledDragAttempt,
163
180
  ref: setNodeRef,
164
181
  rowId: row_0.id ?? row_0._id,
165
182
  style: {
@@ -1 +1 @@
1
- {"version":3,"file":"OrderableTable.js","names":["DragOverlay","formatAdminURL","React","useEffect","useState","toast","useConfig","useListQuery","useLocale","DraggableSortableItem","DraggableSortable","OrderableRow","OrderableRowDragPreview","baseClass","OrderableTable","appearance","BeforeTable","collection","columns","data","initialData","config","listQueryData","orderableFieldName","query","code","localeCode","serverData","docs","localData","setLocalData","cellMap","setCellMap","dragActiveRowId","setDragActiveRowId","Object","fromEntries","map","item","index","String","id","_id","activeColumns","filter","col","active","includes","accessor","length","_jsx","handleDragEnd","moveFromIndex","moveToIndex","sort","warning","undefined","movedId","newBeforeRow","newAfterRow","previousData","currentData","newData","splice","target","key","newKeyWillBe","jsonBody","collectionSlug","slug","docsToMove","response","fetch","apiRoute","routes","api","path","body","JSON","stringify","credentials","headers","method","status","Error","ok","json","err","error","message","handleDragStart","rowIds","row","_jsxs","className","Boolean","join","ids","onDragEnd","onDragStart","cellPadding","cellSpacing","i","Heading","rowIndex","children","attributes","isDragging","listeners","setNodeRef","transform","transition","dragAttributes","dragListeners","ref","rowId","style","opacity"],"sources":["../../../src/elements/Table/OrderableTable.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig, Column, OrderableEndpointBody } from 'payload'\n\nimport './index.css'\n\nimport { DragOverlay } from '@dnd-kit/core'\nimport { formatAdminURL } from 'payload/shared'\nimport React, { useEffect, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { DraggableSortableItem } from '../DraggableSortable/DraggableSortableItem/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { OrderableRow } from './OrderableRow.js'\nimport { OrderableRowDragPreview } from './OrderableRowDragPreview.js'\n\nconst baseClass = 'table'\n\nexport type Props = {\n readonly appearance?: 'condensed' | 'default'\n readonly BeforeTable?: React.ReactNode\n readonly collection: ClientCollectionConfig\n readonly columns?: Column[]\n readonly data: Record<string, unknown>[]\n readonly heading?: React.ReactNode\n}\n\nexport const OrderableTable: React.FC<Props> = ({\n appearance = 'default',\n BeforeTable,\n collection,\n columns,\n data: initialData,\n}) => {\n const { config } = useConfig()\n const { data: listQueryData, orderableFieldName, query } = useListQuery()\n const { code: localeCode } = useLocale()\n // Use the data from ListQueryProvider if available, otherwise use the props\n const serverData = listQueryData?.docs || initialData\n\n // Local state to track the current order of rows\n const [localData, setLocalData] = useState(serverData)\n\n // id -> index for each column\n const [cellMap, setCellMap] = useState<Record<string, number>>({})\n\n const [dragActiveRowId, setDragActiveRowId] = useState<number | string | undefined>()\n\n // Update local data when server data changes\n useEffect(() => {\n setLocalData(serverData)\n setCellMap(\n Object.fromEntries(serverData.map((item, index) => [String(item.id ?? item._id), index])),\n )\n }, [serverData])\n\n const activeColumns = columns?.filter((col) => col?.active)\n\n if (\n !activeColumns ||\n activeColumns.filter((col) => !['_dragHandle', '_select'].includes(col.accessor)).length === 0\n ) {\n return <div>No columns selected</div>\n }\n\n const handleDragEnd = async ({ moveFromIndex, moveToIndex }) => {\n if (query.sort !== orderableFieldName && query.sort !== `-${orderableFieldName}`) {\n toast.warning('To reorder the rows you must first sort them by the \"Order\" column')\n setDragActiveRowId(undefined)\n return\n }\n\n if (moveFromIndex === moveToIndex) {\n setDragActiveRowId(undefined)\n return\n }\n\n const movedId = localData[moveFromIndex].id ?? localData[moveFromIndex]._id\n const newBeforeRow =\n moveToIndex > moveFromIndex ? localData[moveToIndex] : localData[moveToIndex - 1]\n const newAfterRow =\n moveToIndex > moveFromIndex ? localData[moveToIndex + 1] : localData[moveToIndex]\n\n // Store the original data for rollback\n const previousData = [...localData]\n\n // Optimisitc update of local state to reorder the rows\n setLocalData((currentData) => {\n const newData = [...currentData]\n // Update the rendered cell for the moved row to show \"pending\"\n newData[moveFromIndex][orderableFieldName] = `pending`\n // Move the item in the array\n newData.splice(moveToIndex, 0, newData.splice(moveFromIndex, 1)[0])\n return newData\n })\n\n try {\n const target: OrderableEndpointBody['target'] = newBeforeRow\n ? {\n id: newBeforeRow.id ?? newBeforeRow._id,\n key: newBeforeRow[orderableFieldName],\n }\n : {\n id: newAfterRow.id ?? newAfterRow._id,\n key: newAfterRow[orderableFieldName],\n }\n\n const newKeyWillBe =\n (newBeforeRow && query.sort === orderableFieldName) ||\n (!newBeforeRow && query.sort === `-${orderableFieldName}`)\n ? 'greater'\n : 'less'\n\n const jsonBody: OrderableEndpointBody = {\n collectionSlug: collection.slug,\n docsToMove: [movedId],\n newKeyWillBe,\n orderableFieldName,\n target,\n }\n\n const response = await fetch(\n formatAdminURL({\n apiRoute: config.routes.api,\n path: `/reorder?locale=${localeCode}`,\n }),\n {\n body: JSON.stringify(jsonBody),\n credentials: 'include',\n headers: {\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n },\n )\n\n if (response.status === 403) {\n throw new Error('You do not have permission to reorder these rows')\n }\n\n if (!response.ok) {\n throw new Error(\n 'Failed to reorder. This can happen if you reorder several rows too quickly. Please try again.',\n )\n }\n\n if (response.status === 200 && (await response.json())['message'] === 'initial migration') {\n throw new Error(\n 'You have enabled \"orderable\" on a collection with existing documents' +\n 'and this is the first time you have sorted documents. We have run an automatic migration ' +\n 'to add an initial order to the documents. Please refresh the page and try again.',\n )\n }\n } catch (err) {\n const error = err instanceof Error ? err.message : String(err)\n // Rollback to previous state if the request fails\n setLocalData(previousData)\n toast.error(error)\n } finally {\n setDragActiveRowId(undefined)\n }\n }\n\n const handleDragStart = ({ id }) => {\n setDragActiveRowId(id)\n }\n\n const rowIds = localData.map((row) => row.id ?? row._id)\n\n return (\n <div\n className={[baseClass, appearance && `${baseClass}--appearance-${appearance}`]\n .filter(Boolean)\n .join(' ')}\n >\n {BeforeTable}\n <DraggableSortable ids={rowIds} onDragEnd={handleDragEnd} onDragStart={handleDragStart}>\n <table cellPadding=\"0\" cellSpacing=\"0\">\n <thead>\n <tr>\n {activeColumns.map((col, i) => (\n <th id={`heading-${col.accessor}`} key={i}>\n {col.Heading}\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {localData.map((row, rowIndex) => (\n <DraggableSortableItem id={rowIds[rowIndex]} key={rowIds[rowIndex]}>\n {({ attributes, isDragging, listeners, setNodeRef, transform, transition }) => (\n <OrderableRow\n cellMap={cellMap}\n className={`row-${rowIndex + 1}`}\n columns={activeColumns}\n dragAttributes={attributes}\n dragListeners={listeners}\n ref={setNodeRef}\n rowId={row.id ?? row._id}\n style={{\n opacity: isDragging ? 0 : 1,\n transform,\n transition,\n }}\n />\n )}\n </DraggableSortableItem>\n ))}\n </tbody>\n </table>\n\n <DragOverlay>\n <OrderableRowDragPreview\n className={[baseClass, `${baseClass}--drag-preview`].join(' ')}\n rowId={dragActiveRowId}\n >\n <OrderableRow cellMap={cellMap} columns={activeColumns} rowId={dragActiveRowId} />\n </OrderableRowDragPreview>\n </DragOverlay>\n </DraggableSortable>\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"OrderableTable.js","names":["DragOverlay","formatAdminURL","React","useEffect","useState","toast","useConfig","useListQuery","useLocale","useTranslation","DraggableSortableItem","DraggableSortable","OrderableRow","OrderableRowDragPreview","baseClass","mustSortByOrderToastId","OrderableTable","appearance","BeforeTable","collection","columns","data","initialData","config","listQueryData","orderableFieldName","query","code","localeCode","t","serverData","docs","isOrderable","sort","localData","setLocalData","cellMap","setCellMap","dragActiveRowId","setDragActiveRowId","Object","fromEntries","map","item","index","String","id","_id","activeColumns","filter","col","active","includes","accessor","length","_jsx","handleDragEnd","moveFromIndex","moveToIndex","warning","undefined","movedId","newBeforeRow","newAfterRow","previousData","currentData","newData","splice","target","key","newKeyWillBe","jsonBody","collectionSlug","slug","docsToMove","response","fetch","apiRoute","routes","api","path","body","JSON","stringify","credentials","headers","method","status","Error","ok","json","err","error","message","handleDragStart","handleDisabledDragAttempt","rowIds","row","_jsxs","className","Boolean","join","ids","onDragEnd","onDragStart","cellPadding","cellSpacing","i","Heading","rowIndex","disabled","children","attributes","isDragging","listeners","setNodeRef","transform","transition","dragAttributes","dragListeners","onDisabledDragAttempt","ref","rowId","style","opacity"],"sources":["../../../src/elements/Table/OrderableTable.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig, Column, OrderableEndpointBody } from 'payload'\n\nimport './index.css'\n\nimport { DragOverlay } from '@dnd-kit/core'\nimport { formatAdminURL } from 'payload/shared'\nimport React, { useEffect, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { DraggableSortableItem } from '../DraggableSortable/DraggableSortableItem/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { OrderableRow } from './OrderableRow.js'\nimport { OrderableRowDragPreview } from './OrderableRowDragPreview.js'\n\nconst baseClass = 'table'\n\n// A stable id so repeated attempts (e.g. holding Space) update the same toast instead of stacking new ones\nconst mustSortByOrderToastId = 'orderable-table-must-sort-by-order'\n\nexport type Props = {\n readonly appearance?: 'condensed' | 'default'\n readonly BeforeTable?: React.ReactNode\n readonly collection: ClientCollectionConfig\n readonly columns?: Column[]\n readonly data: Record<string, unknown>[]\n readonly heading?: React.ReactNode\n}\n\nexport const OrderableTable: React.FC<Props> = ({\n appearance = 'default',\n BeforeTable,\n collection,\n columns,\n data: initialData,\n}) => {\n const { config } = useConfig()\n const { data: listQueryData, orderableFieldName, query } = useListQuery()\n const { code: localeCode } = useLocale()\n const { t } = useTranslation()\n // Use the data from ListQueryProvider if available, otherwise use the props\n const serverData = listQueryData?.docs || initialData\n\n const isOrderable = query.sort === orderableFieldName || query.sort === `-${orderableFieldName}`\n\n // Local state to track the current order of rows\n const [localData, setLocalData] = useState(serverData)\n\n // id -> index for each column\n const [cellMap, setCellMap] = useState<Record<string, number>>({})\n\n const [dragActiveRowId, setDragActiveRowId] = useState<number | string | undefined>()\n\n // Update local data when server data changes\n useEffect(() => {\n setLocalData(serverData)\n setCellMap(\n Object.fromEntries(serverData.map((item, index) => [String(item.id ?? item._id), index])),\n )\n }, [serverData])\n\n const activeColumns = columns?.filter((col) => col?.active)\n\n if (\n !activeColumns ||\n activeColumns.filter((col) => !['_dragHandle', '_select'].includes(col.accessor)).length === 0\n ) {\n return <div>No columns selected</div>\n }\n\n const handleDragEnd = async ({ moveFromIndex, moveToIndex }) => {\n if (!isOrderable) {\n toast.warning(t('general:sortByOrderToReorder'), { id: mustSortByOrderToastId })\n setDragActiveRowId(undefined)\n return\n }\n\n if (moveFromIndex === moveToIndex) {\n setDragActiveRowId(undefined)\n return\n }\n\n const movedId = localData[moveFromIndex].id ?? localData[moveFromIndex]._id\n const newBeforeRow =\n moveToIndex > moveFromIndex ? localData[moveToIndex] : localData[moveToIndex - 1]\n const newAfterRow =\n moveToIndex > moveFromIndex ? localData[moveToIndex + 1] : localData[moveToIndex]\n\n // Store the original data for rollback\n const previousData = [...localData]\n\n // Optimisitc update of local state to reorder the rows\n setLocalData((currentData) => {\n const newData = [...currentData]\n // Update the rendered cell for the moved row to show \"pending\"\n newData[moveFromIndex][orderableFieldName] = `pending`\n // Move the item in the array\n newData.splice(moveToIndex, 0, newData.splice(moveFromIndex, 1)[0])\n return newData\n })\n\n try {\n const target: OrderableEndpointBody['target'] = newBeforeRow\n ? {\n id: newBeforeRow.id ?? newBeforeRow._id,\n key: newBeforeRow[orderableFieldName],\n }\n : {\n id: newAfterRow.id ?? newAfterRow._id,\n key: newAfterRow[orderableFieldName],\n }\n\n const newKeyWillBe =\n (newBeforeRow && query.sort === orderableFieldName) ||\n (!newBeforeRow && query.sort === `-${orderableFieldName}`)\n ? 'greater'\n : 'less'\n\n const jsonBody: OrderableEndpointBody = {\n collectionSlug: collection.slug,\n docsToMove: [movedId],\n newKeyWillBe,\n orderableFieldName,\n target,\n }\n\n const response = await fetch(\n formatAdminURL({\n apiRoute: config.routes.api,\n path: `/reorder?locale=${localeCode}`,\n }),\n {\n body: JSON.stringify(jsonBody),\n credentials: 'include',\n headers: {\n 'Content-Type': 'application/json',\n },\n method: 'POST',\n },\n )\n\n if (response.status === 403) {\n throw new Error('You do not have permission to reorder these rows')\n }\n\n if (!response.ok) {\n throw new Error(\n 'Failed to reorder. This can happen if you reorder several rows too quickly. Please try again.',\n )\n }\n\n if (response.status === 200 && (await response.json())['message'] === 'initial migration') {\n throw new Error(\n 'You have enabled \"orderable\" on a collection with existing documents' +\n 'and this is the first time you have sorted documents. We have run an automatic migration ' +\n 'to add an initial order to the documents. Please refresh the page and try again.',\n )\n }\n } catch (err) {\n const error = err instanceof Error ? err.message : String(err)\n // Rollback to previous state if the request fails\n setLocalData(previousData)\n toast.error(error)\n } finally {\n setDragActiveRowId(undefined)\n }\n }\n\n const handleDragStart = ({ id }) => {\n setDragActiveRowId(id)\n }\n\n const handleDisabledDragAttempt = () => {\n toast.warning(t('general:sortByOrderToReorder'), { id: mustSortByOrderToastId })\n }\n\n const rowIds = localData.map((row) => row.id ?? row._id)\n\n return (\n <div\n className={[baseClass, appearance && `${baseClass}--appearance-${appearance}`]\n .filter(Boolean)\n .join(' ')}\n >\n {BeforeTable}\n <DraggableSortable ids={rowIds} onDragEnd={handleDragEnd} onDragStart={handleDragStart}>\n <table cellPadding=\"0\" cellSpacing=\"0\">\n <thead>\n <tr>\n {activeColumns.map((col, i) => (\n <th id={`heading-${col.accessor}`} key={i}>\n {col.Heading}\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {localData.map((row, rowIndex) => (\n <DraggableSortableItem\n disabled={!isOrderable}\n id={rowIds[rowIndex]}\n key={rowIds[rowIndex]}\n >\n {({ attributes, isDragging, listeners, setNodeRef, transform, transition }) => (\n <OrderableRow\n cellMap={cellMap}\n className={`row-${rowIndex + 1}`}\n columns={activeColumns}\n dragAttributes={attributes}\n dragListeners={listeners}\n isOrderable={isOrderable}\n onDisabledDragAttempt={handleDisabledDragAttempt}\n ref={setNodeRef}\n rowId={row.id ?? row._id}\n style={{\n opacity: isDragging ? 0 : 1,\n transform,\n transition,\n }}\n />\n )}\n </DraggableSortableItem>\n ))}\n </tbody>\n </table>\n\n <DragOverlay>\n <OrderableRowDragPreview\n className={[baseClass, `${baseClass}--drag-preview`].join(' ')}\n rowId={dragActiveRowId}\n >\n <OrderableRow cellMap={cellMap} columns={activeColumns} rowId={dragActiveRowId} />\n </OrderableRowDragPreview>\n </DragOverlay>\n </DraggableSortable>\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -148,6 +148,7 @@
148
148
 
149
149
  /* Condensed appearance */
150
150
  .table--appearance-condensed {
151
+ border: var(--stroke-width-small) solid var(--color-border);
151
152
  border-radius: var(--radius-medium);
152
153
  scrollbar-width: thin;
153
154
  scrollbar-color: var(--scrollbar-color) transparent;