@wordpress/dataviews 0.9.0 → 1.1.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.
- package/CHANGELOG.md +8 -0
- package/README.md +0 -8
- package/build/add-filter.js.map +1 -1
- package/build/bulk-actions.js.map +1 -1
- package/build/constants.js +1 -26
- package/build/constants.js.map +1 -1
- package/build/dataviews.js +3 -6
- package/build/dataviews.js.map +1 -1
- package/build/dropdown-menu-helper.js.map +1 -1
- package/build/filter-and-sort-data-view.js +72 -65
- package/build/filter-and-sort-data-view.js.map +1 -1
- package/build/filter-summary.js +4 -2
- package/build/filter-summary.js.map +1 -1
- package/build/filters.js.map +1 -1
- package/build/index.js +2 -2
- package/build/index.js.map +1 -1
- package/build/item-actions.js.map +1 -1
- package/build/layouts.js +38 -0
- package/build/layouts.js.map +1 -0
- package/build/lock-unlock.js.map +1 -1
- package/build/normalize-fields.js +7 -2
- package/build/normalize-fields.js.map +1 -1
- package/build/pagination.js.map +1 -1
- package/build/reset-filters.js.map +1 -1
- package/build/search-widget.js +5 -4
- package/build/search-widget.js.map +1 -1
- package/build/search.js.map +1 -1
- package/build/single-selection-checkbox.js +1 -1
- package/build/single-selection-checkbox.js.map +1 -1
- package/build/types.js +6 -0
- package/build/types.js.map +1 -0
- package/build/utils.js.map +1 -1
- package/build/view-actions.js +2 -1
- package/build/view-actions.js.map +1 -1
- package/build/view-grid.js +43 -15
- package/build/view-grid.js.map +1 -1
- package/build/view-list.js +4 -22
- package/build/view-list.js.map +1 -1
- package/build/view-table.js +5 -11
- package/build/view-table.js.map +1 -1
- package/build-module/add-filter.js.map +1 -1
- package/build-module/bulk-actions.js.map +1 -1
- package/build-module/constants.js +1 -25
- package/build-module/constants.js.map +1 -1
- package/build-module/dataviews.js +3 -6
- package/build-module/dataviews.js.map +1 -1
- package/build-module/dropdown-menu-helper.js.map +1 -1
- package/build-module/filter-and-sort-data-view.js +72 -65
- package/build-module/filter-and-sort-data-view.js.map +1 -1
- package/build-module/filter-summary.js +3 -2
- package/build-module/filter-summary.js.map +1 -1
- package/build-module/filters.js.map +1 -1
- package/build-module/index.js +1 -1
- package/build-module/index.js.map +1 -1
- package/build-module/item-actions.js.map +1 -1
- package/build-module/layouts.js +30 -0
- package/build-module/layouts.js.map +1 -0
- package/build-module/lock-unlock.js.map +1 -1
- package/build-module/normalize-fields.js +7 -2
- package/build-module/normalize-fields.js.map +1 -1
- package/build-module/pagination.js.map +1 -1
- package/build-module/reset-filters.js.map +1 -1
- package/build-module/search-widget.js +4 -3
- package/build-module/search-widget.js.map +1 -1
- package/build-module/search.js.map +1 -1
- package/build-module/single-selection-checkbox.js +1 -1
- package/build-module/single-selection-checkbox.js.map +1 -1
- package/build-module/types.js +2 -0
- package/build-module/types.js.map +1 -0
- package/build-module/utils.js.map +1 -1
- package/build-module/view-actions.js +2 -1
- package/build-module/view-actions.js.map +1 -1
- package/build-module/view-grid.js +43 -15
- package/build-module/view-grid.js.map +1 -1
- package/build-module/view-list.js +6 -24
- package/build-module/view-list.js.map +1 -1
- package/build-module/view-table.js +5 -11
- package/build-module/view-table.js.map +1 -1
- package/build-style/style-rtl.css +60 -45
- package/build-style/style.css +60 -45
- package/build-types/constants.d.ts +45 -0
- package/build-types/constants.d.ts.map +1 -0
- package/build-types/filter-and-sort-data-view.d.ts +18 -0
- package/build-types/filter-and-sort-data-view.d.ts.map +1 -0
- package/build-types/normalize-fields.d.ts +12 -0
- package/build-types/normalize-fields.d.ts.map +1 -0
- package/build-types/types.d.ts +122 -0
- package/build-types/types.d.ts.map +1 -0
- package/package.json +11 -11
- package/src/{constants.js → constants.ts} +1 -35
- package/src/dataviews.js +2 -5
- package/src/filter-and-sort-data-view.ts +164 -0
- package/src/filter-summary.js +4 -4
- package/src/index.js +1 -1
- package/src/layouts.js +39 -0
- package/src/normalize-fields.ts +23 -0
- package/src/search-widget.js +4 -3
- package/src/single-selection-checkbox.js +1 -1
- package/src/stories/fixtures.js +0 -2
- package/src/style.scss +65 -51
- package/src/types.ts +144 -0
- package/src/view-actions.js +2 -1
- package/src/view-grid.js +91 -52
- package/src/view-list.js +4 -24
- package/src/view-table.js +7 -11
- package/tsconfig.json +20 -0
- package/tsconfig.tsbuildinfo +1 -0
- package/src/filter-and-sort-data-view.js +0 -154
- package/src/normalize-fields.js +0 -17
package/build/view-actions.js
CHANGED
|
@@ -11,6 +11,7 @@ var _element = require("@wordpress/element");
|
|
|
11
11
|
var _icons = require("@wordpress/icons");
|
|
12
12
|
var _lockUnlock = require("./lock-unlock");
|
|
13
13
|
var _constants = require("./constants");
|
|
14
|
+
var _layouts = require("./layouts");
|
|
14
15
|
/**
|
|
15
16
|
* WordPress dependencies
|
|
16
17
|
*/
|
|
@@ -32,7 +33,7 @@ function ViewTypeMenu({
|
|
|
32
33
|
onChangeView,
|
|
33
34
|
supportedLayouts
|
|
34
35
|
}) {
|
|
35
|
-
let _availableViews =
|
|
36
|
+
let _availableViews = _layouts.VIEW_LAYOUTS;
|
|
36
37
|
if (supportedLayouts) {
|
|
37
38
|
_availableViews = _availableViews.filter(_view => supportedLayouts.includes(_view.type));
|
|
38
39
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_components","require","_i18n","_element","_icons","_lockUnlock","_constants","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuRadioItemV2","DropdownMenuRadioItem","DropdownMenuCheckboxItemV2","DropdownMenuCheckboxItem","DropdownMenuItemLabelV2","DropdownMenuItemLabel","unlock","componentsPrivateApis","ViewTypeMenu","view","onChangeView","supportedLayouts","_availableViews","VIEW_LAYOUTS","filter","_view","includes","type","length","activeView","find","v","_react","createElement","trigger","suffix","label","__","map","availableView","key","value","name","checked","hideOnClick","onChange","e","target","PAGE_SIZE_VALUES","PageSizeMenu","perPage","size","page","FieldsVisibilityMenu","fields","hidableFields","field","enableHiding","id","layout","mediaField","hiddenFields","header","SortMenu","sortableFields","enableSorting","currentSortedField","sort","sortedDirection","direction","style","minWidth","Object","entries","SORTING_DIRECTIONS","info","isChecked","undefined","ViewActions","memo","Button","icon","settings","_default","exports","default"],"sources":["@wordpress/dataviews/src/view-actions.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { memo } from '@wordpress/element';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\nimport { VIEW_LAYOUTS, SORTING_DIRECTIONS } from './constants';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuRadioItemV2: DropdownMenuRadioItem,\n\tDropdownMenuCheckboxItemV2: DropdownMenuCheckboxItem,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n} = unlock( componentsPrivateApis );\n\nfunction ViewTypeMenu( { view, onChangeView, supportedLayouts } ) {\n\tlet _availableViews = VIEW_LAYOUTS;\n\tif ( supportedLayouts ) {\n\t\t_availableViews = _availableViews.filter( ( _view ) =>\n\t\t\tsupportedLayouts.includes( _view.type )\n\t\t);\n\t}\n\tif ( _availableViews.length === 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = _availableViews.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">{ activeView.label }</span>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ _availableViews.map( ( availableView ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ availableView.type }\n\t\t\t\t\t\tvalue={ availableView.type }\n\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\tchecked={ availableView.type === view.type }\n\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\tonChange={ ( e ) => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ availableView.label }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst PAGE_SIZE_VALUES = [ 10, 20, 50, 100 ];\nfunction PageSizeMenu( { view, onChangeView } ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={ <span aria-hidden=\"true\">{ view.perPage }</span> }\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Items per page' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ PAGE_SIZE_VALUES.map( ( size ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ size }\n\t\t\t\t\t\tvalue={ size }\n\t\t\t\t\t\tname=\"view-actions-page-size\"\n\t\t\t\t\t\tchecked={ view.perPage === size }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t// `e.target.value` holds the same value as `size` but as a string,\n\t\t\t\t\t\t\t\t// so we use `size` directly to avoid parsing to int.\n\t\t\t\t\t\t\t\tperPage: size,\n\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>{ size }</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction FieldsVisibilityMenu( { view, onChangeView, fields } ) {\n\tconst hidableFields = fields.filter(\n\t\t( field ) =>\n\t\t\tfield.enableHiding !== false && field.id !== view.layout.mediaField\n\t);\n\tif ( ! hidableFields?.length ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Fields' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ hidableFields?.map( ( field ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuCheckboxItem\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\tvalue={ field.id }\n\t\t\t\t\t\tchecked={ ! view.hiddenFields?.includes( field.id ) }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\thiddenFields: view.hiddenFields?.includes(\n\t\t\t\t\t\t\t\t\tfield.id\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t? view.hiddenFields.filter(\n\t\t\t\t\t\t\t\t\t\t\t( id ) => id !== field.id\n\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t: [\n\t\t\t\t\t\t\t\t\t\t\t...( view.hiddenFields || [] ),\n\t\t\t\t\t\t\t\t\t\t\tfield.id,\n\t\t\t\t\t\t\t\t\t ],\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuCheckboxItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction SortMenu( { fields, view, onChangeView } ) {\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( ! sortableFields?.length ) {\n\t\treturn null;\n\t}\n\tconst currentSortedField = fields.find(\n\t\t( field ) => field.id === view.sort?.field\n\t);\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t{ currentSortedField?.header }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Sort by' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ sortableFields?.map( ( field ) => {\n\t\t\t\tconst sortedDirection = view.sort?.direction;\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tminWidth: '220px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Object.entries( SORTING_DIRECTIONS ).map(\n\t\t\t\t\t\t\t( [ direction, info ] ) => {\n\t\t\t\t\t\t\t\tconst isChecked =\n\t\t\t\t\t\t\t\t\tcurrentSortedField !== undefined &&\n\t\t\t\t\t\t\t\t\tsortedDirection === direction &&\n\t\t\t\t\t\t\t\t\tfield.id === currentSortedField.id;\n\n\t\t\t\t\t\t\t\tconst value = `${ field.id }-${ direction }`;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\t\t\t\t\t// All sorting radio items share the same name, so that\n\t\t\t\t\t\t\t\t\t\t// selecting a sorting option automatically deselects the\n\t\t\t\t\t\t\t\t\t\t// previously selected one, even if it is displayed in\n\t\t\t\t\t\t\t\t\t\t// another submenu. The field and direction are passed via\n\t\t\t\t\t\t\t\t\t\t// the `value` prop.\n\t\t\t\t\t\t\t\t\t\tname=\"view-actions-sorting\"\n\t\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\t\tchecked={ isChecked }\n\t\t\t\t\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\t\t\t\t\t\t\tfield: field.id,\n\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\n\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t{ info.label }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t</DropdownMenu>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst ViewActions = memo( function ViewActions( {\n\tfields,\n\tview,\n\tonChangeView,\n\tsupportedLayouts,\n} ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\ticon={ settings }\n\t\t\t\t\tlabel={ __( 'View options' ) }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<DropdownMenuGroup>\n\t\t\t\t<ViewTypeMenu\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tsupportedLayouts={ supportedLayouts }\n\t\t\t\t/>\n\t\t\t\t<SortMenu\n\t\t\t\t\tfields={ fields }\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t/>\n\t\t\t\t<FieldsVisibilityMenu\n\t\t\t\t\tfields={ fields }\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t/>\n\t\t\t\t<PageSizeMenu view={ view } onChangeView={ onChangeView } />\n\t\t\t</DropdownMenuGroup>\n\t\t</DropdownMenu>\n\t);\n} );\n\nexport default ViewActions;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["_components","require","_i18n","_element","_icons","_lockUnlock","_constants","_layouts","DropdownMenuV2","DropdownMenu","DropdownMenuGroupV2","DropdownMenuGroup","DropdownMenuItemV2","DropdownMenuItem","DropdownMenuRadioItemV2","DropdownMenuRadioItem","DropdownMenuCheckboxItemV2","DropdownMenuCheckboxItem","DropdownMenuItemLabelV2","DropdownMenuItemLabel","unlock","componentsPrivateApis","ViewTypeMenu","view","onChangeView","supportedLayouts","_availableViews","VIEW_LAYOUTS","filter","_view","includes","type","length","activeView","find","v","_react","createElement","trigger","suffix","label","__","map","availableView","key","value","name","checked","hideOnClick","onChange","e","target","PAGE_SIZE_VALUES","PageSizeMenu","perPage","size","page","FieldsVisibilityMenu","fields","hidableFields","field","enableHiding","id","layout","mediaField","hiddenFields","header","SortMenu","sortableFields","enableSorting","currentSortedField","sort","sortedDirection","direction","style","minWidth","Object","entries","SORTING_DIRECTIONS","info","isChecked","undefined","ViewActions","memo","Button","icon","settings","_default","exports","default"],"sources":["@wordpress/dataviews/src/view-actions.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { memo } from '@wordpress/element';\nimport { settings } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\nimport { SORTING_DIRECTIONS } from './constants';\nimport { VIEW_LAYOUTS } from './layouts';\n\nconst {\n\tDropdownMenuV2: DropdownMenu,\n\tDropdownMenuGroupV2: DropdownMenuGroup,\n\tDropdownMenuItemV2: DropdownMenuItem,\n\tDropdownMenuRadioItemV2: DropdownMenuRadioItem,\n\tDropdownMenuCheckboxItemV2: DropdownMenuCheckboxItem,\n\tDropdownMenuItemLabelV2: DropdownMenuItemLabel,\n} = unlock( componentsPrivateApis );\n\nfunction ViewTypeMenu( { view, onChangeView, supportedLayouts } ) {\n\tlet _availableViews = VIEW_LAYOUTS;\n\tif ( supportedLayouts ) {\n\t\t_availableViews = _availableViews.filter( ( _view ) =>\n\t\t\tsupportedLayouts.includes( _view.type )\n\t\t);\n\t}\n\tif ( _availableViews.length === 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = _availableViews.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">{ activeView.label }</span>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ _availableViews.map( ( availableView ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ availableView.type }\n\t\t\t\t\t\tvalue={ availableView.type }\n\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\tchecked={ availableView.type === view.type }\n\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\tonChange={ ( e ) => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ availableView.label }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst PAGE_SIZE_VALUES = [ 10, 20, 50, 100 ];\nfunction PageSizeMenu( { view, onChangeView } ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={ <span aria-hidden=\"true\">{ view.perPage }</span> }\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Items per page' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ PAGE_SIZE_VALUES.map( ( size ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\tkey={ size }\n\t\t\t\t\t\tvalue={ size }\n\t\t\t\t\t\tname=\"view-actions-page-size\"\n\t\t\t\t\t\tchecked={ view.perPage === size }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t// `e.target.value` holds the same value as `size` but as a string,\n\t\t\t\t\t\t\t\t// so we use `size` directly to avoid parsing to int.\n\t\t\t\t\t\t\t\tperPage: size,\n\t\t\t\t\t\t\t\tpage: 1,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>{ size }</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction FieldsVisibilityMenu( { view, onChangeView, fields } ) {\n\tconst hidableFields = fields.filter(\n\t\t( field ) =>\n\t\t\tfield.enableHiding !== false && field.id !== view.layout.mediaField\n\t);\n\tif ( ! hidableFields?.length ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Fields' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ hidableFields?.map( ( field ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuCheckboxItem\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\tvalue={ field.id }\n\t\t\t\t\t\tchecked={ ! view.hiddenFields?.includes( field.id ) }\n\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\thiddenFields: view.hiddenFields?.includes(\n\t\t\t\t\t\t\t\t\tfield.id\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t? view.hiddenFields.filter(\n\t\t\t\t\t\t\t\t\t\t\t( id ) => id !== field.id\n\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t: [\n\t\t\t\t\t\t\t\t\t\t\t...( view.hiddenFields || [] ),\n\t\t\t\t\t\t\t\t\t\t\tfield.id,\n\t\t\t\t\t\t\t\t\t ],\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t</DropdownMenuCheckboxItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction SortMenu( { fields, view, onChangeView } ) {\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( ! sortableFields?.length ) {\n\t\treturn null;\n\t}\n\tconst currentSortedField = fields.find(\n\t\t( field ) => field.id === view.sort?.field\n\t);\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<DropdownMenuItem\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t\t{ currentSortedField?.header }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t{ __( 'Sort by' ) }\n\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t</DropdownMenuItem>\n\t\t\t}\n\t\t>\n\t\t\t{ sortableFields?.map( ( field ) => {\n\t\t\t\tconst sortedDirection = view.sort?.direction;\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownMenuItem>\n\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t</DropdownMenuItem>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tminWidth: '220px',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Object.entries( SORTING_DIRECTIONS ).map(\n\t\t\t\t\t\t\t( [ direction, info ] ) => {\n\t\t\t\t\t\t\t\tconst isChecked =\n\t\t\t\t\t\t\t\t\tcurrentSortedField !== undefined &&\n\t\t\t\t\t\t\t\t\tsortedDirection === direction &&\n\t\t\t\t\t\t\t\t\tfield.id === currentSortedField.id;\n\n\t\t\t\t\t\t\t\tconst value = `${ field.id }-${ direction }`;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuRadioItem\n\t\t\t\t\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\t\t\t\t\t// All sorting radio items share the same name, so that\n\t\t\t\t\t\t\t\t\t\t// selecting a sorting option automatically deselects the\n\t\t\t\t\t\t\t\t\t\t// previously selected one, even if it is displayed in\n\t\t\t\t\t\t\t\t\t\t// another submenu. The field and direction are passed via\n\t\t\t\t\t\t\t\t\t\t// the `value` prop.\n\t\t\t\t\t\t\t\t\t\tname=\"view-actions-sorting\"\n\t\t\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t\t\t\tchecked={ isChecked }\n\t\t\t\t\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t\t...view,\n\t\t\t\t\t\t\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\t\t\t\t\t\t\tfield: field.id,\n\t\t\t\t\t\t\t\t\t\t\t\t\tdirection,\n\t\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t\t\t{ info.label }\n\t\t\t\t\t\t\t\t\t\t</DropdownMenuItemLabel>\n\t\t\t\t\t\t\t\t\t</DropdownMenuRadioItem>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t</DropdownMenu>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownMenu>\n\t);\n}\n\nconst ViewActions = memo( function ViewActions( {\n\tfields,\n\tview,\n\tonChangeView,\n\tsupportedLayouts,\n} ) {\n\treturn (\n\t\t<DropdownMenu\n\t\t\ttrigger={\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\ticon={ settings }\n\t\t\t\t\tlabel={ __( 'View options' ) }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<DropdownMenuGroup>\n\t\t\t\t<ViewTypeMenu\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\tsupportedLayouts={ supportedLayouts }\n\t\t\t\t/>\n\t\t\t\t<SortMenu\n\t\t\t\t\tfields={ fields }\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t/>\n\t\t\t\t<FieldsVisibilityMenu\n\t\t\t\t\tfields={ fields }\n\t\t\t\t\tview={ view }\n\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t/>\n\t\t\t\t<PageSizeMenu view={ view } onChangeView={ onChangeView } />\n\t\t\t</DropdownMenuGroup>\n\t\t</DropdownMenu>\n\t);\n} );\n\nexport default ViewActions;\n"],"mappings":"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","ignoreList":[]}
|
package/build/view-grid.js
CHANGED
|
@@ -9,7 +9,6 @@ var _react = require("react");
|
|
|
9
9
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
10
10
|
var _components = require("@wordpress/components");
|
|
11
11
|
var _i18n = require("@wordpress/i18n");
|
|
12
|
-
var _compose = require("@wordpress/compose");
|
|
13
12
|
var _itemActions = _interopRequireDefault(require("./item-actions"));
|
|
14
13
|
var _singleSelectionCheckbox = _interopRequireDefault(require("./single-selection-checkbox"));
|
|
15
14
|
var _bulkActions = require("./bulk-actions");
|
|
@@ -35,7 +34,8 @@ function GridItem({
|
|
|
35
34
|
mediaField,
|
|
36
35
|
primaryField,
|
|
37
36
|
visibleFields,
|
|
38
|
-
|
|
37
|
+
badgeFields,
|
|
38
|
+
columnFields
|
|
39
39
|
}) {
|
|
40
40
|
const hasBulkAction = (0, _bulkActions.useHasAPossibleBulkAction)(actions, item);
|
|
41
41
|
const id = getItemId(item);
|
|
@@ -90,7 +90,24 @@ function GridItem({
|
|
|
90
90
|
item: item,
|
|
91
91
|
actions: actions,
|
|
92
92
|
isCompact: true
|
|
93
|
-
})), (0, _react.createElement)(_components.
|
|
93
|
+
})), !!badgeFields?.length && (0, _react.createElement)(_components.__experimentalHStack, {
|
|
94
|
+
className: "dataviews-view-grid__badge-fields",
|
|
95
|
+
spacing: 2,
|
|
96
|
+
wrap: true,
|
|
97
|
+
align: "top",
|
|
98
|
+
justify: "flex-start"
|
|
99
|
+
}, badgeFields.map(field => {
|
|
100
|
+
const renderedValue = field.render({
|
|
101
|
+
item
|
|
102
|
+
});
|
|
103
|
+
if (!renderedValue) {
|
|
104
|
+
return null;
|
|
105
|
+
}
|
|
106
|
+
return (0, _react.createElement)(_components.FlexItem, {
|
|
107
|
+
key: field.id,
|
|
108
|
+
className: 'dataviews-view-grid__field-value'
|
|
109
|
+
}, renderedValue);
|
|
110
|
+
})), !!visibleFields?.length && (0, _react.createElement)(_components.__experimentalVStack, {
|
|
94
111
|
className: "dataviews-view-grid__fields",
|
|
95
112
|
spacing: 3
|
|
96
113
|
}, visibleFields.map(field => {
|
|
@@ -101,7 +118,7 @@ function GridItem({
|
|
|
101
118
|
return null;
|
|
102
119
|
}
|
|
103
120
|
return (0, _react.createElement)(_components.Flex, {
|
|
104
|
-
className: (0, _classnames.default)('dataviews-view-grid__field',
|
|
121
|
+
className: (0, _classnames.default)('dataviews-view-grid__field', columnFields?.includes(field.id) ? 'is-column' : 'is-row'),
|
|
105
122
|
key: field.id,
|
|
106
123
|
gap: 1,
|
|
107
124
|
justify: "flex-start",
|
|
@@ -109,15 +126,15 @@ function GridItem({
|
|
|
109
126
|
style: {
|
|
110
127
|
height: 'auto'
|
|
111
128
|
},
|
|
112
|
-
direction:
|
|
113
|
-
}, (0, _react.createElement)(_components.FlexItem, {
|
|
129
|
+
direction: columnFields?.includes(field.id) ? 'column' : 'row'
|
|
130
|
+
}, (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_components.FlexItem, {
|
|
114
131
|
className: "dataviews-view-grid__field-name"
|
|
115
132
|
}, field.header), (0, _react.createElement)(_components.FlexItem, {
|
|
116
133
|
className: "dataviews-view-grid__field-value",
|
|
117
134
|
style: {
|
|
118
135
|
maxHeight: 'none'
|
|
119
136
|
}
|
|
120
|
-
}, renderedValue));
|
|
137
|
+
}, renderedValue)));
|
|
121
138
|
})));
|
|
122
139
|
}
|
|
123
140
|
function ViewGrid({
|
|
@@ -127,25 +144,35 @@ function ViewGrid({
|
|
|
127
144
|
actions,
|
|
128
145
|
isLoading,
|
|
129
146
|
getItemId,
|
|
130
|
-
deferredRendering,
|
|
131
147
|
selection,
|
|
132
148
|
onSelectionChange
|
|
133
149
|
}) {
|
|
134
150
|
const mediaField = fields.find(field => field.id === view.layout.mediaField);
|
|
135
151
|
const primaryField = fields.find(field => field.id === view.layout.primaryField);
|
|
136
|
-
const
|
|
137
|
-
|
|
138
|
-
|
|
152
|
+
const {
|
|
153
|
+
visibleFields,
|
|
154
|
+
badgeFields
|
|
155
|
+
} = fields.reduce((accumulator, field) => {
|
|
156
|
+
if (view.hiddenFields.includes(field.id) || [view.layout.mediaField, view.layout.primaryField].includes(field.id)) {
|
|
157
|
+
return accumulator;
|
|
158
|
+
}
|
|
159
|
+
// If the field is a badge field, add it to the badgeFields array
|
|
160
|
+
// otherwise add it to the rest visibleFields array.
|
|
161
|
+
const key = view.layout.badgeFields?.includes(field.id) ? 'badgeFields' : 'visibleFields';
|
|
162
|
+
accumulator[key].push(field);
|
|
163
|
+
return accumulator;
|
|
164
|
+
}, {
|
|
165
|
+
visibleFields: [],
|
|
166
|
+
badgeFields: []
|
|
139
167
|
});
|
|
140
|
-
const
|
|
141
|
-
const hasData = !!usedData?.length;
|
|
168
|
+
const hasData = !!data?.length;
|
|
142
169
|
return (0, _react.createElement)(_react.Fragment, null, hasData && (0, _react.createElement)(_components.__experimentalGrid, {
|
|
143
170
|
gap: 6,
|
|
144
171
|
columns: 2,
|
|
145
172
|
alignment: "top",
|
|
146
173
|
className: "dataviews-view-grid",
|
|
147
174
|
"aria-busy": isLoading
|
|
148
|
-
},
|
|
175
|
+
}, data.map(item => {
|
|
149
176
|
return (0, _react.createElement)(GridItem, {
|
|
150
177
|
key: getItemId(item),
|
|
151
178
|
selection: selection,
|
|
@@ -157,7 +184,8 @@ function ViewGrid({
|
|
|
157
184
|
mediaField: mediaField,
|
|
158
185
|
primaryField: primaryField,
|
|
159
186
|
visibleFields: visibleFields,
|
|
160
|
-
|
|
187
|
+
badgeFields: badgeFields,
|
|
188
|
+
columnFields: view.layout.columnFields
|
|
161
189
|
});
|
|
162
190
|
})), !hasData && (0, _react.createElement)("div", {
|
|
163
191
|
className: (0, _classnames.default)({
|
package/build/view-grid.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_i18n","_compose","_itemActions","_singleSelectionCheckbox","_bulkActions","GridItem","selection","data","onSelectionChange","getItemId","item","actions","mediaField","primaryField","visibleFields","displayAsColumnFields","hasBulkAction","useHasAPossibleBulkAction","id","isSelected","includes","_react","createElement","__experimentalVStack","spacing","key","className","classnames","onClickCapture","event","ctrlKey","metaKey","stopPropagation","preventDefault","filter","_item","itemId","render","__experimentalHStack","justify","default","disabled","isCompact","map","field","renderedValue","Flex","gap","expanded","style","height","direction","FlexItem","header","maxHeight","ViewGrid","fields","view","isLoading","deferredRendering","find","layout","hiddenFields","shownData","useAsyncList","step","usedData","hasData","length","Fragment","__experimentalGrid","columns","alignment","Spinner","__"],"sources":["@wordpress/dataviews/src/view-grid.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tSpinner,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useAsyncList } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\nimport SingleSelectionCheckbox from './single-selection-checkbox';\n\nimport { useHasAPossibleBulkAction } from './bulk-actions';\n\nfunction GridItem( {\n\tselection,\n\tdata,\n\tonSelectionChange,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n\tdisplayAsColumnFields,\n} ) {\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ classnames( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t} ) }\n\t\t\tonClickCapture={ ( event ) => {\n\t\t\t\tif ( event.ctrlKey || event.metaKey ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! hasBulkAction ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId === id ||\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId !== id &&\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} )\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>\n\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t</div>\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<SingleSelectionCheckbox\n\t\t\t\t\tid={ id }\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t\t/>\n\t\t\t\t<HStack className=\"dataviews-view-grid__primary-field\">\n\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t</HStack>\n\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t</HStack>\n\t\t\t<VStack className=\"dataviews-view-grid__fields\" spacing={ 3 }>\n\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\titem,\n\t\t\t\t\t} );\n\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\treturn null;\n\t\t\t\t\t}\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'dataviews-view-grid__field',\n\t\t\t\t\t\t\t\tdisplayAsColumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t? 'is-column'\n\t\t\t\t\t\t\t\t\t: 'is-row'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\tgap={ 1 }\n\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\texpanded\n\t\t\t\t\t\t\tstyle={ { height: 'auto' } }\n\t\t\t\t\t\t\tdirection={\n\t\t\t\t\t\t\t\tdisplayAsColumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t? 'column'\n\t\t\t\t\t\t\t\t\t: 'row'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<FlexItem className=\"dataviews-view-grid__field-name\">\n\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t\tstyle={ { maxHeight: 'none' } }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</VStack>\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid( {\n\tdata,\n\tfields,\n\tview,\n\tactions,\n\tisLoading,\n\tgetItemId,\n\tdeferredRendering,\n\tselection,\n\tonSelectionChange,\n} ) {\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\t! [ view.layout.mediaField, view.layout.primaryField ].includes(\n\t\t\t\tfield.id\n\t\t\t)\n\t);\n\tconst shownData = useAsyncList( data, { step: 3 } );\n\tconst usedData = deferredRendering ? shownData : data;\n\tconst hasData = !! usedData?.length;\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 6 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ usedData.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tvisibleFields={ visibleFields }\n\t\t\t\t\t\t\t\tdisplayAsColumnFields={\n\t\t\t\t\t\t\t\t\tview.layout.displayAsColumnFields\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_i18n","_itemActions","_singleSelectionCheckbox","_bulkActions","GridItem","selection","data","onSelectionChange","getItemId","item","actions","mediaField","primaryField","visibleFields","badgeFields","columnFields","hasBulkAction","useHasAPossibleBulkAction","id","isSelected","includes","_react","createElement","__experimentalVStack","spacing","key","className","classnames","onClickCapture","event","ctrlKey","metaKey","stopPropagation","preventDefault","filter","_item","itemId","render","__experimentalHStack","justify","default","disabled","isCompact","length","wrap","align","map","field","renderedValue","FlexItem","Flex","gap","expanded","style","height","direction","Fragment","header","maxHeight","ViewGrid","fields","view","isLoading","find","layout","reduce","accumulator","hiddenFields","push","hasData","__experimentalGrid","columns","alignment","Spinner","__"],"sources":["@wordpress/dataviews/src/view-grid.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tSpinner,\n\tFlex,\n\tFlexItem,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport ItemActions from './item-actions';\nimport SingleSelectionCheckbox from './single-selection-checkbox';\n\nimport { useHasAPossibleBulkAction } from './bulk-actions';\n\nfunction GridItem( {\n\tselection,\n\tdata,\n\tonSelectionChange,\n\tgetItemId,\n\titem,\n\tactions,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n\tbadgeFields,\n\tcolumnFields,\n} ) {\n\tconst hasBulkAction = useHasAPossibleBulkAction( actions, item );\n\tconst id = getItemId( item );\n\tconst isSelected = selection.includes( id );\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 0 }\n\t\t\tkey={ id }\n\t\t\tclassName={ classnames( 'dataviews-view-grid__card', {\n\t\t\t\t'is-selected': hasBulkAction && isSelected,\n\t\t\t} ) }\n\t\t\tonClickCapture={ ( event ) => {\n\t\t\t\tif ( event.ctrlKey || event.metaKey ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( ! hasBulkAction ) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId === id ||\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} )\n\t\t\t\t\t\t);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tonSelectionChange(\n\t\t\t\t\t\t\tdata.filter( ( _item ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId?.( _item );\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\titemId !== id &&\n\t\t\t\t\t\t\t\t\tselection.includes( itemId )\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} )\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>\n\t\t\t<div className=\"dataviews-view-grid__media\">\n\t\t\t\t{ mediaField?.render( { item } ) }\n\t\t\t</div>\n\t\t\t<HStack\n\t\t\t\tjustify=\"space-between\"\n\t\t\t\tclassName=\"dataviews-view-grid__title-actions\"\n\t\t\t>\n\t\t\t\t<SingleSelectionCheckbox\n\t\t\t\t\tid={ id }\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\tdata={ data }\n\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\tdisabled={ ! hasBulkAction }\n\t\t\t\t/>\n\t\t\t\t<HStack className=\"dataviews-view-grid__primary-field\">\n\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t</HStack>\n\t\t\t\t<ItemActions item={ item } actions={ actions } isCompact />\n\t\t\t</HStack>\n\t\t\t{ !! badgeFields?.length && (\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"dataviews-view-grid__badge-fields\"\n\t\t\t\t\tspacing={ 2 }\n\t\t\t\t\twrap\n\t\t\t\t\talign=\"top\"\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t>\n\t\t\t\t\t{ badgeFields.map( ( field ) => {\n\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tclassName={ 'dataviews-view-grid__field-value' }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ !! visibleFields?.length && (\n\t\t\t\t<VStack className=\"dataviews-view-grid__fields\" spacing={ 3 }>\n\t\t\t\t\t{ visibleFields.map( ( field ) => {\n\t\t\t\t\t\tconst renderedValue = field.render( {\n\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tif ( ! renderedValue ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t'dataviews-view-grid__field',\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'is-column'\n\t\t\t\t\t\t\t\t\t\t: 'is-row'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\tgap={ 1 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\texpanded\n\t\t\t\t\t\t\t\tstyle={ { height: 'auto' } }\n\t\t\t\t\t\t\t\tdirection={\n\t\t\t\t\t\t\t\t\tcolumnFields?.includes( field.id )\n\t\t\t\t\t\t\t\t\t\t? 'column'\n\t\t\t\t\t\t\t\t\t\t: 'row'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<FlexItem className=\"dataviews-view-grid__field-name\">\n\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-grid__field-value\"\n\t\t\t\t\t\t\t\t\t\tstyle={ { maxHeight: 'none' } }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ renderedValue }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t</Flex>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</VStack>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default function ViewGrid( {\n\tdata,\n\tfields,\n\tview,\n\tactions,\n\tisLoading,\n\tgetItemId,\n\tselection,\n\tonSelectionChange,\n} ) {\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst { visibleFields, badgeFields } = fields.reduce(\n\t\t( accumulator, field ) => {\n\t\t\tif (\n\t\t\t\tview.hiddenFields.includes( field.id ) ||\n\t\t\t\t[ view.layout.mediaField, view.layout.primaryField ].includes(\n\t\t\t\t\tfield.id\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\treturn accumulator;\n\t\t\t}\n\t\t\t// If the field is a badge field, add it to the badgeFields array\n\t\t\t// otherwise add it to the rest visibleFields array.\n\t\t\tconst key = view.layout.badgeFields?.includes( field.id )\n\t\t\t\t? 'badgeFields'\n\t\t\t\t: 'visibleFields';\n\t\t\taccumulator[ key ].push( field );\n\t\t\treturn accumulator;\n\t\t},\n\t\t{ visibleFields: [], badgeFields: [] }\n\t);\n\tconst hasData = !! data?.length;\n\treturn (\n\t\t<>\n\t\t\t{ hasData && (\n\t\t\t\t<Grid\n\t\t\t\t\tgap={ 6 }\n\t\t\t\t\tcolumns={ 2 }\n\t\t\t\t\talignment=\"top\"\n\t\t\t\t\tclassName=\"dataviews-view-grid\"\n\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t>\n\t\t\t\t\t{ data.map( ( item ) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\tonSelectionChange={ onSelectionChange }\n\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\t\t\tvisibleFields={ visibleFields }\n\t\t\t\t\t\t\t\tbadgeFields={ badgeFields }\n\t\t\t\t\t\t\t\tcolumnFields={ view.layout.columnFields }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</Grid>\n\t\t\t) }\n\t\t\t{ ! hasData && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames( {\n\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
|
package/build/view-list.js
CHANGED
|
@@ -10,7 +10,6 @@ var _classnames = _interopRequireDefault(require("classnames"));
|
|
|
10
10
|
var _compose = require("@wordpress/compose");
|
|
11
11
|
var _components = require("@wordpress/components");
|
|
12
12
|
var _element = require("@wordpress/element");
|
|
13
|
-
var _icons = require("@wordpress/icons");
|
|
14
13
|
var _i18n = require("@wordpress/i18n");
|
|
15
14
|
var _lockUnlock = require("./lock-unlock");
|
|
16
15
|
/**
|
|
@@ -36,7 +35,6 @@ function ListItem({
|
|
|
36
35
|
item,
|
|
37
36
|
isSelected,
|
|
38
37
|
onSelect,
|
|
39
|
-
onDetailsChange,
|
|
40
38
|
mediaField,
|
|
41
39
|
primaryField,
|
|
42
40
|
visibleFields
|
|
@@ -103,16 +101,7 @@ function ListItem({
|
|
|
103
101
|
className: "dataviews-view-list__field-value"
|
|
104
102
|
}, field.render({
|
|
105
103
|
item
|
|
106
|
-
})))))))))
|
|
107
|
-
role: "gridcell"
|
|
108
|
-
}, (0, _react.createElement)(CompositeItem, {
|
|
109
|
-
render: (0, _react.createElement)(_components.Button, null),
|
|
110
|
-
className: "dataviews-view-list__details-button",
|
|
111
|
-
onClick: () => onDetailsChange([item]),
|
|
112
|
-
icon: _icons.info,
|
|
113
|
-
label: (0, _i18n.__)('View details'),
|
|
114
|
-
size: "compact"
|
|
115
|
-
}))));
|
|
104
|
+
})))))))))));
|
|
116
105
|
}
|
|
117
106
|
function ViewList({
|
|
118
107
|
view,
|
|
@@ -121,17 +110,11 @@ function ViewList({
|
|
|
121
110
|
isLoading,
|
|
122
111
|
getItemId,
|
|
123
112
|
onSelectionChange,
|
|
124
|
-
onDetailsChange,
|
|
125
113
|
selection,
|
|
126
|
-
deferredRendering,
|
|
127
114
|
id: preferredId
|
|
128
115
|
}) {
|
|
129
116
|
const baseId = (0, _compose.useInstanceId)(ViewList, 'view-list', preferredId);
|
|
130
|
-
const
|
|
131
|
-
step: 3
|
|
132
|
-
});
|
|
133
|
-
const usedData = deferredRendering ? shownData : data;
|
|
134
|
-
const selectedItem = usedData?.findLast(item => selection.includes(item.id));
|
|
117
|
+
const selectedItem = data?.findLast(item => selection.includes(item.id));
|
|
135
118
|
const mediaField = fields.find(field => field.id === view.layout.mediaField);
|
|
136
119
|
const primaryField = fields.find(field => field.id === view.layout.primaryField);
|
|
137
120
|
const visibleFields = fields.filter(field => !view.hiddenFields.includes(field.id) && ![view.layout.primaryField, view.layout.mediaField].includes(field.id));
|
|
@@ -140,7 +123,7 @@ function ViewList({
|
|
|
140
123
|
const store = useCompositeStore({
|
|
141
124
|
defaultActiveId: getItemDomId(selectedItem)
|
|
142
125
|
});
|
|
143
|
-
const hasData =
|
|
126
|
+
const hasData = data?.length;
|
|
144
127
|
if (!hasData) {
|
|
145
128
|
return (0, _react.createElement)("div", {
|
|
146
129
|
className: (0, _classnames.default)({
|
|
@@ -155,7 +138,7 @@ function ViewList({
|
|
|
155
138
|
className: "dataviews-view-list",
|
|
156
139
|
role: "grid",
|
|
157
140
|
store: store
|
|
158
|
-
},
|
|
141
|
+
}, data.map(item => {
|
|
159
142
|
const id = getItemDomId(item);
|
|
160
143
|
return (0, _react.createElement)(ListItem, {
|
|
161
144
|
key: id,
|
|
@@ -163,7 +146,6 @@ function ViewList({
|
|
|
163
146
|
item: item,
|
|
164
147
|
isSelected: item === selectedItem,
|
|
165
148
|
onSelect: onSelect,
|
|
166
|
-
onDetailsChange: onDetailsChange,
|
|
167
149
|
mediaField: mediaField,
|
|
168
150
|
primaryField: primaryField,
|
|
169
151
|
visibleFields: visibleFields
|
package/build/view-list.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_classnames","_interopRequireDefault","require","_compose","_components","_element","_icons","_i18n","_lockUnlock","useCompositeStoreV2","useCompositeStore","CompositeV2","Composite","CompositeItemV2","CompositeItem","CompositeRowV2","CompositeRow","unlock","componentsPrivateApis","ListItem","id","item","isSelected","onSelect","onDetailsChange","mediaField","primaryField","visibleFields","itemRef","useRef","labelId","descriptionId","useEffect","current","scrollIntoView","behavior","block","inline","_react","createElement","ref","render","role","className","classNames","__experimentalHStack","onClick","spacing","justify","alignment","__experimentalVStack","map","field","key","VisuallyHidden","as","header","Button","icon","info","label","__","size","ViewList","view","fields","data","isLoading","getItemId","onSelectionChange","selection","deferredRendering","preferredId","baseId","useInstanceId","shownData","useAsyncList","step","usedData","selectedItem","findLast","includes","find","layout","filter","hiddenFields","useCallback","getItemDomId","undefined","store","defaultActiveId","hasData","length","Spinner"],"sources":["@wordpress/dataviews/src/view-list.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useAsyncList, useInstanceId } from '@wordpress/compose';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tprivateApis as componentsPrivateApis,\n\tButton,\n\tSpinner,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\nimport { info } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\n\nconst {\n\tuseCompositeStoreV2: useCompositeStore,\n\tCompositeV2: Composite,\n\tCompositeItemV2: CompositeItem,\n\tCompositeRowV2: CompositeRow,\n} = unlock( componentsPrivateApis );\n\nfunction ListItem( {\n\tid,\n\titem,\n\tisSelected,\n\tonSelect,\n\tonDetailsChange,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n} ) {\n\tconst itemRef = useRef( null );\n\tconst labelId = `${ id }-label`;\n\tconst descriptionId = `${ id }-description`;\n\n\tuseEffect( () => {\n\t\tif ( isSelected ) {\n\t\t\titemRef.current?.scrollIntoView( {\n\t\t\t\tbehavior: 'auto',\n\t\t\t\tblock: 'nearest',\n\t\t\t\tinline: 'nearest',\n\t\t\t} );\n\t\t}\n\t}, [ isSelected ] );\n\n\treturn (\n\t\t<CompositeRow\n\t\t\tref={ itemRef }\n\t\t\trender={ <li /> }\n\t\t\trole=\"row\"\n\t\t\tclassName={ classNames( {\n\t\t\t\t'is-selected': isSelected,\n\t\t\t} ) }\n\t\t>\n\t\t\t<HStack className=\"dataviews-view-list__item-wrapper\">\n\t\t\t\t<div role=\"gridcell\">\n\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\trender={ <div /> }\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\taria-pressed={ isSelected }\n\t\t\t\t\t\taria-labelledby={ labelId }\n\t\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t\tclassName=\"dataviews-view-list__item\"\n\t\t\t\t\t\tonClick={ () => onSelect( item ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\t\t\talignment=\"flex-start\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-wrapper\">\n\t\t\t\t\t\t\t\t{ mediaField?.render( { item } ) || (\n\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-placeholder\"></div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__primary-field\"\n\t\t\t\t\t\t\t\t\tid={ labelId }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__fields\"\n\t\t\t\t\t\t\t\t\tid={ descriptionId }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ visibleFields.map( ( field ) => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__field\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<VisuallyHidden\n\t\t\t\t\t\t\t\t\t\t\t\tas=\"span\"\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__field-label\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"dataviews-view-list__field-value\">\n\t\t\t\t\t\t\t\t\t\t\t\t{ field.render( { item } ) }\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</CompositeItem>\n\t\t\t\t</div>\n\t\t\t\t{ onDetailsChange && (\n\t\t\t\t\t<div role=\"gridcell\">\n\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\trender={ <Button /> }\n\t\t\t\t\t\t\tclassName=\"dataviews-view-list__details-button\"\n\t\t\t\t\t\t\tonClick={ () => onDetailsChange( [ item ] ) }\n\t\t\t\t\t\t\ticon={ info }\n\t\t\t\t\t\t\tlabel={ __( 'View details' ) }\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</CompositeRow>\n\t);\n}\n\nexport default function ViewList( {\n\tview,\n\tfields,\n\tdata,\n\tisLoading,\n\tgetItemId,\n\tonSelectionChange,\n\tonDetailsChange,\n\tselection,\n\tdeferredRendering,\n\tid: preferredId,\n} ) {\n\tconst baseId = useInstanceId( ViewList, 'view-list', preferredId );\n\tconst shownData = useAsyncList( data, { step: 3 } );\n\tconst usedData = deferredRendering ? shownData : data;\n\tconst selectedItem = usedData?.findLast( ( item ) =>\n\t\tselection.includes( item.id )\n\t);\n\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\t! [ view.layout.primaryField, view.layout.mediaField ].includes(\n\t\t\t\tfield.id\n\t\t\t)\n\t);\n\n\tconst onSelect = useCallback(\n\t\t( item ) => onSelectionChange( [ item ] ),\n\t\t[ onSelectionChange ]\n\t);\n\n\tconst getItemDomId = useCallback(\n\t\t( item ) => ( item ? `${ baseId }-${ getItemId( item ) }` : undefined ),\n\t\t[ baseId, getItemId ]\n\t);\n\n\tconst store = useCompositeStore( {\n\t\tdefaultActiveId: getItemDomId( selectedItem ),\n\t} );\n\n\tconst hasData = usedData?.length;\n\tif ( ! hasData ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={ classNames( {\n\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t'dataviews-no-results': ! hasData && ! isLoading,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ ! hasData && (\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Composite\n\t\t\tid={ baseId }\n\t\t\trender={ <ul /> }\n\t\t\tclassName=\"dataviews-view-list\"\n\t\t\trole=\"grid\"\n\t\t\tstore={ store }\n\t\t>\n\t\t\t{ usedData.map( ( item ) => {\n\t\t\t\tconst id = getItemDomId( item );\n\t\t\t\treturn (\n\t\t\t\t\t<ListItem\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tisSelected={ item === selectedItem }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\tonDetailsChange={ onDetailsChange }\n\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\tvisibleFields={ visibleFields }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Composite>\n\t);\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["_classnames","_interopRequireDefault","require","_compose","_components","_element","_i18n","_lockUnlock","useCompositeStoreV2","useCompositeStore","CompositeV2","Composite","CompositeItemV2","CompositeItem","CompositeRowV2","CompositeRow","unlock","componentsPrivateApis","ListItem","id","item","isSelected","onSelect","mediaField","primaryField","visibleFields","itemRef","useRef","labelId","descriptionId","useEffect","current","scrollIntoView","behavior","block","inline","_react","createElement","ref","render","role","className","classNames","__experimentalHStack","onClick","spacing","justify","alignment","__experimentalVStack","map","field","key","VisuallyHidden","as","header","ViewList","view","fields","data","isLoading","getItemId","onSelectionChange","selection","preferredId","baseId","useInstanceId","selectedItem","findLast","includes","find","layout","filter","hiddenFields","useCallback","getItemDomId","undefined","store","defaultActiveId","hasData","length","Spinner","__"],"sources":["@wordpress/dataviews/src/view-list.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tprivateApis as componentsPrivateApis,\n\tSpinner,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { useCallback, useEffect, useRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from './lock-unlock';\n\nconst {\n\tuseCompositeStoreV2: useCompositeStore,\n\tCompositeV2: Composite,\n\tCompositeItemV2: CompositeItem,\n\tCompositeRowV2: CompositeRow,\n} = unlock( componentsPrivateApis );\n\nfunction ListItem( {\n\tid,\n\titem,\n\tisSelected,\n\tonSelect,\n\tmediaField,\n\tprimaryField,\n\tvisibleFields,\n} ) {\n\tconst itemRef = useRef( null );\n\tconst labelId = `${ id }-label`;\n\tconst descriptionId = `${ id }-description`;\n\n\tuseEffect( () => {\n\t\tif ( isSelected ) {\n\t\t\titemRef.current?.scrollIntoView( {\n\t\t\t\tbehavior: 'auto',\n\t\t\t\tblock: 'nearest',\n\t\t\t\tinline: 'nearest',\n\t\t\t} );\n\t\t}\n\t}, [ isSelected ] );\n\n\treturn (\n\t\t<CompositeRow\n\t\t\tref={ itemRef }\n\t\t\trender={ <li /> }\n\t\t\trole=\"row\"\n\t\t\tclassName={ classNames( {\n\t\t\t\t'is-selected': isSelected,\n\t\t\t} ) }\n\t\t>\n\t\t\t<HStack className=\"dataviews-view-list__item-wrapper\">\n\t\t\t\t<div role=\"gridcell\">\n\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\trender={ <div /> }\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\taria-pressed={ isSelected }\n\t\t\t\t\t\taria-labelledby={ labelId }\n\t\t\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t\t\tclassName=\"dataviews-view-list__item\"\n\t\t\t\t\t\tonClick={ () => onSelect( item ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t\t\tjustify=\"start\"\n\t\t\t\t\t\t\talignment=\"flex-start\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-wrapper\">\n\t\t\t\t\t\t\t\t{ mediaField?.render( { item } ) || (\n\t\t\t\t\t\t\t\t\t<div className=\"dataviews-view-list__media-placeholder\"></div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<VStack spacing={ 1 }>\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__primary-field\"\n\t\t\t\t\t\t\t\t\tid={ labelId }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ primaryField?.render( { item } ) }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__fields\"\n\t\t\t\t\t\t\t\t\tid={ descriptionId }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ visibleFields.map( ( field ) => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__field\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<VisuallyHidden\n\t\t\t\t\t\t\t\t\t\t\t\tas=\"span\"\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-list__field-label\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"dataviews-view-list__field-value\">\n\t\t\t\t\t\t\t\t\t\t\t\t{ field.render( { item } ) }\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</CompositeItem>\n\t\t\t\t</div>\n\t\t\t</HStack>\n\t\t</CompositeRow>\n\t);\n}\n\nexport default function ViewList( {\n\tview,\n\tfields,\n\tdata,\n\tisLoading,\n\tgetItemId,\n\tonSelectionChange,\n\tselection,\n\tid: preferredId,\n} ) {\n\tconst baseId = useInstanceId( ViewList, 'view-list', preferredId );\n\tconst selectedItem = data?.findLast( ( item ) =>\n\t\tselection.includes( item.id )\n\t);\n\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view.layout.mediaField\n\t);\n\tconst primaryField = fields.find(\n\t\t( field ) => field.id === view.layout.primaryField\n\t);\n\tconst visibleFields = fields.filter(\n\t\t( field ) =>\n\t\t\t! view.hiddenFields.includes( field.id ) &&\n\t\t\t! [ view.layout.primaryField, view.layout.mediaField ].includes(\n\t\t\t\tfield.id\n\t\t\t)\n\t);\n\n\tconst onSelect = useCallback(\n\t\t( item ) => onSelectionChange( [ item ] ),\n\t\t[ onSelectionChange ]\n\t);\n\n\tconst getItemDomId = useCallback(\n\t\t( item ) => ( item ? `${ baseId }-${ getItemId( item ) }` : undefined ),\n\t\t[ baseId, getItemId ]\n\t);\n\n\tconst store = useCompositeStore( {\n\t\tdefaultActiveId: getItemDomId( selectedItem ),\n\t} );\n\n\tconst hasData = data?.length;\n\tif ( ! hasData ) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={ classNames( {\n\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t'dataviews-no-results': ! hasData && ! isLoading,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ ! hasData && (\n\t\t\t\t\t<p>{ isLoading ? <Spinner /> : __( 'No results' ) }</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Composite\n\t\t\tid={ baseId }\n\t\t\trender={ <ul /> }\n\t\t\tclassName=\"dataviews-view-list\"\n\t\t\trole=\"grid\"\n\t\t\tstore={ store }\n\t\t>\n\t\t\t{ data.map( ( item ) => {\n\t\t\t\tconst id = getItemDomId( item );\n\t\t\t\treturn (\n\t\t\t\t\t<ListItem\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\tid={ id }\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tisSelected={ item === selectedItem }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\tprimaryField={ primaryField }\n\t\t\t\t\t\tvisibleFields={ visibleFields }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Composite>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
|
package/build/view-table.js
CHANGED
|
@@ -8,7 +8,6 @@ exports.default = void 0;
|
|
|
8
8
|
var _react = require("react");
|
|
9
9
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
10
10
|
var _i18n = require("@wordpress/i18n");
|
|
11
|
-
var _compose = require("@wordpress/compose");
|
|
12
11
|
var _icons = require("@wordpress/icons");
|
|
13
12
|
var _components = require("@wordpress/components");
|
|
14
13
|
var _element = require("@wordpress/element");
|
|
@@ -158,7 +157,7 @@ function BulkSelectionCheckbox({
|
|
|
158
157
|
onSelectionChange(selectableItems);
|
|
159
158
|
}
|
|
160
159
|
},
|
|
161
|
-
label: areAllSelected ? (0, _i18n.__)('Deselect all') : (0, _i18n.__)('Select all')
|
|
160
|
+
"aria-label": areAllSelected ? (0, _i18n.__)('Deselect all') : (0, _i18n.__)('Select all')
|
|
162
161
|
});
|
|
163
162
|
}
|
|
164
163
|
function TableRow({
|
|
@@ -216,8 +215,7 @@ function TableRow({
|
|
|
216
215
|
}, hasBulkActions && (0, _react.createElement)("td", {
|
|
217
216
|
className: "dataviews-view-table__checkbox-column",
|
|
218
217
|
style: {
|
|
219
|
-
width:
|
|
220
|
-
minWidth: 20
|
|
218
|
+
width: '1%'
|
|
221
219
|
}
|
|
222
220
|
}, (0, _react.createElement)("div", {
|
|
223
221
|
className: "dataviews-view-table__cell-content-wrapper"
|
|
@@ -268,7 +266,6 @@ function ViewTable({
|
|
|
268
266
|
data,
|
|
269
267
|
getItemId,
|
|
270
268
|
isLoading = false,
|
|
271
|
-
deferredRendering,
|
|
272
269
|
selection,
|
|
273
270
|
onSelectionChange,
|
|
274
271
|
setOpenedFilter
|
|
@@ -283,7 +280,6 @@ function ViewTable({
|
|
|
283
280
|
headerMenuToFocusRef.current = undefined;
|
|
284
281
|
}
|
|
285
282
|
});
|
|
286
|
-
const asyncData = (0, _compose.useAsyncList)(data);
|
|
287
283
|
const tableNoticeId = (0, _element.useId)();
|
|
288
284
|
if (nextHeaderMenuToFocus) {
|
|
289
285
|
// If we need to force focus, we short-circuit rendering here
|
|
@@ -300,8 +296,7 @@ function ViewTable({
|
|
|
300
296
|
setNextHeaderMenuToFocus(fallback?.node);
|
|
301
297
|
};
|
|
302
298
|
const visibleFields = fields.filter(field => !view.hiddenFields.includes(field.id) && ![view.layout.mediaField].includes(field.id));
|
|
303
|
-
const
|
|
304
|
-
const hasData = !!usedData?.length;
|
|
299
|
+
const hasData = !!data?.length;
|
|
305
300
|
const sortValues = {
|
|
306
301
|
asc: 'ascending',
|
|
307
302
|
desc: 'descending'
|
|
@@ -316,8 +311,7 @@ function ViewTable({
|
|
|
316
311
|
}, hasBulkActions && (0, _react.createElement)("th", {
|
|
317
312
|
className: "dataviews-view-table__checkbox-column",
|
|
318
313
|
style: {
|
|
319
|
-
width:
|
|
320
|
-
minWidth: 20
|
|
314
|
+
width: '1%'
|
|
321
315
|
},
|
|
322
316
|
"data-field-id": "selection",
|
|
323
317
|
scope: "col"
|
|
@@ -357,7 +351,7 @@ function ViewTable({
|
|
|
357
351
|
className: "dataviews-view-table__actions-column"
|
|
358
352
|
}, (0, _react.createElement)("span", {
|
|
359
353
|
className: "dataviews-view-table-header"
|
|
360
|
-
}, (0, _i18n.__)('Actions'))))), (0, _react.createElement)("tbody", null, hasData &&
|
|
354
|
+
}, (0, _i18n.__)('Actions'))))), (0, _react.createElement)("tbody", null, hasData && data.map((item, index) => (0, _react.createElement)(TableRow, {
|
|
361
355
|
key: getItemId(item),
|
|
362
356
|
item: item,
|
|
363
357
|
hasBulkActions: hasBulkActions,
|