@wordpress/dataviews 16.0.0 → 17.0.1-next.v.202606191442.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 (110) hide show
  1. package/CHANGELOG.md +44 -1
  2. package/README.md +2 -2
  3. package/build/components/dataform-layouts/panel/summary-button.cjs.map +2 -2
  4. package/build/components/dataform-layouts/panel/utils/get-label-content.cjs.map +2 -2
  5. package/build/components/dataviews-filters/filter.cjs.map +2 -2
  6. package/build/components/dataviews-layouts/grid/composite-grid.cjs.map +2 -2
  7. package/build/components/dataviews-layouts/index.cjs +9 -0
  8. package/build/components/dataviews-layouts/index.cjs.map +3 -3
  9. package/build/components/dataviews-layouts/list/index.cjs.map +1 -1
  10. package/build/components/dataviews-layouts/picker-activity/index.cjs +304 -0
  11. package/build/components/dataviews-layouts/picker-activity/index.cjs.map +7 -0
  12. package/build/components/dataviews-layouts/table/column-primary.cjs +2 -2
  13. package/build/components/dataviews-layouts/table/column-primary.cjs.map +2 -2
  14. package/build/components/dataviews-pagination/index.cjs.map +1 -1
  15. package/build/components/dataviews-picker-footer/index.cjs +72 -33
  16. package/build/components/dataviews-picker-footer/index.cjs.map +2 -2
  17. package/build/components/dataviews-view-config/index.cjs +1 -0
  18. package/build/components/dataviews-view-config/index.cjs.map +2 -2
  19. package/build/constants.cjs +4 -1
  20. package/build/constants.cjs.map +2 -2
  21. package/build/dataviews-picker/index.cjs +2 -1
  22. package/build/dataviews-picker/index.cjs.map +2 -2
  23. package/build/field-types/password.cjs +1 -1
  24. package/build/field-types/password.cjs.map +2 -2
  25. package/build/hooks/use-form-validity.cjs +2 -2
  26. package/build/hooks/use-form-validity.cjs.map +2 -2
  27. package/build/types/dataviews.cjs.map +1 -1
  28. package/build-module/components/dataform-layouts/panel/summary-button.mjs.map +2 -2
  29. package/build-module/components/dataform-layouts/panel/utils/get-label-content.mjs.map +2 -2
  30. package/build-module/components/dataviews-filters/filter.mjs.map +2 -2
  31. package/build-module/components/dataviews-layouts/grid/composite-grid.mjs.map +2 -2
  32. package/build-module/components/dataviews-layouts/index.mjs +11 -1
  33. package/build-module/components/dataviews-layouts/index.mjs.map +2 -2
  34. package/build-module/components/dataviews-layouts/list/index.mjs.map +1 -1
  35. package/build-module/components/dataviews-layouts/picker-activity/index.mjs +273 -0
  36. package/build-module/components/dataviews-layouts/picker-activity/index.mjs.map +7 -0
  37. package/build-module/components/dataviews-layouts/table/column-primary.mjs +2 -2
  38. package/build-module/components/dataviews-layouts/table/column-primary.mjs.map +2 -2
  39. package/build-module/components/dataviews-pagination/index.mjs.map +1 -1
  40. package/build-module/components/dataviews-picker-footer/index.mjs +71 -33
  41. package/build-module/components/dataviews-picker-footer/index.mjs.map +2 -2
  42. package/build-module/components/dataviews-view-config/index.mjs +1 -0
  43. package/build-module/components/dataviews-view-config/index.mjs.map +2 -2
  44. package/build-module/constants.mjs +3 -1
  45. package/build-module/constants.mjs.map +2 -2
  46. package/build-module/dataviews-picker/index.mjs +6 -2
  47. package/build-module/dataviews-picker/index.mjs.map +2 -2
  48. package/build-module/field-types/password.mjs +1 -1
  49. package/build-module/field-types/password.mjs.map +2 -2
  50. package/build-module/hooks/use-form-validity.mjs +2 -2
  51. package/build-module/hooks/use-form-validity.mjs.map +2 -2
  52. package/build-style/style-rtl.css +352 -178
  53. package/build-style/style.css +352 -178
  54. package/build-types/components/dataform-layouts/panel/summary-button.d.ts.map +1 -1
  55. package/build-types/components/dataform-layouts/panel/utils/get-label-content.d.ts.map +1 -1
  56. package/build-types/components/dataviews-filters/filter.d.ts.map +1 -1
  57. package/build-types/components/dataviews-layouts/grid/composite-grid.d.ts.map +1 -1
  58. package/build-types/components/dataviews-layouts/index.d.ts +8 -0
  59. package/build-types/components/dataviews-layouts/index.d.ts.map +1 -1
  60. package/build-types/components/dataviews-layouts/picker-activity/index.d.ts +3 -0
  61. package/build-types/components/dataviews-layouts/picker-activity/index.d.ts.map +1 -0
  62. package/build-types/components/dataviews-picker-footer/index.d.ts +3 -2
  63. package/build-types/components/dataviews-picker-footer/index.d.ts.map +1 -1
  64. package/build-types/components/dataviews-view-config/index.d.ts.map +1 -1
  65. package/build-types/constants.d.ts +1 -0
  66. package/build-types/constants.d.ts.map +1 -1
  67. package/build-types/dataform/stories/index.story.d.ts +1 -0
  68. package/build-types/dataform/stories/index.story.d.ts.map +1 -1
  69. package/build-types/dataviews/stories/index.story.d.ts.map +1 -1
  70. package/build-types/dataviews-picker/index.d.ts +3 -2
  71. package/build-types/dataviews-picker/index.d.ts.map +1 -1
  72. package/build-types/dataviews-picker/stories/index.story.d.ts.map +1 -1
  73. package/build-types/types/dataviews.d.ts +16 -2
  74. package/build-types/types/dataviews.d.ts.map +1 -1
  75. package/build-wp/index.js +1267 -945
  76. package/package.json +31 -23
  77. package/src/components/dataform-controls/style.scss +1 -1
  78. package/src/components/dataform-layouts/card/style.scss +1 -1
  79. package/src/components/dataform-layouts/details/style.scss +1 -1
  80. package/src/components/dataform-layouts/panel/style.scss +18 -31
  81. package/src/components/dataform-layouts/panel/summary-button.tsx +0 -1
  82. package/src/components/dataform-layouts/panel/utils/get-label-content.tsx +0 -1
  83. package/src/components/dataform-layouts/regular/style.scss +4 -4
  84. package/src/components/dataviews-bulk-actions/style.scss +2 -2
  85. package/src/components/dataviews-filters/filter.tsx +0 -1
  86. package/src/components/dataviews-filters/style.scss +44 -45
  87. package/src/components/dataviews-layouts/activity/style.scss +11 -11
  88. package/src/components/dataviews-layouts/grid/composite-grid.tsx +0 -1
  89. package/src/components/dataviews-layouts/grid/style.scss +12 -12
  90. package/src/components/dataviews-layouts/index.ts +10 -0
  91. package/src/components/dataviews-layouts/list/style.scss +20 -21
  92. package/src/components/dataviews-layouts/picker-activity/index.tsx +359 -0
  93. package/src/components/dataviews-layouts/picker-activity/style.scss +227 -0
  94. package/src/components/dataviews-layouts/picker-grid/style.scss +10 -10
  95. package/src/components/dataviews-layouts/picker-table/style.scss +4 -4
  96. package/src/components/dataviews-layouts/table/style.scss +17 -17
  97. package/src/components/dataviews-picker-footer/index.tsx +94 -31
  98. package/src/components/dataviews-picker-footer/style.scss +1 -1
  99. package/src/components/dataviews-view-config/index.tsx +1 -0
  100. package/src/components/dataviews-view-config/style.scss +1 -1
  101. package/src/constants.ts +1 -0
  102. package/src/dataform/stories/content.story.tsx +1 -1
  103. package/src/dataform/stories/index.story.tsx +1 -0
  104. package/src/dataviews/stories/index.story.tsx +1 -0
  105. package/src/dataviews/style.scss +8 -8
  106. package/src/dataviews-picker/index.tsx +9 -3
  107. package/src/dataviews-picker/stories/index.story.tsx +6 -0
  108. package/src/dataviews-picker/test/dataviews-picker.tsx +5 -0
  109. package/src/style.scss +1 -0
  110. package/src/types/dataviews.ts +21 -1
