@wordpress/edit-site 6.2.0 → 6.4.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 (368) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/build/components/add-new-pattern/index.js +8 -2
  3. package/build/components/add-new-pattern/index.js.map +1 -1
  4. package/build/components/{add-new-page → add-new-post}/index.js +21 -17
  5. package/build/components/add-new-post/index.js.map +1 -0
  6. package/build/components/add-new-template/index.js +3 -1
  7. package/build/components/add-new-template/index.js.map +1 -1
  8. package/build/components/block-editor/use-site-editor-settings.js +6 -85
  9. package/build/components/block-editor/use-site-editor-settings.js.map +1 -1
  10. package/build/components/editor/index.js +21 -3
  11. package/build/components/editor/index.js.map +1 -1
  12. package/build/components/global-styles/background-panel.js +0 -5
  13. package/build/components/global-styles/background-panel.js.map +1 -1
  14. package/build/components/global-styles/block-preview-panel.js +14 -5
  15. package/build/components/global-styles/block-preview-panel.js.map +1 -1
  16. package/build/components/global-styles/font-families.js +42 -23
  17. package/build/components/global-styles/font-families.js.map +1 -1
  18. package/build/components/global-styles/font-library-modal/font-collection.js +13 -30
  19. package/build/components/global-styles/font-library-modal/font-collection.js.map +1 -1
  20. package/build/components/global-styles/font-library-modal/index.js +4 -4
  21. package/build/components/global-styles/font-library-modal/index.js.map +1 -1
  22. package/build/components/global-styles/font-library-modal/installed-fonts.js +60 -12
  23. package/build/components/global-styles/font-library-modal/installed-fonts.js.map +1 -1
  24. package/build/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js +39 -0
  25. package/build/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js.map +1 -0
  26. package/build/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js +39 -0
  27. package/build/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js.map +1 -0
  28. package/build/components/global-styles/font-sizes/font-size-preview.js +44 -0
  29. package/build/components/global-styles/font-sizes/font-size-preview.js.map +1 -0
  30. package/build/components/global-styles/font-sizes/font-size.js +213 -0
  31. package/build/components/global-styles/font-sizes/font-size.js.map +1 -0
  32. package/build/components/global-styles/font-sizes/font-sizes-count.js +50 -0
  33. package/build/components/global-styles/font-sizes/font-sizes-count.js.map +1 -0
  34. package/build/components/global-styles/font-sizes/font-sizes.js +163 -0
  35. package/build/components/global-styles/font-sizes/font-sizes.js.map +1 -0
  36. package/build/components/global-styles/font-sizes/rename-font-size-dialog.js +67 -0
  37. package/build/components/global-styles/font-sizes/rename-font-size-dialog.js.map +1 -0
  38. package/build/components/global-styles/hooks.js +0 -40
  39. package/build/components/global-styles/hooks.js.map +1 -1
  40. package/build/components/global-styles/preview-typography.js +47 -0
  41. package/build/components/global-styles/preview-typography.js.map +1 -0
  42. package/build/components/global-styles/screen-block.js +17 -1
  43. package/build/components/global-styles/screen-block.js.map +1 -1
  44. package/build/components/global-styles/screen-layout.js +5 -1
  45. package/build/components/global-styles/screen-layout.js.map +1 -1
  46. package/build/components/global-styles/screen-revisions/revisions-buttons.js +1 -1
  47. package/build/components/global-styles/screen-revisions/revisions-buttons.js.map +1 -1
  48. package/build/components/global-styles/screen-style-variations.js +2 -2
  49. package/build/components/global-styles/screen-style-variations.js.map +1 -1
  50. package/build/components/global-styles/screen-typography.js +3 -2
  51. package/build/components/global-styles/screen-typography.js.map +1 -1
  52. package/build/components/global-styles/shadows-edit-panel.js +1 -2
  53. package/build/components/global-styles/shadows-edit-panel.js.map +1 -1
  54. package/build/components/global-styles/size-control/index.js +85 -0
  55. package/build/components/global-styles/size-control/index.js.map +1 -0
  56. package/build/components/global-styles/style-variations-container.js +8 -5
  57. package/build/components/global-styles/style-variations-container.js.map +1 -1
  58. package/build/components/global-styles/typography-elements.js +0 -2
  59. package/build/components/global-styles/typography-elements.js.map +1 -1
  60. package/build/components/global-styles/ui.js +8 -0
  61. package/build/components/global-styles/ui.js.map +1 -1
  62. package/build/components/global-styles/variations/variation.js +4 -4
  63. package/build/components/global-styles/variations/variation.js.map +1 -1
  64. package/build/components/global-styles/variations/variations-color.js +4 -3
  65. package/build/components/global-styles/variations/variations-color.js.map +1 -1
  66. package/build/components/global-styles/variations/variations-typography.js +15 -29
  67. package/build/components/global-styles/variations/variations-typography.js.map +1 -1
  68. package/build/components/global-styles-sidebar/index.js +2 -2
  69. package/build/components/global-styles-sidebar/index.js.map +1 -1
  70. package/build/components/layout/index.js +22 -8
  71. package/build/components/layout/index.js.map +1 -1
  72. package/build/components/layout/router.js +30 -43
  73. package/build/components/layout/router.js.map +1 -1
  74. package/build/components/page-patterns/header.js +1 -1
  75. package/build/components/page-patterns/header.js.map +1 -1
  76. package/build/components/page-patterns/index.js +65 -49
  77. package/build/components/page-patterns/index.js.map +1 -1
  78. package/build/components/page-patterns/search-items.js +29 -4
  79. package/build/components/page-patterns/search-items.js.map +1 -1
  80. package/build/components/page-patterns/use-patterns.js +22 -55
  81. package/build/components/page-patterns/use-patterns.js.map +1 -1
  82. package/build/components/page-templates/index.js +56 -50
  83. package/build/components/page-templates/index.js.map +1 -1
  84. package/build/components/pagination/index.js +4 -4
  85. package/build/components/pagination/index.js.map +1 -1
  86. package/build/components/post-edit/index.js +105 -0
  87. package/build/components/post-edit/index.js.map +1 -0
  88. package/build/components/post-fields/index.js +314 -0
  89. package/build/components/post-fields/index.js.map +1 -0
  90. package/build/components/post-list/index.js +281 -0
  91. package/build/components/post-list/index.js.map +1 -0
  92. package/build/components/posts-app/index.js +11 -17
  93. package/build/components/posts-app/index.js.map +1 -1
  94. package/build/components/posts-app/router.js +85 -0
  95. package/build/components/posts-app/router.js.map +1 -0
  96. package/build/components/revisions/index.js +10 -7
  97. package/build/components/revisions/index.js.map +1 -1
  98. package/build/components/save-panel/index.js +1 -1
  99. package/build/components/save-panel/index.js.map +1 -1
  100. package/build/components/sidebar-dataviews/add-new-view.js +4 -1
  101. package/build/components/sidebar-dataviews/add-new-view.js.map +1 -1
  102. package/build/components/sidebar-dataviews/custom-dataviews-list.js +6 -2
  103. package/build/components/sidebar-dataviews/custom-dataviews-list.js.map +1 -1
  104. package/build/components/sidebar-dataviews/default-views.js +119 -93
  105. package/build/components/sidebar-dataviews/default-views.js.map +1 -1
  106. package/build/components/sidebar-dataviews/index.js +44 -2
  107. package/build/components/sidebar-dataviews/index.js.map +1 -1
  108. package/build/components/sidebar-navigation-screen-global-styles/content.js +64 -0
  109. package/build/components/sidebar-navigation-screen-global-styles/content.js.map +1 -0
  110. package/build/components/sidebar-navigation-screen-global-styles/index.js +2 -47
  111. package/build/components/sidebar-navigation-screen-global-styles/index.js.map +1 -1
  112. package/build/components/sidebar-navigation-screen-navigation-menu/rename-modal.js +3 -2
  113. package/build/components/sidebar-navigation-screen-navigation-menu/rename-modal.js.map +1 -1
  114. package/build/components/sidebar-navigation-screen-patterns/use-pattern-categories.js +3 -2
  115. package/build/components/sidebar-navigation-screen-patterns/use-pattern-categories.js.map +1 -1
  116. package/build/components/site-hub/index.js +81 -1
  117. package/build/components/site-hub/index.js.map +1 -1
  118. package/build/components/sync-state-with-url/use-init-edited-entity-from-url.js +3 -1
  119. package/build/components/sync-state-with-url/use-init-edited-entity-from-url.js.map +1 -1
  120. package/build/hooks/push-changes-to-global-styles/index.js +2 -2
  121. package/build/hooks/push-changes-to-global-styles/index.js.map +1 -1
  122. package/build/hooks/use-theme-style-variations/use-theme-style-variations-by-property.js +65 -42
  123. package/build/hooks/use-theme-style-variations/use-theme-style-variations-by-property.js.map +1 -1
  124. package/build/index.js +10 -0
  125. package/build/index.js.map +1 -1
  126. package/build/posts.js +57 -2
  127. package/build/posts.js.map +1 -1
  128. package/build/store/private-actions.js +7 -2
  129. package/build/store/private-actions.js.map +1 -1
  130. package/build/store/selectors.js +34 -6
  131. package/build/store/selectors.js.map +1 -1
  132. package/build/utils/get-filtered-template-parts.js +64 -0
  133. package/build/utils/get-filtered-template-parts.js.map +1 -0
  134. package/build-module/components/add-new-pattern/index.js +8 -2
  135. package/build-module/components/add-new-pattern/index.js.map +1 -1
  136. package/build-module/components/{add-new-page → add-new-post}/index.js +21 -17
  137. package/build-module/components/add-new-post/index.js.map +1 -0
  138. package/build-module/components/add-new-template/index.js +3 -1
  139. package/build-module/components/add-new-template/index.js.map +1 -1
  140. package/build-module/components/block-editor/use-site-editor-settings.js +6 -85
  141. package/build-module/components/block-editor/use-site-editor-settings.js.map +1 -1
  142. package/build-module/components/editor/index.js +21 -3
  143. package/build-module/components/editor/index.js.map +1 -1
  144. package/build-module/components/global-styles/background-panel.js +0 -5
  145. package/build-module/components/global-styles/background-panel.js.map +1 -1
  146. package/build-module/components/global-styles/block-preview-panel.js +14 -5
  147. package/build-module/components/global-styles/block-preview-panel.js.map +1 -1
  148. package/build-module/components/global-styles/font-families.js +44 -25
  149. package/build-module/components/global-styles/font-families.js.map +1 -1
  150. package/build-module/components/global-styles/font-library-modal/font-collection.js +14 -31
  151. package/build-module/components/global-styles/font-library-modal/font-collection.js.map +1 -1
  152. package/build-module/components/global-styles/font-library-modal/index.js +4 -4
  153. package/build-module/components/global-styles/font-library-modal/index.js.map +1 -1
  154. package/build-module/components/global-styles/font-library-modal/installed-fonts.js +63 -15
  155. package/build-module/components/global-styles/font-library-modal/installed-fonts.js.map +1 -1
  156. package/build-module/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js +32 -0
  157. package/build-module/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js.map +1 -0
  158. package/build-module/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js +32 -0
  159. package/build-module/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js.map +1 -0
  160. package/build-module/components/global-styles/font-sizes/font-size-preview.js +37 -0
  161. package/build-module/components/global-styles/font-sizes/font-size-preview.js.map +1 -0
  162. package/build-module/components/global-styles/font-sizes/font-size.js +207 -0
  163. package/build-module/components/global-styles/font-sizes/font-size.js.map +1 -0
  164. package/build-module/components/global-styles/font-sizes/font-sizes-count.js +43 -0
  165. package/build-module/components/global-styles/font-sizes/font-sizes-count.js.map +1 -0
  166. package/build-module/components/global-styles/font-sizes/font-sizes.js +157 -0
  167. package/build-module/components/global-styles/font-sizes/font-sizes.js.map +1 -0
  168. package/build-module/components/global-styles/font-sizes/rename-font-size-dialog.js +61 -0
  169. package/build-module/components/global-styles/font-sizes/rename-font-size-dialog.js.map +1 -0
  170. package/build-module/components/global-styles/hooks.js +0 -38
  171. package/build-module/components/global-styles/hooks.js.map +1 -1
  172. package/build-module/components/global-styles/preview-typography.js +39 -0
  173. package/build-module/components/global-styles/preview-typography.js.map +1 -0
  174. package/build-module/components/global-styles/screen-block.js +18 -1
  175. package/build-module/components/global-styles/screen-block.js.map +1 -1
  176. package/build-module/components/global-styles/screen-layout.js +5 -1
  177. package/build-module/components/global-styles/screen-layout.js.map +1 -1
  178. package/build-module/components/global-styles/screen-revisions/revisions-buttons.js +1 -1
  179. package/build-module/components/global-styles/screen-revisions/revisions-buttons.js.map +1 -1
  180. package/build-module/components/global-styles/screen-style-variations.js +2 -2
  181. package/build-module/components/global-styles/screen-style-variations.js.map +1 -1
  182. package/build-module/components/global-styles/screen-typography.js +3 -2
  183. package/build-module/components/global-styles/screen-typography.js.map +1 -1
  184. package/build-module/components/global-styles/shadows-edit-panel.js +1 -2
  185. package/build-module/components/global-styles/shadows-edit-panel.js.map +1 -1
  186. package/build-module/components/global-styles/size-control/index.js +79 -0
  187. package/build-module/components/global-styles/size-control/index.js.map +1 -0
  188. package/build-module/components/global-styles/style-variations-container.js +9 -6
  189. package/build-module/components/global-styles/style-variations-container.js.map +1 -1
  190. package/build-module/components/global-styles/typography-elements.js +0 -2
  191. package/build-module/components/global-styles/typography-elements.js.map +1 -1
  192. package/build-module/components/global-styles/ui.js +8 -0
  193. package/build-module/components/global-styles/ui.js.map +1 -1
  194. package/build-module/components/global-styles/variations/variation.js +5 -5
  195. package/build-module/components/global-styles/variations/variation.js.map +1 -1
  196. package/build-module/components/global-styles/variations/variations-color.js +5 -4
  197. package/build-module/components/global-styles/variations/variations-color.js.map +1 -1
  198. package/build-module/components/global-styles/variations/variations-typography.js +16 -30
  199. package/build-module/components/global-styles/variations/variations-typography.js.map +1 -1
  200. package/build-module/components/global-styles-sidebar/index.js +2 -2
  201. package/build-module/components/global-styles-sidebar/index.js.map +1 -1
  202. package/build-module/components/layout/index.js +20 -8
  203. package/build-module/components/layout/index.js.map +1 -1
  204. package/build-module/components/layout/router.js +30 -43
  205. package/build-module/components/layout/router.js.map +1 -1
  206. package/build-module/components/page-patterns/header.js +1 -1
  207. package/build-module/components/page-patterns/header.js.map +1 -1
  208. package/build-module/components/page-patterns/index.js +66 -50
  209. package/build-module/components/page-patterns/index.js.map +1 -1
  210. package/build-module/components/page-patterns/search-items.js +28 -4
  211. package/build-module/components/page-patterns/search-items.js.map +1 -1
  212. package/build-module/components/page-patterns/use-patterns.js +23 -56
  213. package/build-module/components/page-patterns/use-patterns.js.map +1 -1
  214. package/build-module/components/page-templates/index.js +58 -53
  215. package/build-module/components/page-templates/index.js.map +1 -1
  216. package/build-module/components/pagination/index.js +4 -4
  217. package/build-module/components/pagination/index.js.map +1 -1
  218. package/build-module/components/post-edit/index.js +98 -0
  219. package/build-module/components/post-edit/index.js.map +1 -0
  220. package/build-module/components/post-fields/index.js +306 -0
  221. package/build-module/components/post-fields/index.js.map +1 -0
  222. package/build-module/components/post-list/index.js +275 -0
  223. package/build-module/components/post-list/index.js.map +1 -0
  224. package/build-module/components/posts-app/index.js +11 -17
  225. package/build-module/components/posts-app/index.js.map +1 -1
  226. package/build-module/components/posts-app/router.js +77 -0
  227. package/build-module/components/posts-app/router.js.map +1 -0
  228. package/build-module/components/revisions/index.js +10 -7
  229. package/build-module/components/revisions/index.js.map +1 -1
  230. package/build-module/components/save-panel/index.js +1 -1
  231. package/build-module/components/save-panel/index.js.map +1 -1
  232. package/build-module/components/sidebar-dataviews/add-new-view.js +4 -1
  233. package/build-module/components/sidebar-dataviews/add-new-view.js.map +1 -1
  234. package/build-module/components/sidebar-dataviews/custom-dataviews-list.js +6 -2
  235. package/build-module/components/sidebar-dataviews/custom-dataviews-list.js.map +1 -1
  236. package/build-module/components/sidebar-dataviews/default-views.js +117 -92
  237. package/build-module/components/sidebar-dataviews/default-views.js.map +1 -1
  238. package/build-module/components/sidebar-dataviews/index.js +47 -5
  239. package/build-module/components/sidebar-dataviews/index.js.map +1 -1
  240. package/build-module/components/sidebar-navigation-screen-global-styles/content.js +57 -0
  241. package/build-module/components/sidebar-navigation-screen-global-styles/content.js.map +1 -0
  242. package/build-module/components/sidebar-navigation-screen-global-styles/index.js +2 -47
  243. package/build-module/components/sidebar-navigation-screen-global-styles/index.js.map +1 -1
  244. package/build-module/components/sidebar-navigation-screen-navigation-menu/rename-modal.js +3 -2
  245. package/build-module/components/sidebar-navigation-screen-navigation-menu/rename-modal.js.map +1 -1
  246. package/build-module/components/sidebar-navigation-screen-patterns/use-pattern-categories.js +3 -2
  247. package/build-module/components/sidebar-navigation-screen-patterns/use-pattern-categories.js.map +1 -1
  248. package/build-module/components/site-hub/index.js +81 -1
  249. package/build-module/components/site-hub/index.js.map +1 -1
  250. package/build-module/components/sync-state-with-url/use-init-edited-entity-from-url.js +3 -1
  251. package/build-module/components/sync-state-with-url/use-init-edited-entity-from-url.js.map +1 -1
  252. package/build-module/hooks/push-changes-to-global-styles/index.js +2 -2
  253. package/build-module/hooks/push-changes-to-global-styles/index.js.map +1 -1
  254. package/build-module/hooks/use-theme-style-variations/use-theme-style-variations-by-property.js +61 -38
  255. package/build-module/hooks/use-theme-style-variations/use-theme-style-variations-by-property.js.map +1 -1
  256. package/build-module/index.js +11 -2
  257. package/build-module/index.js.map +1 -1
  258. package/build-module/posts.js +57 -2
  259. package/build-module/posts.js.map +1 -1
  260. package/build-module/store/private-actions.js +7 -2
  261. package/build-module/store/private-actions.js.map +1 -1
  262. package/build-module/store/selectors.js +35 -7
  263. package/build-module/store/selectors.js.map +1 -1
  264. package/build-module/utils/get-filtered-template-parts.js +57 -0
  265. package/build-module/utils/get-filtered-template-parts.js.map +1 -0
  266. package/build-style/posts-rtl.css +668 -510
  267. package/build-style/posts.css +668 -510
  268. package/build-style/style-rtl.css +772 -702
  269. package/build-style/style.css +772 -702
  270. package/package.json +41 -41
  271. package/src/components/add-new-pattern/index.js +8 -2
  272. package/src/components/{add-new-page → add-new-post}/index.js +28 -22
  273. package/src/components/add-new-template/index.js +4 -1
  274. package/src/components/add-new-template/style.scss +4 -6
  275. package/src/components/block-editor/use-site-editor-settings.js +10 -101
  276. package/src/components/editor/index.js +21 -5
  277. package/src/components/global-styles/background-panel.js +0 -8
  278. package/src/components/global-styles/block-preview-panel.js +22 -9
  279. package/src/components/global-styles/font-families.js +66 -31
  280. package/src/components/global-styles/font-library-modal/font-collection.js +17 -32
  281. package/src/components/global-styles/font-library-modal/index.js +4 -2
  282. package/src/components/global-styles/font-library-modal/installed-fonts.js +94 -13
  283. package/src/components/global-styles/font-library-modal/style.scss +26 -10
  284. package/src/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js +43 -0
  285. package/src/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js +37 -0
  286. package/src/components/global-styles/font-sizes/font-size-preview.js +43 -0
  287. package/src/components/global-styles/font-sizes/font-size.js +250 -0
  288. package/src/components/global-styles/font-sizes/font-sizes-count.js +40 -0
  289. package/src/components/global-styles/font-sizes/font-sizes.js +263 -0
  290. package/src/components/global-styles/font-sizes/rename-font-size-dialog.js +70 -0
  291. package/src/components/global-styles/hooks.js +0 -41
  292. package/src/components/global-styles/preview-typography.js +39 -0
  293. package/src/components/global-styles/screen-block.js +20 -0
  294. package/src/components/global-styles/screen-layout.js +5 -1
  295. package/src/components/global-styles/screen-revisions/revisions-buttons.js +1 -1
  296. package/src/components/global-styles/screen-style-variations.js +2 -2
  297. package/src/components/global-styles/screen-typography.js +3 -2
  298. package/src/components/global-styles/shadows-edit-panel.js +1 -2
  299. package/src/components/global-styles/size-control/index.js +86 -0
  300. package/src/components/global-styles/style-variations-container.js +14 -7
  301. package/src/components/global-styles/style.scss +13 -3
  302. package/src/components/global-styles/typography-elements.js +0 -4
  303. package/src/components/global-styles/ui.js +10 -0
  304. package/src/components/global-styles/variations/variation.js +5 -5
  305. package/src/components/global-styles/variations/variations-color.js +6 -4
  306. package/src/components/global-styles/variations/variations-typography.js +15 -33
  307. package/src/components/global-styles-sidebar/index.js +2 -2
  308. package/src/components/layout/index.js +24 -4
  309. package/src/components/layout/router.js +29 -37
  310. package/src/components/layout/style.scss +38 -8
  311. package/src/components/page-patterns/header.js +1 -1
  312. package/src/components/page-patterns/index.js +62 -64
  313. package/src/components/page-patterns/search-items.js +37 -3
  314. package/src/components/page-patterns/style.scss +1 -8
  315. package/src/components/page-patterns/use-patterns.js +43 -82
  316. package/src/components/page-templates/index.js +67 -64
  317. package/src/components/page-templates/style.scss +6 -9
  318. package/src/components/pagination/index.js +4 -4
  319. package/src/components/post-edit/index.js +96 -0
  320. package/src/components/post-edit/style.scss +9 -0
  321. package/src/components/post-fields/index.js +345 -0
  322. package/src/components/post-list/index.js +326 -0
  323. package/src/components/{page-pages → post-list}/style.scss +25 -8
  324. package/src/components/posts-app/index.js +9 -11
  325. package/src/components/posts-app/router.js +69 -0
  326. package/src/components/revisions/index.js +9 -1
  327. package/src/components/save-panel/index.js +1 -1
  328. package/src/components/sidebar/style.scss +6 -0
  329. package/src/components/sidebar-dataviews/add-new-view.js +2 -1
  330. package/src/components/sidebar-dataviews/custom-dataviews-list.js +6 -2
  331. package/src/components/sidebar-dataviews/default-views.js +131 -106
  332. package/src/components/sidebar-dataviews/index.js +39 -4
  333. package/src/components/sidebar-navigation-screen-global-styles/content.js +55 -0
  334. package/src/components/sidebar-navigation-screen-global-styles/index.js +1 -54
  335. package/src/components/sidebar-navigation-screen-navigation-menu/rename-modal.js +2 -1
  336. package/src/components/sidebar-navigation-screen-patterns/use-pattern-categories.js +10 -2
  337. package/src/components/site-hub/index.js +84 -1
  338. package/src/components/sync-state-with-url/use-init-edited-entity-from-url.js +3 -2
  339. package/src/hooks/push-changes-to-global-styles/index.js +2 -2
  340. package/src/hooks/use-theme-style-variations/test/use-theme-style-variations-by-property.js +28 -24
  341. package/src/hooks/use-theme-style-variations/use-theme-style-variations-by-property.js +72 -47
  342. package/src/index.js +14 -1
  343. package/src/posts.js +63 -2
  344. package/src/posts.scss +9 -0
  345. package/src/store/private-actions.js +7 -3
  346. package/src/store/selectors.js +53 -14
  347. package/src/store/test/selectors.js +1 -26
  348. package/src/style.scss +2 -2
  349. package/src/utils/get-filtered-template-parts.js +61 -0
  350. package/src/utils/test/get-filtered-template-parts.js +127 -0
  351. package/build/components/add-new-page/index.js.map +0 -1
  352. package/build/components/global-styles/screen-background.js +0 -36
  353. package/build/components/global-styles/screen-background.js.map +0 -1
  354. package/build/components/page-pages/index.js +0 -473
  355. package/build/components/page-pages/index.js.map +0 -1
  356. package/build/components/table/index.js +0 -35
  357. package/build/components/table/index.js.map +0 -1
  358. package/build-module/components/add-new-page/index.js.map +0 -1
  359. package/build-module/components/global-styles/screen-background.js +0 -30
  360. package/build-module/components/global-styles/screen-background.js.map +0 -1
  361. package/build-module/components/page-pages/index.js +0 -465
  362. package/build-module/components/page-pages/index.js.map +0 -1
  363. package/build-module/components/table/index.js +0 -30
  364. package/build-module/components/table/index.js.map +0 -1
  365. package/src/components/global-styles/screen-background.js +0 -29
  366. package/src/components/page-pages/index.js +0 -564
  367. package/src/components/table/index.js +0 -33
  368. package/src/components/table/style.scss +0 -38
