@wordpress/dataviews 4.22.0 → 5.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (343) hide show
  1. package/CHANGELOG.md +39 -0
  2. package/README.md +147 -32
  3. package/build/components/dataviews/index.js +71 -37
  4. package/build/components/dataviews/index.js.map +1 -1
  5. package/build/components/dataviews-context/index.js +15 -1
  6. package/build/components/dataviews-context/index.js.map +1 -1
  7. package/build/components/dataviews-filters/{filter-summary.js → filter.js} +108 -17
  8. package/build/components/dataviews-filters/filter.js.map +1 -0
  9. package/build/components/dataviews-filters/index.js +21 -20
  10. package/build/components/dataviews-filters/index.js.map +1 -1
  11. package/build/components/dataviews-filters/input-widget.js +76 -0
  12. package/build/components/dataviews-filters/input-widget.js.map +1 -0
  13. package/build/components/dataviews-filters/search-widget.js +33 -39
  14. package/build/components/dataviews-filters/search-widget.js.map +1 -1
  15. package/build/components/dataviews-filters/utils.js +25 -0
  16. package/build/components/dataviews-filters/utils.js.map +1 -0
  17. package/build/components/dataviews-item-actions/index.js +1 -1
  18. package/build/components/dataviews-item-actions/index.js.map +1 -1
  19. package/build/components/dataviews-layout/index.js +7 -2
  20. package/build/components/dataviews-layout/index.js.map +1 -1
  21. package/build/components/dataviews-pagination/index.js +4 -3
  22. package/build/components/dataviews-pagination/index.js.map +1 -1
  23. package/build/components/dataviews-selection-checkbox/index.js.map +1 -1
  24. package/build/components/dataviews-view-config/index.js +10 -19
  25. package/build/components/dataviews-view-config/index.js.map +1 -1
  26. package/build/constants.js +83 -2
  27. package/build/constants.js.map +1 -1
  28. package/build/dataform-controls/boolean.js +42 -0
  29. package/build/dataform-controls/boolean.js.map +1 -0
  30. package/build/dataform-controls/checkbox.js +44 -0
  31. package/build/dataform-controls/checkbox.js.map +1 -0
  32. package/build/dataform-controls/datetime.js +96 -2
  33. package/build/dataform-controls/datetime.js.map +1 -1
  34. package/build/dataform-controls/email.js +48 -0
  35. package/build/dataform-controls/email.js.map +1 -0
  36. package/build/dataform-controls/index.js +9 -1
  37. package/build/dataform-controls/index.js.map +1 -1
  38. package/build/dataform-controls/integer.js +49 -1
  39. package/build/dataform-controls/integer.js.map +1 -1
  40. package/build/dataform-controls/select.js +1 -0
  41. package/build/dataform-controls/select.js.map +1 -1
  42. package/build/dataform-controls/text.js +3 -1
  43. package/build/dataform-controls/text.js.map +1 -1
  44. package/build/dataform-controls/toggle-group.js +52 -0
  45. package/build/dataform-controls/toggle-group.js.map +1 -0
  46. package/build/dataforms-layouts/data-form-layout.js +1 -1
  47. package/build/dataforms-layouts/data-form-layout.js.map +1 -1
  48. package/build/dataforms-layouts/panel/index.js +14 -5
  49. package/build/dataforms-layouts/panel/index.js.map +1 -1
  50. package/build/dataforms-layouts/regular/index.js +23 -4
  51. package/build/dataforms-layouts/regular/index.js.map +1 -1
  52. package/build/dataviews-layouts/grid/index.js +89 -27
  53. package/build/dataviews-layouts/grid/index.js.map +1 -1
  54. package/build/dataviews-layouts/list/index.js +11 -6
  55. package/build/dataviews-layouts/list/index.js.map +1 -1
  56. package/build/dataviews-layouts/table/column-header-menu.js +9 -7
  57. package/build/dataviews-layouts/table/column-header-menu.js.map +1 -1
  58. package/build/dataviews-layouts/table/column-primary.js +18 -13
  59. package/build/dataviews-layouts/table/column-primary.js.map +1 -1
  60. package/build/dataviews-layouts/table/index.js +46 -14
  61. package/build/dataviews-layouts/table/index.js.map +1 -1
  62. package/build/dataviews-layouts/table/use-is-horizontal-scroll-end.js +65 -0
  63. package/build/dataviews-layouts/table/use-is-horizontal-scroll-end.js.map +1 -0
  64. package/build/dataviews-layouts/utils/item-click-wrapper.js +77 -0
  65. package/build/dataviews-layouts/utils/item-click-wrapper.js.map +1 -0
  66. package/build/field-types/array.js +62 -0
  67. package/build/field-types/array.js.map +1 -0
  68. package/build/field-types/boolean.js +71 -0
  69. package/build/field-types/boolean.js.map +1 -0
  70. package/build/field-types/date.js +57 -0
  71. package/build/field-types/date.js.map +1 -0
  72. package/build/field-types/datetime.js +19 -1
  73. package/build/field-types/datetime.js.map +1 -1
  74. package/build/field-types/email.js +60 -0
  75. package/build/field-types/email.js.map +1 -0
  76. package/build/field-types/index.js +42 -1
  77. package/build/field-types/index.js.map +1 -1
  78. package/build/field-types/integer.js +23 -1
  79. package/build/field-types/integer.js.map +1 -1
  80. package/build/field-types/media.js +31 -0
  81. package/build/field-types/media.js.map +1 -0
  82. package/build/field-types/text.js +23 -1
  83. package/build/field-types/text.js.map +1 -1
  84. package/build/filter-and-sort-data-view.js +174 -11
  85. package/build/filter-and-sort-data-view.js.map +1 -1
  86. package/build/normalize-fields.js +72 -11
  87. package/build/normalize-fields.js.map +1 -1
  88. package/build/types.js.map +1 -1
  89. package/build/utils.js +11 -19
  90. package/build/utils.js.map +1 -1
  91. package/build-module/components/dataviews/index.js +74 -40
  92. package/build-module/components/dataviews/index.js.map +1 -1
  93. package/build-module/components/dataviews-context/index.js +16 -2
  94. package/build-module/components/dataviews-context/index.js.map +1 -1
  95. package/build-module/components/dataviews-filters/filter.js +309 -0
  96. package/build-module/components/dataviews-filters/filter.js.map +1 -0
  97. package/build-module/components/dataviews-filters/index.js +22 -21
  98. package/build-module/components/dataviews-filters/index.js.map +1 -1
  99. package/build-module/components/dataviews-filters/input-widget.js +69 -0
  100. package/build-module/components/dataviews-filters/input-widget.js.map +1 -0
  101. package/build-module/components/dataviews-filters/search-widget.js +31 -37
  102. package/build-module/components/dataviews-filters/search-widget.js.map +1 -1
  103. package/build-module/components/dataviews-filters/utils.js +18 -0
  104. package/build-module/components/dataviews-filters/utils.js.map +1 -0
  105. package/build-module/components/dataviews-item-actions/index.js +1 -1
  106. package/build-module/components/dataviews-item-actions/index.js.map +1 -1
  107. package/build-module/components/dataviews-layout/index.js +7 -2
  108. package/build-module/components/dataviews-layout/index.js.map +1 -1
  109. package/build-module/components/dataviews-pagination/index.js +4 -4
  110. package/build-module/components/dataviews-pagination/index.js.map +1 -1
  111. package/build-module/components/dataviews-selection-checkbox/index.js.map +1 -1
  112. package/build-module/components/dataviews-view-config/index.js +9 -20
  113. package/build-module/components/dataviews-view-config/index.js.map +1 -1
  114. package/build-module/constants.js +82 -1
  115. package/build-module/constants.js.map +1 -1
  116. package/build-module/dataform-controls/boolean.js +35 -0
  117. package/build-module/dataform-controls/boolean.js.map +1 -0
  118. package/build-module/dataform-controls/checkbox.js +37 -0
  119. package/build-module/dataform-controls/checkbox.js.map +1 -0
  120. package/build-module/dataform-controls/datetime.js +98 -3
  121. package/build-module/dataform-controls/datetime.js.map +1 -1
  122. package/build-module/dataform-controls/email.js +41 -0
  123. package/build-module/dataform-controls/email.js.map +1 -0
  124. package/build-module/dataform-controls/index.js +9 -1
  125. package/build-module/dataform-controls/index.js.map +1 -1
  126. package/build-module/dataform-controls/integer.js +51 -3
  127. package/build-module/dataform-controls/integer.js.map +1 -1
  128. package/build-module/dataform-controls/select.js +1 -0
  129. package/build-module/dataform-controls/select.js.map +1 -1
  130. package/build-module/dataform-controls/text.js +3 -1
  131. package/build-module/dataform-controls/text.js.map +1 -1
  132. package/build-module/dataform-controls/toggle-group.js +45 -0
  133. package/build-module/dataform-controls/toggle-group.js.map +1 -0
  134. package/build-module/dataforms-layouts/data-form-layout.js +1 -1
  135. package/build-module/dataforms-layouts/data-form-layout.js.map +1 -1
  136. package/build-module/dataforms-layouts/panel/index.js +14 -5
  137. package/build-module/dataforms-layouts/panel/index.js.map +1 -1
  138. package/build-module/dataforms-layouts/regular/index.js +23 -4
  139. package/build-module/dataforms-layouts/regular/index.js.map +1 -1
  140. package/build-module/dataviews-layouts/grid/index.js +90 -29
  141. package/build-module/dataviews-layouts/grid/index.js.map +1 -1
  142. package/build-module/dataviews-layouts/list/index.js +11 -6
  143. package/build-module/dataviews-layouts/list/index.js.map +1 -1
  144. package/build-module/dataviews-layouts/table/column-header-menu.js +9 -7
  145. package/build-module/dataviews-layouts/table/column-header-menu.js.map +1 -1
  146. package/build-module/dataviews-layouts/table/column-primary.js +18 -12
  147. package/build-module/dataviews-layouts/table/column-primary.js.map +1 -1
  148. package/build-module/dataviews-layouts/table/index.js +47 -16
  149. package/build-module/dataviews-layouts/table/index.js.map +1 -1
  150. package/build-module/dataviews-layouts/table/use-is-horizontal-scroll-end.js +58 -0
  151. package/build-module/dataviews-layouts/table/use-is-horizontal-scroll-end.js.map +1 -0
  152. package/build-module/dataviews-layouts/utils/item-click-wrapper.js +71 -0
  153. package/build-module/dataviews-layouts/utils/item-click-wrapper.js.map +1 -0
  154. package/build-module/field-types/array.js +57 -0
  155. package/build-module/field-types/array.js.map +1 -0
  156. package/build-module/field-types/boolean.js +65 -0
  157. package/build-module/field-types/boolean.js.map +1 -0
  158. package/build-module/field-types/date.js +51 -0
  159. package/build-module/field-types/date.js.map +1 -0
  160. package/build-module/field-types/datetime.js +19 -1
  161. package/build-module/field-types/datetime.js.map +1 -1
  162. package/build-module/field-types/email.js +54 -0
  163. package/build-module/field-types/email.js.map +1 -0
  164. package/build-module/field-types/index.js +42 -1
  165. package/build-module/field-types/index.js.map +1 -1
  166. package/build-module/field-types/integer.js +23 -1
  167. package/build-module/field-types/integer.js.map +1 -1
  168. package/build-module/field-types/media.js +25 -0
  169. package/build-module/field-types/media.js.map +1 -0
  170. package/build-module/field-types/text.js +23 -1
  171. package/build-module/field-types/text.js.map +1 -1
  172. package/build-module/filter-and-sort-data-view.js +175 -12
  173. package/build-module/filter-and-sort-data-view.js.map +1 -1
  174. package/build-module/normalize-fields.js +72 -11
  175. package/build-module/normalize-fields.js.map +1 -1
  176. package/build-module/types.js.map +1 -1
  177. package/build-module/utils.js +10 -17
  178. package/build-module/utils.js.map +1 -1
  179. package/build-style/style-rtl.css +315 -13
  180. package/build-style/style.css +315 -13
  181. package/build-types/components/dataform/stories/index.story.d.ts.map +1 -1
  182. package/build-types/components/dataviews/index.d.ts +24 -3
  183. package/build-types/components/dataviews/index.d.ts.map +1 -1
  184. package/build-types/components/dataviews/stories/fixtures.d.ts +10 -1
  185. package/build-types/components/dataviews/stories/fixtures.d.ts.map +1 -1
  186. package/build-types/components/dataviews/stories/index.story.d.ts +23 -4
  187. package/build-types/components/dataviews/stories/index.story.d.ts.map +1 -1
  188. package/build-types/components/dataviews-context/index.d.ts +14 -1
  189. package/build-types/components/dataviews-context/index.d.ts.map +1 -1
  190. package/build-types/components/dataviews-filters/filter.d.ts +15 -0
  191. package/build-types/components/dataviews-filters/filter.d.ts.map +1 -0
  192. package/build-types/components/dataviews-filters/index.d.ts +3 -8
  193. package/build-types/components/dataviews-filters/index.d.ts.map +1 -1
  194. package/build-types/components/dataviews-filters/input-widget.d.ts +13 -0
  195. package/build-types/components/dataviews-filters/input-widget.d.ts.map +1 -0
  196. package/build-types/components/dataviews-filters/search-widget.d.ts +4 -5
  197. package/build-types/components/dataviews-filters/search-widget.d.ts.map +1 -1
  198. package/build-types/components/dataviews-filters/utils.d.ts +6 -0
  199. package/build-types/components/dataviews-filters/utils.d.ts.map +1 -0
  200. package/build-types/components/dataviews-layout/index.d.ts +5 -1
  201. package/build-types/components/dataviews-layout/index.d.ts.map +1 -1
  202. package/build-types/components/dataviews-pagination/index.d.ts +1 -1
  203. package/build-types/components/dataviews-pagination/index.d.ts.map +1 -1
  204. package/build-types/components/dataviews-selection-checkbox/index.d.ts +2 -2
  205. package/build-types/components/dataviews-selection-checkbox/index.d.ts.map +1 -1
  206. package/build-types/components/dataviews-view-config/index.d.ts +3 -4
  207. package/build-types/components/dataviews-view-config/index.d.ts.map +1 -1
  208. package/build-types/components/stories/index.story.d.ts +63 -0
  209. package/build-types/components/stories/index.story.d.ts.map +1 -0
  210. package/build-types/constants.d.ts +20 -3
  211. package/build-types/constants.d.ts.map +1 -1
  212. package/build-types/dataform-controls/boolean.d.ts +6 -0
  213. package/build-types/dataform-controls/boolean.d.ts.map +1 -0
  214. package/build-types/dataform-controls/checkbox.d.ts +6 -0
  215. package/build-types/dataform-controls/checkbox.d.ts.map +1 -0
  216. package/build-types/dataform-controls/datetime.d.ts +1 -1
  217. package/build-types/dataform-controls/datetime.d.ts.map +1 -1
  218. package/build-types/dataform-controls/email.d.ts +6 -0
  219. package/build-types/dataform-controls/email.d.ts.map +1 -0
  220. package/build-types/dataform-controls/index.d.ts +1 -1
  221. package/build-types/dataform-controls/index.d.ts.map +1 -1
  222. package/build-types/dataform-controls/integer.d.ts +1 -4
  223. package/build-types/dataform-controls/integer.d.ts.map +1 -1
  224. package/build-types/dataform-controls/select.d.ts.map +1 -1
  225. package/build-types/dataform-controls/text.d.ts.map +1 -1
  226. package/build-types/dataform-controls/toggle-group.d.ts +6 -0
  227. package/build-types/dataform-controls/toggle-group.d.ts.map +1 -0
  228. package/build-types/dataforms-layouts/panel/index.d.ts.map +1 -1
  229. package/build-types/dataforms-layouts/regular/index.d.ts.map +1 -1
  230. package/build-types/dataviews-layouts/grid/index.d.ts +2 -1
  231. package/build-types/dataviews-layouts/grid/index.d.ts.map +1 -1
  232. package/build-types/dataviews-layouts/index.d.ts +3 -3
  233. package/build-types/dataviews-layouts/list/index.d.ts.map +1 -1
  234. package/build-types/dataviews-layouts/table/column-header-menu.d.ts.map +1 -1
  235. package/build-types/dataviews-layouts/table/column-primary.d.ts +8 -1
  236. package/build-types/dataviews-layouts/table/column-primary.d.ts.map +1 -1
  237. package/build-types/dataviews-layouts/table/index.d.ts +1 -1
  238. package/build-types/dataviews-layouts/table/index.d.ts.map +1 -1
  239. package/build-types/dataviews-layouts/table/use-is-horizontal-scroll-end.d.ts +19 -0
  240. package/build-types/dataviews-layouts/table/use-is-horizontal-scroll-end.d.ts.map +1 -0
  241. package/build-types/dataviews-layouts/utils/item-click-wrapper.d.ts +15 -0
  242. package/build-types/dataviews-layouts/utils/item-click-wrapper.d.ts.map +1 -0
  243. package/build-types/field-types/array.d.ts +7 -0
  244. package/build-types/field-types/array.d.ts.map +1 -0
  245. package/build-types/field-types/boolean.d.ts +19 -0
  246. package/build-types/field-types/boolean.d.ts.map +1 -0
  247. package/build-types/field-types/date.d.ts +16 -0
  248. package/build-types/field-types/date.d.ts.map +1 -0
  249. package/build-types/field-types/datetime.d.ts +7 -1
  250. package/build-types/field-types/datetime.d.ts.map +1 -1
  251. package/build-types/field-types/email.d.ts +19 -0
  252. package/build-types/field-types/email.d.ts.map +1 -0
  253. package/build-types/field-types/index.d.ts +2 -10
  254. package/build-types/field-types/index.d.ts.map +1 -1
  255. package/build-types/field-types/integer.d.ts +7 -1
  256. package/build-types/field-types/integer.d.ts.map +1 -1
  257. package/build-types/field-types/media.d.ts +16 -0
  258. package/build-types/field-types/media.d.ts.map +1 -0
  259. package/build-types/field-types/text.d.ts +7 -1
  260. package/build-types/field-types/text.d.ts.map +1 -1
  261. package/build-types/filter-and-sort-data-view.d.ts.map +1 -1
  262. package/build-types/normalize-fields.d.ts.map +1 -1
  263. package/build-types/types.d.ts +74 -8
  264. package/build-types/types.d.ts.map +1 -1
  265. package/build-types/utils.d.ts +5 -2
  266. package/build-types/utils.d.ts.map +1 -1
  267. package/build-wp/index.js +3299 -1182
  268. package/package.json +18 -12
  269. package/src/components/dataform/stories/index.story.tsx +41 -20
  270. package/src/components/dataviews/index.tsx +108 -43
  271. package/src/components/dataviews/stories/fixtures.tsx +135 -69
  272. package/src/components/dataviews/stories/index.story.tsx +265 -7
  273. package/src/components/dataviews/stories/style.css +24 -3
  274. package/src/components/dataviews/style.scss +27 -0
  275. package/src/components/dataviews-context/index.ts +30 -2
  276. package/src/components/dataviews-filters/filter.tsx +603 -0
  277. package/src/components/dataviews-filters/index.tsx +23 -29
  278. package/src/components/dataviews-filters/input-widget.tsx +91 -0
  279. package/src/components/dataviews-filters/search-widget.tsx +51 -48
  280. package/src/components/dataviews-filters/style.scss +117 -14
  281. package/src/components/dataviews-filters/utils.ts +25 -0
  282. package/src/components/dataviews-item-actions/index.tsx +1 -1
  283. package/src/components/dataviews-layout/index.tsx +8 -1
  284. package/src/components/dataviews-pagination/index.tsx +4 -4
  285. package/src/components/dataviews-selection-checkbox/index.tsx +2 -2
  286. package/src/components/dataviews-view-config/index.tsx +10 -18
  287. package/src/components/stories/index.story.tsx +372 -0
  288. package/src/constants.ts +116 -1
  289. package/src/dataform-controls/boolean.tsx +30 -0
  290. package/src/dataform-controls/checkbox.tsx +31 -0
  291. package/src/dataform-controls/datetime.tsx +106 -2
  292. package/src/dataform-controls/email.tsx +42 -0
  293. package/src/dataform-controls/index.tsx +8 -0
  294. package/src/dataform-controls/integer.tsx +75 -1
  295. package/src/dataform-controls/select.tsx +1 -0
  296. package/src/dataform-controls/style.scss +5 -0
  297. package/src/dataform-controls/text.tsx +2 -1
  298. package/src/dataform-controls/toggle-group.tsx +59 -0
  299. package/src/dataforms-layouts/data-form-layout.tsx +1 -1
  300. package/src/dataforms-layouts/panel/index.tsx +19 -7
  301. package/src/dataforms-layouts/panel/style.scss +8 -1
  302. package/src/dataforms-layouts/regular/index.tsx +50 -17
  303. package/src/dataforms-layouts/regular/style.scss +4 -1
  304. package/src/dataviews-layouts/grid/index.tsx +180 -68
  305. package/src/dataviews-layouts/grid/style.scss +8 -0
  306. package/src/dataviews-layouts/list/index.tsx +12 -5
  307. package/src/dataviews-layouts/table/column-header-menu.tsx +10 -8
  308. package/src/dataviews-layouts/table/column-primary.tsx +26 -13
  309. package/src/dataviews-layouts/table/index.tsx +74 -10
  310. package/src/dataviews-layouts/table/style.scss +37 -1
  311. package/src/dataviews-layouts/table/use-is-horizontal-scroll-end.ts +82 -0
  312. package/src/dataviews-layouts/utils/item-click-wrapper.tsx +93 -0
  313. package/src/field-types/array.tsx +75 -0
  314. package/src/field-types/boolean.tsx +66 -0
  315. package/src/field-types/date.ts +56 -0
  316. package/src/field-types/datetime.tsx +46 -2
  317. package/src/field-types/email.tsx +79 -0
  318. package/src/field-types/index.tsx +50 -3
  319. package/src/field-types/integer.tsx +53 -2
  320. package/src/field-types/media.tsx +28 -0
  321. package/src/field-types/text.tsx +41 -2
  322. package/src/filter-and-sort-data-view.ts +270 -10
  323. package/src/normalize-fields.ts +116 -13
  324. package/src/test/dataviews.tsx +20 -2
  325. package/src/test/filter-and-sort-data-view.js +601 -25
  326. package/src/test/normalize-fields.ts +155 -0
  327. package/src/types.ts +112 -9
  328. package/src/utils.ts +10 -33
  329. package/tsconfig.json +2 -0
  330. package/tsconfig.tsbuildinfo +1 -1
  331. package/build/components/dataviews-filters/filter-summary.js.map +0 -1
  332. package/build/dataviews-layouts/utils/get-clickable-item-props.js +0 -36
  333. package/build/dataviews-layouts/utils/get-clickable-item-props.js.map +0 -1
  334. package/build-module/components/dataviews-filters/filter-summary.js +0 -218
  335. package/build-module/components/dataviews-filters/filter-summary.js.map +0 -1
  336. package/build-module/dataviews-layouts/utils/get-clickable-item-props.js +0 -30
  337. package/build-module/dataviews-layouts/utils/get-clickable-item-props.js.map +0 -1
  338. package/build-types/components/dataviews-filters/filter-summary.d.ts +0 -14
  339. package/build-types/components/dataviews-filters/filter-summary.d.ts.map +0 -1
  340. package/build-types/dataviews-layouts/utils/get-clickable-item-props.d.ts +0 -19
  341. package/build-types/dataviews-layouts/utils/get-clickable-item-props.d.ts.map +0 -1
  342. package/src/components/dataviews-filters/filter-summary.tsx +0 -338
  343. package/src/dataviews-layouts/utils/get-clickable-item-props.ts +0 -39