@@ -100,7 +100,7 @@
100
100
  flex-direction: column;
101
101
  font-size: var(--wpds-typography-font-size-md, 13px);
102
102
  line-height: var(--wpds-typography-line-height-sm, 20px);
103
- background-color: var(--wp-dataviews-color-background, var(--wpds-color-bg-surface-neutral-strong, #fff));
103
+ background-color: var(--wp-dataviews-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
104
104
  }
105
105
 
106
106
  .dataviews__view-actions,
@@ -166,7 +166,7 @@
166
166
  .dataviews-title-field {
167
167
  font-size: var(--wpds-typography-font-size-md, 13px);
168
168
  font-weight: var(--wpds-typography-font-weight-medium, 499);
169
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
169
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
170
170
  text-overflow: ellipsis;
171
171
  white-space: nowrap;
172
172
  width: 100%;
@@ -178,10 +178,10 @@
178
178
  overflow: hidden;
179
179
  display: block;
180
180
  flex-grow: 0;
181
- color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
181
+ color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
182
182
  }
183
183
  .dataviews-title-field a:hover {
184
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
184
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
185
185
  }
186
186
  .dataviews-title-field a:focus {
187
187
  color: var(--wp-admin-theme-color--rgb);
@@ -196,18 +196,18 @@
196
196
  overflow: hidden;
197
197
  display: block;
198
198
  width: 100%;
199
- color: var(--wpds-color-fg-interactive-neutral-active, #1e1e1e);
199
+ color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
200
200
  }
201
201
  .dataviews-title-field button.components-button.is-link:hover {
202
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
202
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
203
203
  }
204
204
 
205
205
  .dataviews-title-field--clickable {
206
206
  cursor: var(--wpds-cursor-control, pointer);
207
- color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
207
+ color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
208
208
  }
209
209
  .dataviews-title-field--clickable:hover {
210
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
210
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
211
211
  }
212
212
  .dataviews-title-field--clickable:focus {
213
213
  color: var(--wp-admin-theme-color--rgb);
@@ -232,12 +232,12 @@
232
232
  }
233
233
 
234
234
  .dataviews-bulk-actions-footer__item-count {
235
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
235
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
236
236
  }
237
237
 
238
238
  .dataviews-bulk-actions-footer__container {
239
239
  margin-left: auto;
240
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
240
+ min-height: var(--wpds-dimension-size-md, 32px);
241
241
  }
242
242
 
243
243
  .dataviews-layout__container {
@@ -288,7 +288,7 @@
288
288
  display: none;
289
289
  }
290
290
  .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name {
291
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
291
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
292
292
  white-space: nowrap;
293
293
  overflow: hidden;
294
294
  text-overflow: ellipsis;
@@ -310,8 +310,8 @@
310
310
  border: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-interactive-neutral, #8d8d8d);
311
311
  cursor: var(--wpds-cursor-control, pointer);
312
312
  padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-md, 12px);
313
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
314
- color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
313
+ min-height: var(--wpds-dimension-size-md, 32px);
314
+ color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
315
315
  position: relative;
316
316
  display: flex;
317
317
  align-items: center;
@@ -321,33 +321,33 @@
321
321
  cursor: default;
322
322
  }
323
323
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-reset {
324
- padding-inline-end: calc(24px + var(--wpds-dimension-padding-xs, 4px));
324
+ padding-inline-end: calc(var(--wpds-dimension-size-sm, 24px) + var(--wpds-dimension-padding-xs, 4px));
325
325
  }
326
326
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] {
327
- color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
327
+ color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
328
328
  border-color: var(--wpds-color-stroke-interactive-neutral-active, #6e6e6e);
329
- background-color: var(--wpds-color-bg-interactive-neutral-weak-active, #ededed);
329
+ background-color: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
330
330
  }
331
331
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values {
332
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
333
- background: var(--wpds-color-bg-interactive-brand-weak, #0000);
332
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
333
+ background: var(--wpds-color-background-interactive-brand-weak, #0000);
334
334
  border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
335
335
  }
336
336
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] {
337
- color: var(--wpds-color-fg-interactive-brand-active, var(--wp-admin-theme-color, #3858e9));
338
- background: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
337
+ color: var(--wpds-color-foreground-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 52%, black));
338
+ background: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
339
339
  border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
340
340
  }
341
341
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible {
342
342
  outline: none;
343
- box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
343
+ box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
344
344
  }
345
345
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip .dataviews-filters-__summary-filter-text-name {
346
346
  font-weight: var(--wpds-typography-font-weight-medium, 499);
347
347
  }
348
348
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove {
349
- width: 24px;
350
- height: 24px;
349
+ width: var(--wpds-dimension-size-sm, 24px);
350
+ height: var(--wpds-dimension-size-sm, 24px);
351
351
  border-radius: var(--wpds-border-radius-md, 4px);
352
352
  border: 0;
353
353
  padding: 0;
@@ -362,23 +362,23 @@
362
362
  cursor: var(--wpds-cursor-control, pointer);
363
363
  }
364
364
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
365
- fill: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
365
+ fill: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
366
366
  }
367
367
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
368
- background: var(--wpds-color-bg-interactive-neutral-weak-active, #ededed);
368
+ background: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
369
369
  }
370
370
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
371
- fill: var(--wpds-color-fg-interactive-neutral-active, #1e1e1e);
371
+ fill: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
372
372
  }
373
373
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
374
- fill: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
374
+ fill: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
375
375
  }
376
376
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
377
- background: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
377
+ background: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
378
378
  }
379
379
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible {
380
380
  outline: none;
381
- box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
381
+ box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
382
382
  }
383
383
 
384
384
  .dataviews-filters__search-widget-filter-combobox-list {
@@ -404,7 +404,7 @@
404
404
  box-sizing: border-box;
405
405
  padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-md, 12px);
406
406
  cursor: default;
407
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
407
+ min-height: var(--wpds-dimension-size-md, 32px);
408
408
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
409
409
  font-weight: 400;
410
410
  font-size: 13px;
@@ -414,23 +414,23 @@
414
414
  margin-block-end: 0;
415
415
  }
416
416
  .dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item], .dataviews-filters__search-widget-listitem:focus {
417
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
417
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
418
418
  }
