@wordpress/dataviews 12.1.1-next.v.202602241322.0 → 13.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/CHANGELOG.md +22 -1
  2. package/README.md +132 -14
  3. package/build/components/dataform-layouts/card/index.cjs +12 -7
  4. package/build/components/dataform-layouts/card/index.cjs.map +2 -2
  5. package/build/components/dataform-layouts/panel/utils/get-label-content.cjs +2 -2
  6. package/build/components/dataform-layouts/panel/utils/get-label-content.cjs.map +2 -2
  7. package/build/components/dataviews-context/index.cjs +1 -0
  8. package/build/components/dataviews-context/index.cjs.map +2 -2
  9. package/build/components/dataviews-filters/toggle.cjs +6 -2
  10. package/build/components/dataviews-filters/toggle.cjs.map +2 -2
  11. package/build/components/dataviews-footer/index.cjs +28 -12
  12. package/build/components/dataviews-footer/index.cjs.map +3 -3
  13. package/build/components/dataviews-item-actions/index.cjs +0 -1
  14. package/build/components/dataviews-item-actions/index.cjs.map +2 -2
  15. package/build/components/dataviews-layout/index.cjs +4 -0
  16. package/build/components/dataviews-layout/index.cjs.map +2 -2
  17. package/build/components/dataviews-layouts/activity/index.cjs +41 -26
  18. package/build/components/dataviews-layouts/activity/index.cjs.map +3 -3
  19. package/build/components/dataviews-layouts/grid/composite-grid.cjs +2 -0
  20. package/build/components/dataviews-layouts/grid/composite-grid.cjs.map +2 -2
  21. package/build/components/dataviews-layouts/grid/index.cjs +19 -14
  22. package/build/components/dataviews-layouts/grid/index.cjs.map +3 -3
  23. package/build/components/dataviews-layouts/list/index.cjs +25 -12
  24. package/build/components/dataviews-layouts/list/index.cjs.map +2 -2
  25. package/build/components/dataviews-layouts/table/index.cjs +40 -19
  26. package/build/components/dataviews-layouts/table/index.cjs.map +2 -2
  27. package/build/dataviews/index.cjs +9 -2
  28. package/build/dataviews/index.cjs.map +3 -3
  29. package/build/dataviews-picker/index.cjs +1 -0
  30. package/build/dataviews-picker/index.cjs.map +2 -2
  31. package/build/hooks/use-data.cjs +46 -0
  32. package/build/hooks/use-data.cjs.map +7 -0
  33. package/build/hooks/use-delayed-loading.cjs +47 -0
  34. package/build/hooks/use-delayed-loading.cjs.map +7 -0
  35. package/build-module/components/dataform-layouts/card/index.mjs +12 -7
  36. package/build-module/components/dataform-layouts/card/index.mjs.map +2 -2
  37. package/build-module/components/dataform-layouts/panel/utils/get-label-content.mjs +3 -3
  38. package/build-module/components/dataform-layouts/panel/utils/get-label-content.mjs.map +2 -2
  39. package/build-module/components/dataviews-context/index.mjs +1 -0
  40. package/build-module/components/dataviews-context/index.mjs.map +2 -2
  41. package/build-module/components/dataviews-filters/toggle.mjs +6 -2
  42. package/build-module/components/dataviews-filters/toggle.mjs.map +2 -2
  43. package/build-module/components/dataviews-footer/index.mjs +28 -12
  44. package/build-module/components/dataviews-footer/index.mjs.map +2 -2
  45. package/build-module/components/dataviews-item-actions/index.mjs +0 -1
  46. package/build-module/components/dataviews-item-actions/index.mjs.map +2 -2
  47. package/build-module/components/dataviews-layout/index.mjs +4 -0
  48. package/build-module/components/dataviews-layout/index.mjs.map +2 -2
  49. package/build-module/components/dataviews-layouts/activity/index.mjs +41 -26
  50. package/build-module/components/dataviews-layouts/activity/index.mjs.map +2 -2
  51. package/build-module/components/dataviews-layouts/grid/composite-grid.mjs +2 -0
  52. package/build-module/components/dataviews-layouts/grid/composite-grid.mjs.map +2 -2
  53. package/build-module/components/dataviews-layouts/grid/index.mjs +19 -14
  54. package/build-module/components/dataviews-layouts/grid/index.mjs.map +2 -2
  55. package/build-module/components/dataviews-layouts/list/index.mjs +25 -12
  56. package/build-module/components/dataviews-layouts/list/index.mjs.map +2 -2
  57. package/build-module/components/dataviews-layouts/table/index.mjs +40 -19
  58. package/build-module/components/dataviews-layouts/table/index.mjs.map +2 -2
  59. package/build-module/dataviews/index.mjs +9 -2
  60. package/build-module/dataviews/index.mjs.map +2 -2
  61. package/build-module/dataviews-picker/index.mjs +1 -0
  62. package/build-module/dataviews-picker/index.mjs.map +2 -2
  63. package/build-module/hooks/use-data.mjs +25 -0
  64. package/build-module/hooks/use-data.mjs.map +7 -0
  65. package/build-module/hooks/use-delayed-loading.mjs +22 -0
  66. package/build-module/hooks/use-delayed-loading.mjs.map +7 -0
  67. package/build-style/style-rtl.css +91 -19
  68. package/build-style/style.css +91 -19
  69. package/build-types/components/dataform-layouts/card/index.d.ts.map +1 -1
  70. package/build-types/components/dataform-layouts/panel/utils/get-label-content.d.ts +1 -1
  71. package/build-types/components/dataform-layouts/panel/utils/get-label-content.d.ts.map +1 -1
  72. package/build-types/components/dataviews-context/index.d.ts +1 -0
  73. package/build-types/components/dataviews-context/index.d.ts.map +1 -1
  74. package/build-types/components/dataviews-filters/toggle.d.ts.map +1 -1
  75. package/build-types/components/dataviews-footer/index.d.ts +1 -1
  76. package/build-types/components/dataviews-footer/index.d.ts.map +1 -1
  77. package/build-types/components/dataviews-item-actions/index.d.ts.map +1 -1
  78. package/build-types/components/dataviews-layout/index.d.ts +1 -1
  79. package/build-types/components/dataviews-layout/index.d.ts.map +1 -1
  80. package/build-types/components/dataviews-layouts/activity/index.d.ts.map +1 -1
  81. package/build-types/components/dataviews-layouts/grid/composite-grid.d.ts +2 -1
  82. package/build-types/components/dataviews-layouts/grid/composite-grid.d.ts.map +1 -1
  83. package/build-types/components/dataviews-layouts/grid/index.d.ts.map +1 -1
  84. package/build-types/components/dataviews-layouts/list/index.d.ts.map +1 -1
  85. package/build-types/components/dataviews-layouts/table/index.d.ts.map +1 -1
  86. package/build-types/dataform/stories/layout-panel.d.ts.map +1 -1
  87. package/build-types/dataviews/index.d.ts.map +1 -1
  88. package/build-types/dataviews/stories/empty.d.ts.map +1 -1
  89. package/build-types/dataviews/stories/free-composition.d.ts.map +1 -1
  90. package/build-types/dataviews/stories/layout-table.d.ts.map +1 -1
  91. package/build-types/dataviews/stories/minimal-ui.d.ts.map +1 -1
  92. package/build-types/dataviews/stories/with-card.d.ts.map +1 -1
  93. package/build-types/dataviews-picker/index.d.ts.map +1 -1
  94. package/build-types/hooks/use-data.d.ts +12 -0
  95. package/build-types/hooks/use-data.d.ts.map +1 -0
  96. package/build-types/hooks/use-delayed-loading.d.ts +4 -0
  97. package/build-types/hooks/use-delayed-loading.d.ts.map +1 -0
  98. package/build-wp/index.js +263 -135
  99. package/package.json +16 -19
  100. package/src/components/dataform-layouts/card/index.tsx +8 -9
  101. package/src/components/dataform-layouts/card/style.scss +1 -0
  102. package/src/components/dataform-layouts/panel/style.scss +2 -0
  103. package/src/components/dataform-layouts/panel/utils/get-label-content.tsx +3 -5
  104. package/src/components/dataform-layouts/regular/style.scss +3 -2
  105. package/src/components/dataviews-context/index.ts +2 -0
  106. package/src/components/dataviews-filters/toggle.tsx +9 -2
  107. package/src/components/dataviews-footer/index.tsx +39 -12
  108. package/src/components/dataviews-footer/style.scss +6 -1
  109. package/src/components/dataviews-item-actions/index.tsx +0 -3
  110. package/src/components/dataviews-item-actions/style.scss +7 -0
  111. package/src/components/dataviews-layout/index.tsx +5 -0
  112. package/src/components/dataviews-layouts/activity/index.tsx +29 -22
  113. package/src/components/dataviews-layouts/activity/style.scss +5 -0
  114. package/src/components/dataviews-layouts/grid/composite-grid.tsx +4 -0
  115. package/src/components/dataviews-layouts/grid/index.tsx +19 -22
  116. package/src/components/dataviews-layouts/grid/style.scss +5 -0
  117. package/src/components/dataviews-layouts/list/index.tsx +39 -21
  118. package/src/components/dataviews-layouts/list/style.scss +5 -9
  119. package/src/components/dataviews-layouts/table/index.tsx +48 -22
  120. package/src/components/dataviews-layouts/table/style.scss +6 -0
  121. package/src/dataform/stories/layout-card.tsx +2 -2
  122. package/src/dataform/stories/layout-panel.tsx +5 -1
  123. package/src/dataviews/index.tsx +10 -2
  124. package/src/dataviews/stories/empty.tsx +1 -7
  125. package/src/dataviews/stories/free-composition.tsx +0 -5
  126. package/src/dataviews/stories/layout-table.tsx +1 -7
  127. package/src/dataviews/stories/minimal-ui.tsx +0 -5
  128. package/src/dataviews/stories/with-card.tsx +1 -7
  129. package/src/dataviews/style.scss +25 -0
  130. package/src/dataviews-picker/index.tsx +1 -0
  131. package/src/hooks/use-data.ts +45 -0
  132. package/src/hooks/use-delayed-loading.ts +21 -0
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/dataviews-picker/index.tsx"],
4
- "sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useMemo, useRef, useState } from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../components/dataviews-context';\nimport { VIEW_LAYOUTS } from '../components/dataviews-layouts';\nimport {\n\tFilters,\n\tFiltersToggled,\n\tuseFilters,\n\tFiltersToggle,\n} from '../components/dataviews-filters';\nimport DataViewsLayout from '../components/dataviews-layout';\nimport { DataViewsPickerFooter } from '../components/dataviews-picker-footer';\nimport DataViewsSearch from '../components/dataviews-search';\nimport { DataViewsPagination } from '../components/dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../components/dataviews-view-config';\nimport normalizeFields from '../field-types';\nimport type { ActionButton, Field, View, SupportedLayouts } from '../types';\nimport type { SelectionOrUpdater } from '../types/private';\ntype ItemWithId = { id: string };\n\nconst isItemClickable = () => false;\n\nconst dataViewsPickerLayouts = VIEW_LAYOUTS.filter(\n\t( viewLayout ) => viewLayout.isPicker\n);\n\ntype DataViewsPickerProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tactions?: ActionButton< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t\tinfiniteScrollHandler?: () => void;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection: string[];\n\tonChangeSelection: ( items: string[] ) => void;\n\tchildren?: ReactNode;\n\tconfig?: {\n\t\tperPageSizes: number[];\n\t};\n\titemListLabel?: string;\n\tempty?: ReactNode;\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst EMPTY_ARRAY: any[] = [];\n\ntype DefaultUIProps = Pick<\n\tDataViewsPickerProps< any >,\n\t'search' | 'searchLabel'\n>;\n\nfunction DefaultUI( {\n\tsearch = true,\n\tsearchLabel = undefined,\n}: DefaultUIProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talign=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tgap=\"xs\"\n\t\t\t>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t>\n\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t<FiltersToggle />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap=\"xs\" style={ { flexShrink: 0 } }>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t\t<FiltersToggled className=\"dataviews-filters__container\" />\n\t\t\t<DataViewsLayout />\n\t\t\t<DataViewsPickerFooter />\n\t\t</>\n\t);\n}\n\nfunction DataViewsPicker< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts: defaultLayoutsProperty,\n\tselection,\n\tonChangeSelection,\n\tchildren,\n\tconfig = { perPageSizes: [ 10, 20, 50, 100 ] },\n\titemListLabel,\n\tempty,\n}: DataViewsPickerProps< Item > ) {\n\tconst { infiniteScrollHandler } = paginationInfo;\n\tconst containerRef = useRef< HTMLDivElement >( null );\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst resizeObserverRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst filters = useFilters( _fields, view );\n\tconst hasPrimaryOrLockedFilters = useMemo(\n\t\t() =>\n\t\t\t( filters || [] ).some(\n\t\t\t\t( filter ) => filter.isPrimary || filter.isLocked\n\t\t\t),\n\t\t[ filters ]\n\t);\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >(\n\t\thasPrimaryOrLockedFilters\n\t);\n\n\tuseEffect( () => {\n\t\tif ( hasPrimaryOrLockedFilters && ! isShowingFilter ) {\n\t\t\tsetIsShowingFilter( true );\n\t\t}\n\t}, [ hasPrimaryOrLockedFilters, isShowingFilter ] );\n\n\t// Attach scroll event listener for infinite scroll\n\tuseEffect( () => {\n\t\tif ( ! view.infiniteScrollEnabled || ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = throttle( ( event: unknown ) => {\n\t\t\tconst target = ( event as Event ).target as HTMLElement;\n\t\t\tconst scrollTop = target.scrollTop;\n\t\t\tconst scrollHeight = target.scrollHeight;\n\t\t\tconst clientHeight = target.clientHeight;\n\n\t\t\t// Check if user has scrolled near the bottom\n\t\t\tif ( scrollTop + clientHeight >= scrollHeight - 100 ) {\n\t\t\t\tinfiniteScrollHandler?.();\n\t\t\t}\n\t\t}, 100 ); // Throttle to 100ms\n\n\t\tconst container = containerRef.current;\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\n\t\treturn () => {\n\t\t\tcontainer.removeEventListener( 'scroll', handleScroll );\n\t\t\thandleScroll.cancel(); // Cancel any pending throttled calls\n\t\t};\n\t}, [ infiniteScrollHandler, view.infiniteScrollEnabled ] );\n\n\t// Filter out DataViewsPicker layouts.\n\tconst defaultLayouts = useMemo(\n\t\t() =>\n\t\t\tObject.fromEntries(\n\t\t\t\tObject.entries( defaultLayoutsProperty ).filter(\n\t\t\t\t\t( [ layoutType ] ) => {\n\t\t\t\t\t\treturn dataViewsPickerLayouts.some(\n\t\t\t\t\t\t\t( viewLayout ) => viewLayout.type === layoutType\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t),\n\t\t[ defaultLayoutsProperty ]\n\t);\n\n\tif ( ! defaultLayouts[ view.type ] ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tisItemClickable,\n\t\t\t\tselection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tcontainerWidth,\n\t\t\t\tcontainerRef,\n\t\t\t\tresizeObserverRef,\n\t\t\t\tdefaultLayouts,\n\t\t\t\tfilters,\n\t\t\t\tisShowingFilter,\n\t\t\t\tsetIsShowingFilter,\n\t\t\t\tconfig,\n\t\t\t\titemListLabel,\n\t\t\t\tempty,\n\t\t\t\thasInfiniteScrollHandler: !! infiniteScrollHandler,\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-picker-wrapper\" ref={ containerRef }>\n\t\t\t\t{ children ?? (\n\t\t\t\t\t<DefaultUI search={ search } searchLabel={ searchLabel } />\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n\n// Populate the DataViews sub components\nconst DataViewsPickerSubComponents =\n\tDataViewsPicker as typeof DataViewsPicker & {\n\t\tBulkActionToolbar: typeof DataViewsPickerFooter;\n\t\tFilters: typeof Filters;\n\t\tFiltersToggled: typeof FiltersToggled;\n\t\tFiltersToggle: typeof FiltersToggle;\n\t\tLayout: typeof DataViewsLayout;\n\t\tLayoutSwitcher: typeof ViewTypeMenu;\n\t\tPagination: typeof DataViewsPagination;\n\t\tSearch: typeof DataViewsSearch;\n\t\tViewConfig: typeof DataviewsViewConfigDropdown;\n\t};\n\nDataViewsPickerSubComponents.BulkActionToolbar = DataViewsPickerFooter;\nDataViewsPickerSubComponents.Filters = Filters;\nDataViewsPickerSubComponents.FiltersToggled = FiltersToggled;\nDataViewsPickerSubComponents.FiltersToggle = FiltersToggle;\nDataViewsPickerSubComponents.Layout = DataViewsLayout;\nDataViewsPickerSubComponents.LayoutSwitcher = ViewTypeMenu;\nDataViewsPickerSubComponents.Pagination = DataViewsPagination;\nDataViewsPickerSubComponents.Search = DataViewsSearch;\nDataViewsPickerSubComponents.ViewConfig = DataviewsViewConfigDropdown;\n\nexport default DataViewsPickerSubComponents;\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/**\n * External dependencies\n */\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useMemo, useRef, useState } from '@wordpress/element';\nimport { useResizeObserver, throttle } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../components/dataviews-context';\nimport { VIEW_LAYOUTS } from '../components/dataviews-layouts';\nimport {\n\tFilters,\n\tFiltersToggled,\n\tuseFilters,\n\tFiltersToggle,\n} from '../components/dataviews-filters';\nimport DataViewsLayout from '../components/dataviews-layout';\nimport { DataViewsPickerFooter } from '../components/dataviews-picker-footer';\nimport DataViewsSearch from '../components/dataviews-search';\nimport { DataViewsPagination } from '../components/dataviews-pagination';\nimport DataViewsViewConfig, {\n\tDataviewsViewConfigDropdown,\n\tViewTypeMenu,\n} from '../components/dataviews-view-config';\nimport normalizeFields from '../field-types';\nimport type { ActionButton, Field, View, SupportedLayouts } from '../types';\nimport type { SelectionOrUpdater } from '../types/private';\ntype ItemWithId = { id: string };\n\nconst isItemClickable = () => false;\n\nconst dataViewsPickerLayouts = VIEW_LAYOUTS.filter(\n\t( viewLayout ) => viewLayout.isPicker\n);\n\ntype DataViewsPickerProps< Item > = {\n\tview: View;\n\tonChangeView: ( view: View ) => void;\n\tfields: Field< Item >[];\n\tactions?: ActionButton< Item >[];\n\tsearch?: boolean;\n\tsearchLabel?: string;\n\tdata: Item[];\n\tisLoading?: boolean;\n\tpaginationInfo: {\n\t\ttotalItems: number;\n\t\ttotalPages: number;\n\t\tinfiniteScrollHandler?: () => void;\n\t};\n\tdefaultLayouts: SupportedLayouts;\n\tselection: string[];\n\tonChangeSelection: ( items: string[] ) => void;\n\tchildren?: ReactNode;\n\tconfig?: {\n\t\tperPageSizes: number[];\n\t};\n\titemListLabel?: string;\n\tempty?: ReactNode;\n} & ( Item extends ItemWithId\n\t? { getItemId?: ( item: Item ) => string }\n\t: { getItemId: ( item: Item ) => string } );\n\nconst defaultGetItemId = ( item: ItemWithId ) => item.id;\nconst EMPTY_ARRAY: any[] = [];\n\ntype DefaultUIProps = Pick<\n\tDataViewsPickerProps< any >,\n\t'search' | 'searchLabel'\n>;\n\nfunction DefaultUI( {\n\tsearch = true,\n\tsearchLabel = undefined,\n}: DefaultUIProps ) {\n\treturn (\n\t\t<>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\talign=\"top\"\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews__view-actions\"\n\t\t\t\tgap=\"xs\"\n\t\t\t>\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\tclassName=\"dataviews__search\"\n\t\t\t\t>\n\t\t\t\t\t{ search && <DataViewsSearch label={ searchLabel } /> }\n\t\t\t\t\t<FiltersToggle />\n\t\t\t\t</Stack>\n\t\t\t\t<Stack direction=\"row\" gap=\"xs\" style={ { flexShrink: 0 } }>\n\t\t\t\t\t<DataViewsViewConfig />\n\t\t\t\t</Stack>\n\t\t\t</Stack>\n\t\t\t<FiltersToggled className=\"dataviews-filters__container\" />\n\t\t\t<DataViewsLayout />\n\t\t\t<DataViewsPickerFooter />\n\t\t</>\n\t);\n}\n\nfunction DataViewsPicker< Item >( {\n\tview,\n\tonChangeView,\n\tfields,\n\tsearch = true,\n\tsearchLabel = undefined,\n\tactions = EMPTY_ARRAY,\n\tdata,\n\tgetItemId = defaultGetItemId,\n\tisLoading = false,\n\tpaginationInfo,\n\tdefaultLayouts: defaultLayoutsProperty,\n\tselection,\n\tonChangeSelection,\n\tchildren,\n\tconfig = { perPageSizes: [ 10, 20, 50, 100 ] },\n\titemListLabel,\n\tempty,\n}: DataViewsPickerProps< Item > ) {\n\tconst { infiniteScrollHandler } = paginationInfo;\n\tconst containerRef = useRef< HTMLDivElement >( null );\n\tconst [ containerWidth, setContainerWidth ] = useState( 0 );\n\tconst resizeObserverRef = useResizeObserver(\n\t\t( resizeObserverEntries: any ) => {\n\t\t\tsetContainerWidth(\n\t\t\t\tresizeObserverEntries[ 0 ].borderBoxSize[ 0 ].inlineSize\n\t\t\t);\n\t\t},\n\t\t{ box: 'border-box' }\n\t);\n\tconst [ openedFilter, setOpenedFilter ] = useState< string | null >( null );\n\tfunction setSelectionWithChange( value: SelectionOrUpdater ) {\n\t\tconst newValue =\n\t\t\ttypeof value === 'function' ? value( selection ) : value;\n\t\tif ( onChangeSelection ) {\n\t\t\tonChangeSelection( newValue );\n\t\t}\n\t}\n\tconst _fields = useMemo( () => normalizeFields( fields ), [ fields ] );\n\tconst filters = useFilters( _fields, view );\n\tconst hasPrimaryOrLockedFilters = useMemo(\n\t\t() =>\n\t\t\t( filters || [] ).some(\n\t\t\t\t( filter ) => filter.isPrimary || filter.isLocked\n\t\t\t),\n\t\t[ filters ]\n\t);\n\tconst [ isShowingFilter, setIsShowingFilter ] = useState< boolean >(\n\t\thasPrimaryOrLockedFilters\n\t);\n\n\tuseEffect( () => {\n\t\tif ( hasPrimaryOrLockedFilters && ! isShowingFilter ) {\n\t\t\tsetIsShowingFilter( true );\n\t\t}\n\t}, [ hasPrimaryOrLockedFilters, isShowingFilter ] );\n\n\t// Attach scroll event listener for infinite scroll\n\tuseEffect( () => {\n\t\tif ( ! view.infiniteScrollEnabled || ! containerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleScroll = throttle( ( event: unknown ) => {\n\t\t\tconst target = ( event as Event ).target as HTMLElement;\n\t\t\tconst scrollTop = target.scrollTop;\n\t\t\tconst scrollHeight = target.scrollHeight;\n\t\t\tconst clientHeight = target.clientHeight;\n\n\t\t\t// Check if user has scrolled near the bottom\n\t\t\tif ( scrollTop + clientHeight >= scrollHeight - 100 ) {\n\t\t\t\tinfiniteScrollHandler?.();\n\t\t\t}\n\t\t}, 100 ); // Throttle to 100ms\n\n\t\tconst container = containerRef.current;\n\t\tcontainer.addEventListener( 'scroll', handleScroll );\n\n\t\treturn () => {\n\t\t\tcontainer.removeEventListener( 'scroll', handleScroll );\n\t\t\thandleScroll.cancel(); // Cancel any pending throttled calls\n\t\t};\n\t}, [ infiniteScrollHandler, view.infiniteScrollEnabled ] );\n\n\t// Filter out DataViewsPicker layouts.\n\tconst defaultLayouts = useMemo(\n\t\t() =>\n\t\t\tObject.fromEntries(\n\t\t\t\tObject.entries( defaultLayoutsProperty ).filter(\n\t\t\t\t\t( [ layoutType ] ) => {\n\t\t\t\t\t\treturn dataViewsPickerLayouts.some(\n\t\t\t\t\t\t\t( viewLayout ) => viewLayout.type === layoutType\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t)\n\t\t\t),\n\t\t[ defaultLayoutsProperty ]\n\t);\n\n\tif ( ! defaultLayouts[ view.type ] ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<DataViewsContext.Provider\n\t\t\tvalue={ {\n\t\t\t\tview,\n\t\t\t\tonChangeView,\n\t\t\t\tfields: _fields,\n\t\t\t\tactions,\n\t\t\t\tdata,\n\t\t\t\tisLoading,\n\t\t\t\tpaginationInfo,\n\t\t\t\tisItemClickable,\n\t\t\t\tselection,\n\t\t\t\tonChangeSelection: setSelectionWithChange,\n\t\t\t\topenedFilter,\n\t\t\t\tsetOpenedFilter,\n\t\t\t\tgetItemId,\n\t\t\t\tcontainerWidth,\n\t\t\t\tcontainerRef,\n\t\t\t\tresizeObserverRef,\n\t\t\t\tdefaultLayouts,\n\t\t\t\tfilters,\n\t\t\t\tisShowingFilter,\n\t\t\t\tsetIsShowingFilter,\n\t\t\t\tconfig,\n\t\t\t\titemListLabel,\n\t\t\t\tempty,\n\t\t\t\thasInitiallyLoaded: true,\n\t\t\t\thasInfiniteScrollHandler: !! infiniteScrollHandler,\n\t\t\t} }\n\t\t>\n\t\t\t<div className=\"dataviews-picker-wrapper\" ref={ containerRef }>\n\t\t\t\t{ children ?? (\n\t\t\t\t\t<DefaultUI search={ search } searchLabel={ searchLabel } />\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</DataViewsContext.Provider>\n\t);\n}\n\n// Populate the DataViews sub components\nconst DataViewsPickerSubComponents =\n\tDataViewsPicker as typeof DataViewsPicker & {\n\t\tBulkActionToolbar: typeof DataViewsPickerFooter;\n\t\tFilters: typeof Filters;\n\t\tFiltersToggled: typeof FiltersToggled;\n\t\tFiltersToggle: typeof FiltersToggle;\n\t\tLayout: typeof DataViewsLayout;\n\t\tLayoutSwitcher: typeof ViewTypeMenu;\n\t\tPagination: typeof DataViewsPagination;\n\t\tSearch: typeof DataViewsSearch;\n\t\tViewConfig: typeof DataviewsViewConfigDropdown;\n\t};\n\nDataViewsPickerSubComponents.BulkActionToolbar = DataViewsPickerFooter;\nDataViewsPickerSubComponents.Filters = Filters;\nDataViewsPickerSubComponents.FiltersToggled = FiltersToggled;\nDataViewsPickerSubComponents.FiltersToggle = FiltersToggle;\nDataViewsPickerSubComponents.Layout = DataViewsLayout;\nDataViewsPickerSubComponents.LayoutSwitcher = ViewTypeMenu;\nDataViewsPickerSubComponents.Pagination = DataViewsPagination;\nDataViewsPickerSubComponents.Search = DataViewsSearch;\nDataViewsPickerSubComponents.ViewConfig = DataviewsViewConfigDropdown;\n\nexport default DataViewsPickerSubComponents;\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -0,0 +1,25 @@
1
+ // packages/dataviews/src/hooks/use-data.ts
2
+ import { useEffect, useRef, useState } from "@wordpress/element";
3
+ function useData(data, isLoading, paginationInfo) {
4
+ const previousDataRef = useRef(data);
5
+ const previousPaginationInfoRef = useRef(paginationInfo);
6
+ const [hasInitiallyLoaded, setHasInitiallyLoaded] = useState(
7
+ !isLoading
8
+ );
9
+ useEffect(() => {
10
+ if (!isLoading) {
11
+ previousDataRef.current = data;
12
+ previousPaginationInfoRef.current = paginationInfo;
13
+ setHasInitiallyLoaded(true);
14
+ }
15
+ }, [data, isLoading, paginationInfo]);
16
+ return {
17
+ data: isLoading && previousDataRef.current?.length ? previousDataRef.current : data,
18
+ paginationInfo: isLoading && previousDataRef.current?.length ? previousPaginationInfoRef.current : paginationInfo,
19
+ hasInitiallyLoaded
20
+ };
21
+ }
22
+ export {
23
+ useData as default
24
+ };
25
+ //# sourceMappingURL=use-data.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/hooks/use-data.ts"],
4
+ "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\n\ntype PaginationInfo = {\n\ttotalItems: number;\n\ttotalPages: number;\n\tinfiniteScrollHandler?: () => void;\n};\n\nexport default function useData< Item >(\n\tdata: Item[],\n\tisLoading: boolean | undefined,\n\tpaginationInfo: PaginationInfo\n): {\n\tdata: Item[];\n\tpaginationInfo: PaginationInfo;\n\thasInitiallyLoaded: boolean;\n} {\n\tconst previousDataRef = useRef< Item[] >( data );\n\tconst previousPaginationInfoRef =\n\t\tuseRef< PaginationInfo >( paginationInfo );\n\tconst [ hasInitiallyLoaded, setHasInitiallyLoaded ] = useState(\n\t\t! isLoading\n\t);\n\tuseEffect( () => {\n\t\tif ( ! isLoading ) {\n\t\t\tpreviousDataRef.current = data;\n\t\t\tpreviousPaginationInfoRef.current = paginationInfo;\n\t\t\tsetHasInitiallyLoaded( true );\n\t\t}\n\t}, [ data, isLoading, paginationInfo ] );\n\treturn {\n\t\tdata:\n\t\t\tisLoading && previousDataRef.current?.length\n\t\t\t\t? previousDataRef.current\n\t\t\t\t: data,\n\t\tpaginationInfo:\n\t\t\tisLoading && previousDataRef.current?.length\n\t\t\t\t? previousPaginationInfoRef.current\n\t\t\t\t: paginationInfo,\n\t\thasInitiallyLoaded,\n\t};\n}\n"],
5
+ "mappings": ";AAGA,SAAS,WAAW,QAAQ,gBAAgB;AAQ7B,SAAR,QACN,MACA,WACA,gBAKC;AACD,QAAM,kBAAkB,OAAkB,IAAK;AAC/C,QAAM,4BACL,OAA0B,cAAe;AAC1C,QAAM,CAAE,oBAAoB,qBAAsB,IAAI;AAAA,IACrD,CAAE;AAAA,EACH;AACA,YAAW,MAAM;AAChB,QAAK,CAAE,WAAY;AAClB,sBAAgB,UAAU;AAC1B,gCAA0B,UAAU;AACpC,4BAAuB,IAAK;AAAA,IAC7B;AAAA,EACD,GAAG,CAAE,MAAM,WAAW,cAAe,CAAE;AACvC,SAAO;AAAA,IACN,MACC,aAAa,gBAAgB,SAAS,SACnC,gBAAgB,UAChB;AAAA,IACJ,gBACC,aAAa,gBAAgB,SAAS,SACnC,0BAA0B,UAC1B;AAAA,IACJ;AAAA,EACD;AACD;",
6
+ "names": []
7
+ }
@@ -0,0 +1,22 @@
1
+ // packages/dataviews/src/hooks/use-delayed-loading.ts
2
+ import { useEffect, useState } from "@wordpress/element";
3
+ function useDelayedLoading(isLoading, options = { delay: 400 }) {
4
+ const [showLoader, setShowLoader] = useState(false);
5
+ useEffect(() => {
6
+ if (!isLoading) {
7
+ return;
8
+ }
9
+ const timeout = setTimeout(() => {
10
+ setShowLoader(true);
11
+ }, options.delay);
12
+ return () => {
13
+ clearTimeout(timeout);
14
+ setShowLoader(false);
15
+ };
16
+ }, [isLoading, options.delay]);
17
+ return showLoader;
18
+ }
19
+ export {
20
+ useDelayedLoading
21
+ };
22
+ //# sourceMappingURL=use-delayed-loading.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/hooks/use-delayed-loading.ts"],
4
+ "sourcesContent": ["import { useEffect, useState } from '@wordpress/element';\n\nexport function useDelayedLoading(\n\tisLoading: boolean,\n\toptions: { delay: number } = { delay: 400 }\n): boolean {\n\tconst [ showLoader, setShowLoader ] = useState( false );\n\tuseEffect( () => {\n\t\tif ( ! isLoading ) {\n\t\t\treturn;\n\t\t}\n\t\tconst timeout = setTimeout( () => {\n\t\t\tsetShowLoader( true );\n\t\t}, options.delay );\n\t\treturn () => {\n\t\t\tclearTimeout( timeout );\n\t\t\tsetShowLoader( false );\n\t\t};\n\t}, [ isLoading, options.delay ] );\n\treturn showLoader;\n}\n"],
5
+ "mappings": ";AAAA,SAAS,WAAW,gBAAgB;AAE7B,SAAS,kBACf,WACA,UAA6B,EAAE,OAAO,IAAI,GAChC;AACV,QAAM,CAAE,YAAY,aAAc,IAAI,SAAU,KAAM;AACtD,YAAW,MAAM;AAChB,QAAK,CAAE,WAAY;AAClB;AAAA,IACD;AACA,UAAM,UAAU,WAAY,MAAM;AACjC,oBAAe,IAAK;AAAA,IACrB,GAAG,QAAQ,KAAM;AACjB,WAAO,MAAM;AACZ,mBAAc,OAAQ;AACtB,oBAAe,KAAM;AAAA,IACtB;AAAA,EACD,GAAG,CAAE,WAAW,QAAQ,KAAM,CAAE;AAChC,SAAO;AACR;",
6
+ "names": []
7
+ }
@@ -133,6 +133,25 @@
133
133
  }