package/CHANGELOG.md CHANGED
@@ -2,6 +2,45 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
+ ## 5.0.0 (2025-07-23)
6
+
7
+ ### Bug Fixes
8
+
9
+ - Fix `filterSortAndPaginate` to handle undefined values for the `is` filter.
10
+ - Fix the background color of the action column if the row is selected
11
+
12
+ ### Features
13
+
14
+ - Add support for grouping items by a field in the `grid` layout by introducing a `groupByField` prop in the View object.
15
+ - Add support for free composition in the `DataViews` component by exporting subcomponents: `<DataViews.ViewConfig />`, `<DataViews.Search />`, `<DataViews.Pagination />`, `<DataViews.LayoutSwitcher />`, `<DataViews.Layout />`, `<DataViews.FiltersToggle />`, `<DataViews.Filters />`, `<DataViews.BulkActionToolbar />`.
16
+ - `select`, `text`, `email` controls: add `help` support from the field `description` prop.
17
+ - `text`, `email` Edit control: add `help` support from the field `description` prop.
18
+ - Add new Edit controls: `checkbox`, `toggleGroup`. In the `toggleGroup`, if the field elements (options) have a `description`, then the selected option's description will be also rendered.
19
+ - Add new `media`, `boolean`, `email`, `array` and `date` field type definitions.
20
+ - Field type definitions are now able to define a default `enableSorting` and `render` function.
21
+ - Pin the actions column on the table view when the width is insufficient.
22
+ - Enhance filter component styles.
23
+ - Add user input filter support based on the `Edit` property of the field type definitions.
24
+ - Add new filter operators: `lessThan`, `greaterThan`, `lessThanOrEqual`, `greaterThanOrEqual`, `contains`, `notContains`, `startsWith`, `between`, `on`, `notOn`, `before`, `after`, `inThePast`, `over`, `beforeInc`, and `afterInc`.
25
+ - Add `align` to the `layout.styles` properties, for use in the DataViews table layout. Options are: `start`, `center`, and `end`.
26
+ - Allow fields to opt-out of filtering via `field.filterBy: false`.
27
+ - Update the field type definitions to declare the default and valid operators they support. Fields with no `type` property can use all operators; if none is provided in the field's config, they'll use `is` and `isNot` by default.
28
+ - Adjust the spacing of the `DataForm` based on the type.
29
+ - Add `label-position-side` classes to labels in the form field layouts. Ensure that labels in the panel view do not align center, and that all side labels are center aligned.
30
+ - Allow readonly fields in DataForm when `readOnly` is set to `true`.
31
+ - Adjust the padding when the component is placed inside a `Card`.
32
+ - Introduce `perPageSizes` to control the available sizes of the items per page
33
+
34
+ ### Breaking Changes
35
+
36
+ - Fields with `Edit` defined or `type` will automatically be considered as filters unless `filterBy` is set to `false`.
37
+ - Add `renderItemLink` prop support in the `DataViews` component. It replaces `onClickItem`prop and allows integration with router libraries.
38
+
39
+ ### Internal
40
+
41
+ - Adds new story that combines DataViews and DataForm.
42
+ - Add a story for each FieldTypeDefinition.
43
+
5
44
  ## 4.22.0 (2025-06-25)