419
419
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection {
420
420
  border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
421
- background: var(--wpds-color-bg-surface-neutral-strong, #fff);
421
+ background: var(--wpds-color-background-surface-neutral-strong, #fff);
422
422
  }
423
423
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection.is-selected {
424
424
  border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
425
- background: var(--wpds-color-bg-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
425
+ background: var(--wpds-color-background-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
426
426
  }
427
427
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection {
428
428
  border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
429
- background: var(--wpds-color-bg-surface-neutral-strong, #fff);
429
+ background: var(--wpds-color-background-surface-neutral-strong, #fff);
430
430
  }
431
431
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
432
432
  border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
433
- background: var(--wpds-color-bg-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
433
+ background: var(--wpds-color-background-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
434
434
  }
435
435
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-value {
436
436
  overflow: hidden;
@@ -444,7 +444,7 @@
444
444
  text-overflow: ellipsis;
445
445
  font-size: var(--wpds-typography-font-size-sm, 12px);
446
446
  line-height: 16px;
447
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
447
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
448
448
  }
449
449
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
450
450
  border: 1px solid #1e1e1e;
@@ -501,7 +501,7 @@
501
501
  padding: 0;
502
502
  }
503
503
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected {
504
- background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
504
+ background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
505
505
  border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
506
506
  }
507
507
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected::before {
@@ -515,8 +515,8 @@
515
515
  right: 50%;
516
516
  transform: translate(50%, -50%);
517
517
  margin: 0;
518
- background-color: var(--wpds-color-fg-interactive-brand-strong, #fff);
519
- border: 4px solid var(--wpds-color-fg-interactive-brand-strong, #fff);
518
+ background-color: var(--wpds-color-foreground-interactive-brand-strong, #fff);
519
+ border: 4px solid var(--wpds-color-foreground-interactive-brand-strong, #fff);
520
520
  }
521
521
  @media (min-width: 600px) {
522
522
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected::before {
@@ -558,6 +558,9 @@
558
558
  box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
559
559
  outline: 2px solid transparent;
560
560
  }
561
+ .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-moz-placeholder {
562
+ color: rgba(30, 30, 30, 0.62);
563
+ }
561
564
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder {
562
565
  color: rgba(30, 30, 30, 0.62);
563
566
  }
@@ -608,8 +611,8 @@
608
611
  }
609
612
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
610
613
  position: relative;
611
- background: var(--wpds-color-bg-interactive-neutral-weak, #0000);
612
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
614
+ background: var(--wpds-color-background-interactive-neutral-weak, #0000);
615
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
613
616
  margin: 0;
614
617
  padding: 0;
615
618
  width: var(--checkbox-size);
@@ -626,12 +629,12 @@
626
629
  }
627
630
  }
628
631
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
629
- background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
632
+ background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
630
633
  border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
631
634
  }
632
635
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
633
636
  --checkmark-size: var(--checkbox-size);
634
- fill: var(--wpds-color-fg-interactive-neutral-strong, #f0f0f0);
637
+ fill: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
635
638
  position: absolute;
636
639
  right: 50%;
637
640
  top: 50%;
@@ -677,14 +680,17 @@
677
680
  box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
678
681
  outline: 2px solid transparent;
679
682
  }
683
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
684
+ color: rgba(30, 30, 30, 0.62);
685
+ }
680
686
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
681
687
  color: rgba(30, 30, 30, 0.62);
682
688
  }
683
689
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
684
690
  display: block;
685
- padding: 0 calc(var(--wpds-dimension-base, 4px) * 8) 0 var(--wpds-dimension-padding-sm, 8px);
691
+ padding: 0 var(--wpds-dimension-size-md, 32px) 0 var(--wpds-dimension-padding-sm, 8px);
686
692
  width: 100%;
687
- height: calc(var(--wpds-dimension-base, 4px) * 8);
693
+ height: var(--wpds-dimension-size-md, 32px);
688
694
  margin-right: 0;
689
695
  margin-left: 0;
690
696
  /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -696,11 +702,14 @@
696
702
  }
697
703
  }
698
704
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
699
- background: var(--wpds-color-bg-surface-neutral-strong, #fff);
700
- box-shadow: inset 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
705
+ background: var(--wpds-color-background-surface-neutral-strong, #fff);
706
+ box-shadow: inset 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
707
+ }
708
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
709
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
701
710
  }
702
711
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
703
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
712
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
704
713
  }
705
714
  .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 {
706
715
  -webkit-appearance: none;
@@ -713,7 +722,7 @@
713
722
  display: flex;
714
723
  align-items: center;
715
724
  justify-content: center;
716
- width: 24px;
725
+ width: var(--wpds-dimension-size-sm, 24px);
717
726
  }
718
727
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon:dir(ltr) {
719
728
  transform: scaleX(-1);
@@ -729,20 +738,21 @@
729
738
  top: 0;
730
739
  left: 0;
731
740
  transform: translate(-50%, -50%);
732
- background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
733
- height: calc(var(--wpds-dimension-base, 4px) * 4);
734
- min-width: calc(var(--wpds-dimension-base, 4px) * 4);
741
+ background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
742
+ height: var(--wpds-dimension-size-2xs, 16px);
743
+ min-width: var(--wpds-dimension-size-2xs, 16px);
735
744
  line-height: var(--wpds-typography-line-height-xs, 16px);
736
745
  padding: 0 var(--wpds-dimension-padding-xs, 4px);
737
746
  text-align: center;
738
747
  border-radius: var(--wpds-border-radius-lg, 8px);
739
748
  font-size: 11px;
740
- outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-bg-surface-neutral-strong, #fff);
741
- color: var(--wpds-color-fg-interactive-neutral-strong, #f0f0f0);
749
+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-background-surface-neutral-strong, #fff);
750
+ color: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
742
751
  box-sizing: border-box;
743
752
  }
744
753
 
745
754
  .dataviews-search {
755
+ width: -moz-fit-content;
746
756
  width: fit-content;
747
757
  }
748
758
 
@@ -766,7 +776,7 @@
766
776
  right: 0;
767
777
  background-color: inherit;
768
778
  padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
769
- border-top: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
779
+ border-top: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
770
780
  flex-shrink: 0;
771
781
  }
772
782
  @media not (prefers-reduced-motion) {
@@ -914,7 +924,7 @@
914
924
  left: var(--wpds-dimension-gap-xs, 4px);
915
925
  width: var(--wpds-dimension-gap-xs, 4px);
916
926
  height: var(--wpds-dimension-gap-xs, 4px);
917
- background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
927
+ background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
918
928
  border-radius: 50%;
919
929
  pointer-events: none;
920
930
  }
@@ -980,7 +990,7 @@
980
990
  right: 0;
981
991
  width: 100%;
982
992
  height: 100%;
983
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
993
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
984
994
  border-radius: var(--wpds-border-radius-md, 4px);
985
995
  pointer-events: none;
986
996
  outline: 2px solid transparent;
@@ -999,32 +1009,33 @@
999
1009
  }
1000
1010
  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field,
1001
1011
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-field {
1002
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1012
+ min-height: var(--wpds-dimension-size-sm, 24px);
1003
1013
  overflow: hidden;
1004
1014
  align-content: center;
1005
1015
  text-align: start;
1006
1016
  }
1007
1017
  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable,
1008
1018
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable {
1019
+ width: -moz-fit-content;
1009
1020
  width: fit-content;
1010
1021
  }
1011
1022
  .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value,
1012
1023
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
1013
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1024
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1014
1025
  }
1015
1026
  .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after,
1016
1027
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after {
1017
- box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-bg-surface-neutral-strong, #fff);
1028
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-background-surface-neutral-strong, #fff);
1018
1029
  }
1019
1030
  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus::after,
1020
1031
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__media:focus::after {
1021
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1032
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1022
1033
  }
1023
1034
  .dataviews-view-grid .dataviews-view-grid__media,
1024
1035
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media {
1025
1036
  width: 100%;
1026
1037
  aspect-ratio: 1/1;
1027
- background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
1038
+ background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
1028
1039
  border-radius: var(--wpds-border-radius-md, 4px);
1029
1040
  overflow: hidden;
1030
1041
  position: relative;
@@ -1035,7 +1046,8 @@
1035
1046
  }
1036
1047
  .dataviews-view-grid .dataviews-view-grid__media img,
1037
1048
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media img {
1038
- object-fit: cover;
1049
+ -o-object-fit: cover;
1050
+ object-fit: cover;
1039
1051
  width: 100%;
1040
1052
  height: 100%;
1041
1053
  }
@@ -1058,7 +1070,7 @@
1058
1070
  display: block;
1059
1071
  border-radius: var(--wpds-border-radius-md, 4px);
1060
1072
  box-shadow: none;
1061
- background: var(--wpds-color-bg-surface-neutral, #fcfcfc);
1073
+ background: var(--wpds-color-background-surface-neutral, #fcfcfc);
1062
1074
  }
1063
1075
  .dataviews-view-grid .dataviews-view-grid__fields,
1064
1076
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields {
@@ -1072,19 +1084,19 @@
1072
1084
  }
1073
1085
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field-value:not(:empty),
1074
1086
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field-value:not(:empty) {
1075
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1087
+ min-height: var(--wpds-dimension-size-sm, 24px);
1076
1088
  line-height: var(--wpds-typography-line-height-sm, 20px);
1077
1089
  padding-top: calc(var(--wpds-dimension-base, 4px) / 2);
1078
1090
  }
1079
1091
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field,
1080
1092
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field {
1081
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1093
+ min-height: var(--wpds-dimension-size-sm, 24px);
1082
1094
  align-items: center;
1083
1095
  }
1084
1096
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name,
1085
1097
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
1086
1098
  width: 35%;
1087
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
1099
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
1088
1100
  overflow: hidden;
1089
1101
  text-overflow: ellipsis;
1090
1102
  white-space: nowrap;
@@ -1156,7 +1168,7 @@
1156
1168
  left: var(--wpds-dimension-padding-xs, 4px);
1157
1169
  }
1158
1170
  .dataviews-view-grid__card .dataviews-view-grid__media-actions .dataviews-all-actions-button {
1159
- background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
1171
+ background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
1160
1172
  }
1161
1173
  @media not (prefers-reduced-motion) {
1162
1174
  .dataviews-view-grid__card .dataviews-view-grid__media-actions {
@@ -1183,7 +1195,7 @@
1183
1195
  .dataviews-view-grid__group-header {
1184
1196
  font-size: var(--wpds-typography-font-size-lg, 15px);
1185
1197
  font-weight: var(--wpds-typography-font-weight-medium, 499);
1186
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1198
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1187
1199
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
1188
1200
  padding: 0 var(--wpds-dimension-padding-2xl, 24px);
1189
1201
  container-type: inline-size;
@@ -1199,7 +1211,7 @@ div.dataviews-view-list {
1199
1211
  .dataviews-view-list div[role=row],
1200
1212
  .dataviews-view-list div[role=article] {
1201
1213
  margin: 0;
1202
- border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
1214
+ border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
1203
1215
  }
1204
1216
  .dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper,
1205
1217
  .dataviews-view-list div[role=article] .dataviews-view-list__item-wrapper {
@@ -1210,6 +1222,7 @@ div.dataviews-view-list {
1210
1222
  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions,
1211
1223
  .dataviews-view-list div[role=article] .dataviews-view-list__item-actions {
1212
1224
  display: flex;
1225
+ width: -moz-max-content;
1213
1226
  width: max-content;
1214
1227
  flex: 0 0 auto;
1215
1228
  gap: var(--wpds-dimension-gap-xs, 4px);
@@ -1222,7 +1235,7 @@ div.dataviews-view-list {
1222
1235
  }
1223
1236
  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > div,
1224
1237
  .dataviews-view-list div[role=article] .dataviews-view-list__item-actions > div {
1225
- height: 24px;
1238
+ height: var(--wpds-dimension-size-sm, 24px);
1226
1239
  }
1227
1240
  .dataviews-view-list div[role=row] .dataviews-view-list__item-actions > :not(:last-child),
1228
1241
  .dataviews-view-list div[role=article] .dataviews-view-list__item-actions > :not(:last-child) {
@@ -1246,19 +1259,19 @@ div.dataviews-view-list {
1246
1259
  }
1247
1260
  .dataviews-view-list div[role=row].is-selected.is-selected,
1248
1261
  .dataviews-view-list div[role=article].is-selected.is-selected {
1249
- border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 46%, white));
1262
+ border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 40%, white));
1250
1263
  }
1251
1264
  .dataviews-view-list div[role=row].is-selected.is-selected + div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected + div[role=article],
1252
1265
  .dataviews-view-list div[role=article].is-selected.is-selected + div[role=row],
1253
1266
  .dataviews-view-list div[role=article].is-selected.is-selected + div[role=article] {
1254
- border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 46%, white));
1267
+ border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 40%, white));
1255
1268
  }
1256
1269
  .dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within,
1257
1270
  .dataviews-view-list div[role=article]:not(.is-selected):hover,
1258
1271
  .dataviews-view-list div[role=article]:not(.is-selected).is-hovered,
1259
1272
  .dataviews-view-list div[role=article]:not(.is-selected):focus-within {
1260
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1261
- background-color: var(--wpds-color-bg-interactive-brand-weak, #0000);
1273
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1274
+ background-color: var(--wpds-color-background-interactive-brand-weak, #0000);
1262
1275
  }
1263
1276
  .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-title-field,
1264
1277
  .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-title-field,
@@ -1270,14 +1283,14 @@ div.dataviews-view-list {
1270
1283
  .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__field,
1271
1284
  .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-title-field,
1272
1285
  .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__field {
1273
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1286
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1274
1287
  }
1275
1288
  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper,
1276
1289
  .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper,
1277
1290
  .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper,
1278
1291
  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper {
1279
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1280
- color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
1292
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1293
+ color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
1281
1294
  }
1282
1295
  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
1283
1296
  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
@@ -1287,14 +1300,16 @@ div.dataviews-view-list {
1287
1300
  .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
1288
1301
  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
1289
1302
  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field {
1290
- color: var(--wpds-color-fg-interactive-neutral-active, #1e1e1e);
1303
+ color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
1291
1304
  }
1292
1305
  .dataviews-view-list .dataviews-view-list__item {
1293
1306
  position: absolute;
1294
1307
  z-index: 1;
1295
1308
  inset: 0;
1296
1309
  scroll-margin: var(--wpds-dimension-gap-sm, 8px) 0;
1297
- appearance: none;
1310
+ -webkit-appearance: none;
1311
+ -moz-appearance: none;
1312
+ appearance: none;
1298
1313
  border: none;
1299
1314
  background: none;
1300
1315
  padding: 0;
@@ -1307,13 +1322,13 @@ div.dataviews-view-list {
1307
1322
  position: absolute;
1308
1323
  content: "";
1309
1324
  inset: var(--wp-admin-border-width-focus);
1310
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1325
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1311
1326
  border-radius: var(--wpds-border-radius-sm, 2px);
1312
1327
  outline: 2px solid transparent;
1313
1328
  }
1314
1329
  .dataviews-view-list .dataviews-view-list__title-field {
1315
1330
  flex: 1;
1316
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1331
+ min-height: var(--wpds-dimension-size-sm, 24px);
1317
1332
  line-height: var(--wpds-typography-line-height-md, 24px);
1318
1333
  overflow: hidden;
1319
1334
  }
@@ -1326,13 +1341,14 @@ div.dataviews-view-list {
1326
1341
  overflow: hidden;
1327
1342
  position: relative;
1328
1343
  flex-shrink: 0;
1329
- background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
1344
+ background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
1330
1345
  border-radius: var(--wpds-border-radius-md, 4px);
1331
1346
  }
1332
1347
  .dataviews-view-list .dataviews-view-list__media-wrapper img {
1333
1348
  width: 100%;
1334
1349
  height: 100%;
1335
- object-fit: cover;
1350
+ -o-object-fit: cover;
1351
+ object-fit: cover;
1336
1352
  }
1337
1353
  .dataviews-view-list .dataviews-view-list__media-wrapper::after {
1338
1354
  content: "";
@@ -1350,7 +1366,7 @@ div.dataviews-view-list {
1350
1366
  min-width: 0;
1351
1367
  }
1352
1368
  .dataviews-view-list .dataviews-view-list__field {
1353
- color: var(--wpds-color-fg-interactive-neutral-weak, #707070);
1369
+ color: var(--wpds-color-foreground-interactive-neutral-weak, #707070);
1354
1370
  }
1355
1371
  .dataviews-view-list .dataviews-view-list__fields {
1356
1372
  display: flex;
@@ -1366,7 +1382,7 @@ div.dataviews-view-list {
1366
1382
  display: none;
1367
1383
  }
1368
1384
  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field-value {
1369
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1385
+ min-height: var(--wpds-dimension-size-sm, 24px);
1370
1386
  line-height: var(--wpds-typography-line-height-sm, 20px);
1371
1387
  display: flex;
1372
1388
  align-items: center;
@@ -1378,29 +1394,29 @@ div.dataviews-view-list {
1378
1394
  padding: var(--wpds-dimension-padding-sm, 8px) var(--wpds-dimension-padding-2xl, 24px);
1379
1395
  }
1380
1396
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__title-field {
1381
- min-height: calc(var(--wpds-dimension-base, 4px) * 4);
1397
+ min-height: var(--wpds-dimension-size-2xs, 16px);
1382
1398
  line-height: var(--wpds-typography-line-height-xs, 16px);
1383
1399
  }
1384
1400
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__media-wrapper {
1385
- width: calc(var(--wpds-dimension-base, 4px) * 8);
1386
- height: calc(var(--wpds-dimension-base, 4px) * 8);
1401
+ width: var(--wpds-dimension-size-md, 32px);
1402
+ height: var(--wpds-dimension-size-md, 32px);
1387
1403
  }
1388
1404
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__field-wrapper {
1389
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1405
+ min-height: var(--wpds-dimension-size-md, 32px);
1390
1406
  }
1391
1407
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields {
1392
1408
  gap: var(--wpds-dimension-gap-sm, 8px);
1393
1409
  row-gap: var(--wpds-dimension-gap-xs, 4px);
1394
1410
  }
1395
1411
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
1396
- min-height: calc(var(--wpds-dimension-base, 4px) * 4);
1412
+ min-height: var(--wpds-dimension-size-2xs, 16px);
1397
1413
  line-height: var(--wpds-typography-line-height-xs, 16px);
1398
1414
  }
1399
1415
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__item-wrapper {
1400
1416
  padding: var(--wpds-dimension-padding-2xl, 24px) var(--wpds-dimension-padding-2xl, 24px);
1401
1417
  }
1402
1418
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__title-field {
1403
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1419
+ min-height: var(--wpds-dimension-size-md, 32px);
1404
1420
  line-height: var(--wpds-typography-line-height-xl, 32px);
1405
1421
  }
1406
1422
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__media-wrapper {
@@ -1415,7 +1431,7 @@ div.dataviews-view-list {
1415
1431
  row-gap: var(--wpds-dimension-gap-sm, 8px);
1416
1432
  }
1417
1433
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
1418
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1434
+ min-height: var(--wpds-dimension-size-md, 32px);
1419
1435
  line-height: var(--wpds-typography-line-height-md, 24px);
1420
1436
  }
1421
1437
  .dataviews-view-list.is-refreshing {
@@ -1432,7 +1448,7 @@ div.dataviews-view-list {
1432
1448
  .dataviews-view-list__group-header {
1433
1449
  font-size: var(--wpds-typography-font-size-lg, 15px);
1434
1450
  font-weight: var(--wpds-typography-font-weight-medium, 499);
1435
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1451
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1436
1452
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
1437
1453
  padding: 0 var(--wpds-dimension-padding-2xl, 24px);
1438
1454
  }
@@ -1443,13 +1459,13 @@ div.dataviews-view-list {
1443
1459
  border-color: inherit;
1444
1460
  border-collapse: collapse;
1445
1461
  position: relative;
1446
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
1462
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
1447
1463
  margin-bottom: auto;
1448
1464
  background-color: inherit;
1449
1465
  }
1450
1466
  .dataviews-view-table th {
1451
1467
  text-align: right;
1452
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1468
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1453
1469
  font-weight: normal;
1454
1470
  font-size: var(--wpds-typography-font-size-md, 13px);
1455
1471
  }
@@ -1465,7 +1481,7 @@ div.dataviews-view-list {
1465
1481
  .dataviews-view-table th.dataviews-view-table__actions-column--sticky {
1466
1482
  position: sticky;
1467
1483
  left: 0;
1468
- background-color: var(--wp-dataviews-color-background, var(--wpds-color-bg-surface-neutral-strong, #fff));
1484
+ background-color: var(--wp-dataviews-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
1469
1485
  }
1470
1486
  .dataviews-view-table td.dataviews-view-table__actions-column--stuck::after,
1471
1487
  .dataviews-view-table th.dataviews-view-table__actions-column--stuck::after {
@@ -1476,7 +1492,7 @@ div.dataviews-view-list {
1476
1492
  bottom: 0;
1477
1493
  right: 0;
1478
1494
  width: 1px;
1479
- background-color: var(--wpds-color-bg-surface-neutral, #fcfcfc);
1495
+ background-color: var(--wpds-color-background-surface-neutral, #fcfcfc);
1480
1496
  }
1481
1497
  .dataviews-view-table td.dataviews-view-table__checkbox-column,
1482
1498
  .dataviews-view-table th.dataviews-view-table__checkbox-column {
@@ -1488,7 +1504,7 @@ div.dataviews-view-list {
1488
1504
  min-width: auto;
1489
1505
  }
1490
1506
  .dataviews-view-table tr {
1491
- border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
1507
+ border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
1492
1508
  background-color: inherit;
1493
1509
  }
1494
1510
  .dataviews-view-table tr td:first-child,
@@ -1511,23 +1527,23 @@ div.dataviews-view-list {
1511
1527
  }
1512
1528
  }
1513
1529
  .dataviews-view-table tr.is-selected {
1514
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1515
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1530
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1531
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1516
1532
  }
1517
1533
  .dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected + tr {
1518
- border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 46%, white));
1534
+ border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 40%, white));
1519
1535
  }
1520
1536
  .dataviews-view-table tr.is-selected .dataviews-view-table__actions-column--sticky {
1521
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1537
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1522
1538
  }
1523
1539
  .dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
1524
1540
  opacity: 1;
1525
1541
  }
1526
1542
  .dataviews-view-table.has-bulk-actions tr:focus-within .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr:hover .dataviews-view-table__actions-column--sticky {
1527
- background-color: var(--wp-dataviews-color-background, var(--wpds-color-bg-surface-neutral-strong, #fff));
1543
+ background-color: var(--wp-dataviews-color-background, var(--wpds-color-background-surface-neutral-strong, #fff));
1528
1544
  }
1529
1545
  .dataviews-view-table.has-bulk-actions tr.is-selected .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr.is-selected:hover .dataviews-view-table__actions-column--sticky {
1530
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1546
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1531
1547
  }
1532
1548
  .dataviews-view-table thead {
1533
1549
  position: sticky;
@@ -1543,7 +1559,7 @@ div.dataviews-view-list {
1543
1559
  right: 0;
1544
1560
  left: 0;
1545
1561
  height: 1px;
1546
- background-color: var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
1562
+ background-color: var(--wpds-color-stroke-surface-neutral-weak, #f0f0f0);
1547
1563
  }
1548
1564
  .dataviews-view-table thead tr {
1549
1565
  border: 0;
@@ -1573,7 +1589,7 @@ div.dataviews-view-list {
1573
1589
  vertical-align: top;
1574
1590
  }
1575
1591
  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
1576
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1592
+ min-height: var(--wpds-dimension-size-md, 32px);
1577
1593
  display: flex;
1578
1594
  align-items: center;
1579
1595
  white-space: nowrap;
@@ -1595,7 +1611,7 @@ div.dataviews-view-list {
1595
1611
  font-weight: var(--wpds-typography-font-weight-medium, 499);
1596
1612
  }
1597
1613
  .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
1598
- color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
1614
+ color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
1599
1615
  }
1600
1616
  .dataviews-view-table .dataviews-view-table-header-button span {
1601
1617
  speak: none;
@@ -1641,18 +1657,19 @@ div.dataviews-view-list {
1641
1657
 
1642
1658
  .dataviews-column-primary__media {
1643
1659
  max-width: 60px;
1644
- min-width: calc(var(--wpds-dimension-base, 4px) * 8);
1645
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1660
+ min-width: var(--wpds-dimension-size-md, 32px);
1661
+ min-height: var(--wpds-dimension-size-md, 32px);
1646
1662
  overflow: hidden;
1647
1663
  position: relative;
1648
1664
  flex-shrink: 0;
1649
- background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
1665
+ background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
1650
1666
  border-radius: var(--wpds-border-radius-md, 4px);
1651
1667
  }
1652
1668
  .dataviews-column-primary__media img {
1653
- width: calc(var(--wpds-dimension-base, 4px) * 8);
1654
- height: calc(var(--wpds-dimension-base, 4px) * 8);
1655
- object-fit: cover;
1669
+ width: var(--wpds-dimension-size-md, 32px);
1670
+ height: var(--wpds-dimension-size-md, 32px);
1671
+ -o-object-fit: cover;
1672
+ object-fit: cover;
1656
1673
  }
1657
1674
  .dataviews-column-primary__media::after {
1658
1675
  content: "";
@@ -1674,7 +1691,7 @@ div.dataviews-view-list {
1674
1691
  .dataviews-view-table__group-header-row .dataviews-view-table__group-header-cell {
1675
1692
  font-weight: var(--wpds-typography-font-weight-medium, 499);
1676
1693
  padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
1677
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1694
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1678
1695
  }
1679
1696
 
1680
1697
  /* Column width intents via colgroup: make non-primary columns shrink-to-fit */
@@ -1709,28 +1726,29 @@ div.dataviews-view-list {
1709
1726
  padding: var(--wpds-dimension-padding-sm, 8px) 0 var(--wpds-dimension-padding-xs, 4px);
1710
1727
  }
1711
1728
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field {
1712
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1729
+ min-height: var(--wpds-dimension-size-sm, 24px);
1713
1730
  overflow: hidden;
1714
1731
  align-content: center;
1715
1732
  text-align: start;
1716
1733
  }
1717
1734
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field--clickable {
1735
+ width: -moz-fit-content;
1718
1736
  width: fit-content;
1719
1737
  }
1720
1738
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-value {
1721
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1739
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1722
1740
  }
1723
1741
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media::after {
1724
- box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-bg-surface-neutral-strong, #fff);
1742
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-background-surface-neutral-strong, #fff);
1725
1743
  }
1726
1744
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus::after {
1727
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1745
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1728
1746
  }
1729
1747
  .dataviews-view-picker-grid:focus-visible[aria-activedescendant] {
1730
1748
  outline: none;
1731
1749
  }
1732
1750
  .dataviews-view-picker-grid:focus-visible [data-active-item=true] {
1733
- outline: 2px solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1751
+ outline: 2px solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1734
1752
  }
1735
1753
  .dataviews-view-picker-grid .dataviews-selection-checkbox {
1736
1754
  top: var(--wpds-dimension-padding-sm, 8px) !important;
@@ -1742,12 +1760,13 @@ div.dataviews-view-list {
1742
1760
  width: 100%;
1743
1761
  aspect-ratio: 1/1;
1744
1762
  min-height: 0;
1745
- background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
1763
+ background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
1746
1764
  border-radius: var(--wpds-border-radius-md, 4px);
1747
1765
  position: relative;
1748
1766
  }
1749
1767
  .dataviews-view-picker-grid .dataviews-view-picker-grid__media img {
1750
- object-fit: cover;
1768
+ -o-object-fit: cover;
1769
+ object-fit: cover;
1751
1770
  width: 100%;
1752
1771
  height: 100%;
1753
1772
  }
@@ -1771,17 +1790,17 @@ div.dataviews-view-list {
1771
1790
  padding: 0 0 var(--wpds-dimension-padding-md, 12px);
1772
1791
  }
1773
1792
  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field-value:not(:empty) {
1774
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1793
+ min-height: var(--wpds-dimension-size-sm, 24px);
1775
1794
  line-height: var(--wpds-typography-line-height-sm, 20px);
1776
1795
  padding-top: calc(var(--wpds-dimension-base, 4px) / 2);
1777
1796
  }
1778
1797
  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field {
1779
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
1798
+ min-height: var(--wpds-dimension-size-sm, 24px);
1780
1799
  align-items: center;
1781
1800
  }
1782
1801
  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-name {
1783
1802
  width: 35%;
1784
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
1803
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
1785
1804
  overflow: hidden;
1786
1805
  text-overflow: ellipsis;
1787
1806
  white-space: nowrap;
@@ -1829,7 +1848,7 @@ div.dataviews-view-list {
1829
1848
  .dataviews-view-picker-grid-group__header {
1830
1849
  font-size: var(--wpds-typography-font-size-lg, 15px);
1831
1850
  font-weight: var(--wpds-typography-font-weight-medium, 499);
1832
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1851
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1833
1852
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
1834
1853
  padding: 0 calc(var(--wpds-dimension-base, 4px) * 12);
1835
1854
  }
@@ -1844,7 +1863,7 @@ div.dataviews-view-list {
1844
1863
  outline: none;
1845
1864
  }
1846
1865
  .dataviews-view-picker-table tbody:focus-visible [data-active-item=true] {
1847
- outline: 2px solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1866
+ outline: 2px solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1848
1867
  }
1849
1868
  .dataviews-view-picker-table .dataviews-selection-checkbox .components-checkbox-control__input.components-checkbox-control__input {
1850
1869
  pointer-events: none;
@@ -1854,13 +1873,13 @@ div.dataviews-view-list {
1854
1873
  cursor: var(--wpds-cursor-control, pointer);
1855
1874
  }
1856
1875
  .dataviews-view-picker-table .dataviews-view-table__row.is-selected {
1857
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1876
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1858
1877
  }
1859
1878
  .dataviews-view-picker-table .dataviews-view-table__row.is-hovered {
1860
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1879
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1861
1880
  }
1862
1881
  .dataviews-view-picker-table .dataviews-view-table__row.is-selected.is-hovered {
1863
- background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1882
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1864
1883
  }
1865
1884
 
1866
1885
  .dataviews-view-activity {
@@ -1870,12 +1889,12 @@ div.dataviews-view-list {
1870
1889
  .dataviews-view-activity .dataviews-view-activity__group-header {
1871
1890
  font-size: var(--wpds-typography-font-size-lg, 15px);
1872
1891
  font-weight: var(--wpds-typography-font-weight-medium, 499);
1873
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
1892
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
1874
1893
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
1875
1894
  padding: 0;
1876
1895
  }
1877
1896
  .dataviews-view-activity .dataviews-view-activity__item-actions {
1878
- min-width: calc(var(--wpds-dimension-base, 4px) * 6);
1897
+ min-width: var(--wpds-dimension-size-sm, 24px);
1879
1898
  }
1880
1899
  .dataviews-view-activity .dataviews-view-activity__item-content {
1881
1900
  flex-grow: 1;
@@ -1883,7 +1902,7 @@ div.dataviews-view-list {
1883
1902
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title,
1884
1903
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-description,
1885
1904
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
1886
- min-height: calc(var(--wpds-dimension-base, 4px) * 4);
1905
+ min-height: var(--wpds-dimension-size-2xs, 16px);
1887
1906
  }
1888
1907
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title {
1889
1908
  position: relative;
@@ -1896,12 +1915,13 @@ div.dataviews-view-list {
1896
1915
  cursor: var(--wpds-cursor-control, pointer);
1897
1916
  }
1898
1917
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable:focus-visible {
1899
- outline: var(--wp-admin-border-width-focus) solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1918
+ outline: var(--wp-admin-border-width-focus) solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
1900
1919
  outline-offset: var(--wp-admin-border-width-focus);
1901
1920
  border-radius: var(--wpds-border-radius-sm, 2px);
1902
1921
  }
1903
1922
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions {
1904
1923
  display: flex;
1924
+ width: -moz-max-content;
1905
1925
  width: max-content;
1906
1926
  flex: 0 0 auto;
1907
1927
  }
@@ -1910,7 +1930,7 @@ div.dataviews-view-list {
1910
1930
  z-index: 1;
1911
1931
  }
1912
1932
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
1913
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
1933
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
1914
1934
  display: flex;
1915
1935
  gap: var(--wpds-dimension-gap-md, 12px);
1916
1936
  row-gap: var(--wpds-dimension-gap-xs, 4px);
@@ -1948,7 +1968,7 @@ div.dataviews-view-list {
1948
1968
  width: var(--wpds-dimension-padding-md, 12px);
1949
1969
  }
1950
1970
  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type::before {
1951
- height: calc(var(--wpds-dimension-base, 4px) * 3);
1971
+ height: var(--wpds-dimension-size-3xs, 12px);
1952
1972
  }
1953
1973
  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type-icon {
1954
1974
  width: calc(var(--wpds-dimension-base, 4px) * 3 - 1px);
@@ -1958,10 +1978,10 @@ div.dataviews-view-list {
1958
1978
  margin: var(--wpds-dimension-gap-md, 12px) 0;
1959
1979
  }
1960
1980
  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type {
1961
- width: calc(var(--wpds-dimension-base, 4px) * 6);
1981
+ width: var(--wpds-dimension-size-sm, 24px);
1962
1982
  }
1963
1983
  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type::before {
1964
- height: calc(var(--wpds-dimension-base, 4px) * 3);
1984
+ height: var(--wpds-dimension-size-3xs, 12px);
1965
1985
  }
1966
1986
  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type-icon {
1967
1987
  width: calc(var(--wpds-dimension-base, 4px) * 6 + 1px);
@@ -1972,10 +1992,10 @@ div.dataviews-view-list {
1972
1992
  padding-top: var(--wpds-dimension-padding-sm, 8px);
1973
1993
  }
1974
1994
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type {
1975
- width: calc(var(--wpds-dimension-base, 4px) * 8);
1995
+ width: var(--wpds-dimension-size-md, 32px);
1976
1996
  }
1977
1997
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type::before {
1978
- height: calc(var(--wpds-dimension-base, 4px) * 2);
1998
+ height: var(--wpds-dimension-size-4xs, 8px);
1979
1999
  }
1980
2000
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type-icon {
1981
2001
  width: calc(var(--wpds-dimension-base, 4px) * 8 + 1px);
@@ -2001,7 +2021,7 @@ div.dataviews-view-list {
2001
2021
  .dataviews-view-activity .dataviews-view-activity__item-type-icon {
2002
2022
  overflow: hidden;
2003
2023
  flex-shrink: 0;
2004
- background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
2024
+ background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
2005
2025
  }
2006
2026
  .dataviews-view-activity .dataviews-view-activity__item-type-icon img,
2007
2027
  .dataviews-view-activity .dataviews-view-activity__item-type-icon svg,
@@ -2010,7 +2030,8 @@ div.dataviews-view-list {
2010
2030
  width: 100%;
2011
2031
  height: 100%;
2012
2032
  margin: 0 auto;
2013
- object-fit: cover;
2033
+ -o-object-fit: cover;
2034
+ object-fit: cover;
2014
2035
  border-radius: 50%;
2015
2036
  box-sizing: border-box;
2016
2037
  box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-surface-neutral, #dbdbdb);
@@ -2036,9 +2057,174 @@ div.dataviews-view-list {
2036
2057
  justify-content: space-between;
2037
2058
  }
2038
2059
 
2060
+ .dataviews-view-picker-activity {
2061
+ margin: 0;
2062
+ padding: 0;
2063
+ flex-grow: 1;
2064
+ }
2065
+ .dataviews-view-picker-activity:focus-visible[aria-activedescendant] {
2066
+ outline: none;
2067
+ }
2068
+ .dataviews-view-picker-activity:focus-visible .dataviews-view-picker-activity__item[data-active-item=true] {
2069
+ outline: 2px solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
2070
+ outline-offset: -2px;
2071
+ }
2072
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item {
2073
+ cursor: var(--wpds-cursor-control, pointer);
2074
+ border-radius: var(--wpds-border-radius-sm, 2px);
2075
+ padding-inline: var(--wpds-dimension-padding-2xl, 24px);
2076
+ transition: background-color 0.1s ease;
2077
+ }
2078
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-selected, .dataviews-view-picker-activity .dataviews-view-picker-activity__item:hover {
2079
+ background-color: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
2080
+ }
2081
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-selected {
2082
+ outline: 3px solid transparent;
2083
+ outline-offset: -2px;
2084
+ }
2085
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-type {
2086
+ width: var(--wpds-dimension-padding-md, 12px);
2087
+ }
2088
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-type::before {
2089
+ height: var(--wpds-dimension-size-3xs, 12px);
2090
+ }
2091
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-type-icon {
2092
+ width: calc(var(--wpds-dimension-base, 4px) * 3 - 1px);
2093
+ height: calc(var(--wpds-dimension-base, 4px) * 3 - 1px);
2094
+ }
2095
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-compact .dataviews-view-picker-activity__item-content {
2096
+ margin: var(--wpds-dimension-gap-md, 12px) 0;
2097
+ }
2098
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-type {
2099
+ width: var(--wpds-dimension-size-sm, 24px);
2100
+ }
2101
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-type::before {
2102
+ height: var(--wpds-dimension-size-3xs, 12px);
2103
+ }
2104
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-type-icon {
2105
+ width: calc(var(--wpds-dimension-base, 4px) * 6 + 1px);
2106
+ height: calc(var(--wpds-dimension-base, 4px) * 6 + 1px);
2107
+ }
2108
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-content {
2109
+ margin: var(--wpds-dimension-gap-md, 12px) 0;
2110
+ padding-top: var(--wpds-dimension-padding-sm, 8px);
2111
+ }
2112
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-type {
2113
+ width: var(--wpds-dimension-size-md, 32px);
2114
+ }
2115
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-type::before {
2116
+ height: var(--wpds-dimension-size-4xs, 8px);
2117
+ }
2118
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-type-icon {
2119
+ width: calc(var(--wpds-dimension-base, 4px) * 8 + 1px);
2120
+ height: calc(var(--wpds-dimension-base, 4px) * 8 + 1px);
2121
+ }
2122
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-content {
2123
+ margin: var(--wpds-dimension-gap-sm, 8px) 0 var(--wpds-dimension-gap-lg, 16px);
2124
+ padding-top: var(--wpds-dimension-padding-md, 12px);
2125
+ }
2126
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-comfortable .dataviews-view-picker-activity__item-bullet, .dataviews-view-picker-activity .dataviews-view-picker-activity__item.is-balanced .dataviews-view-picker-activity__item-bullet {
2127
+ width: calc(var(--wpds-dimension-base, 4px) * 2 + 1px);
2128
+ height: calc(var(--wpds-dimension-base, 4px) * 2 + 1px);
2129
+ position: relative;
2130
+ top: 50%;
2131
+ transform: translateY(-50%);
2132
+ }
2133
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content {
2134
+ flex-grow: 1;
2135
+ }
2136
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-title,
2137
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-description,
2138
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields {
2139
+ min-height: var(--wpds-dimension-size-2xs, 16px);
2140
+ }
2141
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-title {
2142
+ position: relative;
2143
+ display: flex;
2144
+ align-items: center;
2145
+ flex: 1;
2146
+ overflow: hidden;
2147
+ }
2148
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-description:empty {
2149
+ display: none;
2150
+ }
2151
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields {
2152
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2153
+ display: flex;
2154
+ gap: var(--wpds-dimension-gap-md, 12px);
2155
+ row-gap: var(--wpds-dimension-gap-xs, 4px);
2156
+ flex-wrap: wrap;
2157
+ }
2158
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields:empty {
2159
+ display: none;
2160
+ }
2161
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields .dataviews-view-picker-activity__item-field:has(.dataviews-view-picker-activity__item-field-value:empty) {
2162
+ display: none;
2163
+ }
2164
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-content .dataviews-view-picker-activity__item-fields .dataviews-view-picker-activity__item-field-value {
2165
+ display: flex;
2166
+ align-items: center;
2167
+ }
2168
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type {
2169
+ align-self: stretch;
2170
+ flex-shrink: 0;
2171
+ }
2172
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type::after {
2173
+ content: "";
2174
+ flex: 1 1 auto;
2175
+ width: 1px;
2176
+ margin: 0 auto;
2177
+ background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
2178
+ }
2179
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type::before {
2180
+ content: "";
2181
+ flex: 0 0 auto;
2182
+ width: 1px;
2183
+ margin: 0 auto;
2184
+ background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
2185
+ }
2186
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item:first-child .dataviews-view-picker-activity__item-type::before {
2187
+ visibility: hidden;
2188
+ }
2189
+ .dataviews-view-picker-activity .dataviews-view-picker-activity-group:last-of-type > .dataviews-view-picker-activity__item:last-of-type .dataviews-view-picker-activity__item-type::after, .dataviews-view-picker-activity > .dataviews-view-picker-activity__item:last-child .dataviews-view-picker-activity__item-type::after {
2190
+ background: linear-gradient(to bottom, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 0%, color-mix(in srgb, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 20%, transparent) 60%, transparent 100%);
2191
+ }
2192
+ .dataviews-view-picker-activity .dataviews-view-picker-activity-group__header {
2193
+ font-size: var(--wpds-typography-font-size-lg, 15px);
2194
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
2195
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2196
+ margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2197
+ padding: 0;
2198
+ padding-inline-start: var(--wpds-dimension-padding-2xl, 24px);
2199
+ }
2200
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon {
2201
+ overflow: hidden;
2202
+ flex-shrink: 0;
2203
+ background-color: transparent;
2204
+ }
2205
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon img,
2206
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon svg,
2207
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet {
2208
+ display: block;
2209
+ width: 100%;
2210
+ height: 100%;
2211
+ margin: 0 auto;
2212
+ -o-object-fit: cover;
2213
+ object-fit: cover;
2214
+ border-radius: 50%;
2215
+ box-sizing: border-box;
2216
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-surface-neutral, #dbdbdb);
2217
+ }
2218
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon svg {
2219
+ padding: var(--wpds-dimension-padding-xs, 4px);
2220
+ }
2221
+ .dataviews-view-picker-activity .dataviews-view-picker-activity__item-type-icon .dataviews-view-picker-activity__item-bullet {
2222
+ background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
2223
+ }
2224
+
2039
2225
  .dataviews-picker-footer__bulk-selection {
2040
2226
  align-self: flex-start;
2041
- height: calc(var(--wpds-dimension-base, 4px) * 8);
2227
+ height: var(--wpds-dimension-size-md, 32px);
2042
2228
  }
2043
2229
 
2044
2230
  .dataviews-picker-footer__actions {
@@ -2073,7 +2259,7 @@ div.dataviews-view-list {
2073
2259
  border: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
2074
2260
  }
2075
2261
  .dataviews-controls__date-preset:active {
2076
- background-color: var(--wpds-color-bg-interactive-neutral-strong-active, #1e1e1e);
2262
+ background-color: var(--wpds-color-background-interactive-neutral-strong-active, #1e1e1e);
2077
2263
  }
2078
2264
 
2079
2265
  .dataforms-layouts-panel__field-trigger {
@@ -2081,7 +2267,7 @@ div.dataviews-view-list {
2081
2267
  color: inherit;
2082
2268
  display: flex;
2083
2269
  width: 100%;
2084
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2270
+ min-height: var(--wpds-dimension-size-sm, 24px);
2085
2271
  cursor: var(--wpds-cursor-control, pointer);
2086
2272
  align-items: flex-start;
2087
2273
  border-radius: var(--wpds-border-radius-sm, 2px);
@@ -2089,7 +2275,7 @@ div.dataviews-view-list {
2089
2275
  }
2090
2276
  .dataforms-layouts-panel__field-trigger--label-side {
2091
2277
  flex-direction: row;
2092
- gap: var(--wpds-dimension-gap-md, 12px);
2278
+ gap: var(--wpds-dimension-gap-sm, 8px);
2093
2279
  }
2094
2280
  .dataforms-layouts-panel__field-trigger--label-top {
2095
2281
  display: grid;
@@ -2099,19 +2285,19 @@ div.dataviews-view-list {
2099
2285
  align-items: center;
2100
2286
  }
2101
2287
  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover {
2102
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2288
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2103
2289
  }
2104
2290
  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-trigger-icon {
2105
2291
  opacity: 1;
2106
2292
  }
2107
2293
  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-label {
2108
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2294
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2109
2295
  }
2110
2296
  .dataforms-layouts-panel__field-trigger.is-disabled {
2111
2297
  cursor: default;
2112
2298
  }
2113
2299
  .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control {
2114
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
2300
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2115
2301
  font-weight: var(--wpds-typography-font-weight-regular, 400);
2116
2302
  }
2117
2303
 
@@ -2120,19 +2306,19 @@ div.dataviews-view-list {
2120
2306
  fill: currentColor;
2121
2307
  }
2122
2308
  .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:hover, .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:focus-visible {
2123
- fill: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2309
+ fill: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2124
2310
  }
2125
2311
 
2126
2312
  .dataforms-layouts-panel__field-trigger-icon {
2127
2313
  padding: 0;
2128
- color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2314
+ color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2129
2315
  flex: 0 0 auto;
2130
2316
  opacity: 0;
2131
2317
  border-radius: var(--wpds-border-radius-xs, 1px);
2132
2318
  }
2133
2319
  .dataforms-layouts-panel__field-trigger-icon:focus-visible {
2134
2320
  opacity: 1;
2135
- outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
2321
+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
2136
2322
  }
2137
2323
 
2138
2324
  .dataforms-layouts-panel__field-dropdown-anchor {
@@ -2145,12 +2331,12 @@ div.dataviews-view-list {
2145
2331
  .dataforms-layouts-panel__field-label {
2146
2332
  width: 38%;
2147
2333
  flex-shrink: 0;
2148
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2334
+ min-height: var(--wpds-dimension-size-sm, 24px);
2149
2335
  display: flex;
2150
2336
  align-items: center;
2151
2337
  line-height: var(--wpds-typography-line-height-sm, 20px);
2152
2338
  hyphens: auto;
2153
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
2339
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2154
2340
  }
2155
2341
  .dataforms-layouts-panel__field-label .components-base-control__label {
2156
2342
  display: inline;
@@ -2158,14 +2344,14 @@ div.dataviews-view-list {
2158
2344
  line-height: inherit;
2159
2345
  }
2160
2346
  .dataforms-layouts-panel__field-label.has-error {
2161
- color: var(--wpds-color-fg-content-error-weak, #cc1818);
2347
+ color: var(--wpds-color-foreground-content-error-weak, #cc1818);
2162
2348
  }
2163
2349
 
2164
2350
  .dataforms-layouts-panel__field-label-error-content {
2165
2351
  position: relative;
2166
2352
  z-index: 1;
2167
2353
  cursor: help;
2168
- fill: var(--wpds-color-fg-content-error-weak, #cc1818);
2354
+ fill: var(--wpds-color-foreground-content-error-weak, #cc1818);
2169
2355
  display: inline-flex;
2170
2356
  flex-direction: row;
2171
2357
  align-items: center;
@@ -2178,31 +2364,19 @@ div.dataviews-view-list {
2178
2364
  .dataforms-layouts-panel__field-control {
2179
2365
  flex-grow: 1;
2180
2366
  min-width: 0;
2181
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2367
+ min-height: var(--wpds-dimension-size-sm, 24px);
2182
2368
  line-height: var(--wpds-typography-line-height-md, 24px);
2183
2369
  display: flex;
2184
2370
  align-items: center;
2185
- overflow: hidden;
2371
+ overflow: clip;
2372
+ padding-inline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
2373
+ margin-inline: calc(-1 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
2186
2374
  word-break: break-word;
2187
2375
  font-weight: var(--wpds-typography-font-weight-medium, 499);
2188
2376
  }
2189
2377
  .dataforms-layouts-panel__field-control > * {
2190
2378
  min-width: 0;
2191
2379
  }
2192
- .dataforms-layouts-panel__field-control .components-button {
2193
- max-width: 100%;
2194
- text-align: right;
2195
- white-space: normal;
2196
- text-wrap: balance;
2197
- text-wrap: pretty;
2198
- min-height: 32px;
2199
- }
2200
- .dataforms-layouts-panel__field-control.components-button.is-link[aria-disabled=true] {
2201
- text-decoration: none;
2202
- }
2203
- .dataforms-layouts-panel__field-control .components-dropdown {
2204
- max-width: 100%;
2205
- }
2206
2380
 
2207
2381
  .dataforms-layouts-panel__field-trigger--label-top .dataforms-layouts-panel__field-label {
2208
2382
  width: 100%;
@@ -2240,20 +2414,20 @@ div.dataviews-view-list {
2240
2414
 
2241
2415
  .dataforms-layouts-regular__field {
2242
2416
  width: 100%;
2243
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
2417
+ min-height: var(--wpds-dimension-size-md, 32px);
2244
2418
  justify-content: flex-start !important;
2245
2419
  align-items: flex-start !important;
2246
2420
  }
2247
2421
  .dataforms-layouts-regular__field .components-base-control__label,
2248
2422
  .dataforms-layouts-regular__field .components-input-control__label,
2249
2423
  .dataforms-layouts-regular__field .components-form-token-field__label {
2250
- color: var(--wpds-color-fg-content-neutral, #1e1e1e);
2424
+ color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
2251
2425
  }
2252
2426
 
2253
2427
  .dataforms-layouts-regular__field-label {
2254
2428
  width: 38%;
2255
2429
  flex-shrink: 0;
2256
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
2430
+ min-height: var(--wpds-dimension-size-md, 32px);
2257
2431
  display: flex;
2258
2432
  align-items: center;
2259
2433
  line-height: var(--wpds-typography-line-height-sm, 20px);
@@ -2268,7 +2442,7 @@ div.dataviews-view-list {
2268
2442
 
2269
2443
  .dataforms-layouts-regular__field-control {
2270
2444
  flex-grow: 1;
2271
- min-height: calc(var(--wpds-dimension-base, 4px) * 8);
2445
+ min-height: var(--wpds-dimension-size-md, 32px);
2272
2446
  display: flex;
2273
2447
  align-items: center;
2274
2448
  }
@@ -2286,7 +2460,7 @@ div.dataviews-view-list {
2286
2460
  }
2287
2461
 
2288
2462
  .dataforms-layouts-card__field-description {
2289
- color: var(--wpds-color-fg-content-neutral-weak, #707070);
2463
+ color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2290
2464
  display: block;
2291
2465
  font-size: var(--wpds-typography-font-size-md, 13px);
2292
2466
  margin-bottom: var(--wpds-dimension-gap-lg, 16px);
@@ -2301,7 +2475,7 @@ div.dataviews-view-list {
2301
2475
 
2302
2476
  .dataforms-layouts-details__summary-content {
2303
2477
  display: inline-flex;
2304
- min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2478
+ min-height: var(--wpds-dimension-size-sm, 24px);
2305
2479
  }
2306
2480
 
2307
2481
  .dataforms-layouts-details__content {