134
134
  }
135
135
 
136
+ .dataviews-no-results.is-refreshing {
137
+ opacity: 0.5;
138
+ pointer-events: none;
139
+ }
140
+ @media not (prefers-reduced-motion) {
141
+ .dataviews-no-results.is-refreshing {
142
+ opacity: 1;
143
+ animation: dataviews-pulse 1s ease-in-out infinite;
144
+ }
145
+ }
146
+
147
+ @keyframes dataviews-pulse {
148
+ 0%, 100% {
149
+ opacity: 1;
150
+ }
151
+ 50% {
152
+ opacity: 0.5;
153
+ }
154
+ }
136
155
  .dataviews-loading-more {
137
156
  text-align: center;
138
157
  }
@@ -741,18 +760,28 @@
741
760
  .dataviews-footer {
742
761
  z-index: 2;
743
762
  }
763
+ .dataviews-footer .is-refreshing {
764
+ opacity: 0.5;
765
+ pointer-events: none;
766
+ }
767
+ @media not (prefers-reduced-motion) {
768
+ .dataviews-footer .is-refreshing {
769
+ opacity: 1;
770
+ animation: dataviews-pulse 1s ease-in-out infinite;
771
+ }
772
+ }
744
773
 
745
774
  @container (max-width: 560px) {
746
- .dataviews-footer {
775
+ .dataviews-footer__content {
747
776
  flex-direction: column !important;
748
777
  }
749
- .dataviews-footer .dataviews-bulk-actions-footer__container {
778
+ .dataviews-footer__content .dataviews-bulk-actions-footer__container {
750
779
  width: 100%;
751
780
  }
752
- .dataviews-footer .dataviews-bulk-actions-footer__item-count {
781
+ .dataviews-footer__content .dataviews-bulk-actions-footer__item-count {
753
782
  flex-grow: 1;
754
783
  }
755
- .dataviews-footer .dataviews-pagination {
784
+ .dataviews-footer__content .dataviews-pagination {
756
785
  width: 100%;
757
786
  justify-content: space-between;
758
787
  }
@@ -773,6 +802,10 @@
773
802
  z-index: 1000001;
774
803
  }
775
804
 
805
+ .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
806
+ padding: 0 4px;
807
+ }
808
+
776
809
  .dataviews-selection-checkbox {
777
810
  --checkbox-input-size: 24px;
778
811
  }
@@ -1018,6 +1051,16 @@
1018
1051
  .dataviews-view-grid .dataviews-view-grid__badge-fields:not(:empty) {
1019
1052
  padding-bottom: 12px;
1020
1053
  }
1054
+ .dataviews-view-grid.is-refreshing {
1055
+ opacity: 0.5;
1056
+ pointer-events: none;
1057
+ }
1058
+ @media not (prefers-reduced-motion) {
1059
+ .dataviews-view-grid.is-refreshing {
1060
+ opacity: 1;
1061
+ animation: dataviews-pulse 1s ease-in-out infinite;
1062
+ }
1063
+ }
1021
1064
 
1022
1065
  .dataviews-view-grid__field-value:empty,
1023
1066
  .dataviews-view-grid__field:empty {
@@ -1257,7 +1300,6 @@ div.dataviews-view-list {
1257
1300
  border-radius: 4px;
1258
1301
  }
1259
1302
  .dataviews-view-list .dataviews-view-list__field-wrapper {
1260
- min-height: 52px;
1261
1303
  flex-grow: 1;
1262
1304
  min-width: 0;
1263
1305
  }
@@ -1297,9 +1339,6 @@ div.dataviews-view-list {
1297
1339
  width: 32px;
1298
1340
  height: 32px;
1299
1341
  }
1300
- .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__field-wrapper {
1301
- min-height: 32px;
1302
- }
1303
1342
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields {
1304
1343
  gap: 8px;
1305
1344
  row-gap: 4px;
@@ -1319,9 +1358,6 @@ div.dataviews-view-list {
1319
1358
  width: 64px;
1320
1359
  height: 64px;
1321
1360
  }
1322
- .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__field-wrapper {
1323
- min-height: 64px;
1324
- }
1325
1361
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields {
1326
1362
  gap: 16px;
1327
1363
  row-gap: 8px;
@@ -1330,6 +1366,16 @@ div.dataviews-view-list {
1330
1366
  min-height: 32px;
1331
1367
  line-height: 24px;
1332
1368
  }
1369
+ .dataviews-view-list.is-refreshing {
1370
+ opacity: 0.5;
1371
+ pointer-events: none;
1372
+ }
1373
+ @media not (prefers-reduced-motion) {
1374
+ .dataviews-view-list.is-refreshing {
1375
+ opacity: 1;
1376
+ animation: dataviews-pulse 1s ease-in-out infinite;
1377
+ }
1378
+ }
1333
1379
 
1334
1380
  .dataviews-view-list__group-header {
1335
1381
  font-size: 15px;
@@ -1472,6 +1518,7 @@ div.dataviews-view-list {
1472
1518
  }
1473
1519
  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-end {
1474
1520
  justify-content: flex-end;
1521
+ font-variant-numeric: tabular-nums;
1475
1522
  }
1476
1523
  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-center {
1477
1524
  justify-content: center;
@@ -1573,6 +1620,17 @@ div.dataviews-view-list {
1573
1620
  width: 1%;
1574
1621
  }
1575
1622
 
1623
+ .dataviews-view-table.is-refreshing {
1624
+ opacity: 0.5;
1625
+ pointer-events: none;
1626
+ }
1627
+ @media not (prefers-reduced-motion) {
1628
+ .dataviews-view-table.is-refreshing {
1629
+ opacity: 1;
1630
+ animation: dataviews-pulse 1s ease-in-out infinite;
1631
+ }
1632
+ }
1633
+
1576
1634
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card {
1577
1635
  height: 100%;
1578
1636
  justify-content: flex-start;
@@ -1899,6 +1957,16 @@ div.dataviews-view-list {
1899
1957
  content: "";
1900
1958
  background-color: #ddd;
1901
1959
  }
1960
+ .dataviews-view-activity.is-refreshing {
1961
+ opacity: 0.5;
1962
+ pointer-events: none;
1963
+ }
1964
+ @media not (prefers-reduced-motion) {
1965
+ .dataviews-view-activity.is-refreshing {
1966
+ opacity: 1;
1967
+ animation: dataviews-pulse 1s ease-in-out infinite;
1968
+ }
1969
+ }
1902
1970
  .dataviews-view-activity + .dataviews-pagination {
1903
1971
  justify-content: space-between;
1904
1972
  }
@@ -1956,7 +2024,7 @@ div.dataviews-view-list {
1956
2024
  }
1957
2025
  .dataforms-layouts-panel__field-trigger--label-side {
1958
2026
  flex-direction: row;
1959
- gap: var(--wpds-dimension-gap-md);
2027
+ gap: var(--wpds-dimension-gap-md, 12px);
1960
2028
  }
1961
2029
  .dataforms-layouts-panel__field-trigger--label-top {
1962
2030
  display: grid;
@@ -1979,7 +2047,7 @@ div.dataviews-view-list {
1979
2047
  }
1980
2048
  .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control {
1981
2049
  color: #757575;
1982
- font-weight: var(--wpds-font-weight-regular);
2050
+ font-weight: var(--wpds-font-weight-regular, 400);
1983
2051
  }
1984
2052
 
1985
2053
  .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon {
@@ -1995,11 +2063,11 @@ div.dataviews-view-list {
1995
2063
  color: var(--wp-admin-theme-color);
1996
2064
  flex: 0 0 auto;
1997
2065
  opacity: 0;
1998
- border-radius: var(--wpds-border-radius-xs);
2066
+ border-radius: var(--wpds-border-radius-xs, 1px);
1999
2067
  }
2000
2068
  .dataforms-layouts-panel__field-trigger-icon:focus-visible {
2001
2069
  opacity: 1;
2002
- outline: var(--wpds-border-width-focus) solid var(--wp-admin-theme-color);
2070
+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wp-admin-theme-color);
2003
2071
  }
2004
2072
 
2005
2073
  .dataforms-layouts-panel__field-dropdown-anchor {
@@ -2018,6 +2086,7 @@ div.dataviews-view-list {
2018
2086
  line-height: 20px;
2019
2087
  hyphens: auto;
2020
2088
  color: #757575;
2089
+ text-transform: capitalize;
2021
2090
  }
2022
2091
  .dataforms-layouts-panel__field-label .components-base-control__label {
2023
2092
  display: inline;
@@ -2046,11 +2115,12 @@ div.dataviews-view-list {
2046
2115
  flex-grow: 1;
2047
2116
  min-width: 0;
2048
2117
  min-height: 24px;
2049
- line-height: var(--wpds-font-line-height-md);
2118
+ line-height: var(--wpds-font-line-height-md, 24px);
2050
2119
  display: flex;
2051
2120
  align-items: center;
2052
2121
  overflow: hidden;
2053
- font-weight: var(--wpds-font-weight-medium);
2122
+ word-break: break-word;
2123
+ font-weight: var(--wpds-font-weight-medium, 499);
2054
2124
  }
2055
2125
  .dataforms-layouts-panel__field-control > * {
2056
2126
  min-width: 0;
@@ -2093,8 +2163,9 @@ div.dataviews-view-list {
2093
2163
  align-items: flex-start !important;
2094
2164
  }
2095
2165
  .dataforms-layouts-regular__field .components-base-control__label,
2096
- .dataforms-layouts-regular__field .components-input-control__label {
2097
- color: #757575;
2166
+ .dataforms-layouts-regular__field .components-input-control__label,
2167
+ .dataforms-layouts-regular__field .components-form-token-field__label {
2168
+ color: #1e1e1e;
2098
2169
  }
2099
2170
 
2100
2171
  .dataforms-layouts-regular__field-label {
@@ -2142,6 +2213,7 @@ div.dataviews-view-list {
2142
2213
  display: flex;
2143
2214
  flex-direction: row;
2144
2215
  gap: 16px;
2216
+ align-items: center;
2145
2217
  }
2146
2218
 
2147
2219
  .dataforms-layouts-details__summary-content {
@@ -133,6 +133,25 @@
133
133
  }
134
134
  }
135
135
 
136
+ .dataviews-no-results.is-refreshing {
137
+ opacity: 0.5;
138
+ pointer-events: none;
139
+ }
140
+ @media not (prefers-reduced-motion) {
141
+ .dataviews-no-results.is-refreshing {
142
+ opacity: 1;
143
+ animation: dataviews-pulse 1s ease-in-out infinite;
144
+ }
145
+ }
146
+
147
+ @keyframes dataviews-pulse {
148
+ 0%, 100% {
149
+ opacity: 1;
150
+ }
151
+ 50% {
152
+ opacity: 0.5;
153
+ }
154
+ }
136
155
  .dataviews-loading-more {
137
156
  text-align: center;
138
157
  }
@@ -741,18 +760,28 @@
741
760
  .dataviews-footer {
742
761
  z-index: 2;
743
762
  }
763
+ .dataviews-footer .is-refreshing {
764
+ opacity: 0.5;
765
+ pointer-events: none;
766
+ }
767
+ @media not (prefers-reduced-motion) {
768
+ .dataviews-footer .is-refreshing {
769
+ opacity: 1;
770
+ animation: dataviews-pulse 1s ease-in-out infinite;
771
+ }
772
+ }
744
773
 
745
774
  @container (max-width: 560px) {
746
- .dataviews-footer {
775
+ .dataviews-footer__content {
747
776
  flex-direction: column !important;
748
777
  }
749
- .dataviews-footer .dataviews-bulk-actions-footer__container {
778
+ .dataviews-footer__content .dataviews-bulk-actions-footer__container {
750
779
  width: 100%;
751
780
  }
752
- .dataviews-footer .dataviews-bulk-actions-footer__item-count {
781
+ .dataviews-footer__content .dataviews-bulk-actions-footer__item-count {
753
782
  flex-grow: 1;
754
783
  }
755
- .dataviews-footer .dataviews-pagination {
784
+ .dataviews-footer__content .dataviews-pagination {
756
785
  width: 100%;
757
786
  justify-content: space-between;
758
787
  }
@@ -773,6 +802,10 @@
773
802
  z-index: 1000001;
774
803
  }
775
804
 
805
+ .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
806
+ padding: 0 4px;
807
+ }
808
+
776
809
  .dataviews-selection-checkbox {
777
810
  --checkbox-input-size: 24px;
778
811
  }
@@ -1018,6 +1051,16 @@
1018
1051
  .dataviews-view-grid .dataviews-view-grid__badge-fields:not(:empty) {
1019
1052
  padding-bottom: 12px;
1020
1053
  }
1054
+ .dataviews-view-grid.is-refreshing {
1055
+ opacity: 0.5;
1056
+ pointer-events: none;
1057
+ }
1058
+ @media not (prefers-reduced-motion) {
1059
+ .dataviews-view-grid.is-refreshing {
1060
+ opacity: 1;
1061
+ animation: dataviews-pulse 1s ease-in-out infinite;
1062
+ }
1063
+ }
1021
1064
 
1022
1065
  .dataviews-view-grid__field-value:empty,
1023
1066
  .dataviews-view-grid__field:empty {
@@ -1257,7 +1300,6 @@ div.dataviews-view-list {
1257
1300
  border-radius: 4px;
1258
1301
  }
1259
1302
  .dataviews-view-list .dataviews-view-list__field-wrapper {
1260
- min-height: 52px;
1261
1303
  flex-grow: 1;
1262
1304
  min-width: 0;
1263
1305
  }
@@ -1297,9 +1339,6 @@ div.dataviews-view-list {
1297
1339
  width: 32px;
1298
1340
  height: 32px;
1299
1341
  }
1300
- .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__field-wrapper {
1301
- min-height: 32px;
1302
- }
1303
1342
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields {
1304
1343
  gap: 8px;
1305
1344
  row-gap: 4px;
@@ -1319,9 +1358,6 @@ div.dataviews-view-list {
1319
1358
  width: 64px;
1320
1359
  height: 64px;
1321
1360
  }
1322
- .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__field-wrapper {
1323
- min-height: 64px;
1324
- }
1325
1361
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields {
1326
1362
  gap: 16px;
1327
1363
  row-gap: 8px;
@@ -1330,6 +1366,16 @@ div.dataviews-view-list {
1330
1366
  min-height: 32px;
1331
1367
  line-height: 24px;
1332
1368
  }
1369
+ .dataviews-view-list.is-refreshing {
1370
+ opacity: 0.5;
1371
+ pointer-events: none;
1372
+ }
1373
+ @media not (prefers-reduced-motion) {
1374
+ .dataviews-view-list.is-refreshing {
1375
+ opacity: 1;
1376
+ animation: dataviews-pulse 1s ease-in-out infinite;
1377
+ }
1378
+ }
1333
1379
 
1334
1380
  .dataviews-view-list__group-header {
1335
1381
  font-size: 15px;
@@ -1472,6 +1518,7 @@ div.dataviews-view-list {
1472
1518
  }
1473
1519
  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-end {
1474
1520
  justify-content: flex-end;
1521
+ font-variant-numeric: tabular-nums;
1475
1522
  }
1476
1523
  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__cell-align-center {
1477
1524
  justify-content: center;
@@ -1573,6 +1620,17 @@ div.dataviews-view-list {
1573
1620
  width: 1%;
1574
1621
  }
1575
1622
 
1623
+ .dataviews-view-table.is-refreshing {
1624
+ opacity: 0.5;
1625
+ pointer-events: none;
1626
+ }
1627
+ @media not (prefers-reduced-motion) {
1628
+ .dataviews-view-table.is-refreshing {
1629
+ opacity: 1;
1630
+ animation: dataviews-pulse 1s ease-in-out infinite;
1631
+ }
1632
+ }
1633
+
1576
1634
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card {
1577
1635
  height: 100%;
1578
1636
  justify-content: flex-start;
@@ -1899,6 +1957,16 @@ div.dataviews-view-list {
1899
1957
  content: "";
1900
1958
  background-color: #ddd;
1901
1959
  }
1960
+ .dataviews-view-activity.is-refreshing {
1961
+ opacity: 0.5;
1962
+ pointer-events: none;
1963
+ }
1964
+ @media not (prefers-reduced-motion) {
1965
+ .dataviews-view-activity.is-refreshing {
1966
+ opacity: 1;
1967
+ animation: dataviews-pulse 1s ease-in-out infinite;
1968
+ }
1969
+ }
1902
1970
  .dataviews-view-activity + .dataviews-pagination {
1903
1971
  justify-content: space-between;
1904
1972
  }
@@ -1956,7 +2024,7 @@ div.dataviews-view-list {
1956
2024
  }
1957
2025
  .dataforms-layouts-panel__field-trigger--label-side {
1958
2026
  flex-direction: row;
1959
- gap: var(--wpds-dimension-gap-md);
2027
+ gap: var(--wpds-dimension-gap-md, 12px);
1960
2028
  }
1961
2029
  .dataforms-layouts-panel__field-trigger--label-top {
1962
2030
  display: grid;
@@ -1979,7 +2047,7 @@ div.dataviews-view-list {
1979
2047
  }
1980
2048
  .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control {
1981
2049
  color: #757575;
1982
- font-weight: var(--wpds-font-weight-regular);
2050
+ font-weight: var(--wpds-font-weight-regular, 400);
1983
2051
  }
1984
2052
 
1985
2053
  .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon {
@@ -1995,11 +2063,11 @@ div.dataviews-view-list {
1995
2063
  color: var(--wp-admin-theme-color);
1996
2064
  flex: 0 0 auto;
1997
2065
  opacity: 0;
1998
- border-radius: var(--wpds-border-radius-xs);
2066
+ border-radius: var(--wpds-border-radius-xs, 1px);
1999
2067
  }
2000
2068
  .dataforms-layouts-panel__field-trigger-icon:focus-visible {
2001
2069
  opacity: 1;
2002
- outline: var(--wpds-border-width-focus) solid var(--wp-admin-theme-color);
2070
+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wp-admin-theme-color);
2003
2071
  }
2004
2072
 
2005
2073
  .dataforms-layouts-panel__field-dropdown-anchor {
@@ -2018,6 +2086,7 @@ div.dataviews-view-list {
2018
2086
  line-height: 20px;
2019
2087
  hyphens: auto;
2020
2088
  color: #757575;
2089
+ text-transform: capitalize;
2021
2090
  }
2022
2091
  .dataforms-layouts-panel__field-label .components-base-control__label {
2023
2092
  display: inline;
@@ -2046,11 +2115,12 @@ div.dataviews-view-list {
2046
2115
  flex-grow: 1;
2047
2116
  min-width: 0;
2048
2117
  min-height: 24px;
2049
- line-height: var(--wpds-font-line-height-md);
2118
+ line-height: var(--wpds-font-line-height-md, 24px);
2050
2119
  display: flex;
2051
2120
  align-items: center;
2052
2121
  overflow: hidden;
2053
- font-weight: var(--wpds-font-weight-medium);
2122
+ word-break: break-word;
2123
+ font-weight: var(--wpds-font-weight-medium, 499);
2054
2124
  }
2055
2125
  .dataforms-layouts-panel__field-control > * {
2056
2126
  min-width: 0;
@@ -2093,8 +2163,9 @@ div.dataviews-view-list {
2093
2163
  align-items: flex-start !important;
2094
2164
  }
2095
2165
  .dataforms-layouts-regular__field .components-base-control__label,
2096
- .dataforms-layouts-regular__field .components-input-control__label {
2097
- color: #757575;
2166
+ .dataforms-layouts-regular__field .components-input-control__label,
2167
+ .dataforms-layouts-regular__field .components-form-token-field__label {
2168
+ color: #1e1e1e;
2098
2169
  }
2099
2170
 
2100
2171
  .dataforms-layouts-regular__field-label {
@@ -2142,6 +2213,7 @@ div.dataviews-view-list {
2142
2213
  display: flex;
2143
2214
  flex-direction: row;
2144
2215
  gap: 16px;
2216
+ align-items: center;
2145
2217
  }
2146
2218
 
2147
2219
  .dataforms-layouts-details__summary-content {
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/dataform-layouts/card/index.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EACX,gBAAgB,EAKhB,MAAM,gBAAgB,CAAC;AA0DxB,MAAM,CAAC,OAAO,UAAU,aAAa,CAAE,IAAI,EAAI,EAC9C,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,mBAAmB,EACnB,gBAAgB,EAChB,QAAQ,GACR,EAAE,gBAAgB,CAAE,IAAI,CAAE,sCAiM1B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/dataform-layouts/card/index.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EACX,gBAAgB,EAKhB,MAAM,gBAAgB,CAAC;AA0DxB,MAAM,CAAC,OAAO,UAAU,aAAa,CAAE,IAAI,EAAI,EAC9C,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,mBAAmB,EACnB,gBAAgB,EAChB,QAAQ,GACR,EAAE,gBAAgB,CAAE,IAAI,CAAE,sCAiM1B"}
@@ -1,3 +1,3 @@
1
- declare function getLabelContent(showError?: boolean, errorMessage?: string, fieldLabel?: string): import("react").JSX.Element;
1
+ declare function getLabelContent(showError?: boolean, errorMessage?: string, fieldLabel?: string): string | import("react").JSX.Element | undefined;
2
2
  export default getLabelContent;
3
3
  //# sourceMappingURL=get-label-content.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"get-label-content.d.ts","sourceRoot":"","sources":["../../../../../src/components/dataform-layouts/panel/utils/get-label-content.tsx"],"names":[],"mappings":"AAMA,iBAAS,eAAe,CACvB,SAAS,CAAC,EAAE,OAAO,EACnB,YAAY,CAAC,EAAE,MAAM,EACrB,UAAU,CAAC,EAAE,MAAM,+BAcnB;AAED,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"get-label-content.d.ts","sourceRoot":"","sources":["../../../../../src/components/dataform-layouts/panel/utils/get-label-content.tsx"],"names":[],"mappings":"AAMA,iBAAS,eAAe,CACvB,SAAS,CAAC,EAAE,OAAO,EACnB,YAAY,CAAC,EAAE,MAAM,EACrB,UAAU,CAAC,EAAE,MAAM,oDAYnB;AAED,eAAe,eAAe,CAAC"}
@@ -40,6 +40,7 @@ type DataViewsContextType<Item> = {
40
40
  perPageSizes: number[];
41
41
  };
42
42
  empty?: ReactNode;
43
+ hasInitiallyLoaded?: boolean;
43
44
  hasInfiniteScrollHandler: boolean;
44
45
  itemListLabel?: string;
45
46
  onReset?: (() => void) | false;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dataviews-context/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOrE;;GAEG;AACH,OAAO,KAAK,EACX,IAAI,EACJ,MAAM,EACN,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGxD,KAAK,oBAAoB,CAAE,IAAI,IAAK;IACnC,IAAI,EAAE,IAAI,CAAC;IACX,YAAY,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,IAAI,CAAC;IACrC,MAAM,EAAE,eAAe,CAAE,IAAI,CAAE,EAAE,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAE,IAAI,CAAE,EAAE,CAAC;IAC3B,IAAI,EAAE,IAAI,EAAE,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE;QACf,UAAU,EAAE,MAAM,CAAC;QACnB,UAAU,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,iBAAiB,EAAE,YAAY,CAAC;IAChC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,eAAe,EAAE,CAAE,YAAY,EAAE,MAAM,GAAG,IAAI,KAAM,IAAI,CAAC;IACzD,SAAS,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,MAAM,CAAC;IACpC,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,MAAM,CAAC;IACxC,WAAW,CAAC,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,IAAI,CAAC;IACrC,cAAc,CAAC,EAAE,CAChB,KAAK,EAAE;QACN,IAAI,EAAE,IAAI,CAAC;KACX,GAAG,cAAc,CAAE,GAAG,CAAE,KACrB,YAAY,CAAC;IAClB,eAAe,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,OAAO,CAAC;IAC3C,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAE,cAAc,GAAG,IAAI,CAAE,CAAC;IAC9D,iBAAiB,EACd,CAAE,CAAE,OAAO,CAAC,EAAE,cAAc,GAAG,IAAI,KAAM,IAAI,CAAE,GAC/C,KAAK,CAAC,SAAS,CAAE,cAAc,CAAE,CAAC;IACrC,cAAc,EAAE,gBAAgB,CAAC;IACjC,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,CAAE,KAAK,EAAE,OAAO,KAAM,IAAI,CAAC;IAC/C,MAAM,EAAE;QAAE,YAAY,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,wBAAwB,EAAE,OAAO,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,CAAE,MAAM,IAAI,CAAE,GAAG,KAAK,CAAC;CACjC,CAAC;AAEF,QAAA,MAAM,gBAAgB,oDA2BnB,CAAC;AAIJ,eAAe,gBAAgB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dataviews-context/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOrE;;GAEG;AACH,OAAO,KAAK,EACX,IAAI,EACJ,MAAM,EACN,eAAe,EACf,gBAAgB,EAChB,gBAAgB,EAChB,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAGxD,KAAK,oBAAoB,CAAE,IAAI,IAAK;IACnC,IAAI,EAAE,IAAI,CAAC;IACX,YAAY,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,IAAI,CAAC;IACrC,MAAM,EAAE,eAAe,CAAE,IAAI,CAAE,EAAE,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAE,IAAI,CAAE,EAAE,CAAC;IAC3B,IAAI,EAAE,IAAI,EAAE,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE;QACf,UAAU,EAAE,MAAM,CAAC;QACnB,UAAU,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,iBAAiB,EAAE,YAAY,CAAC;IAChC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,eAAe,EAAE,CAAE,YAAY,EAAE,MAAM,GAAG,IAAI,KAAM,IAAI,CAAC;IACzD,SAAS,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,MAAM,CAAC;IACpC,YAAY,CAAC,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,MAAM,CAAC;IACxC,WAAW,CAAC,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,IAAI,CAAC;IACrC,cAAc,CAAC,EAAE,CAChB,KAAK,EAAE;QACN,IAAI,EAAE,IAAI,CAAC;KACX,GAAG,cAAc,CAAE,GAAG,CAAE,KACrB,YAAY,CAAC;IAClB,eAAe,EAAE,CAAE,IAAI,EAAE,IAAI,KAAM,OAAO,CAAC;IAC3C,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAE,cAAc,GAAG,IAAI,CAAE,CAAC;IAC9D,iBAAiB,EACd,CAAE,CAAE,OAAO,CAAC,EAAE,cAAc,GAAG,IAAI,KAAM,IAAI,CAAE,GAC/C,KAAK,CAAC,SAAS,CAAE,cAAc,CAAE,CAAC;IACrC,cAAc,EAAE,gBAAgB,CAAC;IACjC,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,eAAe,EAAE,OAAO,CAAC;IACzB,kBAAkB,EAAE,CAAE,KAAK,EAAE,OAAO,KAAM,IAAI,CAAC;IAC/C,MAAM,EAAE;QAAE,YAAY,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IACnC,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,wBAAwB,EAAE,OAAO,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,CAAE,MAAM,IAAI,CAAE,GAAG,KAAK,CAAC;CACjC,CAAC;AAEF,QAAA,MAAM,gBAAgB,oDA4BnB,CAAC;AAIJ,eAAe,gBAAgB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../../src/components/dataviews-filters/toggle.tsx"],"names":[],"mappings":"AAeA,iBAAS,aAAa,uCAwErB;AA8BD,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../../src/components/dataviews-filters/toggle.tsx"],"names":[],"mappings":"AAeA,iBAAS,aAAa,uCA+ErB;AA8BD,eAAe,aAAa,CAAC"}
@@ -1,2 +1,2 @@
1
- export default function DataViewsFooter(): false | import("react").JSX.Element | null;
1
+ export default function DataViewsFooter(): false | import("react").JSX.Element | null | undefined;
2
2
  //# sourceMappingURL=index.d.ts.map