6
45
 
7
46
  ## 4.21.0 (2025-06-04)
package/README.md CHANGED
@@ -207,15 +207,19 @@ Properties:
207
207
  - `showMedia`: Whether the media should be shown in the UI. `true` by default.
208
208
  - `showDescription`: Whether the description should be shown in the UI. `true` by default.
209
209
  - `showLevels`: Whether to display the hierarchical levels for the data. `false` by default. See related `getItemLevel` DataView prop.
210
+ - `groupByField`: The id of the field used for grouping the dataset. So far, only the `grid` layout supports grouping.
210
211
  - `fields`: a list of remaining field `id` that are visible in the UI and the specific order in which they are displayed.
211
212
  - `layout`: config that is specific to a particular layout type.
212
213
 
213
214
  ##### Properties of `layout`
214
215
 
215
- | Properties of `layout` | Table | Grid | List |
216
- | ----------------------------------------------------------------------------------- | ----- | ---- | ---- |
217
- | `badgeFields`: a list of field's `id` to render without label and styled as badges. | | ✓ | |
218
- | `styles`: additional `width`, `maxWidth`, `minWidth` styles for each field column. | ✓ | | |
216
+ | Properties of `layout` | Table | Grid | List |
217
+ | ------------------------------------------------------------------------------------------- | ----- | ---- | ---- |
218
+ | `badgeFields`: a list of field's `id` to render without label and styled as badges. | | ✓ | |
219
+ | `styles`: additional `width`, `maxWidth`, `minWidth`, `align` styles for each field column. | ✓ | | |
220
+
221
+ **For column alignment (`align` property), follow these guidelines:**
222
+ Right-align whenever the cell value is fundamentally quantitative—numbers, decimals, currency, percentages—so that digits and decimal points line up, aiding comparison and calculation. Otherwise, default to left-alignment for all other types (text, codes, labels, dates).
219
223
 