@@ -116,7 +116,7 @@
116
116
  flex-direction: column;
117
117
  }
118
118
 
119
- .dataviews-filters__view-actions {
119
+ .dataviews__view-actions {
120
120
  box-sizing: border-box;
121
121
  padding: 16px 48px;
122
122
  flex-shrink: 0;
@@ -125,267 +125,436 @@
125
125
  transition: padding ease-out 0.1s;
126
126
  }
127
127
  @media (prefers-reduced-motion: reduce) {
128
- .dataviews-filters__view-actions {
128
+ .dataviews__view-actions {
129
129
  transition-duration: 0s;
130
130
  transition-delay: 0s;
131
131
  }
132
132
  }
133
- .dataviews-filters__view-actions .components-search-control .components-base-control__field {
133
+ .dataviews__view-actions .components-search-control .components-base-control__field {
134
134
  max-width: 240px;
135
135
  }
136
136
 
137
- .dataviews-filters__container .dataviews-filters__reset-button[aria-disabled=true], .dataviews-filters__container .dataviews-filters__reset-button[aria-disabled=true]:hover {
138
- opacity: 0;
137
+ .dataviews-view-list__primary-field,
138
+ .dataviews-view-grid__primary-field,
139
+ .dataviews-view-table__primary-field {
140
+ font-size: 13px;
141
+ font-weight: 500;
142
+ color: #757575;
143
+ text-overflow: ellipsis;
144
+ white-space: nowrap;
145
+ width: 100%;
139
146
  }
140
- .dataviews-filters__container .dataviews-filters__reset-button[aria-disabled=true]:focus {
141
- opacity: 1;
147
+ .dataviews-view-list__primary-field a,
148
+ .dataviews-view-grid__primary-field a,
149
+ .dataviews-view-table__primary-field a {
150
+ text-decoration: none;
151
+ text-overflow: ellipsis;
152
+ white-space: nowrap;
153
+ overflow: hidden;
154
+ display: block;
155
+ flex-grow: 0;
156
+ color: #1e1e1e;
142
157
  }
143
-
144
- .dataviews-filters-button {
145
- position: relative;
158
+ .dataviews-view-list__primary-field a:hover,
159
+ .dataviews-view-grid__primary-field a:hover,
160
+ .dataviews-view-table__primary-field a:hover {
161
+ color: var(--wp-admin-theme-color);
162
+ }
163
+ .dataviews-view-list__primary-field a:focus,
164
+ .dataviews-view-grid__primary-field a:focus,
165
+ .dataviews-view-table__primary-field a:focus {
166
+ color: var(--wp-admin-theme-color--rgb);
167
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
168
+ border-radius: 2px;
169
+ }
170
+ .dataviews-view-list__primary-field button.components-button.is-link,
171
+ .dataviews-view-grid__primary-field button.components-button.is-link,
172
+ .dataviews-view-table__primary-field button.components-button.is-link {
173
+ text-decoration: none;
174
+ font-weight: inherit;
175
+ text-overflow: ellipsis;
176
+ white-space: nowrap;
177
+ overflow: hidden;
178
+ display: block;
179
+ width: 100%;
180
+ color: #1e1e1e;
181
+ }
182
+ .dataviews-view-list__primary-field button.components-button.is-link:hover,
183
+ .dataviews-view-grid__primary-field button.components-button.is-link:hover,
184
+ .dataviews-view-table__primary-field button.components-button.is-link:hover {
185
+ color: var(--wp-admin-theme-color);
146
186
  }
147
187
 
148
- .dataviews-pagination {
149
- position: sticky;
150
- bottom: 0;
151
- right: 0;
152
- background-color: #fff;
153
- padding: 12px 48px;
154
- border-top: 1px solid #f0f0f0;
155
- color: #757575;
156
- flex-shrink: 0;
188
+ .dataviews-no-results,
189
+ .dataviews-loading {
190
+ padding: 0 48px;
191
+ flex-grow: 1;
192
+ display: flex;
193
+ align-items: center;
194
+ justify-content: center;
157
195
  transition: padding ease-out 0.1s;
158
196
  }
159
197
  @media (prefers-reduced-motion: reduce) {
160
- .dataviews-pagination {
198
+ .dataviews-no-results,
199
+ .dataviews-loading {
161
200
  transition-duration: 0s;
162
201
  transition-delay: 0s;
163
202
  }
164
203
  }
165
204
 
166
- .dataviews-pagination__page-selection {
167
- font-size: 11px;
168
- text-transform: uppercase;
169
- font-weight: 500;
170
- color: #1e1e1e;
205
+ /* stylelint-disable-next-line scss/at-rule-no-unknown -- '@container' not globally permitted */
206
+ @container (max-width: 430px) {
207
+ .dataviews__view-actions {
208
+ padding: 12px 24px;
209
+ }
210
+ .dataviews__view-actions .components-search-control .components-base-control__field {
211
+ max-width: 112px;
212
+ }
213
+
214
+ .dataviews-view-grid,
215
+ .dataviews-no-results,
216
+ .dataviews-loading {
217
+ padding-right: 24px;
218
+ padding-left: 24px;
219
+ }
220
+ }
221
+ .dataviews-bulk-actions__modal {
222
+ z-index: 1000001;
171
223
  }
172
224
 
173
- .dataviews-filters-options {
174
- margin: 32px 0 16px;
225
+ .dataviews-bulk-actions__edit-button.components-button {
226
+ flex-shrink: 0;
175
227
  }
176
228
 
177
- .dataviews-view-table {
229
+ .dataviews-bulk-actions-toolbar {
230
+ position: sticky;
231
+ display: flex;
232
+ flex-direction: column;
233
+ align-content: center;
234
+ flex-wrap: wrap;
235
+ width: -moz-fit-content;
236
+ width: fit-content;
237
+ margin-right: auto;
238
+ margin-left: auto;
239
+ bottom: 24px;
240
+ z-index: 2;
241
+ }
242
+ .dataviews-bulk-actions-toolbar .components-accessible-toolbar {
243
+ border-color: #ddd;
244
+ box-shadow: 0 0.7px 1px rgba(0, 0, 0, 0.1), 0 1.2px 1.7px -0.2px rgba(0, 0, 0, 0.1), 0 2.3px 3.3px -0.5px rgba(0, 0, 0, 0.1);
245
+ }
246
+ .dataviews-bulk-actions-toolbar .components-accessible-toolbar .components-toolbar-group {
247
+ border-color: #e0e0e0;
248
+ }
249
+ .dataviews-bulk-actions-toolbar .components-accessible-toolbar .components-toolbar-group:last-child {
250
+ border: 0;
251
+ }
252
+ .dataviews-bulk-actions-toolbar .dataviews-bulk-actions-toolbar__selection-count {
253
+ display: flex;
254
+ align-items: center;
255
+ margin: 0 8px 0 8px;
256
+ }
257
+
258
+ .dataviews-bulk-actions-toolbar__wrapper {
259
+ display: flex;
260
+ flex-grow: 1;
178
261
  width: 100%;
179
- text-indent: 0;
180
- border-color: inherit;
181
- border-collapse: collapse;
262
+ }
263
+ .dataviews-bulk-actions-toolbar__wrapper .components-toolbar-group {
264
+ align-items: center;
265
+ }
266
+ .dataviews-bulk-actions-toolbar__wrapper .components-button.is-busy {
267
+ max-height: 36px;
268
+ }
269
+
270
+ .dataviews-filters__button {
182
271
  position: relative;
183
- color: #757575;
184
- margin-bottom: auto;
185
272
  }
186
- .dataviews-view-table a {
187
- text-decoration: none;
188
- color: #1e1e1e;
189
- font-weight: 500;
273
+
274
+ .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true], .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:hover {
275
+ opacity: 0;
190
276
  }
191
- .dataviews-view-table th {
192
- text-align: right;
193
- color: #1e1e1e;
194
- font-weight: normal;
195
- font-size: 13px;
277
+ .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:focus {
278
+ opacity: 1;
196
279
  }
197
- .dataviews-view-table td,
198
- .dataviews-view-table th {
199
- padding: 12px;
200
- white-space: nowrap;
280
+
281
+ .dataviews-filters__summary-popover .components-popover__content {
282
+ width: 230px;
283
+ padding: 0;
284
+ border-radius: 4px;
201
285
  }
202
- .dataviews-view-table td[data-field-id=actions],
203
- .dataviews-view-table th[data-field-id=actions] {
204
- text-align: left;
286
+
287
+ .dataviews-filters__summary-operators-container {
288
+ padding: 8px 8px 0;
205
289
  }
206
- .dataviews-view-table td.dataviews-view-table__checkbox-column,
207
- .dataviews-view-table th.dataviews-view-table__checkbox-column {
208
- padding-left: 0;
290
+ .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-listbox) {
291
+ border-bottom: 1px solid #e0e0e0;
292
+ padding-bottom: 8px;
209
293
  }
210
- .dataviews-view-table tr {
211
- border-bottom: 1px solid #f0f0f0;
294
+ .dataviews-filters__summary-operators-container:empty {
295
+ display: none;
212
296
  }
213
- .dataviews-view-table tr .dataviews-view-table-header-button {
214
- gap: 4px;
297
+ .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name {
298
+ color: #757575;
215
299
  }
216
- .dataviews-view-table tr th:first-child, .dataviews-view-table tr th:last-child,
217
- .dataviews-view-table tr td:first-child,
218
- .dataviews-view-table tr td:last-child {
219
- transition: padding ease-out 0.1s;
300
+
301
+ .dataviews-filters__summary-chip-container {
302
+ position: relative;
303
+ white-space: pre-wrap;
220
304
  }
221
- @media (prefers-reduced-motion: reduce) {
222
- .dataviews-view-table tr th:first-child, .dataviews-view-table tr th:last-child,
223
- .dataviews-view-table tr td:first-child,
224
- .dataviews-view-table tr td:last-child {
225
- transition-duration: 0s;
226
- transition-delay: 0s;
227
- }
305
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip {
306
+ border-radius: 16px;
307
+ border: 1px solid transparent;
308
+ cursor: pointer;
309
+ padding: 4px 12px;
310
+ min-height: 32px;
311
+ background: #f0f0f0;
312
+ color: #2f2f2f;
313
+ position: relative;
314
+ display: flex;
315
+ align-items: center;
228
316
  }
229
- .dataviews-view-table tr td:first-child,
230
- .dataviews-view-table tr th:first-child {
231
- padding-right: 48px;
317
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-reset {
318
+ padding-inline-end: 28px;
232
319
  }
233
- .dataviews-view-table tr td:first-child .dataviews-view-table-header-button,
234
- .dataviews-view-table tr td:first-child .dataviews-view-table-header,
235
- .dataviews-view-table tr th:first-child .dataviews-view-table-header-button,
236
- .dataviews-view-table tr th:first-child .dataviews-view-table-header {
237
- margin-right: -8px;
320
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] {
321
+ background: #e0e0e0;
322
+ color: #1e1e1e;
238
323
  }
239
- .dataviews-view-table tr td:last-child,
240
- .dataviews-view-table tr th:last-child {
241
- padding-left: 48px;
324
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values {
325
+ color: var(--wp-admin-theme-color);
326
+ background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
242
327
  }
243
- .dataviews-view-table tr:last-child {
244
- border-bottom: 0;
328
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] {
329
+ background: rgba(var(--wp-admin-theme-color--rgb), 0.12);
245
330
  }
246
- .dataviews-view-table tr.is-hovered {
247
- background-color: #f8f8f8;
331
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible {
332
+ outline: none;
333
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
248
334
  }
249
- .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input {
250
- opacity: 0;
335
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip .dataviews-filters-__summary-filter-text-name {
336
+ font-weight: 500;
251
337
  }
252
- .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:checked, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:indeterminate, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:focus {
253
- opacity: 1;
338
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove {
339
+ width: 24px;
340
+ height: 24px;
341
+ border-radius: 50%;
342
+ border: 0;
343
+ padding: 0;
344
+ position: absolute;
345
+ left: 4px;
346
+ top: 50%;
347
+ transform: translateY(-50%);
348
+ display: flex;
349
+ align-items: center;
350
+ justify-content: center;
351
+ background: transparent;
352
+ cursor: pointer;
254
353
  }
255
- .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
256
- opacity: 0;
354
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
355
+ fill: #757575;
257
356
  }
258
- .dataviews-view-table tr:focus-within .components-checkbox-control__input,
259
- .dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .components-checkbox-control__input,
260
- .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .components-checkbox-control__input,
261
- .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
262
- opacity: 1;
357
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
358
+ background: #e0e0e0;
263
359
  }
264
- @media (hover: none) {
265
- .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input,
266
- .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
267
- opacity: 1;
268
- }
360
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
361
+ fill: #1e1e1e;
269
362
  }
270
- .dataviews-view-table tr.is-selected {
271
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
272
- color: #757575;
363
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
364
+ fill: var(--wp-admin-theme-color);
273
365
  }
274
- .dataviews-view-table tr.is-selected:hover {
275
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
366
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
367
+ background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
276
368
  }
277
- .dataviews-view-table thead {
278
- position: sticky;
279
- inset-block-start: 0;
280
- z-index: 1;
369
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible {
370
+ outline: none;
371
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
281
372
  }
282
- .dataviews-view-table thead tr {
283
- border: 0;
373
+
374
+ .dataviews-filters__search-widget-filter-combobox-list {
375
+ max-height: 184px;
376
+ padding: 4px;
377
+ overflow: auto;
378
+ border-top: 1px solid #e0e0e0;
284
379
  }
285
- .dataviews-view-table thead th {
286
- background-color: #fff;
287
- box-shadow: inset 0 -1px 0 #f0f0f0;
288
- padding-top: 8px;
289
- padding-bottom: 8px;
290
- font-size: 11px;
291
- text-transform: uppercase;
292
- font-weight: 500;
293
- padding-right: 4px;
380
+ .dataviews-filters__search-widget-filter-combobox-list .dataviews-filters__search-widget-filter-combobox-item-value [data-user-value] {
381
+ font-weight: 600;
294
382
  }
295
- .dataviews-view-table tbody td {
296
- vertical-align: top;
383
+
384
+ .dataviews-filters__search-widget-listbox {
385
+ max-height: 184px;
386
+ padding: 4px;
387
+ overflow: auto;
297
388
  }
298
- .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
299
- min-height: 32px;
389
+
390
+ .dataviews-filters__search-widget-listitem {
300
391
  display: flex;
301
392
  align-items: center;
393
+ gap: 8px;
394
+ border-radius: 2px;
395
+ box-sizing: border-box;
396
+ padding: 8px 12px;
397
+ cursor: default;
398
+ margin-block-end: 2px;
302
399
  }
303
- .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper > * {
304
- flex-grow: 1;
400
+ .dataviews-filters__search-widget-listitem:last-child {
401
+ margin-block-end: 0;
305
402
  }
306
- .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__primary-field a {
307
- flex-grow: 0;
403
+ .dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item], .dataviews-filters__search-widget-listitem:focus {
404
+ background-color: var(--wp-admin-theme-color);
405
+ color: #fff;
308
406
  }
309
- .dataviews-view-table .dataviews-view-table-header-button {
310
- padding: 4px 8px;
311
- font-size: 11px;
312
- text-transform: uppercase;
313
- font-weight: 500;
407
+ .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-check, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-check, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-check {
408
+ fill: #fff;
314
409
  }
315
- .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
316
- color: #1e1e1e;
410
+ .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-description, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-description, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-description {
411
+ color: #fff;
317
412
  }
318
- .dataviews-view-table .dataviews-view-table-header-button span {
319
- speak: none;
413
+ .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-check {
414
+ width: 24px;
415
+ height: 24px;
416
+ flex-shrink: 0;
320
417
  }
321
- .dataviews-view-table .dataviews-view-table-header-button span:empty {
322
- display: none;
418
+ .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-description {
419
+ display: block;
420
+ overflow: hidden;
421
+ text-overflow: ellipsis;
422
+ font-size: 12px;
423
+ line-height: 16px;
424
+ color: #757575;
323
425
  }
324
- .dataviews-view-table .dataviews-view-table-header {
325
- padding-right: 4px;
426
+
427
+ .dataviews-filters__search-widget-filter-combobox__wrapper {
428
+ position: relative;
429
+ padding: 8px;
326
430
  }
327
- .dataviews-view-table .dataviews-view-table__actions-column {
328
- width: 1%;
431
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
432
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
433
+ padding: 6px 8px;
434
+ box-shadow: 0 0 0 transparent;
435
+ transition: box-shadow 0.1s linear;
436
+ border-radius: 2px;
437
+ border: 1px solid #949494;
438
+ /* Fonts smaller than 16px causes mobile safari to zoom. */
439
+ font-size: 16px;
440
+ /* Override core line-height. To be reviewed. */
441
+ line-height: normal;
442
+ display: block;
443
+ padding: 0 8px 0 32px;
444
+ background: #f0f0f0;
445
+ border: none;
446
+ width: 100%;
447
+ height: 32px;
448
+ margin-right: 0;
449
+ margin-left: 0;
450
+ /* Fonts smaller than 16px causes mobile safari to zoom. */
451
+ font-size: 16px;
329
452
  }
330
- .dataviews-view-table:has(tr.is-selected) .components-checkbox-control__input {
453
+ @media (prefers-reduced-motion: reduce) {
454
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
455
+ transition-duration: 0s;
456
+ transition-delay: 0s;
457
+ }
458
+ }
459
+ @media (min-width: 600px) {
460
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
461
+ font-size: 13px;
462
+ /* Override core line-height. To be reviewed. */
463
+ line-height: normal;
464
+ }
465
+ }
466
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
467
+ border-color: var(--wp-admin-theme-color);
468
+ box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
469
+ outline: 2px solid transparent;
470
+ }
471
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-input-placeholder {
472
+ color: rgba(30, 30, 30, 0.62);
473
+ }
474
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
331
475
  opacity: 1;
476
+ color: rgba(30, 30, 30, 0.62);
477
+ }
478
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:-ms-input-placeholder {
479
+ color: rgba(30, 30, 30, 0.62);
480
+ }
481
+ @media (min-width: 600px) {
482
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
483
+ font-size: 13px;
484
+ }
485
+ }
486
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
487
+ background: #fff;
488
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
489
+ }
490
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
491
+ color: #757575;
492
+ }
493
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-decoration, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-cancel-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-decoration {
494
+ -webkit-appearance: none;
495
+ }
496
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon {
497
+ position: absolute;
498
+ left: 12px;
499
+ top: 50%;
500
+ transform: translateY(-50%);
501
+ display: flex;
502
+ align-items: center;
503
+ justify-content: center;
504
+ width: 24px;
332
505
  }
333
506
 
334
- .dataviews-view-list__primary-field,
335
- .dataviews-view-grid__primary-field,
336
- .dataviews-view-table__primary-field {
337
- font-size: 13px;
338
- font-weight: 500;
507
+ .dataviews-pagination {
508
+ position: sticky;
509
+ bottom: 0;
510
+ right: 0;
511
+ background-color: #fff;
512
+ padding: 12px 48px;
513
+ border-top: 1px solid #f0f0f0;
339
514
  color: #757575;
340
- text-overflow: ellipsis;
341
- white-space: nowrap;
342
- display: block;
343
- width: 100%;
515
+ flex-shrink: 0;
516
+ transition: padding ease-out 0.1s;
344
517
  }
345
- .dataviews-view-list__primary-field a,
346
- .dataviews-view-grid__primary-field a,
347
- .dataviews-view-table__primary-field a {
348
- text-decoration: none;
349
- text-overflow: ellipsis;
350
- white-space: nowrap;
351
- overflow: hidden;
352
- display: block;
353
- flex-grow: 0;
518
+ @media (prefers-reduced-motion: reduce) {
519
+ .dataviews-pagination {
520
+ transition-duration: 0s;
521
+ transition-delay: 0s;
522
+ }
523
+ }
524
+
525
+ .dataviews-pagination__page-selection {
526
+ font-size: 11px;
527
+ text-transform: uppercase;
528
+ font-weight: 500;
354
529
  color: #1e1e1e;
355
530
  }
356
- .dataviews-view-list__primary-field a:hover,
357
- .dataviews-view-grid__primary-field a:hover,
358
- .dataviews-view-table__primary-field a:hover {
359
- color: var(--wp-admin-theme-color);
531
+
532
+ /* stylelint-disable-next-line scss/at-rule-no-unknown -- '@container' not globally permitted */
533
+ @container (max-width: 430px) {
534
+ .dataviews-pagination {
535
+ padding: 12px 24px;
536
+ }
360
537
  }
361
- .dataviews-view-list__primary-field a:focus,
362
- .dataviews-view-grid__primary-field a:focus,
363
- .dataviews-view-table__primary-field a:focus {
364
- color: var(--wp-admin-theme-color--rgb);
365
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
366
- border-radius: 2px;
538
+ .dataviews-action-modal {
539
+ z-index: 1000001;
367
540
  }
368
- .dataviews-view-list__primary-field button.components-button.is-link,
369
- .dataviews-view-grid__primary-field button.components-button.is-link,
370
- .dataviews-view-table__primary-field button.components-button.is-link {
371
- text-decoration: none;
372
- font-weight: inherit;
373
- text-overflow: ellipsis;
374
- white-space: nowrap;
375
- overflow: hidden;
376
- display: block;
377
- width: 100%;
378
- color: #1e1e1e;
541
+
542
+ .dataviews-selection-checkbox {
543
+ --checkbox-input-size: 24px;
544
+ line-height: 0;
545
+ flex-shrink: 0;
379
546
  }
380
- .dataviews-view-list__primary-field button.components-button.is-link:hover,
381
- .dataviews-view-grid__primary-field button.components-button.is-link:hover,
382
- .dataviews-view-table__primary-field button.components-button.is-link:hover {
383
- color: var(--wp-admin-theme-color);
547
+ @media (min-width: 600px) {
548
+ .dataviews-selection-checkbox {
549
+ --checkbox-input-size: 16px;
550
+ }
551
+ }
552
+ .dataviews-selection-checkbox .components-checkbox-control__input-container {
553
+ margin: 0;
384
554
  }
385
555
 
386
556
  .dataviews-view-grid {
387
557
  margin-bottom: auto;
388
- grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
389
558
  grid-template-rows: max-content;
390
559
  padding: 0 48px 24px;
391
560
  transition: padding ease-out 0.1s;
@@ -396,21 +565,6 @@
396
565
  transition-delay: 0s;
397
566
  }
398
567
  }
399
- @media (min-width: 480px) {
400
- .dataviews-view-grid {
401
- grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
402
- }
403
- }
404
- @media (min-width: 1080px) {
405
- .dataviews-view-grid {
406
- grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
407
- }
408
- }
409
- @media (min-width: 1440px) {
410
- .dataviews-view-grid {
411
- grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
412
- }
413
- }
414
568
  .dataviews-view-grid .dataviews-view-grid__card {
415
569
  height: 100%;
416
570
  justify-content: flex-start;
@@ -424,17 +578,12 @@
424
578
  .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
425
579
  color: #1e1e1e;
426
580
  }
427
- .dataviews-view-grid .dataviews-view-grid__card.is-selected .page-pages-preview-field__button::after {
428
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
429
- background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
430
- }
431
581
  .dataviews-view-grid .dataviews-view-grid__media {
432
582
  width: 100%;
433
583
  min-height: 200px;
434
584
  aspect-ratio: 1/1;
435
585
  background-color: #f0f0f0;
436
586
  border-radius: 4px;
437
- overflow: hidden;
438
587
  position: relative;
439
588
  }
440
589
  .dataviews-view-grid .dataviews-view-grid__media img {
@@ -463,6 +612,7 @@
463
612
  }
464
613
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field {
465
614
  align-items: flex-start;
615
+ min-height: 24px;
466
616
  }
467
617
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field:not(.is-column) {
468
618
  align-items: center;
@@ -476,6 +626,9 @@
476
626
  text-overflow: ellipsis;
477
627
  white-space: nowrap;
478
628
  }
629
+ .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field.is-column + .is-row {
630
+ margin-top: 4px;
631
+ }
479
632
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
480
633
  color: #757575;
481
634
  }
@@ -494,6 +647,39 @@
494
647
  font-size: 12px;
495
648
  }
496
649
 
650
+ .dataviews-view-grid.dataviews-view-grid {
651
+ grid-template-columns: repeat(1, minmax(0, 1fr));
652
+ }
653
+ @media (min-width: 480px) {
654
+ .dataviews-view-grid.dataviews-view-grid {
655
+ grid-template-columns: repeat(2, minmax(0, 1fr));
656
+ }
657
+ }
658
+ @media (min-width: 1080px) {
659
+ .dataviews-view-grid.dataviews-view-grid {
660
+ grid-template-columns: repeat(3, minmax(0, 1fr));
661
+ }
662
+ }
663
+ @media (min-width: 1440px) {
664
+ .dataviews-view-grid.dataviews-view-grid {
665
+ grid-template-columns: repeat(4, minmax(0, 1fr));
666
+ }
667
+ }
668
+ @media (min-width: 1920px) {
669
+ .dataviews-view-grid.dataviews-view-grid {
670
+ grid-template-columns: repeat(5, minmax(0, 1fr));
671
+ }
672
+ }
673
+
674
+ .dataviews-density-picker__range-control {
675
+ width: 200px;
676
+ }
677
+
678
+ .dataviews-view-grid__field-value:empty,
679
+ .dataviews-view-grid__field:empty {
680
+ display: none;
681
+ }
682
+
497
683
  .dataviews-view-list {
498
684
  margin: 0 0 auto;
499
685
  }
@@ -509,20 +695,40 @@
509
695
  .dataviews-view-list li .dataviews-view-list__item-wrapper > * {
510
696
  width: 100%;
511
697
  }
698
+ .dataviews-view-list li .dataviews-view-list__item-actions {
699
+ position: absolute;
700
+ top: 16px;
701
+ left: 0;
702
+ }
703
+ .dataviews-view-list li .dataviews-view-list__item-actions > div {
704
+ height: 24px;
705
+ }
512
706
  .dataviews-view-list li .dataviews-view-list__item-actions .components-button {
513
707
  opacity: 0;
514
- position: fixed;
515
- left: 0;
708
+ }
709
+ .dataviews-view-list li:has(.dataviews-view-list__fields:empty) .dataviews-view-list__item-actions {
710
+ top: 50%;
711
+ transform: translateY(-50%);
516
712
  }
517
713
  .dataviews-view-list li.is-selected .dataviews-view-list__item-actions, .dataviews-view-list li.is-hovered .dataviews-view-list__item-actions, .dataviews-view-list li:focus-within .dataviews-view-list__item-actions {
518
- padding-left: 32px;
714
+ background: #f8f8f8;
715
+ padding-right: 8px;
716
+ margin-left: 24px;
717
+ box-shadow: 12px 0 8px 0 #f8f8f8;
519
718
  }
520
719
  .dataviews-view-list li.is-selected .dataviews-view-list__item-actions .components-button, .dataviews-view-list li.is-hovered .dataviews-view-list__item-actions .components-button, .dataviews-view-list li:focus-within .dataviews-view-list__item-actions .components-button {
521
720
  opacity: 1;
522
721
  position: static;
523
722
  }
524
- .dataviews-view-list li.is-selected .dataviews-view-list__item, .dataviews-view-list li.is-hovered .dataviews-view-list__item, .dataviews-view-list li:focus-within .dataviews-view-list__item {
525
- padding-left: 0;
723
+ .dataviews-view-list li.is-selected .dataviews-view-list__item-actions {
724
+ background-color: #f7f8ff;
725
+ box-shadow: 12px 0 8px 0 #f7f8ff;
726
+ }
727
+ .dataviews-view-list li.is-selected.is-selected {
728
+ border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
729
+ }
730
+ .dataviews-view-list li.is-selected.is-selected + li {
731
+ border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
526
732
  }
527
733
  .dataviews-view-list li:not(.is-selected) .dataviews-view-list__primary-field {
528
734
  color: #1e1e1e;
@@ -548,7 +754,7 @@
548
754
  color: var(--wp-admin-theme-color);
549
755
  }
550
756
  .dataviews-view-list .dataviews-view-list__item {
551
- padding: 16px 24px 16px 0;
757
+ padding: 16px 24px;
552
758
  width: 100%;
553
759
  scroll-margin: 8px 0;
554
760
  }
@@ -563,13 +769,13 @@
563
769
  border-radius: 2px;
564
770
  }
565
771
  .dataviews-view-list .dataviews-view-list__item .dataviews-view-list__primary-field {
566
- min-height: 20px;
567
- line-height: 20px;
772
+ min-height: 24px;
773
+ line-height: 24px;
568
774
  overflow: hidden;
569
775
  }
570
776
  .dataviews-view-list .dataviews-view-list__media-wrapper {
571
- width: 40px;
572
- height: 40px;
777
+ width: 52px;
778
+ height: 52px;
573
779
  overflow: hidden;
574
780
  position: relative;
575
781
  flex-shrink: 0;
@@ -596,303 +802,182 @@
596
802
  height: 32px;
597
803
  background-color: #e0e0e0;
598
804
  }
805
+ .dataviews-view-list .dataviews-view-list__field-wrapper {
806
+ min-height: 52px;
807
+ }
599
808
  .dataviews-view-list .dataviews-view-list__fields {
600
809
  color: #757575;
601
810
  display: flex;
602
- gap: 8px;
811
+ gap: 12px;
812
+ row-gap: 4px;
603
813
  flex-wrap: wrap;
604
814
  font-size: 12px;
605
815
  }
816
+ .dataviews-view-list .dataviews-view-list__fields:empty {
817
+ display: none;
818
+ }
606
819
  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field:has(.dataviews-view-list__field-value:empty) {
607
820
  display: none;
608
821
  }
609
822
  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field-value {
610
- line-height: 20px;
611
- display: inline-flex;
612
- }
613
- .dataviews-view-list .dataviews-view-list__item-actions {
614
- padding-left: 24px;
823
+ line-height: 24px;
615
824
  }
616
825
  .dataviews-view-list + .dataviews-pagination {
617
826
  justify-content: space-between;
618
827
  }
619
828
 
620
- .dataviews-action-modal {
621
- z-index: 1000001;
622
- }
623
-
624
- .dataviews-no-results,
625
- .dataviews-loading {
626
- padding: 0 48px;
627
- flex-grow: 1;
628
- display: flex;
629
- align-items: center;
630
- justify-content: center;
631
- transition: padding ease-out 0.1s;
632
- }
633
- @media (prefers-reduced-motion: reduce) {
634
- .dataviews-no-results,
635
- .dataviews-loading {
636
- transition-duration: 0s;
637
- transition-delay: 0s;
638
- }
639
- }
640
-
641
- .dataviews-view-table-selection-checkbox {
642
- --checkbox-input-size: 24px;
643
- line-height: 0;
644
- flex-shrink: 0;
645
- }
646
- @media (min-width: 600px) {
647
- .dataviews-view-table-selection-checkbox {
648
- --checkbox-input-size: 16px;
649
- }
650
- }
651
- .dataviews-view-table-selection-checkbox .components-checkbox-control__input-container {
652
- margin: 0;
653
- }
654
-
655
- .dataviews-bulk-edit-button.components-button {
656
- flex-shrink: 0;
657
- }
658
-
659
- .dataviews-filter-summary__popover .components-popover__content {
660
- width: 230px;
661
- padding: 0;
662
- border-radius: 4px;
663
- }
664
-
665
- .dataviews-search-widget-filter-combobox-list {
666
- max-height: 184px;
667
- padding: 4px;
668
- overflow: auto;
669
- border-top: 1px solid #e0e0e0;
670
- }
671
- .dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item-value [data-user-value] {
672
- font-weight: 600;
673
- }
674
-
675
- .dataviews-search-widget-listbox {
676
- max-height: 184px;
677
- padding: 4px;
678
- overflow: auto;
679
- }
680
-
681
- .dataviews-search-widget-listitem {
682
- display: flex;
683
- align-items: center;
684
- gap: 8px;
685
- border-radius: 2px;
686
- box-sizing: border-box;
687
- padding: 8px 12px;
688
- cursor: default;
689
- margin-block-end: 2px;
829
+ .dataviews-view-table {
830
+ width: 100%;
831
+ text-indent: 0;
832
+ border-color: inherit;
833
+ border-collapse: collapse;
834
+ position: relative;
835
+ color: #757575;
836
+ margin-bottom: auto;
690
837
  }
691
- .dataviews-search-widget-listitem:last-child {
692
- margin-block-end: 0;
838
+ .dataviews-view-table a {
839
+ text-decoration: none;
840
+ color: #1e1e1e;
841
+ font-weight: 500;
693
842
  }
694
- .dataviews-search-widget-listitem:hover, .dataviews-search-widget-listitem[data-active-item], .dataviews-search-widget-listitem:focus {
695
- background-color: var(--wp-admin-theme-color);
696
- color: #fff;
843
+ .dataviews-view-table th {
844
+ text-align: right;
845
+ color: #1e1e1e;
846
+ font-weight: normal;
847
+ font-size: 13px;
697
848
  }
698
- .dataviews-search-widget-listitem:hover .dataviews-search-widget-listitem-check, .dataviews-search-widget-listitem[data-active-item] .dataviews-search-widget-listitem-check, .dataviews-search-widget-listitem:focus .dataviews-search-widget-listitem-check {
699
- fill: #fff;
849
+ .dataviews-view-table td,
850
+ .dataviews-view-table th {
851
+ padding: 12px;
852
+ white-space: nowrap;
700
853
  }
701
- .dataviews-search-widget-listitem:hover .dataviews-search-widget-listitem-description, .dataviews-search-widget-listitem[data-active-item] .dataviews-search-widget-listitem-description, .dataviews-search-widget-listitem:focus .dataviews-search-widget-listitem-description {
702
- color: #fff;
854
+ .dataviews-view-table td.dataviews-view-table__actions-column,
855
+ .dataviews-view-table th.dataviews-view-table__actions-column {
856
+ text-align: left;
703
857
  }
704
- .dataviews-search-widget-listitem .dataviews-search-widget-listitem-check {
705
- width: 24px;
706
- height: 24px;
707
- flex-shrink: 0;
858
+ .dataviews-view-table td.dataviews-view-table__checkbox-column,
859
+ .dataviews-view-table th.dataviews-view-table__checkbox-column {
860
+ padding-left: 0;
708
861
  }
709
- .dataviews-search-widget-listitem .dataviews-search-widget-listitem-description {
710
- display: block;
711
- overflow: hidden;
712
- text-overflow: ellipsis;
713
- font-size: 12px;
714
- line-height: 16px;
715
- color: #757575;
862
+ .dataviews-view-table tr {
863
+ border-top: 1px solid #f0f0f0;
716
864
  }
717
-
718
- .dataviews-search-widget-filter-combobox__wrapper {
719
- position: relative;
720
- padding: 8px;
865
+ .dataviews-view-table tr .dataviews-view-table-header-button {
866
+ gap: 4px;
721
867
  }
722
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
723
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
724
- padding: 6px 8px;
725
- box-shadow: 0 0 0 transparent;
726
- transition: box-shadow 0.1s linear;
727
- border-radius: 2px;
728
- border: 1px solid #949494;
729
- /* Fonts smaller than 16px causes mobile safari to zoom. */
730
- font-size: 16px;
731
- /* Override core line-height. To be reviewed. */
732
- line-height: normal;
733
- display: block;
734
- padding: 0 8px 0 32px;
735
- background: #f0f0f0;
736
- border: none;
737
- width: 100%;
738
- height: 32px;
739
- margin-right: 0;
740
- margin-left: 0;
741
- /* Fonts smaller than 16px causes mobile safari to zoom. */
742
- font-size: 16px;
868
+ .dataviews-view-table tr td:first-child,
869
+ .dataviews-view-table tr th:first-child {
870
+ padding-right: 48px;
743
871
  }
744
- @media (prefers-reduced-motion: reduce) {
745
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
746
- transition-duration: 0s;
747
- transition-delay: 0s;
748
- }
872
+ .dataviews-view-table tr td:first-child .dataviews-view-table-header-button,
873
+ .dataviews-view-table tr td:first-child .dataviews-view-table-header,
874
+ .dataviews-view-table tr th:first-child .dataviews-view-table-header-button,
875
+ .dataviews-view-table tr th:first-child .dataviews-view-table-header {
876
+ margin-right: -8px;
749
877
  }
750
- @media (min-width: 600px) {
751
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
752
- font-size: 13px;
753
- /* Override core line-height. To be reviewed. */
754
- line-height: normal;
755
- }
878
+ .dataviews-view-table tr td:last-child,
879
+ .dataviews-view-table tr th:last-child {
880
+ padding-left: 48px;
756
881
  }
757
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:focus {
758
- border-color: var(--wp-admin-theme-color);
759
- box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
760
- outline: 2px solid transparent;
882
+ .dataviews-view-table tr:last-child {
883
+ border-bottom: 0;
761
884
  }
762
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-input-placeholder {
763
- color: rgba(30, 30, 30, 0.62);
885
+ .dataviews-view-table tr.is-hovered {
886
+ background-color: #f8f8f8;
887
+ }
888
+ .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input {
889
+ opacity: 0;
764
890
  }
765
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-moz-placeholder {
891
+ .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:checked, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:indeterminate, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:focus {
766
892
  opacity: 1;
767
- color: rgba(30, 30, 30, 0.62);
768
893
  }
769
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:-ms-input-placeholder {
770
- color: rgba(30, 30, 30, 0.62);
894
+ .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
895
+ opacity: 0;
771
896
  }
772
- @media (min-width: 600px) {
773
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
774
- font-size: 13px;
775
- }
897
+ .dataviews-view-table tr:focus-within .components-checkbox-control__input,
898
+ .dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .components-checkbox-control__input,
899
+ .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .components-checkbox-control__input,
900
+ .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
901
+ opacity: 1;
776
902
  }
777
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:focus {
778
- background: #fff;
779
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
903
+ @media (hover: none) {
904
+ .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input,
905
+ .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
906
+ opacity: 1;
907
+ }
780
908
  }
781
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::placeholder {
909
+ .dataviews-view-table tr.is-selected {
910
+ background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
782
911
  color: #757575;
783
912
  }
784
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-decoration, .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-cancel-button, .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-results-button, .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-results-decoration {
785
- -webkit-appearance: none;
913
+ .dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected + tr {
914
+ border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
786
915
  }
787
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__icon {
788
- position: absolute;
789
- left: 12px;
790
- top: 50%;
791
- transform: translateY(-50%);
792
- display: flex;
793
- align-items: center;
794
- justify-content: center;
795
- width: 24px;
916
+ .dataviews-view-table tr.is-selected:hover {
917
+ background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
796
918
  }
797
-
798
- .dataviews-filter-summary__operators-container {
799
- padding: 8px 8px 0;
919
+ .dataviews-view-table thead {
920
+ position: sticky;
921
+ inset-block-start: 0;
922
+ z-index: 1;
800
923
  }
801
- .dataviews-filter-summary__operators-container:has(+ .dataviews-search-widget-listbox) {
802
- border-bottom: 1px solid #e0e0e0;
803
- padding-bottom: 8px;
924
+ .dataviews-view-table thead tr {
925
+ border: 0;
804
926
  }
805
- .dataviews-filter-summary__operators-container:empty {
806
- display: none;
927
+ .dataviews-view-table thead th {
928
+ background-color: #fff;
929
+ padding-top: 8px;
930
+ padding-bottom: 8px;
931
+ padding-right: 12px;
932
+ font-size: 11px;
933
+ text-transform: uppercase;
934
+ font-weight: 500;
807
935
  }
808
- .dataviews-filter-summary__operators-container .dataviews-filter-summary__operators-filter-name {
809
- color: #757575;
936
+ .dataviews-view-table thead th:has(.dataviews-view-table-header-button):not(:first-child) {
937
+ padding-right: 4px;
810
938
  }
811
-
812
- .dataviews-filter-summary__chip-container {
813
- position: relative;
814
- white-space: pre-wrap;
939
+ .dataviews-view-table tbody td {
940
+ vertical-align: top;
815
941
  }
816
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip {
817
- border-radius: 16px;
818
- border: 1px solid transparent;
819
- cursor: pointer;
820
- padding: 0 12px;
821
- height: 32px;
822
- background: #f0f0f0;
823
- color: #757575;
824
- position: relative;
942
+ .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
943
+ min-height: 32px;
825
944
  display: flex;
826
945
  align-items: center;
827
946
  }
828
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-reset {
829
- padding-inline-end: 28px;
830
- }
831
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:hover, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:focus-visible, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip[aria-expanded=true] {
832
- background: #e0e0e0;
833
- color: #1e1e1e;
834
- }
835
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values {
836
- color: var(--wp-admin-theme-color);
837
- background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
838
- }
839
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values:hover, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values[aria-expanded=true] {
840
- background: rgba(var(--wp-admin-theme-color--rgb), 0.12);
841
- }
842
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:focus-visible {
843
- outline: none;
844
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
947
+ .dataviews-view-table tbody .components-v-stack > .dataviews-view-table__cell-content-wrapper:not(:first-child) {
948
+ min-height: 0;
845
949
  }
846
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip .dataviews-filter-summary__filter-text-name {
950
+ .dataviews-view-table .dataviews-view-table-header-button {
951
+ padding: 4px 8px;
952
+ font-size: 11px;
953
+ text-transform: uppercase;
847
954
  font-weight: 500;
848
955
  }
849
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove {
850
- width: 24px;
851
- height: 24px;
852
- border-radius: 50%;
853
- border: 0;
854
- padding: 0;
855
- position: absolute;
856
- left: 4px;
857
- top: 50%;
858
- transform: translateY(-50%);
859
- display: flex;
860
- align-items: center;
861
- justify-content: center;
862
- background: transparent;
863
- cursor: pointer;
956
+ .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
957
+ color: #1e1e1e;
864
958
  }
865
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove svg {
866
- fill: #757575;
959
+ .dataviews-view-table .dataviews-view-table-header-button span {
960
+ speak: none;
867
961
  }
868
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:hover, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus {
869
- background: #e0e0e0;
962
+ .dataviews-view-table .dataviews-view-table-header-button span:empty {
963
+ display: none;
870
964
  }
871
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:hover svg, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus svg {
872
- fill: #1e1e1e;
965
+ .dataviews-view-table .dataviews-view-table-header {
966
+ padding-right: 4px;
873
967
  }
874
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove.has-values svg {
875
- fill: var(--wp-admin-theme-color);
968
+ .dataviews-view-table .dataviews-view-table__actions-column {
969
+ width: 1%;
876
970
  }
877
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove.has-values:hover {
878
- background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
971
+ .dataviews-view-table:has(tr.is-selected) .components-checkbox-control__input {
972
+ opacity: 1;
879
973
  }
880
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus-visible {
881
- outline: none;
882
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
974
+
975
+ .dataviews-view-table__cell-content-wrapper:empty {
976
+ display: none;
883
977
  }
884
978
 
885
979
  /* stylelint-disable-next-line scss/at-rule-no-unknown -- '@container' not globally permitted */
886
980
  @container (max-width: 430px) {
887
- .dataviews-pagination,
888
- .dataviews-filters__view-actions {
889
- padding: 12px 24px;
890
- }
891
-
892
- .dataviews-filters__view-actions .components-search-control .components-base-control__field {
893
- max-width: 112px;
894
- }
895
-
896
981
  .dataviews-view-table tr td:first-child,
897
982
  .dataviews-view-table tr th:first-child {
898
983
  padding-right: 24px;
@@ -902,53 +987,14 @@
902
987
  .dataviews-view-table tr th:last-child {
903
988
  padding-left: 24px;
904
989
  }
905
-
906
- .dataviews-view-grid,
907
- .dataviews-no-results,
908
- .dataviews-loading {
909
- padding-right: 24px;
910
- padding-left: 24px;
911
- }
912
- }
913
- .dataviews-bulk-actions-toolbar-wrapper {
914
- display: flex;
915
- flex-grow: 1;
916
- width: 100%;
917
- }
918
- .dataviews-bulk-actions-toolbar-wrapper .components-toolbar-group {
919
- align-items: center;
920
- }
921
- .dataviews-bulk-actions-toolbar-wrapper .components-button.is-busy {
922
- max-height: 36px;
923
- }
924
-
925
- .dataviews-bulk-actions {
926
- position: sticky;
927
- display: flex;
928
- flex-direction: column;
929
- align-content: center;
930
- flex-wrap: wrap;
931
- width: -moz-fit-content;
932
- width: fit-content;
933
- margin-right: auto;
934
- margin-left: auto;
935
- bottom: 24px;
936
- z-index: 2;
937
990
  }
938
- .dataviews-bulk-actions .components-accessible-toolbar {
939
- border-color: #ddd;
940
- box-shadow: 0 0.7px 1px rgba(0, 0, 0, 0.1), 0 1.2px 1.7px -0.2px rgba(0, 0, 0, 0.1), 0 2.3px 3.3px -0.5px rgba(0, 0, 0, 0.1);
941
- }
942
- .dataviews-bulk-actions .components-accessible-toolbar .components-toolbar-group {
943
- border-color: #e0e0e0;
944
- }
945
- .dataviews-bulk-actions .components-accessible-toolbar .components-toolbar-group:last-child {
946
- border: 0;
991
+ .dataviews-view-table-selection-checkbox {
992
+ --checkbox-input-size: 24px;
947
993
  }
948
- .dataviews-bulk-actions .dataviews-bulk-actions__selection-count {
949
- display: flex;
950
- align-items: center;
951
- margin: 0 8px 0 8px;
994
+ @media (min-width: 600px) {
995
+ .dataviews-view-table-selection-checkbox {
996
+ --checkbox-input-size: 16px;
997
+ }
952
998
  }
953
999
 
954
1000
  .edit-site-layout {
@@ -975,7 +1021,7 @@
975
1021
  }
976
1022
  @media (min-width: 782px) {
977
1023
  .edit-site-layout__sidebar-region {
978
- width: 360px;
1024
+ width: 300px;
979
1025
  }
980
1026
  }
981
1027
  .edit-site-layout.is-full-canvas .edit-site-layout__sidebar-region {
@@ -1004,6 +1050,17 @@
1004
1050
  position: relative;
1005
1051
  width: 100%;
1006
1052
  z-index: 2;
1053
+ /*
1054
+ * The SiteHubMobile component is displayed
1055
+ * for pages that do not have a sidebar,
1056
+ * yet it needs the Sidebar component for the React context.
1057
+ *
1058
+ * This removes the padding in this scenario.
1059
+ * See https://github.com/WordPress/gutenberg/pull/63118
1060
+ */
1061
+ }
1062
+ .edit-site-layout__mobile .edit-site-sidebar__screen-wrapper {
1063
+ padding: 0;
1007
1064
  }
1008
1065
 
1009
1066
  .edit-site-layout__canvas-container {
@@ -1099,8 +1156,10 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
1099
1156
  .edit-site-layout__view-mode-toggle.components-button:hover, .edit-site-layout__view-mode-toggle.components-button:active {
1100
1157
  color: #fff;
1101
1158
  }
1102
- .edit-site-layout__view-mode-toggle.components-button:focus {
1103
- box-shadow: none;
1159
+ .edit-site-layout__view-mode-toggle.components-button:focus-visible, .edit-site-layout__view-mode-toggle.components-button:focus {
1160
+ box-shadow: 0 0 0 3px #1e1e1e, 0 0 0 6px var(--wp-admin-theme-color);
1161
+ outline: 4px solid #0000;
1162
+ outline-offset: 4px;
1104
1163
  }
1105
1164
  .edit-site-layout__view-mode-toggle.components-button::before {
1106
1165
  transition: box-shadow 0.1s ease;
@@ -1120,9 +1179,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
1120
1179
  transition-delay: 0s;
1121
1180
  }
1122
1181
  }
1123
- .edit-site-layout__view-mode-toggle.components-button:focus::before {
1124
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) rgba(255, 255, 255, 0.1), inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1125
- }
1126
1182
  .edit-site-layout__view-mode-toggle.components-button .edit-site-layout__view-mode-toggle-icon {
1127
1183
  display: flex;
1128
1184
  height: 64px;
@@ -1175,6 +1231,20 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
1175
1231
  padding-left: 16px;
1176
1232
  }
1177
1233
 
1234
+ .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus-visible, .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus {
1235
+ box-shadow: none;
1236
+ outline: none;
1237
+ outline-offset: 0;
1238
+ }
1239
+ .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus-visible .edit-site-site-icon svg, .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus .edit-site-site-icon svg {
1240
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #3858e9);
1241
+ outline: 3px solid #0000;
1242
+ height: 40px;
1243
+ width: 40px;
1244
+ padding: 2px;
1245
+ border-radius: 2px;
1246
+ }
1247
+
1178
1248
  .edit-site-page {
1179
1249
  color: #2f2f2f;
1180
1250
  background: #fff;
@@ -1266,9 +1336,11 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
1266
1336
  .edit-site-sidebar__content {
1267
1337
  flex-grow: 1;
1268
1338
  overflow-y: auto;
1339
+ overflow-x: hidden;
1340
+ contain: content;
1269
1341
  }
1270
1342
 
1271
- @keyframes _61x0r_slide-from-right {
1343
+ @keyframes _9l0co_slide-from-right {
1272
1344
  from {
1273
1345
  transform: translateX(-50px);
1274
1346
  opacity: 0;
@@ -1278,7 +1350,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
1278
1350
  opacity: 1;
1279
1351
  }
1280
1352
  }
1281
- @keyframes _61x0r_slide-from-left {
1353
+ @keyframes _9l0co_slide-from-left {
1282
1354
  from {
1283
1355
  transform: translateX(50px);
1284
1356
  opacity: 0;
@@ -1334,10 +1406,10 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
1334
1406
  }
1335
1407
  }
1336
1408
  .edit-site-sidebar__screen-wrapper.slide-from-left {
1337
- animation-name: _61x0r_slide-from-left;
1409
+ animation-name: _9l0co_slide-from-left;
1338
1410
  }
1339
1411
  .edit-site-sidebar__screen-wrapper.slide-from-right {
1340
- animation-name: _61x0r_slide-from-right;
1412
+ animation-name: _9l0co_slide-from-right;
1341
1413
  }
1342
1414
 
1343
1415
  .edit-site-site-hub {
@@ -1461,6 +1533,85 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
1461
1533
  background: #fff;
1462
1534
  }
1463
1535
 
1536
+ .edit-site-post-list__featured-image {
1537
+ height: 100%;
1538
+ object-fit: cover;
1539
+ width: 100%;
1540
+ }
1541
+
1542
+ .edit-site-post-list__featured-image-wrapper {
1543
+ height: 100%;
1544
+ width: 100%;
1545
+ border-radius: 4px;
1546
+ }
1547
+ .edit-site-post-list__featured-image-wrapper.is-layout-table:not(:has(.edit-site-post-list__featured-image-button)), .edit-site-post-list__featured-image-wrapper.is-layout-table .edit-site-post-list__featured-image-button {
1548
+ width: 32px;
1549
+ height: 32px;
1550
+ display: block;
1551
+ border-radius: 4px;
1552
+ position: relative;
1553
+ overflow: hidden;
1554
+ background-color: #f0f0f0;
1555
+ flex-grow: 0 !important;
1556
+ }
1557
+ .edit-site-post-list__featured-image-wrapper.is-layout-table:not(:has(.edit-site-post-list__featured-image-button))::after, .edit-site-post-list__featured-image-wrapper.is-layout-table .edit-site-post-list__featured-image-button::after {
1558
+ border-radius: 4px;
1559
+ box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
1560
+ content: "";
1561
+ height: 100%;
1562
+ right: 0;
1563
+ position: absolute;
1564
+ top: 0;
1565
+ width: 100%;
1566
+ }
1567
+
1568
+ .edit-site-post-list__featured-image-button {
1569
+ box-shadow: none;
1570
+ border: none;
1571
+ padding: 0;
1572
+ background-color: unset;
1573
+ box-sizing: border-box;
1574
+ cursor: pointer;
1575
+ overflow: hidden;
1576
+ height: 100%;
1577
+ width: 100%;
1578
+ border-radius: 4px;
1579
+ }
1580
+ .edit-site-post-list__featured-image-button:focus-visible {
1581
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1582
+ outline: 2px solid transparent;
1583
+ }
1584
+
1585
+ .dataviews-view-grid__card.is-selected .edit-site-post-list__featured-image-button::after {
1586
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1587
+ background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
1588
+ }
1589
+
1590
+ .edit-site-post-list__title span {
1591
+ text-overflow: ellipsis;
1592
+ overflow: hidden;
1593
+ }
1594
+
1595
+ .edit-site-post-list__title-badge {
1596
+ background: #f0f0f0;
1597
+ color: #757575;
1598
+ padding: 0 4px;
1599
+ border-radius: 2px;
1600
+ font-size: 12px;
1601
+ font-weight: 400;
1602
+ flex-shrink: 0;
1603
+ line-height: 20px;
1604
+ }
1605
+
1606
+ .edit-site-post-list__status-icon {
1607
+ height: 24px;
1608
+ width: 24px;
1609
+ }
1610
+ .edit-site-post-list__status-icon svg {
1611
+ fill: currentColor;
1612
+ margin-right: -4px;
1613
+ }
1614
+
1464
1615
  .edit-site-resizable-frame__inner {
1465
1616
  position: relative;
1466
1617
  }
@@ -1704,4 +1855,11 @@ body .media-frame select.attachment-filters:last-of-type {
1704
1855
  .no-js #gutenberg-posts-dashboard {
1705
1856
  min-height: 0;
1706
1857
  position: static;
1858
+ }
1859
+ #gutenberg-posts-dashboard .components-editor-notices__snackbar {
1860
+ position: fixed;
1861
+ left: 0;
1862
+ bottom: 16px;
1863
+ padding-right: 16px;
1864
+ padding-left: 16px;
1707
1865
  }