220
224
  #### `onChangeView`: `function`
221
225
 
@@ -298,7 +302,7 @@ const actions = [
298
302
  icon: <Icon icon={ view } />,
299
303
  isEligible: ( item ) => item.status === 'published',
300
304
  callback: ( items ) => {
301
- console.log( 'Viewing item:', items[0] );
305
+ console.log( 'Viewing item:', items[ 0 ] );
302
306
  },
303
307
  },
304
308
  {
@@ -308,7 +312,7 @@ const actions = [
308
312
  supportsBulk: true,
309
313
  callback: ( items ) => {
310
314
  console.log( 'Editing items:', items );
311
- }
315
+ },
312
316
  },
313
317
  {
314
318
  id: 'delete',
@@ -320,17 +324,17 @@ const actions = [
320
324
  <p>Are you sure you want to delete { items.length } item(s)?</p>
321
325
  <Button
322
326
  variant="primary"
323
- onClick={() => {
327
+ onClick={ () => {
324
328
  console.log( 'Deleting items:', items );
325
329
  onActionPerformed();
326
330
  closeModal();
327
- }}
331
+ } }
328
332
  >
329
333
  Confirm Delete
330
334
  </Button>
331
335
  </div>
332
- )
333
- }
336
+ ),
337
+ },
334
338
  ];
335
339
  ```
336
340
 
@@ -386,14 +390,109 @@ If `selection` and `onChangeSelection` are provided, the `DataViews` component b
386
390
 
387
391
  A function that determines if a media field or a primary field is clickable. It receives an item as an argument and returns a boolean value indicating whether the item can be clicked.
388
392
 
389
- #### `onClickItem`: `function`
393
+ #### `renderItemLink`: `React.ComponentType`
394
+
395
+ A render function used to render clickable items.
396
+
397
+ It can render regular links, but also allows integration with routing libraries (like TanStack Router or React Router).
398
+
399
+ The component receives the following props:
390
400
 
391
- A callback function that is triggered when a user clicks on a media field or primary field. This function is currently implemented only in the `grid` and `list` views.
401
+ - `item`: The data item that was clicked
402
+ - Additional standard HTML anchor props (className, style, etc.)
403
+
404
+ ```jsx
405
+ // Then use it in DataViews
406
+ <DataViews
407
+ // ...other props
408
+ renderItemLink={ ( { item, ...props } ) => (
409
+ <Link to={ `/sites/${ item.slug }` } preload="intent" { ...props } />
410
+ ) }
411
+ />
412
+ ```
392
413
 
393
414
  #### `header`: React component
394
415
 
395
416
  React component to be rendered next to the view config button.
396
417
 
418
+ #### `perPageSizes`: `[ number, number, number, number ]`
419
+
420
+ A list of numbers used to control the available item counts per page.
421
+
422
+ It's optional. Defaults to `[10, 20, 50, 100]`.
423
+
424
+ ### Composition modes
425
+
426
+ The `DataViews` component supports two composition modes:
427
+
428
+ - **Controlled**: This is the default usage mode. `DataViews` renders a full layout out-of-the-box — including search, filters, view switcher, layout grid or table, actions, and pagination. It’s the simplest way to get started and requires minimal setup.
429
+
430
+ - **Free composition**: This mode gives developers full control over the layout. You can compose your own UI using internal components — placing them exactly where they’re needed in your interface. This is useful for more advanced or custom layouts, while still relying on the same shared context for user interactions.
431
+
432
+ The component automatically detects the mode based on the `children` prop. If no `children` are passed, `DataViews` renders its internal layout (controlled mode). If `children` are provided, the component switches to free composition mode, skipping the default layout entirely.
433
+
434
+ In both modes, user interactions update the same `view` object and share the same behavior. Free composition components rely on context state and don’t require additional props to work, making them safe to use without extra boilerplate.
435
+
436
+ ### Free composition
437
+
438
+ When you pass the `children` prop to the `DataViews` component, it enters free composition mode. In this mode, `DataViews` no longer renders its built-in layout — instead, it acts as a wrapper that provides access to internal state and shared behavior through context.
439
+
440
+ This allows you to build your own layout from scratch using the subcomponents exposed by `DataViews`. Each subcomponent automatically connects to the shared context, so you don't need to wire props manually. You can arrange these components however you want and combine them with your own custom elements.
441
+
442
+ This pattern enables full layout flexibility while keeping the data logic centralized.
443
+
444
+ The following components are available directly under `DataViews`:
445
+
446
+ - `DataViews.Search`
447
+ - `DataViews.FiltersToggle`
448
+ - `DataViews.Filters`
449
+ - `DataViews.Layout`
450
+ - `DataViews.LayoutSwitcher`
451
+ - `DataViews.Pagination`
452
+ - `DataViews.BulkActionToolbar`
453
+ - `DataViews.ViewConfig`
454
+
455
+ #### example
456
+
457
+ ```jsx
458
+ import DataViews from '@wordpress/dataviews';
459
+ import { __ } from '@wordpress/i18n';
460
+
461
+ const CustomLayout = () => {
462
+ // Declare data, fields, etc.
463
+
464
+ return (
465
+ <DataViews
466
+ data={ data }
467
+ fields={ fields }
468
+ view={ view }
469
+ onChangeView={ onChangeView }
470
+ paginationInfo={ paginationInfo }
471
+ defaultLayouts={ { table: {} } }
472
+ >
473
+ <h1>{ __( 'Free composition' ) }</h1>
474
+ <DataViews.Search />
475
+ <DataViews.FiltersToggle />
476
+ <DataViews.Filters />
477
+ <DataViews.Layout />
478
+ <DataViews.Pagination />
479
+ </DataViews>
480
+ );
481
+ };
482
+ ```
483
+
484
+ > You can render only the pieces you need, rearrange them freely, or combine them with custom components.
485
+
486
+ ### Accessibility considerations
487
+
488
+ All `DataViews` subcomponents are designed with accessibility in mind — including keyboard interactions, focus management, and semantic roles. Components like `Search`, `Pagination`, `FiltersToggle`, and `Filters` already handle these responsibilities internally and can be safely used in custom layouts.
489
+
490
+ When using free composition, developers are responsible for the outer structure of the layout.
491
+
492
+ Developers don't need to worry about the internal accessibility logic for individual features. The core behaviors — like search semantics, filter toggles, or pagination focus — are encapsulated.
493
+
494
+ `FiltersToggle` controls the visibility of the filters panel, and `Filters` renders the actual filters inside it. They work together and should always be used as a pair. While their internal behavior is accessible by default, how they’re positioned and grouped in custom layouts may affect the overall experience — especially for assistive technologies. Extra care is recommended.
495
+
397
496
  ## `DataForm`
398
497
 
399
498
  <div class="callout callout-info">At <a href="https://wordpress.github.io/gutenberg/">WordPress Gutenberg's Storybook</a> there's and <a href="https://wordpress.github.io/gutenberg/?path=/docs/dataviews-dataform--docs">example implementation of the DataForm component</a>.</div>
@@ -421,7 +520,7 @@ const Example = () => {
421
520
 
422
521
  A single item to be edited.
423
522
 
424
- It can be thought of as a single record coming from the `data` property of `DataViews` — though it doesn't need to be. It can be totally separated or a mix of records if your app supports bulk editing.
523
+ It can be thought of as a single record coming from the `data` property of `DataViews` — though it doesn't need to be. It can be totally separated or a mix of records if your app supports bulk editing.
425
524
 
426
525
  #### `fields`: `Object[]`
427
526
 
@@ -709,10 +808,10 @@ The header text to show in the modal.
709
808
 
710
809
  Specifies the size of the modal window when displaying action content using `RenderModal`.
711
810
 
712
- - Type: `string`
713
- - Optional
714
- - Default: `'medium'`
715
- - One of: `'small'`, `'medium'`, `'large'`, `'fill'`
811
+ - Type: `string`
812
+ - Optional
813
+ - Default: `'medium'`
814
+ - One of: `'small'`, `'medium'`, `'large'`, `'fill'`
716
815
 
717
816
  Example:
718
817
 
@@ -726,10 +825,10 @@ Example:
726
825
 
727
826
  Specifies the focus on mount property of the modal.
728
827
 
729
- - Type: `boolean` | `string`
730
- - Optional
731
- - Default: `true`
732
- - One of: `true` | `false` | `'firstElement'` | `'firstContentElement'`
828
+ - Type: `boolean` | `string`
829
+ - Optional
830
+ - Default: `true`
831
+ - One of: `true` | `false` | `'firstElement'` | `'firstContentElement'`
733
832
 
734
833
  Example:
735
834
 
@@ -791,7 +890,7 @@ Example:
791
890
 
792
891
  ### `header`
793
892
 
794
- React component used by the layouts to display the field name — useful to add icons, etc. It's complementary to the `label` property.
893
+ React component used by the layouts to display the field name — useful to add icons, etc. It's complementary to the `label` property.
795
894
 
796
895
  - Type: React component.
797
896
  - Optional.
@@ -1099,16 +1198,32 @@ Configuration of the filters.
1099
1198
 
1100
1199
  Operators:
1101
1200
 
1102
- | Operator | Selection | Description | Example |
1103
- | ---------- | -------------- | ----------------------------------------------------------------------- | -------------------------------------------------- |
1104
- | `is` | Single item | `EQUAL TO`. The item's field is equal to a single value. | Author is Admin |
1105
- | `isNot` | Single item | `NOT EQUAL TO`. The item's field is not equal to a single value. | Author is not Admin |
1106
- | `isAny` | Multiple items | `OR`. The item's field is present in a list of values. | Author is any: Admin, Editor |
1107
- | `isNone` | Multiple items | `NOT OR`. The item's field is not present in a list of values. | Author is none: Admin, Editor |
1108
- | `isAll` | Multiple items | `AND`. The item's field has all of the values in the list. | Category is all: Book, Review, Science Fiction |
1109
- | `isNotAll` | Multiple items | `NOT AND`. The item's field doesn't have all of the values in the list. | Category is not all: Book, Review, Science Fiction |
1110
-
1111
- `is` and `isNot` are single-selection operators, while `isAny`, `isNone`, `isAll`, and `isNotALl` are multi-selection. A filter with no operators declared will support the `isAny` and `isNone` multi-selection operators by default. A filter cannot mix single-selection & multi-selection operators; if a single-selection operator is present in the list of valid operators, the multi-selection ones will be discarded, and the filter won't allow selecting more than one item.
1201
+ | Operator | Selection | Description | Example |
1202
+ | -------------------- | -------------- | ---------------------------------------------------------------------------------------------------- | -------------------------------------------------- |
1203
+ | `is` | Single item | `EQUAL TO`. The item's field is equal to a single value. | Author is Admin |
1204
+ | `isNot` | Single item | `NOT EQUAL TO`. The item's field is not equal to a single value. | Author is not Admin |
1205
+ | `isAny` | Multiple items | `OR`. The item's field is present in a list of values. | Author is any: Admin, Editor |
1206
+ | `isNone` | Multiple items | `NOT OR`. The item's field is not present in a list of values. | Author is none: Admin, Editor |
1207
+ | `isAll` | Multiple items | `AND`. The item's field has all of the values in the list. | Category is all: Book, Review, Science Fiction |
1208
+ | `isNotAll` | Multiple items | `NOT AND`. The item's field doesn't have all of the values in the list. | Category is not all: Book, Review, Science Fiction |
1209
+ | `lessThan` | Single item | `LESS THAN`. The item's field is numerically less than a single value. | Age is less than 18 |
1210
+ | `greaterThan` | Single item | `GREATER THAN`. The item's field is numerically greater than a single value. | Age is greater than 65 |
1211
+ | `lessThanOrEqual` | Single item | `LESS THAN OR EQUAL TO`. The item's field is numerically less than or equal to a single value. | Age is less than or equal to 18 |
1212
+ | `greaterThanOrEqual` | Single item | `GREATER THAN OR EQUAL TO`. The item's field is numerically greater than or equal to a single value. | Age is greater than or equal to 65 |
1213
+ | `contains` | Text | `CONTAINS`. The item's field contains the given substring. | Title contains: Mars |
1214
+ | `notContains` | Text | `NOT CONTAINS`. The item's field does not contain the given substring. | Description doesn't contain: photo |
1215
+ | `startsWith` | Text | `STARTS WITH`. The item's field starts with the given substring. | Title starts with: Mar |
1216
+ | `on` | Date | `ON`. The item's field is on a given date (date equality using proper date parsing). | Date is on: 2024-01-01 |
1217
+ | `notOn` | Date | `NOT ON`. The item's field is not on a given date (date inequality using proper date parsing). | Date is not on: 2024-01-01 |
1218
+ | `before` | Date | `BEFORE`. The item's field is before a given date. | Date is before 2024-01-01 |
1219
+ | `after` | Date | `AFTER`. The item's field is after a given date. | Date is after 2024-01-01 |
1220
+ | `beforeInc` | Date | `BEFORE (Inc)`. The item's field is before a given date, including the date. | Date is before 2024-01-01, including 2024-01-01 |
1221
+ | `afterInc` | Date | `AFTER (Inc)`. The item's field is after a given date, including the date. | Date is after 2024-01-01, including 2024-01-01 |
1222
+ | `inThePast` | Date | `IN THE PAST`. The item's field is within the last N units (days, weeks, months, or years) from now. | Orders placed in the past 7 days |
1223
+ | `over` | Date | `OVER`. The item's field is older than N units (days, weeks, months, or years) from now. | Orders placed over 7 days ago |
1224
+ | `between` | Multiple items | `BETWEEN`. The item's field is between two values. | Item count between (inc): 10-180 |
1225
+
1226
+ `is`, `isNot`, `on`, `notOn`, `lessThan`, `greaterThan`, `lessThanOrEqual`, `greaterThanOrEqual`, `before`, `after`, `beforeInc`, `afterInc`, `contains`, `notContains`, and `startsWith` are single-selection operators, while `isAny`, `isNone`, `isAll`, and `isNotAll` are multi-selection. `between` is a special operator that requires two values and it's not supported for preset layout. A filter with no operators declared will support the `isAny` and `isNone` multi-selection operators by default. A filter cannot mix single-selection & multi-selection operators; if a single-selection operator is present in the list of valid operators, the multi-selection ones will be discarded, and the filter won't allow selecting more than one item.
1112
1227
 
1113
1228
  Example:
1114
1229
 
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.default = DataViews;
7
+ exports.default = void 0;
8
8
  var _components = require("@wordpress/components");
9
9
  var _element = require("@wordpress/element");
10
10
  var _compose = require("@wordpress/compose");
@@ -13,7 +13,9 @@ var _dataviewsFilters = _interopRequireWildcard(require("../dataviews-filters"))
13
13
  var _dataviewsLayout = _interopRequireDefault(require("../dataviews-layout"));
14
14
  var _dataviewsFooter = _interopRequireDefault(require("../dataviews-footer"));
15
15
  var _dataviewsSearch = _interopRequireDefault(require("../dataviews-search"));
16
- var _dataviewsViewConfig = _interopRequireDefault(require("../dataviews-view-config"));
16
+ var _dataviewsBulkActions = require("../dataviews-bulk-actions");
17
+ var _dataviewsPagination = require("../dataviews-pagination");
18
+ var _dataviewsViewConfig = _interopRequireWildcard(require("../dataviews-view-config"));
17
19
  var _normalizeFields = require("../../normalize-fields");
18
20
  var _jsxRuntime = require("react/jsx-runtime");
19
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -33,6 +35,40 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
33
35
  const defaultGetItemId = item => item.id;
34
36
  const defaultIsItemClickable = () => true;
35
37
  const EMPTY_ARRAY = [];
38
+ function DefaultUI({
39
+ header,
40
+ search = true,
41
+ searchLabel = undefined
42
+ }) {
43
+ const {
44
+ isShowingFilter
45
+ } = (0, _element.useContext)(_dataviewsContext.default);
46
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
47
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
48
+ alignment: "top",
49
+ justify: "space-between",
50
+ className: "dataviews__view-actions",
51
+ spacing: 1,
52
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
53
+ justify: "start",
54
+ expanded: false,
55
+ className: "dataviews__search",
56
+ children: [search && /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsSearch.default, {
57
+ label: searchLabel
58
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsFilters.FiltersToggle, {})]
59
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
60
+ spacing: 1,
61
+ expanded: false,
62
+ style: {
63
+ flexShrink: 0
64
+ },
65
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsViewConfig.default, {}), header]
66
+ })]
67
+ }), isShowingFilter && /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsFilters.default, {
68
+ className: "dataviews-filters__container"
69
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsLayout.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsFooter.default, {})]
70
+ });
71
+ }
36
72
  function DataViews({
37
73
  view,
38
74
  onChangeView,
@@ -49,11 +85,15 @@ function DataViews({
49
85
  selection: selectionProperty,
50
86
  onChangeSelection,
51
87
  onClickItem,
88
+ renderItemLink,
52
89
  isItemClickable = defaultIsItemClickable,
53
- header
90
+ header,
91
+ children,
92
+ perPageSizes
54
93
  }) {
94
+ const containerRef = (0, _element.useRef)(null);
55
95
  const [containerWidth, setContainerWidth] = (0, _element.useState)(0);
56
- const containerRef = (0, _compose.useResizeObserver)(resizeObserverEntries => {
96
+ const resizeObserverRef = (0, _compose.useResizeObserver)(resizeObserverEntries => {
57
97
  setContainerWidth(resizeObserverEntries[0].borderBoxSize[0].inlineSize);
58
98
  }, {
59
99
  box: 'border-box'
@@ -94,42 +134,36 @@ function DataViews({
94
134
  getItemLevel,
95
135
  isItemClickable,
96
136
  onClickItem,
97
- containerWidth
137
+ renderItemLink,
138
+ containerWidth,
139
+ containerRef,
140
+ defaultLayouts,
141
+ filters,
142
+ isShowingFilter,
143
+ setIsShowingFilter,
144
+ perPageSizes
98
145
  },
99
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
146
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
100
147
  className: "dataviews-wrapper",
101
- ref: containerRef,
102
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
103
- alignment: "top",
104
- justify: "space-between",
105
- className: "dataviews__view-actions",
106
- spacing: 1,
107
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
108
- justify: "start",
109
- expanded: false,
110
- className: "dataviews__search",
111
- children: [search && /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsSearch.default, {
112
- label: searchLabel
113
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsFilters.FiltersToggle, {
114
- filters: filters,
115
- view: view,
116
- onChangeView: onChangeView,
117
- setOpenedFilter: setOpenedFilter,
118
- setIsShowingFilter: setIsShowingFilter,
119
- isShowingFilter: isShowingFilter
120
- })]
121
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalHStack, {
122
- spacing: 1,
123
- expanded: false,
124
- style: {
125
- flexShrink: 0
126
- },
127
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsViewConfig.default, {
128
- defaultLayouts: defaultLayouts
129
- }), header]
130
- })]
131
- }), isShowingFilter && /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsFilters.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsLayout.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataviewsFooter.default, {})]
148
+ ref: (0, _compose.useMergeRefs)([containerRef, resizeObserverRef]),
149
+ children: children !== null && children !== void 0 ? children : /*#__PURE__*/(0, _jsxRuntime.jsx)(DefaultUI, {
150
+ header: header,
151
+ search: search,
152
+ searchLabel: searchLabel
153
+ })
132
154
  })
133
155
  });
134
156
  }
157
+
158
+ // Populate the DataViews sub components
159
+ const DataViewsSubComponents = DataViews;
160
+ DataViewsSubComponents.BulkActionToolbar = _dataviewsBulkActions.BulkActionsFooter;
161
+ DataViewsSubComponents.Filters = _dataviewsFilters.default;
162
+ DataViewsSubComponents.FiltersToggle = _dataviewsFilters.FiltersToggle;
163
+ DataViewsSubComponents.Layout = _dataviewsLayout.default;
164
+ DataViewsSubComponents.LayoutSwitcher = _dataviewsViewConfig.ViewTypeMenu;
165
+ DataViewsSubComponents.Pagination = _dataviewsPagination.DataViewsPagination;
166
+ DataViewsSubComponents.Search = _dataviewsSearch.default;
167
+ DataViewsSubComponents.ViewConfig = _dataviewsViewConfig.DataviewsViewConfigDropdown;
168
+ var _default = exports.default = DataViewsSubComponents;
135
169
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["_components","require","_element","_compose","_dataviewsContext","_interopRequireDefault","_dataviewsFilters","_interopRequireWildcard","_dataviewsLayout","_dataviewsFooter","_dataviewsSearch","_dataviewsViewConfig","_normalizeFields","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultGetItemId","item","id","defaultIsItemClickable","EMPTY_ARRAY","DataViews","view","onChangeView","fields","search","searchLabel","undefined","actions","data","getItemId","getItemLevel","isLoading","paginationInfo","defaultLayouts","selection","selectionProperty","onChangeSelection","onClickItem","isItemClickable","header","containerWidth","setContainerWidth","useState","containerRef","useResizeObserver","resizeObserverEntries","borderBoxSize","inlineSize","box","selectionState","setSelectionState","isUncontrolled","openedFilter","setOpenedFilter","setSelectionWithChange","value","newValue","_fields","useMemo","normalizeFields","_selection","filter","some","filters","useFilters","isShowingFilter","setIsShowingFilter","isPrimary","jsx","Provider","children","jsxs","className","ref","__experimentalHStack","alignment","justify","spacing","expanded","label","FiltersToggle","style","flexShrink"],"sources":["@wordpress/dataviews/src/components/dataviews/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __experimentalHStack as HStack } from '@wordpress/components';\nimport { useMemo, useState } from '@wordpress/element';\nimport { useResizeObserver } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\nimport {\n\tdefault as DataViewsFilters,\n\tuseFilters,\n\tFiltersToggle,\n} from '../dataviews-filters';\nimport DataViewsLayout from '../dataviews-layout';\nimport DataViewsFooter from '../dataviews-footer';\nimport DataViewsSearch from '../dataviews-search';\nimport DataViewsViewConfig from '../dataviews-view-config';\nimport { normalizeFields } from '../../normalize-fields';\nimport type { Action, Field, View, SupportedLayouts } from '../../types';\nimport type { SelectionOrUpdater } from '../../private-types';\n\ntype ItemWithId = { id: string };\n\ntype DataViewsProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection?: string[];\n\tonChangeSelection?: ( items: string[] ) => void;\n\tonClickItem?: ( item: Item ) => void;\n\tisItemClickable?: ( item: Item ) => boolean;\n\theader?: ReactNode;\n\tgetItemLevel?: ( item: Item ) => number;\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst defaultIsItemClickable = () => true;\nconst EMPTY_ARRAY: any[] = [];\n\nexport default function DataViews< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tgetItemLevel,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts,\n\tselection: selectionProperty,\n\tonChangeSelection,\n\tonClickItem,\n\tisItemClickable = defaultIsItemClickable,\n\theader,\n}: DataViewsProps< Item > ) {\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst containerRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ selectionState, setSelectionState ] = useState< string[] >( [] );\n\tconst isUncontrolled =\n\t\tselectionProperty === undefined || onChangeSelection === undefined;\n\tconst selection = isUncontrolled ? selectionState : selectionProperty;\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( isUncontrolled ) {\n\t\t\tsetSelectionState( newValue );\n\t\t}\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst _selection = useMemo( () => {\n\t\treturn selection.filter( ( id ) =>\n\t\t\tdata.some( ( item ) => getItemId( item ) === id )\n\t\t);\n\t}, [ selection, data, getItemId ] );\n\n\tconst filters = useFilters( _fields, view );\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >( () =>\n\t\t( filters || [] ).some( ( filter ) => filter.isPrimary )\n\t);\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tselection: _selection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tgetItemLevel,\n\t\t\t\tisItemClickable,\n\t\t\t\tonClickItem,\n\t\t\t\tcontainerWidth,\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-wrapper\" ref={ containerRef }>\n\t\t\t\t<HStack\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\t\tspacing={ 1 }\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t\t<FiltersToggle\n\t\t\t\t\t\t\tfilters={ filters }\n\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t\t\tsetIsShowingFilter={ setIsShowingFilter }\n\t\t\t\t\t\t\tisShowingFilter={ isShowingFilter }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\tstyle={ { flexShrink: 0 } }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DataViewsViewConfig\n\t\t\t\t\t\t\tdefaultLayouts={ defaultLayouts }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ header }\n\t\t\t\t\t</HStack>\n\t\t\t\t</HStack>\n\t\t\t\t{ isShowingFilter && <DataViewsFilters /> }\n\t\t\t\t<DataViewsLayout />\n\t\t\t\t<DataViewsFooter />\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_components","require","_element","_compose","_dataviewsContext","_interopRequireDefault","_dataviewsFilters","_interopRequireWildcard","_dataviewsLayout","_dataviewsFooter","_dataviewsSearch","_dataviewsBulkActions","_dataviewsPagination","_dataviewsViewConfig","_normalizeFields","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","defaultGetItemId","item","id","defaultIsItemClickable","EMPTY_ARRAY","DefaultUI","header","search","searchLabel","undefined","isShowingFilter","useContext","DataViewsContext","jsxs","Fragment","children","__experimentalHStack","alignment","justify","className","spacing","expanded","jsx","label","FiltersToggle","style","flexShrink","DataViews","view","onChangeView","fields","actions","data","getItemId","getItemLevel","isLoading","paginationInfo","defaultLayouts","selection","selectionProperty","onChangeSelection","onClickItem","renderItemLink","isItemClickable","perPageSizes","containerRef","useRef","containerWidth","setContainerWidth","useState","resizeObserverRef","useResizeObserver","resizeObserverEntries","borderBoxSize","inlineSize","box","selectionState","setSelectionState","isUncontrolled","openedFilter","setOpenedFilter","setSelectionWithChange","value","newValue","_fields","useMemo","normalizeFields","_selection","filter","some","filters","useFilters","setIsShowingFilter","isPrimary","Provider","ref","useMergeRefs","DataViewsSubComponents","BulkActionToolbar","BulkActionsFooter","Filters","DataViewsFilters","Layout","DataViewsLayout","LayoutSwitcher","ViewTypeMenu","Pagination","DataViewsPagination","Search","DataViewsSearch","ViewConfig","DataviewsViewConfigDropdown","_default","exports"],"sources":["@wordpress/dataviews/src/components/dataviews/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactNode, ComponentProps, ReactElement } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __experimentalHStack as HStack } from '@wordpress/components';\nimport { useContext, useMemo, useRef, useState } from '@wordpress/element';\nimport { useMergeRefs, useResizeObserver } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\nimport {\n\tdefault as DataViewsFilters,\n\tuseFilters,\n\tFiltersToggle,\n} from '../dataviews-filters';\nimport DataViewsLayout from '../dataviews-layout';\nimport DataViewsFooter from '../dataviews-footer';\nimport DataViewsSearch from '../dataviews-search';\nimport { BulkActionsFooter } from '../dataviews-bulk-actions';\nimport { DataViewsPagination } from '../dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../dataviews-view-config';\nimport { normalizeFields } from '../../normalize-fields';\nimport type { Action, Field, View, SupportedLayouts } from '../../types';\nimport type { SelectionOrUpdater } from '../../private-types';\ntype ItemWithId = { id: string };\n\ntype DataViewsProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection?: string[];\n\tonChangeSelection?: ( items: string[] ) => void;\n\tonClickItem?: ( item: Item ) => void;\n\trenderItemLink?: (\n\t\tprops: {\n\t\t\titem: Item;\n\t\t} & ComponentProps< 'a' >\n\t) => ReactElement;\n\tisItemClickable?: ( item: Item ) => boolean;\n\theader?: ReactNode;\n\tgetItemLevel?: ( item: Item ) => number;\n\tchildren?: ReactNode;\n\tperPageSizes?: [ number, number, number, number ];\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst defaultIsItemClickable = () => true;\nconst EMPTY_ARRAY: any[] = [];\n\ntype DefaultUIProps = Pick<\n\tDataViewsProps< any >,\n\t'header' | 'search' | 'searchLabel'\n>;\n\nfunction DefaultUI( {\n\theader,\n\tsearch = true,\n\tsearchLabel = undefined,\n}: DefaultUIProps ) {\n\tconst { isShowingFilter } = useContext( DataViewsContext );\n\treturn (\n\t\t<>\n\t\t\t<HStack\n\t\t\t\talignment=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tspacing={ 1 }\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\texpanded={ false }\n\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t>\n\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t<FiltersToggle />\n\t\t\t\t</HStack>\n\t\t\t\t<HStack\n\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\texpanded={ false }\n\t\t\t\t\tstyle={ { flexShrink: 0 } }\n\t\t\t\t>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t\t{ header }\n\t\t\t\t</HStack>\n\t\t\t</HStack>\n\t\t\t{ isShowingFilter && (\n\t\t\t\t<DataViewsFilters className=\"dataviews-filters__container\" />\n\t\t\t) }\n\t\t\t<DataViewsLayout />\n\t\t\t<DataViewsFooter />\n\t\t</>\n\t);\n}\n\nfunction DataViews< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tgetItemLevel,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts,\n\tselection: selectionProperty,\n\tonChangeSelection,\n\tonClickItem,\n\trenderItemLink,\n\tisItemClickable = defaultIsItemClickable,\n\theader,\n\tchildren,\n\tperPageSizes,\n}: DataViewsProps< Item > ) {\n\tconst containerRef = useRef< HTMLDivElement | null >( null );\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst resizeObserverRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ selectionState, setSelectionState ] = useState< string[] >( [] );\n\tconst isUncontrolled =\n\t\tselectionProperty === undefined || onChangeSelection === undefined;\n\tconst selection = isUncontrolled ? selectionState : selectionProperty;\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( isUncontrolled ) {\n\t\t\tsetSelectionState( newValue );\n\t\t}\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst _selection = useMemo( () => {\n\t\treturn selection.filter( ( id ) =>\n\t\t\tdata.some( ( item ) => getItemId( item ) === id )\n\t\t);\n\t}, [ selection, data, getItemId ] );\n\n\tconst filters = useFilters( _fields, view );\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >( () =>\n\t\t( filters || [] ).some( ( filter ) => filter.isPrimary )\n\t);\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tselection: _selection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tgetItemLevel,\n\t\t\t\tisItemClickable,\n\t\t\t\tonClickItem,\n\t\t\t\trenderItemLink,\n\t\t\t\tcontainerWidth,\n\t\t\t\tcontainerRef,\n\t\t\t\tdefaultLayouts,\n\t\t\t\tfilters,\n\t\t\t\tisShowingFilter,\n\t\t\t\tsetIsShowingFilter,\n\t\t\t\tperPageSizes,\n\t\t\t} }\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"dataviews-wrapper\"\n\t\t\t\tref={ useMergeRefs( [ containerRef, resizeObserverRef ] ) }\n\t\t\t>\n\t\t\t\t{ children ?? (\n\t\t\t\t\t<DefaultUI\n\t\t\t\t\t\theader={ header }\n\t\t\t\t\t\tsearch={ search }\n\t\t\t\t\t\tsearchLabel={ searchLabel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n\n// Populate the DataViews sub components\nconst DataViewsSubComponents = DataViews as typeof DataViews & {\n\tBulkActionToolbar: typeof BulkActionsFooter;\n\tFilters: typeof DataViewsFilters;\n\tFiltersToggle: typeof FiltersToggle;\n\tLayout: typeof DataViewsLayout;\n\tLayoutSwitcher: typeof ViewTypeMenu;\n\tPagination: typeof DataViewsPagination;\n\tSearch: typeof DataViewsSearch;\n\tViewConfig: typeof DataviewsViewConfigDropdown;\n};\n\nDataViewsSubComponents.BulkActionToolbar = BulkActionsFooter;\nDataViewsSubComponents.Filters = DataViewsFilters;\nDataViewsSubComponents.FiltersToggle = FiltersToggle;\nDataViewsSubComponents.Layout = DataViewsLayout;\nDataViewsSubComponents.LayoutSwitcher = ViewTypeMenu;\nDataViewsSubComponents.Pagination = DataViewsPagination;\nDataViewsSubComponents.Search = DataViewsSearch;\nDataViewsSubComponents.ViewConfig = DataviewsViewConfigDropdown;\n\nexport default DataViewsSubComponents;\n"],"mappings":"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","ignoreList":[]}
@@ -6,6 +6,10 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.default = void 0;
7
7
  var _element = require("@wordpress/element");
8
8
  var _constants = require("../../constants");
9
+ /**
10
+ * External dependencies
11
+ */
12
+
9
13
  /**
10
14
  * WordPress dependencies
11
15
  */
@@ -31,7 +35,17 @@ const DataViewsContext = (0, _element.createContext)({
31
35
  openedFilter: null,
32
36
  getItemId: item => item.id,
33
37
  isItemClickable: () => true,
34
- containerWidth: 0
38
+ renderItemLink: undefined,
39
+ containerWidth: 0,
40
+ containerRef: (0, _element.createRef)(),
41
+ defaultLayouts: {
42
+ list: {},
43
+ grid: {},
44
+ table: {}
45
+ },
46
+ filters: [],
47
+ isShowingFilter: false,
48
+ setIsShowingFilter: () => {}
35
49
  });
36
50
  var _default = exports.default = DataViewsContext;
37
51
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["_element","require","_constants","DataViewsContext","createContext","view","type","LAYOUT_TABLE","onChangeView","fields","data","paginationInfo","totalItems","totalPages","selection","onChangeSelection","setOpenedFilter","openedFilter","getItemId","item","id","isItemClickable","containerWidth","_default","exports","default"],"sources":["@wordpress/dataviews/src/components/dataviews-context/index.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { View, Action, NormalizedField } from '../../types';\nimport type { SetSelection } from '../../private-types';\nimport { LAYOUT_TABLE } from '../../constants';\n\ntype DataViewsContextType< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: NormalizedField< Item >[];\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t};\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\topenedFilter: string | null;\n\tsetOpenedFilter: ( openedFilter: string | null ) => void;\n\tgetItemId: ( item: Item ) => string;\n\tgetItemLevel?: ( item: Item ) => number;\n\tonClickItem?: ( item: Item ) => void;\n\tisItemClickable: ( item: Item ) => boolean;\n\tcontainerWidth: number;\n};\n\nconst DataViewsContext = createContext< DataViewsContextType< any > >( {\n\tview: { type: LAYOUT_TABLE },\n\tonChangeView: () => {},\n\tfields: [],\n\tdata: [],\n\tpaginationInfo: {\n\t\ttotalItems: 0,\n\t\ttotalPages: 0,\n\t},\n\tselection: [],\n\tonChangeSelection: () => {},\n\tsetOpenedFilter: () => {},\n\topenedFilter: null,\n\tgetItemId: ( item ) => item.id,\n\tisItemClickable: () => true,\n\tcontainerWidth: 0,\n} );\n\nexport default DataViewsContext;\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAOA,IAAAC,UAAA,GAAAD,OAAA;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AA2BA,MAAME,gBAAgB,GAAG,IAAAC,sBAAa,EAAiC;EACtEC,IAAI,EAAE;IAAEC,IAAI,EAAEC;EAAa,CAAC;EAC5BC,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,MAAM,EAAE,EAAE;EACVC,IAAI,EAAE,EAAE;EACRC,cAAc,EAAE;IACfC,UAAU,EAAE,CAAC;IACbC,UAAU,EAAE;EACb,CAAC;EACDC,SAAS,EAAE,EAAE;EACbC,iBAAiB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC3BC,eAAe,EAAEA,CAAA,KAAM,CAAC,CAAC;EACzBC,YAAY,EAAE,IAAI;EAClBC,SAAS,EAAIC,IAAI,IAAMA,IAAI,CAACC,EAAE;EAC9BC,eAAe,EAAEA,CAAA,KAAM,IAAI;EAC3BC,cAAc,EAAE;AACjB,CAAE,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEWtB,gBAAgB","ignoreList":[]}
1
+ {"version":3,"names":["_element","require","_constants","DataViewsContext","createContext","view","type","LAYOUT_TABLE","onChangeView","fields","data","paginationInfo","totalItems","totalPages","selection","onChangeSelection","setOpenedFilter","openedFilter","getItemId","item","id","isItemClickable","renderItemLink","undefined","containerWidth","containerRef","createRef","defaultLayouts","list","grid","table","filters","isShowingFilter","setIsShowingFilter","_default","exports","default"],"sources":["@wordpress/dataviews/src/components/dataviews-context/index.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ComponentProps, ReactElement } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { createContext, createRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type {\n\tView,\n\tAction,\n\tNormalizedField,\n\tSupportedLayouts,\n\tNormalizedFilter,\n} from '../../types';\nimport type { SetSelection } from '../../private-types';\nimport { LAYOUT_TABLE } from '../../constants';\n\ntype DataViewsContextType< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: NormalizedField< Item >[];\n\tactions?: Action< Item >[];\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t};\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\topenedFilter: string | null;\n\tsetOpenedFilter: ( openedFilter: string | null ) => void;\n\tgetItemId: ( item: Item ) => string;\n\tgetItemLevel?: ( item: Item ) => number;\n\tonClickItem?: ( item: Item ) => void;\n\trenderItemLink?: (\n\t\tprops: {\n\t\t\titem: Item;\n\t\t} & ComponentProps< 'a' >\n\t) => ReactElement;\n\tisItemClickable: ( item: Item ) => boolean;\n\tcontainerWidth: number;\n\tcontainerRef: React.MutableRefObject< HTMLDivElement | null >;\n\tdefaultLayouts: SupportedLayouts;\n\tfilters: NormalizedFilter[];\n\tisShowingFilter: boolean;\n\tsetIsShowingFilter: ( value: boolean ) => void;\n\tperPageSizes?: [ number, number, number, number ];\n};\n\nconst DataViewsContext = createContext< DataViewsContextType< any > >( {\n\tview: { type: LAYOUT_TABLE },\n\tonChangeView: () => {},\n\tfields: [],\n\tdata: [],\n\tpaginationInfo: {\n\t\ttotalItems: 0,\n\t\ttotalPages: 0,\n\t},\n\tselection: [],\n\tonChangeSelection: () => {},\n\tsetOpenedFilter: () => {},\n\topenedFilter: null,\n\tgetItemId: ( item ) => item.id,\n\tisItemClickable: () => true,\n\trenderItemLink: undefined,\n\tcontainerWidth: 0,\n\tcontainerRef: createRef(),\n\tdefaultLayouts: { list: {}, grid: {}, table: {} },\n\tfilters: [],\n\tisShowingFilter: false,\n\tsetIsShowingFilter: () => {},\n} );\n\nexport default DataViewsContext;\n"],"mappings":";;;;;;AAQA,IAAAA,QAAA,GAAAC,OAAA;AAaA,IAAAC,UAAA,GAAAD,OAAA;AArBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AA4CA,MAAME,gBAAgB,GAAG,IAAAC,sBAAa,EAAiC;EACtEC,IAAI,EAAE;IAAEC,IAAI,EAAEC;EAAa,CAAC;EAC5BC,YAAY,EAAEA,CAAA,KAAM,CAAC,CAAC;EACtBC,MAAM,EAAE,EAAE;EACVC,IAAI,EAAE,EAAE;EACRC,cAAc,EAAE;IACfC,UAAU,EAAE,CAAC;IACbC,UAAU,EAAE;EACb,CAAC;EACDC,SAAS,EAAE,EAAE;EACbC,iBAAiB,EAAEA,CAAA,KAAM,CAAC,CAAC;EAC3BC,eAAe,EAAEA,CAAA,KAAM,CAAC,CAAC;EACzBC,YAAY,EAAE,IAAI;EAClBC,SAAS,EAAIC,IAAI,IAAMA,IAAI,CAACC,EAAE;EAC9BC,eAAe,EAAEA,CAAA,KAAM,IAAI;EAC3BC,cAAc,EAAEC,SAAS;EACzBC,cAAc,EAAE,CAAC;EACjBC,YAAY,EAAE,IAAAC,kBAAS,EAAC,CAAC;EACzBC,cAAc,EAAE;IAAEC,IAAI,EAAE,CAAC,CAAC;IAAEC,IAAI,EAAE,CAAC,CAAC;IAAEC,KAAK,EAAE,CAAC;EAAE,CAAC;EACjDC,OAAO,EAAE,EAAE;EACXC,eAAe,EAAE,KAAK;EACtBC,kBAAkB,EAAEA,CAAA,KAAM,CAAC;AAC5B,CAAE,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEWjC,gBAAgB","ignoreList":[]}