@wordpress/dataviews 13.1.1-next.v.202603161435.0 → 14.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.
- package/CHANGELOG.md +15 -6
- package/README.md +17 -2
- package/build/components/dataform-controls/datetime.cjs +8 -4
- package/build/components/dataform-controls/datetime.cjs.map +2 -2
- package/build/components/dataform-layouts/card/index.cjs +132 -128
- package/build/components/dataform-layouts/card/index.cjs.map +3 -3
- package/build/components/dataviews-bulk-actions/index.cjs +28 -5
- package/build/components/dataviews-bulk-actions/index.cjs.map +2 -2
- package/build/components/dataviews-context/index.cjs +2 -2
- package/build/components/dataviews-context/index.cjs.map +2 -2
- package/build/components/dataviews-footer/index.cjs +2 -3
- package/build/components/dataviews-footer/index.cjs.map +2 -2
- package/build/components/dataviews-layouts/grid/composite-grid.cjs +378 -249
- package/build/components/dataviews-layouts/grid/composite-grid.cjs.map +2 -2
- package/build/components/dataviews-layouts/picker-grid/index.cjs +63 -30
- package/build/components/dataviews-layouts/picker-grid/index.cjs.map +2 -2
- package/build/components/dataviews-layouts/picker-table/index.cjs +34 -22
- package/build/components/dataviews-layouts/picker-table/index.cjs.map +2 -2
- package/build/components/dataviews-layouts/utils/use-infinite-scroll.cjs +62 -0
- package/build/components/dataviews-layouts/utils/use-infinite-scroll.cjs.map +7 -0
- package/build/components/dataviews-picker-footer/index.cjs +23 -4
- package/build/components/dataviews-picker-footer/index.cjs.map +2 -2
- package/build/components/dataviews-search/index.cjs +2 -1
- package/build/components/dataviews-search/index.cjs.map +2 -2
- package/build/components/dataviews-selection-checkbox/index.cjs +3 -2
- package/build/components/dataviews-selection-checkbox/index.cjs.map +2 -2
- package/build/components/dataviews-view-config/index.cjs +0 -2
- package/build/components/dataviews-view-config/index.cjs.map +3 -3
- package/build/components/dataviews-view-config/infinite-scroll-toggle.cjs +0 -3
- package/build/components/dataviews-view-config/infinite-scroll-toggle.cjs.map +2 -2
- package/build/dataviews/index.cjs +37 -37
- package/build/dataviews/index.cjs.map +3 -3
- package/build/dataviews-picker/index.cjs +25 -24
- package/build/dataviews-picker/index.cjs.map +3 -3
- package/build/hooks/index.cjs +11 -2
- package/build/hooks/index.cjs.map +2 -2
- package/build/hooks/use-data.cjs +146 -9
- package/build/hooks/use-data.cjs.map +2 -2
- package/build/hooks/use-infinite-scroll.cjs +208 -0
- package/build/hooks/use-infinite-scroll.cjs.map +7 -0
- package/build/hooks/use-selected-items.cjs +57 -0
- package/build/hooks/use-selected-items.cjs.map +7 -0
- package/build/types/dataviews.cjs.map +1 -1
- package/build/types/field-api.cjs.map +1 -1
- package/build/utils/filter-sort-and-paginate.cjs +5 -1
- package/build/utils/filter-sort-and-paginate.cjs.map +2 -2
- package/build/utils/get-footer-message.cjs +8 -8
- package/build/utils/get-footer-message.cjs.map +2 -2
- package/build-module/components/dataform-controls/datetime.mjs +8 -4
- package/build-module/components/dataform-controls/datetime.mjs.map +2 -2
- package/build-module/components/dataform-layouts/card/index.mjs +132 -133
- package/build-module/components/dataform-layouts/card/index.mjs.map +2 -2
- package/build-module/components/dataviews-bulk-actions/index.mjs +28 -5
- package/build-module/components/dataviews-bulk-actions/index.mjs.map +2 -2
- package/build-module/components/dataviews-context/index.mjs +2 -2
- package/build-module/components/dataviews-context/index.mjs.map +2 -2
- package/build-module/components/dataviews-footer/index.mjs +2 -3
- package/build-module/components/dataviews-footer/index.mjs.map +2 -2
- package/build-module/components/dataviews-layouts/grid/composite-grid.mjs +387 -250
- package/build-module/components/dataviews-layouts/grid/composite-grid.mjs.map +2 -2
- package/build-module/components/dataviews-layouts/picker-grid/index.mjs +67 -31
- package/build-module/components/dataviews-layouts/picker-grid/index.mjs.map +2 -2
- package/build-module/components/dataviews-layouts/picker-table/index.mjs +34 -22
- package/build-module/components/dataviews-layouts/picker-table/index.mjs.map +2 -2
- package/build-module/components/dataviews-layouts/utils/use-infinite-scroll.mjs +26 -0
- package/build-module/components/dataviews-layouts/utils/use-infinite-scroll.mjs.map +7 -0
- package/build-module/components/dataviews-picker-footer/index.mjs +23 -4
- package/build-module/components/dataviews-picker-footer/index.mjs.map +2 -2
- package/build-module/components/dataviews-search/index.mjs +2 -1
- package/build-module/components/dataviews-search/index.mjs.map +2 -2
- package/build-module/components/dataviews-selection-checkbox/index.mjs +3 -2
- package/build-module/components/dataviews-selection-checkbox/index.mjs.map +2 -2
- package/build-module/components/dataviews-view-config/index.mjs +0 -2
- package/build-module/components/dataviews-view-config/index.mjs.map +2 -2
- package/build-module/components/dataviews-view-config/infinite-scroll-toggle.mjs +0 -3
- package/build-module/components/dataviews-view-config/infinite-scroll-toggle.mjs.map +2 -2
- package/build-module/dataviews/index.mjs +45 -39
- package/build-module/dataviews/index.mjs.map +2 -2
- package/build-module/dataviews-picker/index.mjs +33 -26
- package/build-module/dataviews-picker/index.mjs.map +2 -2
- package/build-module/hooks/index.mjs +7 -1
- package/build-module/hooks/index.mjs.map +2 -2
- package/build-module/hooks/use-data.mjs +147 -10
- package/build-module/hooks/use-data.mjs.map +2 -2
- package/build-module/hooks/use-infinite-scroll.mjs +188 -0
- package/build-module/hooks/use-infinite-scroll.mjs.map +7 -0
- package/build-module/hooks/use-selected-items.mjs +36 -0
- package/build-module/hooks/use-selected-items.mjs.map +7 -0
- package/build-module/utils/filter-sort-and-paginate.mjs +5 -1
- package/build-module/utils/filter-sort-and-paginate.mjs.map +2 -2
- package/build-module/utils/get-footer-message.mjs +8 -8
- package/build-module/utils/get-footer-message.mjs.map +2 -2
- package/build-style/style-rtl.css +61 -37
- package/build-style/style.css +61 -37
- package/build-types/components/dataform-controls/datetime.d.ts +1 -1
- package/build-types/components/dataform-controls/datetime.d.ts.map +1 -1
- package/build-types/components/dataform-layouts/card/index.d.ts.map +1 -1
- package/build-types/components/dataviews-bulk-actions/index.d.ts +2 -1
- package/build-types/components/dataviews-bulk-actions/index.d.ts.map +1 -1
- package/build-types/components/dataviews-context/index.d.ts +1 -1
- package/build-types/components/dataviews-context/index.d.ts.map +1 -1
- package/build-types/components/dataviews-footer/index.d.ts.map +1 -1
- package/build-types/components/dataviews-layouts/grid/composite-grid.d.ts.map +1 -1
- package/build-types/components/dataviews-layouts/picker-grid/index.d.ts.map +1 -1
- package/build-types/components/dataviews-layouts/picker-table/index.d.ts.map +1 -1
- package/build-types/components/dataviews-layouts/utils/use-infinite-scroll.d.ts +22 -0
- package/build-types/components/dataviews-layouts/utils/use-infinite-scroll.d.ts.map +1 -0
- package/build-types/components/dataviews-picker-footer/index.d.ts.map +1 -1
- package/build-types/components/dataviews-search/index.d.ts.map +1 -1
- package/build-types/components/dataviews-selection-checkbox/index.d.ts.map +1 -1
- package/build-types/components/dataviews-view-config/index.d.ts.map +1 -1
- package/build-types/components/dataviews-view-config/infinite-scroll-toggle.d.ts +1 -1
- package/build-types/components/dataviews-view-config/infinite-scroll-toggle.d.ts.map +1 -1
- package/build-types/dataviews/index.d.ts +0 -1
- package/build-types/dataviews/index.d.ts.map +1 -1
- package/build-types/dataviews/stories/fixtures.d.ts.map +1 -1
- package/build-types/dataviews/stories/free-composition.d.ts.map +1 -1
- package/build-types/dataviews/stories/index.story.d.ts +11 -0
- package/build-types/dataviews/stories/index.story.d.ts.map +1 -1
- package/build-types/dataviews/stories/infinite-scroll.d.ts.map +1 -1
- package/build-types/dataviews/stories/with-card.d.ts.map +1 -1
- package/build-types/dataviews-picker/index.d.ts +0 -1
- package/build-types/dataviews-picker/index.d.ts.map +1 -1
- package/build-types/dataviews-picker/stories/fixtures.d.ts.map +1 -1
- package/build-types/dataviews-picker/stories/index.story.d.ts.map +1 -1
- package/build-types/field-types/stories/index.story.d.ts.map +1 -1
- package/build-types/hooks/index.d.ts +3 -0
- package/build-types/hooks/index.d.ts.map +1 -1
- package/build-types/hooks/test/use-data.d.ts +2 -0
- package/build-types/hooks/test/use-data.d.ts.map +1 -0
- package/build-types/hooks/use-data.d.ts +41 -3
- package/build-types/hooks/use-data.d.ts.map +1 -1
- package/build-types/hooks/use-infinite-scroll.d.ts +21 -0
- package/build-types/hooks/use-infinite-scroll.d.ts.map +1 -0
- package/build-types/hooks/use-selected-items.d.ts +19 -0
- package/build-types/hooks/use-selected-items.d.ts.map +1 -0
- package/build-types/types/dataviews.d.ts +7 -1
- package/build-types/types/dataviews.d.ts.map +1 -1
- package/build-types/types/field-api.d.ts +15 -4
- package/build-types/types/field-api.d.ts.map +1 -1
- package/build-types/utils/filter-sort-and-paginate.d.ts.map +1 -1
- package/build-types/utils/get-footer-message.d.ts +3 -2
- package/build-types/utils/get-footer-message.d.ts.map +1 -1
- package/build-wp/index.js +3013 -2613
- package/package.json +19 -19
- package/src/components/dataform-controls/datetime.tsx +19 -11
- package/src/components/dataform-layouts/card/index.tsx +171 -146
- package/src/components/dataform-layouts/card/style.scss +8 -5
- package/src/components/dataviews-bulk-actions/index.tsx +28 -1
- package/src/components/dataviews-context/index.ts +2 -2
- package/src/components/dataviews-footer/index.tsx +1 -6
- package/src/components/dataviews-layouts/grid/composite-grid.tsx +433 -284
- package/src/components/dataviews-layouts/grid/style.scss +4 -0
- package/src/components/dataviews-layouts/picker-grid/index.tsx +53 -15
- package/src/components/dataviews-layouts/picker-table/index.tsx +42 -22
- package/src/components/dataviews-layouts/utils/use-infinite-scroll.ts +64 -0
- package/src/components/dataviews-picker-footer/index.tsx +21 -1
- package/src/components/dataviews-search/index.tsx +2 -1
- package/src/components/dataviews-selection-checkbox/index.tsx +4 -2
- package/src/components/dataviews-view-config/index.tsx +0 -2
- package/src/components/dataviews-view-config/infinite-scroll-toggle.tsx +0 -5
- package/src/dataviews/index.tsx +57 -52
- package/src/dataviews/stories/fixtures.tsx +288 -0
- package/src/dataviews/stories/free-composition.tsx +12 -11
- package/src/dataviews/stories/index.story.tsx +19 -2
- package/src/dataviews/stories/infinite-scroll.tsx +12 -92
- package/src/dataviews/stories/with-card.tsx +30 -23
- package/src/dataviews/style.scss +5 -7
- package/src/dataviews/test/dataviews.tsx +21 -9
- package/src/dataviews-picker/index.tsx +40 -34
- package/src/dataviews-picker/stories/fixtures.tsx +270 -0
- package/src/dataviews-picker/stories/index.story.tsx +62 -129
- package/src/field-types/stories/index.story.tsx +12 -0
- package/src/hooks/index.ts +3 -0
- package/src/hooks/test/use-data.ts +791 -0
- package/src/hooks/use-data.ts +288 -21
- package/src/hooks/use-infinite-scroll.ts +304 -0
- package/src/hooks/use-selected-items.ts +72 -0
- package/src/types/dataviews.ts +8 -1
- package/src/types/field-api.ts +16 -3
- package/src/utils/filter-sort-and-paginate.ts +13 -1
- package/src/utils/get-footer-message.ts +12 -9
- package/src/utils/test/filter-sort-and-paginate.js +78 -54
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/dataviews-layouts/picker-table/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Spinner, Composite } from '@wordpress/components';\nimport {\n\tuseContext,\n\tuseEffect,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../../dataviews-context';\nimport DataViewsSelectionCheckbox from '../../dataviews-selection-checkbox';\nimport { useIsMultiselectPicker } from '../../dataviews-picker-footer';\nimport { BulkSelectionCheckbox } from '../../dataviews-bulk-actions';\nimport { sortValues } from '../../../constants';\nimport type {\n\tNormalizedField,\n\tViewPickerTable as ViewPickerTableType,\n\tViewPickerTableProps,\n} from '../../../types';\nimport type { SetSelection } from '../../../types/private';\nimport ColumnHeaderMenu from '../table/column-header-menu';\nimport ColumnPrimary from '../table/column-primary';\nimport getDataByGroup from '../utils/get-data-by-group';\n\ninterface TableColumnFieldProps< Item > {\n\tfields: NormalizedField< Item >[];\n\tcolumn: string;\n\titem: Item;\n\talign?: 'start' | 'center' | 'end';\n}\n\ninterface TableRowProps< Item > {\n\titem: Item;\n\tfields: NormalizedField< Item >[];\n\tid: string;\n\tview: ViewPickerTableType;\n\ttitleField?: NormalizedField< Item >;\n\tmediaField?: NormalizedField< Item >;\n\tdescriptionField?: NormalizedField< Item >;\n\tselection: string[];\n\tgetItemId: ( item: Item ) => string;\n\tonChangeSelection: SetSelection;\n\tmultiselect: boolean;\n\tposinset?: number;\n}\n\nfunction TableColumnField< Item >( {\n\titem,\n\tfields,\n\tcolumn,\n\talign,\n}: TableColumnFieldProps< Item > ) {\n\tconst field = fields.find( ( f ) => f.id === column );\n\n\tif ( ! field ) {\n\t\treturn null;\n\t}\n\n\tconst className = clsx( 'dataviews-view-table__cell-content-wrapper', {\n\t\t'dataviews-view-table__cell-align-end': align === 'end',\n\t\t'dataviews-view-table__cell-align-center': align === 'center',\n\t} );\n\n\treturn (\n\t\t<div className={ className }>\n\t\t\t<field.render item={ item } field={ field } />\n\t\t</div>\n\t);\n}\n\nfunction TableRow< Item >( {\n\titem,\n\tfields,\n\tid,\n\tview,\n\ttitleField,\n\tmediaField,\n\tdescriptionField,\n\tselection,\n\tgetItemId,\n\tonChangeSelection,\n\tmultiselect,\n\tposinset,\n}: TableRowProps< Item > ) {\n\tconst { paginationInfo } = useContext( DataViewsContext );\n\tconst isSelected = selection.includes( id );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst {\n\t\tshowTitle = true,\n\t\tshowMedia = true,\n\t\tshowDescription = true,\n\t\tinfiniteScrollEnabled,\n\t} = view;\n\tconst handleMouseEnter = () => {\n\t\tsetIsHovered( true );\n\t};\n\tconst handleMouseLeave = () => {\n\t\tsetIsHovered( false );\n\t};\n\n\tconst columns = view.fields ?? [];\n\tconst hasPrimaryColumn =\n\t\t( titleField && showTitle ) ||\n\t\t( mediaField && showMedia ) ||\n\t\t( descriptionField && showDescription );\n\n\treturn (\n\t\t<Composite.Item\n\t\t\tkey={ id }\n\t\t\trender={ ( { children, ...props } ) => (\n\t\t\t\t<tr\n\t\t\t\t\tclassName={ clsx( 'dataviews-view-table__row', {\n\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t'is-hovered': isHovered,\n\t\t\t\t\t} ) }\n\t\t\t\t\tonMouseEnter={ handleMouseEnter }\n\t\t\t\t\tonMouseLeave={ handleMouseLeave }\n\t\t\t\t\tchildren={ children }\n\t\t\t\t\t{ ...props }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\taria-selected={ isSelected }\n\t\t\taria-setsize={ paginationInfo.totalItems || undefined }\n\t\t\taria-posinset={ posinset }\n\t\t\trole={ infiniteScrollEnabled ? 'article' : 'option' }\n\t\t\tonClick={ () => {\n\t\t\t\tif ( isSelected ) {\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tconst newSelection = multiselect\n\t\t\t\t\t\t? [ ...selection, id ]\n\t\t\t\t\t\t: [ id ];\n\t\t\t\t\tonChangeSelection( newSelection );\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t<td\n\t\t\t\tclassName=\"dataviews-view-table__checkbox-column\"\n\t\t\t\trole=\"presentation\"\n\t\t\t>\n\t\t\t\t<div className=\"dataviews-view-table__cell-content-wrapper\">\n\t\t\t\t\t<DataViewsSelectionCheckbox\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\tdisabled={ false }\n\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</td>\n\n\t\t\t{ hasPrimaryColumn && (\n\t\t\t\t<td role=\"presentation\">\n\t\t\t\t\t<ColumnPrimary\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\ttitleField={ showTitle ? titleField : undefined }\n\t\t\t\t\t\tmediaField={ showMedia ? mediaField : undefined }\n\t\t\t\t\t\tdescriptionField={\n\t\t\t\t\t\t\tshowDescription ? descriptionField : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisItemClickable={ () => false }\n\t\t\t\t\t/>\n\t\t\t\t</td>\n\t\t\t) }\n\t\t\t{ columns.map( ( column: string ) => {\n\t\t\t\t// Explicit picks the supported styles.\n\t\t\t\tconst { width, maxWidth, minWidth, align } =\n\t\t\t\t\tview.layout?.styles?.[ column ] ?? {};\n\n\t\t\t\treturn (\n\t\t\t\t\t<td\n\t\t\t\t\t\tkey={ column }\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\tmaxWidth,\n\t\t\t\t\t\t\tminWidth,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<TableColumnField\n\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\talign={ align }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Composite.Item>\n\t);\n}\n\nfunction ViewPickerTable< Item >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading = false,\n\tonChangeView,\n\tonChangeSelection,\n\tselection,\n\tsetOpenedFilter,\n\tview,\n\tclassName,\n\tempty,\n}: ViewPickerTableProps< Item > ) {\n\tconst headerMenuRefs = useRef<\n\t\tMap< string, { node: HTMLButtonElement; fallback: string } >\n\t>( new Map() );\n\tconst headerMenuToFocusRef = useRef< HTMLButtonElement >( undefined );\n\tconst [ nextHeaderMenuToFocus, setNextHeaderMenuToFocus ] =\n\t\tuseState< HTMLButtonElement >();\n\tconst isMultiselect = useIsMultiselectPicker( actions ) ?? false;\n\n\tuseEffect( () => {\n\t\tif ( headerMenuToFocusRef.current ) {\n\t\t\theaderMenuToFocusRef.current.focus();\n\t\t\theaderMenuToFocusRef.current = undefined;\n\t\t}\n\t} );\n\n\tconst tableNoticeId = useId();\n\n\tif ( nextHeaderMenuToFocus ) {\n\t\t// If we need to force focus, we short-circuit rendering here\n\t\t// to prevent any additional work while we handle that.\n\t\t// Clearing out the focus directive is necessary to make sure\n\t\t// future renders don't cause unexpected focus jumps.\n\t\theaderMenuToFocusRef.current = nextHeaderMenuToFocus;\n\t\tsetNextHeaderMenuToFocus( undefined );\n\t\treturn;\n\t}\n\n\tconst onHide = ( field: NormalizedField< Item > ) => {\n\t\tconst hidden = headerMenuRefs.current.get( field.id );\n\t\tconst fallback = hidden\n\t\t\t? headerMenuRefs.current.get( hidden.fallback )\n\t\t\t: undefined;\n\t\tsetNextHeaderMenuToFocus( fallback?.node );\n\t};\n\n\tconst hasData = !! data?.length;\n\n\tconst titleField = fields.find( ( field ) => field.id === view.titleField );\n\tconst mediaField = fields.find( ( field ) => field.id === view.mediaField );\n\tconst descriptionField = fields.find(\n\t\t( field ) => field.id === view.descriptionField\n\t);\n\n\tconst groupField = view.groupBy?.field\n\t\t? fields.find( ( f ) => f.id === view.groupBy?.field )\n\t\t: null;\n\tconst dataByGroup = groupField ? getDataByGroup( data, groupField ) : null;\n\tconst { showTitle = true, showMedia = true, showDescription = true } = view;\n\tconst hasPrimaryColumn =\n\t\t( titleField && showTitle ) ||\n\t\t( mediaField && showMedia ) ||\n\t\t( descriptionField && showDescription );\n\tconst columns = view.fields ?? [];\n\tconst headerMenuRef =\n\t\t( column: string, index: number ) => ( node: HTMLButtonElement ) => {\n\t\t\tif ( node ) {\n\t\t\t\theaderMenuRefs.current.set( column, {\n\t\t\t\t\tnode,\n\t\t\t\t\tfallback: columns[ index > 0 ? index - 1 : 1 ],\n\t\t\t\t} );\n\t\t\t} else {\n\t\t\t\theaderMenuRefs.current.delete( column );\n\t\t\t}\n\t\t};\n\tconst isInfiniteScroll = view.infiniteScrollEnabled && ! dataByGroup;\n\n\treturn (\n\t\t<>\n\t\t\t<table\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'dataviews-view-table',\n\t\t\t\t\t'dataviews-view-picker-table',\n\t\t\t\t\tclassName,\n\t\t\t\t\t{\n\t\t\t\t\t\t[ `has-${ view.layout?.density }-density` ]:\n\t\t\t\t\t\t\tview.layout?.density &&\n\t\t\t\t\t\t\t[ 'compact', 'comfortable' ].includes(\n\t\t\t\t\t\t\t\tview.layout.density\n\t\t\t\t\t\t\t),\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\taria-busy={ isLoading }\n\t\t\t\taria-describedby={ tableNoticeId }\n\t\t\t\trole={ isInfiniteScroll ? 'feed' : 'listbox' }\n\t\t\t>\n\t\t\t\t<thead role=\"presentation\">\n\t\t\t\t\t<tr\n\t\t\t\t\t\tclassName=\"dataviews-view-table__row\"\n\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<th className=\"dataviews-view-table__checkbox-column\">\n\t\t\t\t\t\t\t{ isMultiselect && (\n\t\t\t\t\t\t\t\t<BulkSelectionCheckbox\n\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</th>\n\t\t\t\t\t\t{ hasPrimaryColumn && (\n\t\t\t\t\t\t\t<th>\n\t\t\t\t\t\t\t\t{ titleField && (\n\t\t\t\t\t\t\t\t\t<ColumnHeaderMenu\n\t\t\t\t\t\t\t\t\t\tref={ headerMenuRef(\n\t\t\t\t\t\t\t\t\t\t\ttitleField.id,\n\t\t\t\t\t\t\t\t\t\t\t0\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\tfieldId={ titleField.id }\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t\t\t\t\tonHide={ onHide }\n\t\t\t\t\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t\t\t\t\t\tcanMove={ false }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ columns.map( ( column, index ) => {\n\t\t\t\t\t\t\t// Explicit picks the supported styles.\n\t\t\t\t\t\t\tconst { width, maxWidth, minWidth, align } =\n\t\t\t\t\t\t\t\tview.layout?.styles?.[ column ] ?? {};\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\tkey={ column }\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\t\t\t\tmaxWidth,\n\t\t\t\t\t\t\t\t\t\tminWidth,\n\t\t\t\t\t\t\t\t\t\ttextAlign: align,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\taria-sort={\n\t\t\t\t\t\t\t\t\t\tview.sort?.direction &&\n\t\t\t\t\t\t\t\t\t\tview.sort?.field === column\n\t\t\t\t\t\t\t\t\t\t\t? sortValues[ view.sort.direction ]\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ColumnHeaderMenu\n\t\t\t\t\t\t\t\t\t\tref={ headerMenuRef( column, index ) }\n\t\t\t\t\t\t\t\t\t\tfieldId={ column }\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t\t\t\t\tonHide={ onHide }\n\t\t\t\t\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t\t\t\t\t\tcanMove={\n\t\t\t\t\t\t\t\t\t\t\tview.layout?.enableMoving ?? true\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</th>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</tr>\n\t\t\t\t</thead>\n\t\t\t\t{ /* Render grouped data if groupBy is specified */ }\n\t\t\t\t{ hasData && groupField && dataByGroup ? (\n\t\t\t\t\tArray.from( dataByGroup.entries() ).map(\n\t\t\t\t\t\t( [ groupName, groupItems ] ) => (\n\t\t\t\t\t\t\t<Composite\n\t\t\t\t\t\t\t\tkey={ `group-${ groupName }` }\n\t\t\t\t\t\t\t\tvirtualFocus\n\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\trender={ <tbody role=\"group\" /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<tr\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-table__group-header-row\"\n\t\t\t\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t\t\tcolSpan={\n\t\t\t\t\t\t\t\t\t\t\tcolumns.length +\n\t\t\t\t\t\t\t\t\t\t\t( hasPrimaryColumn ? 1 : 0 ) +\n\t\t\t\t\t\t\t\t\t\t\t1\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-table__group-header-cell\"\n\t\t\t\t\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ view.groupBy?.showLabel === false\n\t\t\t\t\t\t\t\t\t\t\t? groupName\n\t\t\t\t\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t\t// translators: 1: The label of the field e.g. \"Date\". 2: The value of the field, e.g.: \"May 2022\".\n\t\t\t\t\t\t\t\t\t\t\t\t\t__( '%1$s: %2$s' ),\n\t\t\t\t\t\t\t\t\t\t\t\t\tgroupField.label,\n\t\t\t\t\t\t\t\t\t\t\t\t\tgroupName\n\t\t\t\t\t\t\t\t\t\t\t ) }\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t{ groupItems.map( ( item, index ) => (\n\t\t\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tid={\n\t\t\t\t\t\t\t\t\t\t\tgetItemId( item ) ||\n\t\t\t\t\t\t\t\t\t\t\tindex.toString()\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\t\t\tdescriptionField={ descriptionField }\n\t\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\t\t\tmultiselect={ isMultiselect }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</Composite>\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t) : (\n\t\t\t\t\t<Composite\n\t\t\t\t\t\trender={ <tbody role=\"presentation\" /> }\n\t\t\t\t\t\tvirtualFocus\n\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ hasData &&\n\t\t\t\t\t\t\tdata.map( ( item, index ) => (\n\t\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\tid={ getItemId( item ) || index.toString() }\n\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\t\tdescriptionField={ descriptionField }\n\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\t\tmultiselect={ isMultiselect }\n\t\t\t\t\t\t\t\t\tposinset={ index + 1 }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</Composite>\n\t\t\t\t) }\n\t\t\t</table>\n\t\t\t<div\n\t\t\t\tclassName={ clsx( {\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\tid={ tableNoticeId }\n\t\t\t>\n\t\t\t\t{ ! hasData &&\n\t\t\t\t\t( isLoading ? (\n\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t</p>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tempty\n\t\t\t\t\t) ) }\n\t\t\t\t{ hasData && isLoading && (\n\t\t\t\t\t<p className=\"dataviews-loading-more\">\n\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ViewPickerTable;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAA4B;AAC5B,wBAAmC;AACnC,qBAMO;AAKP,+BAA6B;AAC7B,0CAAuC;AACvC,qCAAuC;AACvC,oCAAsC;AACtC,uBAA2B;AAO3B,gCAA6B;AAC7B,4BAA0B;AAC1B,+BAA2B;
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Spinner, Composite } from '@wordpress/components';\nimport {\n\tuseContext,\n\tuseEffect,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../../dataviews-context';\nimport DataViewsSelectionCheckbox from '../../dataviews-selection-checkbox';\nimport { useIsMultiselectPicker } from '../../dataviews-picker-footer';\nimport { BulkSelectionCheckbox } from '../../dataviews-bulk-actions';\nimport { sortValues } from '../../../constants';\nimport type {\n\tNormalizedField,\n\tViewPickerTable as ViewPickerTableType,\n\tViewPickerTableProps,\n} from '../../../types';\nimport type { SetSelection } from '../../../types/private';\nimport ColumnHeaderMenu from '../table/column-header-menu';\nimport ColumnPrimary from '../table/column-primary';\nimport getDataByGroup from '../utils/get-data-by-group';\nimport { useIntersectionObserver } from '../utils/use-infinite-scroll';\n\ninterface TableColumnFieldProps< Item > {\n\tfields: NormalizedField< Item >[];\n\tcolumn: string;\n\titem: Item;\n\talign?: 'start' | 'center' | 'end';\n}\n\ninterface TableRowProps< Item > {\n\titem: Item;\n\tfields: NormalizedField< Item >[];\n\tid: string;\n\tview: ViewPickerTableType;\n\ttitleField?: NormalizedField< Item >;\n\tmediaField?: NormalizedField< Item >;\n\tdescriptionField?: NormalizedField< Item >;\n\tselection: string[];\n\tgetItemId: ( item: Item ) => string;\n\tonChangeSelection: SetSelection;\n\tmultiselect: boolean;\n\tposinset?: number;\n}\n\nfunction TableColumnField< Item >( {\n\titem,\n\tfields,\n\tcolumn,\n\talign,\n}: TableColumnFieldProps< Item > ) {\n\tconst field = fields.find( ( f ) => f.id === column );\n\n\tif ( ! field ) {\n\t\treturn null;\n\t}\n\n\tconst className = clsx( 'dataviews-view-table__cell-content-wrapper', {\n\t\t'dataviews-view-table__cell-align-end': align === 'end',\n\t\t'dataviews-view-table__cell-align-center': align === 'center',\n\t} );\n\n\treturn (\n\t\t<div className={ className }>\n\t\t\t<field.render item={ item } field={ field } />\n\t\t</div>\n\t);\n}\n\nfunction TableRow< Item >( {\n\titem,\n\tfields,\n\tid,\n\tview,\n\ttitleField,\n\tmediaField,\n\tdescriptionField,\n\tselection,\n\tgetItemId,\n\tonChangeSelection,\n\tmultiselect,\n\tposinset,\n}: TableRowProps< Item > ) {\n\tconst { paginationInfo } = useContext( DataViewsContext );\n\n\tconst isSelected = selection.includes( id );\n\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst elementRef = useRef< HTMLElement | null >( null );\n\n\tconst setElementRef = ( element: HTMLElement | null ) => {\n\t\telementRef.current = element;\n\t};\n\n\tuseIntersectionObserver( elementRef, posinset );\n\tconst {\n\t\tshowTitle = true,\n\t\tshowMedia = true,\n\t\tshowDescription = true,\n\t\tinfiniteScrollEnabled,\n\t} = view;\n\tconst handleMouseEnter = () => {\n\t\tsetIsHovered( true );\n\t};\n\tconst handleMouseLeave = () => {\n\t\tsetIsHovered( false );\n\t};\n\n\tconst columns = view.fields ?? [];\n\tconst hasPrimaryColumn =\n\t\t( titleField && showTitle ) ||\n\t\t( mediaField && showMedia ) ||\n\t\t( descriptionField && showDescription );\n\n\treturn (\n\t\t<Composite.Item\n\t\t\tkey={ id }\n\t\t\tref={ setElementRef }\n\t\t\trender={ ( { children, ...props } ) => (\n\t\t\t\t<tr\n\t\t\t\t\tclassName={ clsx( 'dataviews-view-table__row', {\n\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t'is-hovered': isHovered,\n\t\t\t\t\t} ) }\n\t\t\t\t\tonMouseEnter={ handleMouseEnter }\n\t\t\t\t\tonMouseLeave={ handleMouseLeave }\n\t\t\t\t\tchildren={ children }\n\t\t\t\t\t{ ...props }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\taria-selected={ isSelected }\n\t\t\taria-setsize={ paginationInfo.totalItems || undefined }\n\t\t\taria-posinset={ posinset }\n\t\t\trole={ infiniteScrollEnabled ? 'article' : 'option' }\n\t\t\tonClick={ () => {\n\t\t\t\t// Toggle in/out of selection array\n\t\t\t\tif ( isSelected ) {\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tconst newSelection = multiselect\n\t\t\t\t\t\t? [ ...selection, id ]\n\t\t\t\t\t\t: [ id ];\n\t\t\t\t\tonChangeSelection( newSelection );\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t<td\n\t\t\t\tclassName=\"dataviews-view-table__checkbox-column\"\n\t\t\t\trole=\"presentation\"\n\t\t\t>\n\t\t\t\t<div className=\"dataviews-view-table__cell-content-wrapper\">\n\t\t\t\t\t<DataViewsSelectionCheckbox\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\tdisabled={ false }\n\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</td>\n\n\t\t\t{ hasPrimaryColumn && (\n\t\t\t\t<td role=\"presentation\">\n\t\t\t\t\t<ColumnPrimary\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\ttitleField={ showTitle ? titleField : undefined }\n\t\t\t\t\t\tmediaField={ showMedia ? mediaField : undefined }\n\t\t\t\t\t\tdescriptionField={\n\t\t\t\t\t\t\tshowDescription ? descriptionField : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisItemClickable={ () => false }\n\t\t\t\t\t/>\n\t\t\t\t</td>\n\t\t\t) }\n\t\t\t{ columns.map( ( column: string ) => {\n\t\t\t\t// Explicit picks the supported styles.\n\t\t\t\tconst { width, maxWidth, minWidth, align } =\n\t\t\t\t\tview.layout?.styles?.[ column ] ?? {};\n\n\t\t\t\treturn (\n\t\t\t\t\t<td\n\t\t\t\t\t\tkey={ column }\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\tmaxWidth,\n\t\t\t\t\t\t\tminWidth,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<TableColumnField\n\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\tcolumn={ column }\n\t\t\t\t\t\t\talign={ align }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</td>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Composite.Item>\n\t);\n}\n\nfunction ViewPickerTable< Item >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading = false,\n\tonChangeView,\n\tonChangeSelection,\n\tselection,\n\tsetOpenedFilter,\n\tview,\n\tclassName,\n\tempty,\n}: ViewPickerTableProps< Item > ) {\n\tconst headerMenuRefs = useRef<\n\t\tMap< string, { node: HTMLButtonElement; fallback: string } >\n\t>( new Map() );\n\tconst headerMenuToFocusRef = useRef< HTMLButtonElement >( undefined );\n\tconst [ nextHeaderMenuToFocus, setNextHeaderMenuToFocus ] =\n\t\tuseState< HTMLButtonElement >();\n\tconst isMultiselect = useIsMultiselectPicker( actions ) ?? false;\n\n\tuseEffect( () => {\n\t\tif ( headerMenuToFocusRef.current ) {\n\t\t\theaderMenuToFocusRef.current.focus();\n\t\t\theaderMenuToFocusRef.current = undefined;\n\t\t}\n\t} );\n\n\tconst groupField = view.groupBy?.field\n\t\t? fields.find( ( f ) => f.id === view.groupBy?.field )\n\t\t: null;\n\tconst dataByGroup = groupField ? getDataByGroup( data, groupField ) : null;\n\tconst isInfiniteScroll = view.infiniteScrollEnabled && ! dataByGroup;\n\n\tconst tableNoticeId = useId();\n\n\tif ( nextHeaderMenuToFocus ) {\n\t\t// If we need to force focus, we short-circuit rendering here\n\t\t// to prevent any additional work while we handle that.\n\t\t// Clearing out the focus directive is necessary to make sure\n\t\t// future renders don't cause unexpected focus jumps.\n\t\theaderMenuToFocusRef.current = nextHeaderMenuToFocus;\n\t\tsetNextHeaderMenuToFocus( undefined );\n\t\treturn;\n\t}\n\n\tconst onHide = ( field: NormalizedField< Item > ) => {\n\t\tconst hidden = headerMenuRefs.current.get( field.id );\n\t\tconst fallback = hidden\n\t\t\t? headerMenuRefs.current.get( hidden.fallback )\n\t\t\t: undefined;\n\t\tsetNextHeaderMenuToFocus( fallback?.node );\n\t};\n\n\tconst hasData = !! data?.length;\n\n\tconst titleField = fields.find( ( field ) => field.id === view.titleField );\n\tconst mediaField = fields.find( ( field ) => field.id === view.mediaField );\n\tconst descriptionField = fields.find(\n\t\t( field ) => field.id === view.descriptionField\n\t);\n\n\tconst { showTitle = true, showMedia = true, showDescription = true } = view;\n\tconst hasPrimaryColumn =\n\t\t( titleField && showTitle ) ||\n\t\t( mediaField && showMedia ) ||\n\t\t( descriptionField && showDescription );\n\tconst columns = view.fields ?? [];\n\tconst headerMenuRef =\n\t\t( column: string, index: number ) => ( node: HTMLButtonElement ) => {\n\t\t\tif ( node ) {\n\t\t\t\theaderMenuRefs.current.set( column, {\n\t\t\t\t\tnode,\n\t\t\t\t\tfallback: columns[ index > 0 ? index - 1 : 1 ],\n\t\t\t\t} );\n\t\t\t} else {\n\t\t\t\theaderMenuRefs.current.delete( column );\n\t\t\t}\n\t\t};\n\n\treturn (\n\t\t<>\n\t\t\t<table\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'dataviews-view-table',\n\t\t\t\t\t'dataviews-view-picker-table',\n\t\t\t\t\tclassName,\n\t\t\t\t\t{\n\t\t\t\t\t\t[ `has-${ view.layout?.density }-density` ]:\n\t\t\t\t\t\t\tview.layout?.density &&\n\t\t\t\t\t\t\t[ 'compact', 'comfortable' ].includes(\n\t\t\t\t\t\t\t\tview.layout.density\n\t\t\t\t\t\t\t),\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\taria-busy={ isLoading }\n\t\t\t\taria-describedby={ tableNoticeId }\n\t\t\t\trole={ isInfiniteScroll ? 'feed' : 'listbox' }\n\t\t\t>\n\t\t\t\t<thead role=\"presentation\">\n\t\t\t\t\t<tr\n\t\t\t\t\t\tclassName=\"dataviews-view-table__row\"\n\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<th className=\"dataviews-view-table__checkbox-column\">\n\t\t\t\t\t\t\t{ isMultiselect && (\n\t\t\t\t\t\t\t\t<BulkSelectionCheckbox\n\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t\tdisableSelectAll={ isInfiniteScroll }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</th>\n\t\t\t\t\t\t{ hasPrimaryColumn && (\n\t\t\t\t\t\t\t<th>\n\t\t\t\t\t\t\t\t{ titleField && (\n\t\t\t\t\t\t\t\t\t<ColumnHeaderMenu\n\t\t\t\t\t\t\t\t\t\tref={ headerMenuRef(\n\t\t\t\t\t\t\t\t\t\t\ttitleField.id,\n\t\t\t\t\t\t\t\t\t\t\t0\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\tfieldId={ titleField.id }\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t\t\t\t\tonHide={ onHide }\n\t\t\t\t\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t\t\t\t\t\tcanMove={ false }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ columns.map( ( column, index ) => {\n\t\t\t\t\t\t\t// Explicit picks the supported styles.\n\t\t\t\t\t\t\tconst { width, maxWidth, minWidth, align } =\n\t\t\t\t\t\t\t\tview.layout?.styles?.[ column ] ?? {};\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\tkey={ column }\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\twidth,\n\t\t\t\t\t\t\t\t\t\tmaxWidth,\n\t\t\t\t\t\t\t\t\t\tminWidth,\n\t\t\t\t\t\t\t\t\t\ttextAlign: align,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\taria-sort={\n\t\t\t\t\t\t\t\t\t\tview.sort?.direction &&\n\t\t\t\t\t\t\t\t\t\tview.sort?.field === column\n\t\t\t\t\t\t\t\t\t\t\t? sortValues[ view.sort.direction ]\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tscope=\"col\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ColumnHeaderMenu\n\t\t\t\t\t\t\t\t\t\tref={ headerMenuRef( column, index ) }\n\t\t\t\t\t\t\t\t\t\tfieldId={ column }\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tonChangeView={ onChangeView }\n\t\t\t\t\t\t\t\t\t\tonHide={ onHide }\n\t\t\t\t\t\t\t\t\t\tsetOpenedFilter={ setOpenedFilter }\n\t\t\t\t\t\t\t\t\t\tcanMove={\n\t\t\t\t\t\t\t\t\t\t\tview.layout?.enableMoving ?? true\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</th>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</tr>\n\t\t\t\t</thead>\n\t\t\t\t{ /* Render grouped data if groupBy is specified */ }\n\t\t\t\t{ hasData && groupField && dataByGroup ? (\n\t\t\t\t\tArray.from( dataByGroup.entries() ).map(\n\t\t\t\t\t\t( [ groupName, groupItems ] ) => (\n\t\t\t\t\t\t\t<Composite\n\t\t\t\t\t\t\t\tkey={ `group-${ groupName }` }\n\t\t\t\t\t\t\t\tvirtualFocus\n\t\t\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\t\t\trender={ <tbody role=\"group\" /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<tr\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-table__group-header-row\"\n\t\t\t\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t\t\tcolSpan={\n\t\t\t\t\t\t\t\t\t\t\tcolumns.length +\n\t\t\t\t\t\t\t\t\t\t\t( hasPrimaryColumn ? 1 : 0 ) +\n\t\t\t\t\t\t\t\t\t\t\t1\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-table__group-header-cell\"\n\t\t\t\t\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ view.groupBy?.showLabel === false\n\t\t\t\t\t\t\t\t\t\t\t? groupName\n\t\t\t\t\t\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t\t// translators: 1: The label of the field e.g. \"Date\". 2: The value of the field, e.g.: \"May 2022\".\n\t\t\t\t\t\t\t\t\t\t\t\t\t__( '%1$s: %2$s' ),\n\t\t\t\t\t\t\t\t\t\t\t\t\tgroupField.label,\n\t\t\t\t\t\t\t\t\t\t\t\t\tgroupName\n\t\t\t\t\t\t\t\t\t\t\t ) }\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t\t\t{ groupItems.map( ( item, index ) => (\n\t\t\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tid={\n\t\t\t\t\t\t\t\t\t\t\tgetItemId( item ) ||\n\t\t\t\t\t\t\t\t\t\t\tindex.toString()\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\t\t\tdescriptionField={ descriptionField }\n\t\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\t\t\tmultiselect={ isMultiselect }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</Composite>\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t) : (\n\t\t\t\t\t<Composite\n\t\t\t\t\t\trender={ <tbody role=\"presentation\" /> }\n\t\t\t\t\t\tvirtualFocus\n\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ hasData &&\n\t\t\t\t\t\t\tdata.map( ( item, index ) => {\n\t\t\t\t\t\t\t\tconst itemId = getItemId( item );\n\t\t\t\t\t\t\t\t// Use position from item for accessibility in infinite scroll mode.\n\t\t\t\t\t\t\t\tconst posinset = ( item as any ).position;\n\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\t\t\tkey={ itemId }\n\t\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\t\tfields={ fields }\n\t\t\t\t\t\t\t\t\t\tid={ itemId || index.toString() }\n\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\t\t\tdescriptionField={ descriptionField }\n\t\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\t\t\t\t\tmultiselect={ isMultiselect }\n\t\t\t\t\t\t\t\t\t\tposinset={ posinset }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t</Composite>\n\t\t\t\t) }\n\t\t\t</table>\n\t\t\t<div\n\t\t\t\tclassName={ clsx( {\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\tid={ tableNoticeId }\n\t\t\t>\n\t\t\t\t{ ! hasData &&\n\t\t\t\t\t( isLoading ? (\n\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t</p>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tempty\n\t\t\t\t\t) ) }\n\t\t\t\t{ hasData && isLoading && (\n\t\t\t\t\t<p className=\"dataviews-loading-more\">\n\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ViewPickerTable;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["clsx", "DataViewsContext", "DataViewsSelectionCheckbox", "ColumnPrimary", "getDataByGroup", "ColumnHeaderMenu"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
|
|
30
|
+
// packages/dataviews/src/components/dataviews-layouts/utils/use-infinite-scroll.ts
|
|
31
|
+
var use_infinite_scroll_exports = {};
|
|
32
|
+
__export(use_infinite_scroll_exports, {
|
|
33
|
+
useIntersectionObserver: () => useIntersectionObserver,
|
|
34
|
+
usePlaceholdersNeeded: () => usePlaceholdersNeeded
|
|
35
|
+
});
|
|
36
|
+
module.exports = __toCommonJS(use_infinite_scroll_exports);
|
|
37
|
+
var import_element = require("@wordpress/element");
|
|
38
|
+
var import_dataviews_context = __toESM(require("../../dataviews-context/index.cjs"));
|
|
39
|
+
function useIntersectionObserver(elementRef, posinset) {
|
|
40
|
+
const { intersectionObserver } = (0, import_element.useContext)(import_dataviews_context.default);
|
|
41
|
+
(0, import_element.useEffect)(() => {
|
|
42
|
+
const element = elementRef.current;
|
|
43
|
+
if (!element || posinset === void 0 || !intersectionObserver) {
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
intersectionObserver.observe(element);
|
|
47
|
+
return () => {
|
|
48
|
+
intersectionObserver.unobserve(element);
|
|
49
|
+
};
|
|
50
|
+
}, [elementRef, intersectionObserver, posinset]);
|
|
51
|
+
}
|
|
52
|
+
function usePlaceholdersNeeded(data, isInfiniteScroll, gridColumns) {
|
|
53
|
+
const hasData = !!data?.length;
|
|
54
|
+
const firstItemPosition = hasData && isInfiniteScroll ? data[0].position : void 0;
|
|
55
|
+
return firstItemPosition && gridColumns ? (firstItemPosition - 1) % gridColumns : 0;
|
|
56
|
+
}
|
|
57
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
58
|
+
0 && (module.exports = {
|
|
59
|
+
useIntersectionObserver,
|
|
60
|
+
usePlaceholdersNeeded
|
|
61
|
+
});
|
|
62
|
+
//# sourceMappingURL=use-infinite-scroll.cjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/components/dataviews-layouts/utils/use-infinite-scroll.ts"],
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useContext, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../../dataviews-context';\n\n/**\n * Hook to set up an IntersectionObserver for infinite scroll items.\n * Observes the element and triggers the callback when the item becomes visible.\n *\n * @param elementRef - Ref to the DOM element to observe.\n * @param posinset - The position of the item in the set (1-based index).\n */\nexport function useIntersectionObserver(\n\telementRef: React.RefObject< HTMLElement | null >,\n\tposinset: number | undefined\n) {\n\tconst { intersectionObserver } = useContext( DataViewsContext );\n\n\tuseEffect( () => {\n\t\tconst element = elementRef.current;\n\t\tif ( ! element || posinset === undefined || ! intersectionObserver ) {\n\t\t\treturn;\n\t\t}\n\n\t\tintersectionObserver.observe( element );\n\n\t\treturn () => {\n\t\t\tintersectionObserver.unobserve( element );\n\t\t};\n\t}, [ elementRef, intersectionObserver, posinset ] );\n}\n\n/**\n * Hook to calculate the number of placeholder items needed for the first row\n * in an infinite scroll grid layout.\n *\n * When items are loaded starting from a position other than 1, placeholders\n * are needed to maintain proper grid alignment.\n *\n * @param data - The array of data items.\n * @param isInfiniteScroll - Whether infinite scroll is enabled.\n * @param gridColumns - The number of columns in the grid.\n * @return The number of placeholder items needed.\n */\nexport function usePlaceholdersNeeded< Item >(\n\tdata: Item[],\n\tisInfiniteScroll: boolean,\n\tgridColumns: number\n): number {\n\tconst hasData = !! data?.length;\n\tconst firstItemPosition =\n\t\thasData && isInfiniteScroll\n\t\t\t? ( data[ 0 ] as { position?: number } ).position\n\t\t\t: undefined;\n\n\treturn firstItemPosition && gridColumns\n\t\t? ( firstItemPosition - 1 ) % gridColumns\n\t\t: 0;\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAsC;AAKtC,+BAA6B;AAStB,SAAS,wBACf,YACA,UACC;AACD,QAAM,EAAE,qBAAqB,QAAI,2BAAY,yBAAAA,OAAiB;AAE9D,gCAAW,MAAM;AAChB,UAAM,UAAU,WAAW;AAC3B,QAAK,CAAE,WAAW,aAAa,UAAa,CAAE,sBAAuB;AACpE;AAAA,IACD;AAEA,yBAAqB,QAAS,OAAQ;AAEtC,WAAO,MAAM;AACZ,2BAAqB,UAAW,OAAQ;AAAA,IACzC;AAAA,EACD,GAAG,CAAE,YAAY,sBAAsB,QAAS,CAAE;AACnD;AAcO,SAAS,sBACf,MACA,kBACA,aACS;AACT,QAAM,UAAU,CAAC,CAAE,MAAM;AACzB,QAAM,oBACL,WAAW,mBACN,KAAM,CAAE,EAA6B,WACvC;AAEJ,SAAO,qBAAqB,eACvB,oBAAoB,KAAM,cAC5B;AACJ;",
|
|
6
|
+
"names": ["DataViewsContext"]
|
|
7
|
+
}
|
|
@@ -54,9 +54,25 @@ function BulkSelectionCheckbox({
|
|
|
54
54
|
selectedItems,
|
|
55
55
|
onChangeSelection,
|
|
56
56
|
data,
|
|
57
|
-
getItemId
|
|
57
|
+
getItemId,
|
|
58
|
+
disableSelectAll = false
|
|
58
59
|
}) {
|
|
60
|
+
const hasSelection = selection.length > 0;
|
|
59
61
|
const areAllSelected = selectedItems.length === data.length;
|
|
62
|
+
if (disableSelectAll) {
|
|
63
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
64
|
+
import_components.CheckboxControl,
|
|
65
|
+
{
|
|
66
|
+
className: "dataviews-view-table-selection-checkbox",
|
|
67
|
+
checked: hasSelection,
|
|
68
|
+
disabled: !hasSelection,
|
|
69
|
+
onChange: () => {
|
|
70
|
+
onChangeSelection([]);
|
|
71
|
+
},
|
|
72
|
+
"aria-label": (0, import_i18n.__)("Deselect all")
|
|
73
|
+
}
|
|
74
|
+
);
|
|
75
|
+
}
|
|
60
76
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
61
77
|
import_components.CheckboxControl,
|
|
62
78
|
{
|
|
@@ -130,13 +146,15 @@ function DataViewsPickerFooter() {
|
|
|
130
146
|
onChangeSelection,
|
|
131
147
|
getItemId,
|
|
132
148
|
actions = EMPTY_ARRAY,
|
|
133
|
-
paginationInfo
|
|
149
|
+
paginationInfo,
|
|
150
|
+
view
|
|
134
151
|
} = (0, import_element.useContext)(import_dataviews_context.default);
|
|
135
152
|
const isMultiselect = useIsMultiselectPicker(actions);
|
|
136
153
|
const message = (0, import_get_footer_message.default)(
|
|
137
154
|
selection.length,
|
|
138
155
|
data.length,
|
|
139
|
-
paginationInfo.totalItems
|
|
156
|
+
paginationInfo.totalItems,
|
|
157
|
+
!!view.infiniteScrollEnabled
|
|
140
158
|
);
|
|
141
159
|
const selectedItems = (0, import_element.useMemo)(
|
|
142
160
|
() => data.filter((item) => selection.includes(getItemId(item))),
|
|
@@ -166,7 +184,8 @@ function DataViewsPickerFooter() {
|
|
|
166
184
|
selectedItems,
|
|
167
185
|
onChangeSelection,
|
|
168
186
|
data,
|
|
169
|
-
getItemId
|
|
187
|
+
getItemId,
|
|
188
|
+
disableSelectAll: !!view.infiniteScrollEnabled
|
|
170
189
|
}
|
|
171
190
|
),
|
|
172
191
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "dataviews-bulk-actions-footer__item-count", children: message })
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/dataviews-picker-footer/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Button, CheckboxControl } from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useContext, useMemo, useState } from '@wordpress/element';\nimport { Stack } from '@wordpress/ui';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DataViewsPagination from '../dataviews-pagination';\nimport DataViewsContext from '../dataviews-context';\nimport type { SetSelection } from '../../types/private';\nimport type { Action } from '../../types';\nimport getFooterMessage from '../../utils/get-footer-message';\n\nconst EMPTY_ARRAY: [] = [];\n\nexport function useIsMultiselectPicker< Item >(\n\tactions: Action< Item >[] | undefined\n) {\n\treturn useMemo( () => {\n\t\treturn actions?.every( ( action ) => action.supportsBulk );\n\t}, [ actions ] );\n}\n\nfunction BulkSelectionCheckbox< Item >( {\n\tselection,\n\tselectedItems,\n\tonChangeSelection,\n\tdata,\n\tgetItemId,\n}: {\n\tselection: string[];\n\tselectedItems: Item[];\n\tonChangeSelection: SetSelection;\n\tdata: Item[];\n\tgetItemId: ( item: Item ) => string;\n} ) {\n\tconst areAllSelected = selectedItems.length === data.length;\n\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\tchecked={ areAllSelected }\n\t\t\tindeterminate={ ! areAllSelected && !! selectedItems.length }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( areAllSelected ) {\n\t\t\t\t\t// Deselect all - remove the current page from the total selection.\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.filter(\n\t\t\t\t\t\t\t( id ) =>\n\t\t\t\t\t\t\t\t! data.some(\n\t\t\t\t\t\t\t\t\t( item ) => id === getItemId( item )\n\t\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} else {\n\t\t\t\t\t// Select all - merge the current page into the total selection.\n\t\t\t\t\tconst selectionSet = new Set( [\n\t\t\t\t\t\t...selection,\n\t\t\t\t\t\t...data.map( ( item ) => getItemId( item ) ),\n\t\t\t\t\t] );\n\t\t\t\t\tonChangeSelection( Array.from( selectionSet ) );\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={\n\t\t\t\tareAllSelected ? __( 'Deselect all' ) : __( 'Select all' )\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction ActionButtons< Item >( {\n\tactions,\n\titems,\n\tselection,\n}: {\n\tactions: Action< Item >[];\n\titems: Item[];\n\tselection: string[];\n} ) {\n\tconst registry = useRegistry();\n\tconst [ actionInProgress, setActionInProgress ] = useState< string | null >(\n\t\tnull\n\t);\n\n\treturn (\n\t\t<Stack direction=\"row\" gap=\"xs\">\n\t\t\t{ actions.map( ( action ) => {\n\t\t\t\t// Only support actions with callbacks for DataViewsPicker.\n\t\t\t\t// This is because many use cases of the picker will be already within modals.\n\t\t\t\tif ( ! ( 'callback' in action ) ) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\n\t\t\t\tconst { id, label, icon, isPrimary, callback } = action;\n\n\t\t\t\tconst _label =\n\t\t\t\t\ttypeof label === 'string' ? label : label( items );\n\t\t\t\tconst variant = isPrimary ? 'primary' : 'tertiary';\n\t\t\t\tconst isInProgress = id === actionInProgress;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tdisabled={ isInProgress || ! selection?.length }\n\t\t\t\t\t\tisBusy={ isInProgress }\n\t\t\t\t\t\tonClick={ async () => {\n\t\t\t\t\t\t\tsetActionInProgress( id );\n\t\t\t\t\t\t\tawait callback( items, {\n\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tsetActionInProgress( null );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\tvariant={ variant }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ _label }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n}\n\nexport function DataViewsPickerFooter() {\n\tconst {\n\t\tdata,\n\t\tselection,\n\t\tonChangeSelection,\n\t\tgetItemId,\n\t\tactions = EMPTY_ARRAY,\n\t\tpaginationInfo,\n\t} = useContext( DataViewsContext );\n\n\tconst isMultiselect = useIsMultiselectPicker( actions );\n\n\tconst message = getFooterMessage(\n\t\tselection.length,\n\t\tdata.length,\n\t\tpaginationInfo.totalItems\n\t);\n\n\tconst selectedItems = useMemo(\n\t\t() =>\n\t\t\tdata.filter( ( item ) => selection.includes( getItemId( item ) ) ),\n\t\t[ selection, getItemId, data ]\n\t);\n\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"row\"\n\t\t\tjustify=\"space-between\"\n\t\t\talign=\"center\"\n\t\t\tclassName=\"dataviews-footer\"\n\t\t\tgap=\"sm\"\n\t\t>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\tclassName=\"dataviews-picker-footer__bulk-selection\"\n\t\t\t\tgap=\"md\"\n\t\t\t\talign=\"center\"\n\t\t\t>\n\t\t\t\t{ isMultiselect && (\n\t\t\t\t\t<BulkSelectionCheckbox\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\tselectedItems={ selectedItems }\n\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<span className=\"dataviews-bulk-actions-footer__item-count\">\n\t\t\t\t\t{ message }\n\t\t\t\t</span>\n\t\t\t</Stack>\n\t\t\t<DataViewsPagination />\n\t\t\t{ Boolean( actions?.length ) && (\n\t\t\t\t<div className=\"dataviews-picker-footer__actions\">\n\t\t\t\t\t<ActionButtons\n\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\titems={ selectedItems }\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Stack>\n\t);\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAwC;AACxC,kBAA4B;AAC5B,qBAA8C;AAC9C,gBAAsB;AACtB,kBAAmB;AAKnB,kCAAgC;AAChC,+BAA6B;AAG7B,gCAA6B;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { Button, CheckboxControl } from '@wordpress/components';\nimport { useRegistry } from '@wordpress/data';\nimport { useContext, useMemo, useState } from '@wordpress/element';\nimport { Stack } from '@wordpress/ui';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DataViewsPagination from '../dataviews-pagination';\nimport DataViewsContext from '../dataviews-context';\nimport type { SetSelection } from '../../types/private';\nimport type { Action } from '../../types';\nimport getFooterMessage from '../../utils/get-footer-message';\n\nconst EMPTY_ARRAY: [] = [];\n\nexport function useIsMultiselectPicker< Item >(\n\tactions: Action< Item >[] | undefined\n) {\n\treturn useMemo( () => {\n\t\treturn actions?.every( ( action ) => action.supportsBulk );\n\t}, [ actions ] );\n}\n\nfunction BulkSelectionCheckbox< Item >( {\n\tselection,\n\tselectedItems,\n\tonChangeSelection,\n\tdata,\n\tgetItemId,\n\tdisableSelectAll = false,\n}: {\n\tselection: string[];\n\tselectedItems: Item[];\n\tonChangeSelection: SetSelection;\n\tdata: Item[];\n\tgetItemId: ( item: Item ) => string;\n\tdisableSelectAll?: boolean;\n} ) {\n\tconst hasSelection = selection.length > 0;\n\tconst areAllSelected = selectedItems.length === data.length;\n\n\tif ( disableSelectAll ) {\n\t\treturn (\n\t\t\t<CheckboxControl\n\t\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\t\tchecked={ hasSelection }\n\t\t\t\tdisabled={ ! hasSelection }\n\t\t\t\tonChange={ () => {\n\t\t\t\t\tonChangeSelection( [] );\n\t\t\t\t} }\n\t\t\t\taria-label={ __( 'Deselect all' ) }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-view-table-selection-checkbox\"\n\t\t\tchecked={ areAllSelected }\n\t\t\tindeterminate={ ! areAllSelected && !! selectedItems.length }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( areAllSelected ) {\n\t\t\t\t\t// Deselect all - remove the current page from the total selection.\n\t\t\t\t\tonChangeSelection(\n\t\t\t\t\t\tselection.filter(\n\t\t\t\t\t\t\t( id ) =>\n\t\t\t\t\t\t\t\t! data.some(\n\t\t\t\t\t\t\t\t\t( item ) => id === getItemId( item )\n\t\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} else {\n\t\t\t\t\t// Select all - merge the current page into the total selection.\n\t\t\t\t\tconst selectionSet = new Set( [\n\t\t\t\t\t\t...selection,\n\t\t\t\t\t\t...data.map( ( item ) => getItemId( item ) ),\n\t\t\t\t\t] );\n\t\t\t\t\tonChangeSelection( Array.from( selectionSet ) );\n\t\t\t\t}\n\t\t\t} }\n\t\t\taria-label={\n\t\t\t\tareAllSelected ? __( 'Deselect all' ) : __( 'Select all' )\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction ActionButtons< Item >( {\n\tactions,\n\titems,\n\tselection,\n}: {\n\tactions: Action< Item >[];\n\titems: Item[];\n\tselection: string[];\n} ) {\n\tconst registry = useRegistry();\n\tconst [ actionInProgress, setActionInProgress ] = useState< string | null >(\n\t\tnull\n\t);\n\n\treturn (\n\t\t<Stack direction=\"row\" gap=\"xs\">\n\t\t\t{ actions.map( ( action ) => {\n\t\t\t\t// Only support actions with callbacks for DataViewsPicker.\n\t\t\t\t// This is because many use cases of the picker will be already within modals.\n\t\t\t\tif ( ! ( 'callback' in action ) ) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\n\t\t\t\tconst { id, label, icon, isPrimary, callback } = action;\n\n\t\t\t\tconst _label =\n\t\t\t\t\ttypeof label === 'string' ? label : label( items );\n\t\t\t\tconst variant = isPrimary ? 'primary' : 'tertiary';\n\t\t\t\tconst isInProgress = id === actionInProgress;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tdisabled={ isInProgress || ! selection?.length }\n\t\t\t\t\t\tisBusy={ isInProgress }\n\t\t\t\t\t\tonClick={ async () => {\n\t\t\t\t\t\t\tsetActionInProgress( id );\n\t\t\t\t\t\t\tawait callback( items, {\n\t\t\t\t\t\t\t\tregistry,\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tsetActionInProgress( null );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\tvariant={ variant }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ _label }\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</Stack>\n\t);\n}\n\nexport function DataViewsPickerFooter() {\n\tconst {\n\t\tdata,\n\t\tselection,\n\t\tonChangeSelection,\n\t\tgetItemId,\n\t\tactions = EMPTY_ARRAY,\n\t\tpaginationInfo,\n\t\tview,\n\t} = useContext( DataViewsContext );\n\n\tconst isMultiselect = useIsMultiselectPicker( actions );\n\n\tconst message = getFooterMessage(\n\t\tselection.length,\n\t\tdata.length,\n\t\tpaginationInfo.totalItems,\n\t\t!! view.infiniteScrollEnabled\n\t);\n\n\tconst selectedItems = useMemo(\n\t\t() =>\n\t\t\tdata.filter( ( item ) => selection.includes( getItemId( item ) ) ),\n\t\t[ selection, getItemId, data ]\n\t);\n\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"row\"\n\t\t\tjustify=\"space-between\"\n\t\t\talign=\"center\"\n\t\t\tclassName=\"dataviews-footer\"\n\t\t\tgap=\"sm\"\n\t\t>\n\t\t\t<Stack\n\t\t\t\tdirection=\"row\"\n\t\t\t\tclassName=\"dataviews-picker-footer__bulk-selection\"\n\t\t\t\tgap=\"md\"\n\t\t\t\talign=\"center\"\n\t\t\t>\n\t\t\t\t{ isMultiselect && (\n\t\t\t\t\t<BulkSelectionCheckbox\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\tselectedItems={ selectedItems }\n\t\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\t\tdata={ data }\n\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\tdisableSelectAll={ !! view.infiniteScrollEnabled }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<span className=\"dataviews-bulk-actions-footer__item-count\">\n\t\t\t\t\t{ message }\n\t\t\t\t</span>\n\t\t\t</Stack>\n\t\t\t<DataViewsPagination />\n\t\t\t{ Boolean( actions?.length ) && (\n\t\t\t\t<div className=\"dataviews-picker-footer__actions\">\n\t\t\t\t\t<ActionButtons\n\t\t\t\t\t\tactions={ actions }\n\t\t\t\t\t\titems={ selectedItems }\n\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Stack>\n\t);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["DataViewsContext", "getFooterMessage", "DataViewsPagination"]
|
|
7
7
|
}
|
|
@@ -59,7 +59,8 @@ var DataViewsSearch = (0, import_element.memo)(function Search({ label }) {
|
|
|
59
59
|
if (debouncedSearch !== viewRef.current?.search) {
|
|
60
60
|
onChangeViewRef.current({
|
|
61
61
|
...viewRef.current,
|
|
62
|
-
page: 1,
|
|
62
|
+
page: view.page ? 1 : void 0,
|
|
63
|
+
startPosition: view.startPosition ? 1 : void 0,
|
|
63
64
|
search: debouncedSearch
|
|
64
65
|
});
|
|
65
66
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/dataviews-search/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useEffect, useRef, memo, useContext } from '@wordpress/element';\nimport { SearchControl } from '@wordpress/components';\nimport { useDebouncedInput } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\n\ninterface SearchProps {\n\tlabel?: string;\n}\n\nconst DataViewsSearch = memo( function Search( { label }: SearchProps ) {\n\tconst { view, onChangeView } = useContext( DataViewsContext );\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput(\n\t\tview.search\n\t);\n\tuseEffect( () => {\n\t\tif ( view.search !== debouncedSearch ) {\n\t\t\tsetSearch( view.search ?? '' );\n\t\t}\n\t}, [ view.search, setSearch ] );\n\tconst onChangeViewRef = useRef( onChangeView );\n\tconst viewRef = useRef( view );\n\tuseEffect( () => {\n\t\tonChangeViewRef.current = onChangeView;\n\t\tviewRef.current = view;\n\t}, [ onChangeView, view ] );\n\tuseEffect( () => {\n\t\tif ( debouncedSearch !== viewRef.current?.search ) {\n\t\t\tonChangeViewRef.current( {\n\t\t\t\t...viewRef.current,\n\t\t\t\tpage: 1,\n\t\t\t\tsearch: debouncedSearch,\n\t\t\t} );\n\t\t}\n\t}, [ debouncedSearch ] );\n\tconst searchLabel = label || __( 'Search' );\n\treturn (\n\t\t<SearchControl\n\t\t\tclassName=\"dataviews-search\"\n\t\t\tonChange={ setSearch }\n\t\t\tvalue={ search }\n\t\t\tlabel={ searchLabel }\n\t\t\tplaceholder={ searchLabel }\n\t\t\tsize=\"compact\"\n\t\t/>\n\t);\n} );\n\nexport default DataViewsSearch;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AACnB,qBAAoD;AACpD,wBAA8B;AAC9B,qBAAkC;AAKlC,+BAA6B;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useEffect, useRef, memo, useContext } from '@wordpress/element';\nimport { SearchControl } from '@wordpress/components';\nimport { useDebouncedInput } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\n\ninterface SearchProps {\n\tlabel?: string;\n}\n\nconst DataViewsSearch = memo( function Search( { label }: SearchProps ) {\n\tconst { view, onChangeView } = useContext( DataViewsContext );\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput(\n\t\tview.search\n\t);\n\tuseEffect( () => {\n\t\tif ( view.search !== debouncedSearch ) {\n\t\t\tsetSearch( view.search ?? '' );\n\t\t}\n\t}, [ view.search, setSearch ] );\n\tconst onChangeViewRef = useRef( onChangeView );\n\tconst viewRef = useRef( view );\n\tuseEffect( () => {\n\t\tonChangeViewRef.current = onChangeView;\n\t\tviewRef.current = view;\n\t}, [ onChangeView, view ] );\n\tuseEffect( () => {\n\t\tif ( debouncedSearch !== viewRef.current?.search ) {\n\t\t\tonChangeViewRef.current( {\n\t\t\t\t...viewRef.current,\n\t\t\t\tpage: view.page ? 1 : undefined,\n\t\t\t\tstartPosition: view.startPosition ? 1 : undefined,\n\t\t\t\tsearch: debouncedSearch,\n\t\t\t} );\n\t\t}\n\t}, [ debouncedSearch ] );\n\tconst searchLabel = label || __( 'Search' );\n\treturn (\n\t\t<SearchControl\n\t\t\tclassName=\"dataviews-search\"\n\t\t\tonChange={ setSearch }\n\t\t\tvalue={ search }\n\t\t\tlabel={ searchLabel }\n\t\t\tplaceholder={ searchLabel }\n\t\t\tsize=\"compact\"\n\t\t/>\n\t);\n} );\n\nexport default DataViewsSearch;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAmB;AACnB,qBAAoD;AACpD,wBAA8B;AAC9B,qBAAkC;AAKlC,+BAA6B;AAkC3B;AA5BF,IAAM,sBAAkB,qBAAM,SAAS,OAAQ,EAAE,MAAM,GAAiB;AACvE,QAAM,EAAE,MAAM,aAAa,QAAI,2BAAY,yBAAAA,OAAiB;AAC5D,QAAM,CAAE,QAAQ,WAAW,eAAgB,QAAI;AAAA,IAC9C,KAAK;AAAA,EACN;AACA,gCAAW,MAAM;AAChB,QAAK,KAAK,WAAW,iBAAkB;AACtC,gBAAW,KAAK,UAAU,EAAG;AAAA,IAC9B;AAAA,EACD,GAAG,CAAE,KAAK,QAAQ,SAAU,CAAE;AAC9B,QAAM,sBAAkB,uBAAQ,YAAa;AAC7C,QAAM,cAAU,uBAAQ,IAAK;AAC7B,gCAAW,MAAM;AAChB,oBAAgB,UAAU;AAC1B,YAAQ,UAAU;AAAA,EACnB,GAAG,CAAE,cAAc,IAAK,CAAE;AAC1B,gCAAW,MAAM;AAChB,QAAK,oBAAoB,QAAQ,SAAS,QAAS;AAClD,sBAAgB,QAAS;AAAA,QACxB,GAAG,QAAQ;AAAA,QACX,MAAM,KAAK,OAAO,IAAI;AAAA,QACtB,eAAe,KAAK,gBAAgB,IAAI;AAAA,QACxC,QAAQ;AAAA,MACT,CAAE;AAAA,IACH;AAAA,EACD,GAAG,CAAE,eAAgB,CAAE;AACvB,QAAM,cAAc,aAAS,gBAAI,QAAS;AAC1C,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,UAAW;AAAA,MACX,OAAQ;AAAA,MACR,OAAQ;AAAA,MACR,aAAc;AAAA,MACd,MAAK;AAAA;AAAA,EACN;AAEF,CAAE;AAEF,IAAO,2BAAQ;",
|
|
6
6
|
"names": ["DataViewsContext"]
|
|
7
7
|
}
|
|
@@ -36,7 +36,8 @@ function DataViewsSelectionCheckbox({
|
|
|
36
36
|
...extraProps
|
|
37
37
|
}) {
|
|
38
38
|
const id = getItemId(item);
|
|
39
|
-
const
|
|
39
|
+
const isInSelectionArray = selection.includes(id);
|
|
40
|
+
const checked = !disabled && isInSelectionArray;
|
|
40
41
|
const selectionLabel = titleField?.getValue?.({ item }) || (0, import_i18n.__)("(no title)");
|
|
41
42
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
42
43
|
import_components.CheckboxControl,
|
|
@@ -50,7 +51,7 @@ function DataViewsSelectionCheckbox({
|
|
|
50
51
|
return;
|
|
51
52
|
}
|
|
52
53
|
onChangeSelection(
|
|
53
|
-
|
|
54
|
+
isInSelectionArray ? selection.filter((itemId) => id !== itemId) : [...selection, id]
|
|
54
55
|
);
|
|
55
56
|
},
|
|
56
57
|
...extraProps
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/dataviews-selection-checkbox/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { CheckboxControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { SetSelection } from '../../types/private';\nimport type { NormalizedField } from '../../types';\n\ninterface DataViewsSelectionCheckboxProps< Item > {\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\titem: Item;\n\tgetItemId: ( item: Item ) => string;\n\ttitleField?: NormalizedField< Item >;\n\tdisabled: boolean;\n\ttabIndex?: number;\n}\n\nexport default function DataViewsSelectionCheckbox< Item >( {\n\tselection,\n\tonChangeSelection,\n\titem,\n\tgetItemId,\n\ttitleField,\n\tdisabled,\n\t...extraProps\n}: DataViewsSelectionCheckboxProps< Item > ) {\n\tconst id = getItemId( item );\n\tconst
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAgC;AAChC,kBAAmB;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { CheckboxControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { SetSelection } from '../../types/private';\nimport type { NormalizedField } from '../../types';\n\ninterface DataViewsSelectionCheckboxProps< Item > {\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\titem: Item;\n\tgetItemId: ( item: Item ) => string;\n\ttitleField?: NormalizedField< Item >;\n\tdisabled: boolean;\n\ttabIndex?: number;\n}\n\nexport default function DataViewsSelectionCheckbox< Item >( {\n\tselection,\n\tonChangeSelection,\n\titem,\n\tgetItemId,\n\ttitleField,\n\tdisabled,\n\t...extraProps\n}: DataViewsSelectionCheckboxProps< Item > ) {\n\tconst id = getItemId( item );\n\tconst isInSelectionArray = selection.includes( id );\n\tconst checked = ! disabled && isInSelectionArray;\n\n\t// Fallback label to ensure accessibility\n\tconst selectionLabel =\n\t\ttitleField?.getValue?.( { item } ) || __( '(no title)' );\n\n\treturn (\n\t\t<CheckboxControl\n\t\t\tclassName=\"dataviews-selection-checkbox\"\n\t\t\taria-label={ selectionLabel }\n\t\t\taria-disabled={ disabled }\n\t\t\tchecked={ checked }\n\t\t\tonChange={ () => {\n\t\t\t\tif ( disabled ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\t// Toggle in/out of selection array\n\t\t\t\tonChangeSelection(\n\t\t\t\t\tisInSelectionArray\n\t\t\t\t\t\t? selection.filter( ( itemId ) => id !== itemId )\n\t\t\t\t\t\t: [ ...selection, id ]\n\t\t\t\t);\n\t\t\t} }\n\t\t\t{ ...extraProps }\n\t\t/>\n\t);\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAgC;AAChC,kBAAmB;AAoCjB;AAlBa,SAAR,2BAAqD;AAAA,EAC3D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACJ,GAA6C;AAC5C,QAAM,KAAK,UAAW,IAAK;AAC3B,QAAM,qBAAqB,UAAU,SAAU,EAAG;AAClD,QAAM,UAAU,CAAE,YAAY;AAG9B,QAAM,iBACL,YAAY,WAAY,EAAE,KAAK,CAAE,SAAK,gBAAI,YAAa;AAExD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,cAAa;AAAA,MACb,iBAAgB;AAAA,MAChB;AAAA,MACA,UAAW,MAAM;AAChB,YAAK,UAAW;AACf;AAAA,QACD;AAGA;AAAA,UACC,qBACG,UAAU,OAAQ,CAAE,WAAY,OAAO,MAAO,IAC9C,CAAE,GAAG,WAAW,EAAG;AAAA,QACvB;AAAA,MACD;AAAA,MACE,GAAG;AAAA;AAAA,EACN;AAEF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -45,7 +45,6 @@ var import_ui = require("@wordpress/ui");
|
|
|
45
45
|
var import_constants = require("../../constants.cjs");
|
|
46
46
|
var import_dataviews_layouts = require("../dataviews-layouts/index.cjs");
|
|
47
47
|
var import_dataviews_context = __toESM(require("../dataviews-context/index.cjs"));
|
|
48
|
-
var import_infinite_scroll_toggle = __toESM(require("./infinite-scroll-toggle.cjs"));
|
|
49
48
|
var import_properties_section = require("./properties-section.cjs");
|
|
50
49
|
var import_lock_unlock = require("../../lock-unlock.cjs");
|
|
51
50
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
@@ -342,7 +341,6 @@ function DataviewsViewConfigDropdown() {
|
|
|
342
341
|
}
|
|
343
342
|
),
|
|
344
343
|
!!activeLayout?.viewConfigOptions && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(activeLayout.viewConfigOptions, {}),
|
|
345
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_infinite_scroll_toggle.default, {}),
|
|
346
344
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ItemsPerPageControl, {}),
|
|
347
345
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_properties_section.PropertiesSection, {})
|
|
348
346
|
] })
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/dataviews-view-config/index.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { ChangeEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tDropdown,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n\tSelectControl,\n\t__experimentalHeading as Heading,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { memo, useContext, useMemo } from '@wordpress/element';\nimport { cog } from '@wordpress/icons';\nimport warning from '@wordpress/warning';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { SORTING_DIRECTIONS, sortIcons, sortLabels } from '../../constants';\nimport { VIEW_LAYOUTS } from '../dataviews-layouts';\nimport type { View } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport InfiniteScrollToggle from './infinite-scroll-toggle';\nimport { PropertiesSection } from './properties-section';\nimport { unlock } from '../../lock-unlock';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nconst DATAVIEWS_CONFIG_POPOVER_PROPS = {\n\tclassName: 'dataviews-config__popover',\n\tplacement: 'bottom-end',\n\toffset: 9,\n};\n\nexport function ViewTypeMenu() {\n\tconst { view, onChangeView, defaultLayouts } =\n\t\tuseContext( DataViewsContext );\n\tconst availableLayouts = Object.keys( defaultLayouts );\n\tif ( availableLayouts.length <= 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = VIEW_LAYOUTS.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<Menu>\n\t\t\t<Menu.TriggerButton\n\t\t\t\trender={\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ticon={ activeView?.icon }\n\t\t\t\t\t\tlabel={ __( 'Layout' ) }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Menu.Popover>\n\t\t\t\t{ availableLayouts.map( ( layout ) => {\n\t\t\t\t\tconst config = VIEW_LAYOUTS.find(\n\t\t\t\t\t\t( v ) => v.type === layout\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! config ) {\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<Menu.RadioItem\n\t\t\t\t\t\t\tkey={ layout }\n\t\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\t\tchecked={ layout === view.type }\n\t\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\te: ChangeEvent< HTMLInputElement >\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tswitch ( e.target.value ) {\n\t\t\t\t\t\t\t\t\tcase 'list':\n\t\t\t\t\t\t\t\t\tcase 'grid':\n\t\t\t\t\t\t\t\t\tcase 'table':\n\t\t\t\t\t\t\t\t\tcase 'pickerGrid':\n\t\t\t\t\t\t\t\t\tcase 'pickerTable':\n\t\t\t\t\t\t\t\t\tcase 'activity':\n\t\t\t\t\t\t\t\t\t\tconst viewWithoutLayout = { ...view };\n\t\t\t\t\t\t\t\t\t\tif ( 'layout' in viewWithoutLayout ) {\n\t\t\t\t\t\t\t\t\t\t\tdelete viewWithoutLayout.layout;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn onChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...viewWithoutLayout,\n\t\t\t\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t\t\t\t\t...defaultLayouts[ e.target.value ],\n\t\t\t\t\t\t\t\t\t\t} as View );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\twarning( 'Invalid dataview' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Menu.ItemLabel>{ config.label }</Menu.ItemLabel>\n\t\t\t\t\t\t</Menu.RadioItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</Menu.Popover>\n\t\t</Menu>\n\t);\n}\n\nfunction SortFieldControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\tconst orderOptions = useMemo( () => {\n\t\tconst sortableFields = fields.filter(\n\t\t\t( field ) => field.enableSorting !== false\n\t\t);\n\t\treturn sortableFields.map( ( field ) => {\n\t\t\treturn {\n\t\t\t\tlabel: field.label,\n\t\t\t\tvalue: field.id,\n\t\t\t};\n\t\t} );\n\t}, [ fields ] );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Sort by' ) }\n\t\t\tvalue={ view.sort?.field }\n\t\t\toptions={ orderOptions }\n\t\t\tonChange={ ( value: string ) => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tsort: {\n\t\t\t\t\t\tdirection: view?.sort?.direction || 'desc',\n\t\t\t\t\t\tfield: value,\n\t\t\t\t\t},\n\t\t\t\t\tshowLevels: false,\n\t\t\t\t} );\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction SortDirectionControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( sortableFields.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tlet value = view.sort?.direction;\n\tif ( ! value && view.sort?.field ) {\n\t\tvalue = 'desc';\n\t}\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tclassName=\"dataviews-view-config__sort-direction\"\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Order' ) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newDirection ) => {\n\t\t\t\tif ( newDirection === 'asc' || newDirection === 'desc' ) {\n\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t...view,\n\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\tdirection: newDirection,\n\t\t\t\t\t\t\tfield:\n\t\t\t\t\t\t\t\tview.sort?.field ||\n\t\t\t\t\t\t\t\t// If there is no field assigned as the sorting field assign the first sortable field.\n\t\t\t\t\t\t\t\tfields.find(\n\t\t\t\t\t\t\t\t\t( field ) => field.enableSorting !== false\n\t\t\t\t\t\t\t\t)?.id ||\n\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tshowLevels: false,\n\t\t\t\t\t} );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\twarning( 'Invalid direction' );\n\t\t\t} }\n\t\t>\n\t\t\t{ SORTING_DIRECTIONS.map( ( direction ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\tvalue={ direction }\n\t\t\t\t\t\ticon={ sortIcons[ direction ] }\n\t\t\t\t\t\tlabel={ sortLabels[ direction ] }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ItemsPerPageControl() {\n\tconst { view, config, onChangeView } = useContext( DataViewsContext );\n\tconst { infiniteScrollEnabled } = view;\n\tif (\n\t\t! config ||\n\t\t! config.perPageSizes ||\n\t\tconfig.perPageSizes.length < 2 ||\n\t\tconfig.perPageSizes.length > 6 ||\n\t\tinfiniteScrollEnabled\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Items per page' ) }\n\t\t\tvalue={ view.perPage || 10 }\n\t\t\tdisabled={ ! view?.sort?.field }\n\t\t\tonChange={ ( newItemsPerPage ) => {\n\t\t\t\tconst newItemsPerPageNumber =\n\t\t\t\t\ttypeof newItemsPerPage === 'number' ||\n\t\t\t\t\tnewItemsPerPage === undefined\n\t\t\t\t\t\t? newItemsPerPage\n\t\t\t\t\t\t: parseInt( newItemsPerPage, 10 );\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tperPage: newItemsPerPageNumber,\n\t\t\t\t\tpage: 1,\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ config.perPageSizes.map( ( value ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tlabel={ value.toString() }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ResetViewButton() {\n\tconst { onReset } = useContext( DataViewsContext );\n\n\t// Don't render if no persistence support (onReset is undefined)\n\tif ( onReset === undefined ) {\n\t\treturn null;\n\t}\n\n\tconst isDisabled = onReset === false;\n\n\treturn (\n\t\t<Button\n\t\t\tvariant=\"tertiary\"\n\t\t\tsize=\"compact\"\n\t\t\tdisabled={ isDisabled }\n\t\t\taccessibleWhenDisabled\n\t\t\tclassName=\"dataviews-view-config__reset-button\"\n\t\t\tonClick={ () => {\n\t\t\t\tif ( typeof onReset === 'function' ) {\n\t\t\t\t\tonReset();\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Reset view' ) }\n\t\t</Button>\n\t);\n}\n\nexport function DataviewsViewConfigDropdown() {\n\tconst { view, onReset } = useContext( DataViewsContext );\n\tconst popoverId = useInstanceId(\n\t\t_DataViewsViewConfig,\n\t\t'dataviews-view-config-dropdown'\n\t);\n\tconst activeLayout = VIEW_LAYOUTS.find(\n\t\t( layout ) => layout.type === view.type\n\t);\n\tconst isModified = typeof onReset === 'function';\n\treturn (\n\t\t<Dropdown\n\t\t\texpandOnMobile\n\t\t\tpopoverProps={ {\n\t\t\t\t...DATAVIEWS_CONFIG_POPOVER_PROPS,\n\t\t\t\tid: popoverId,\n\t\t\t} }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"dataviews-view-config__toggle-wrapper\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\ticon={ cog }\n\t\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t\t'View options',\n\t\t\t\t\t\t\t\t'View is used as a noun'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-expanded={ isOpen ? 'true' : 'false' }\n\t\t\t\t\t\t\taria-controls={ popoverId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ isModified && (\n\t\t\t\t\t\t\t<span className=\"dataviews-view-config__modified-indicator\" />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t\tclassName=\"dataviews-config__popover-content-wrapper\"\n\t\t\t\t>\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\tclassName=\"dataviews-view-config\"\n\t\t\t\t\t\tgap=\"xl\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\t\tclassName=\"dataviews-view-config__header\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-settings-section__title\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Appearance' ) }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t\t<ResetViewButton />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t<Stack direction=\"column\" gap=\"lg\">\n\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-config__sort-controls\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SortFieldControl />\n\t\t\t\t\t\t\t\t<SortDirectionControl />\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t\t{ !! activeLayout?.viewConfigOptions && (\n\t\t\t\t\t\t\t\t<activeLayout.viewConfigOptions />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<InfiniteScrollToggle />\n\t\t\t\t\t\t\t<ItemsPerPageControl />\n\t\t\t\t\t\t\t<PropertiesSection />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction _DataViewsViewConfig() {\n\treturn (\n\t\t<>\n\t\t\t<ViewTypeMenu />\n\t\t\t<DataviewsViewConfigDropdown />\n\t\t</>\n\t);\n}\n\nconst DataViewsViewConfig = memo( _DataViewsViewConfig );\n\nexport default DataViewsViewConfig;\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA,wBAUO;AACP,kBAAuB;AACvB,qBAA0C;AAC1C,mBAAoB;AACpB,qBAAoB;AACpB,qBAA8B;AAC9B,gBAAsB;AAKtB,uBAA0D;AAC1D,+BAA6B;AAE7B,+BAA6B;AAC7B,
|
|
6
|
-
"names": ["componentsPrivateApis", "DataViewsContext", "warning", "ToggleGroupControl", "ToggleGroupControlOptionIcon", "ToggleGroupControlOption", "DropdownContentWrapper", "Heading"
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport type { ChangeEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalDropdownContentWrapper as DropdownContentWrapper,\n\tDropdown,\n\t__experimentalToggleGroupControl as ToggleGroupControl,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n\tSelectControl,\n\t__experimentalHeading as Heading,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, _x } from '@wordpress/i18n';\nimport { memo, useContext, useMemo } from '@wordpress/element';\nimport { cog } from '@wordpress/icons';\nimport warning from '@wordpress/warning';\nimport { useInstanceId } from '@wordpress/compose';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { SORTING_DIRECTIONS, sortIcons, sortLabels } from '../../constants';\nimport { VIEW_LAYOUTS } from '../dataviews-layouts';\nimport type { View } from '../../types';\nimport DataViewsContext from '../dataviews-context';\nimport { PropertiesSection } from './properties-section';\nimport { unlock } from '../../lock-unlock';\n\nconst { Menu } = unlock( componentsPrivateApis );\n\nconst DATAVIEWS_CONFIG_POPOVER_PROPS = {\n\tclassName: 'dataviews-config__popover',\n\tplacement: 'bottom-end',\n\toffset: 9,\n};\n\nexport function ViewTypeMenu() {\n\tconst { view, onChangeView, defaultLayouts } =\n\t\tuseContext( DataViewsContext );\n\tconst availableLayouts = Object.keys( defaultLayouts );\n\tif ( availableLayouts.length <= 1 ) {\n\t\treturn null;\n\t}\n\tconst activeView = VIEW_LAYOUTS.find( ( v ) => view.type === v.type );\n\treturn (\n\t\t<Menu>\n\t\t\t<Menu.TriggerButton\n\t\t\t\trender={\n\t\t\t\t\t<Button\n\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\ticon={ activeView?.icon }\n\t\t\t\t\t\tlabel={ __( 'Layout' ) }\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Menu.Popover>\n\t\t\t\t{ availableLayouts.map( ( layout ) => {\n\t\t\t\t\tconst config = VIEW_LAYOUTS.find(\n\t\t\t\t\t\t( v ) => v.type === layout\n\t\t\t\t\t);\n\t\t\t\t\tif ( ! config ) {\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<Menu.RadioItem\n\t\t\t\t\t\t\tkey={ layout }\n\t\t\t\t\t\t\tvalue={ layout }\n\t\t\t\t\t\t\tname=\"view-actions-available-view\"\n\t\t\t\t\t\t\tchecked={ layout === view.type }\n\t\t\t\t\t\t\thideOnClick\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\te: ChangeEvent< HTMLInputElement >\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tswitch ( e.target.value ) {\n\t\t\t\t\t\t\t\t\tcase 'list':\n\t\t\t\t\t\t\t\t\tcase 'grid':\n\t\t\t\t\t\t\t\t\tcase 'table':\n\t\t\t\t\t\t\t\t\tcase 'pickerGrid':\n\t\t\t\t\t\t\t\t\tcase 'pickerTable':\n\t\t\t\t\t\t\t\t\tcase 'activity':\n\t\t\t\t\t\t\t\t\t\tconst viewWithoutLayout = { ...view };\n\t\t\t\t\t\t\t\t\t\tif ( 'layout' in viewWithoutLayout ) {\n\t\t\t\t\t\t\t\t\t\t\tdelete viewWithoutLayout.layout;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn onChangeView( {\n\t\t\t\t\t\t\t\t\t\t\t...viewWithoutLayout,\n\t\t\t\t\t\t\t\t\t\t\ttype: e.target.value,\n\t\t\t\t\t\t\t\t\t\t\t...defaultLayouts[ e.target.value ],\n\t\t\t\t\t\t\t\t\t\t} as View );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\twarning( 'Invalid dataview' );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Menu.ItemLabel>{ config.label }</Menu.ItemLabel>\n\t\t\t\t\t\t</Menu.RadioItem>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</Menu.Popover>\n\t\t</Menu>\n\t);\n}\n\nfunction SortFieldControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\tconst orderOptions = useMemo( () => {\n\t\tconst sortableFields = fields.filter(\n\t\t\t( field ) => field.enableSorting !== false\n\t\t);\n\t\treturn sortableFields.map( ( field ) => {\n\t\t\treturn {\n\t\t\t\tlabel: field.label,\n\t\t\t\tvalue: field.id,\n\t\t\t};\n\t\t} );\n\t}, [ fields ] );\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize\n\t\t\tlabel={ __( 'Sort by' ) }\n\t\t\tvalue={ view.sort?.field }\n\t\t\toptions={ orderOptions }\n\t\t\tonChange={ ( value: string ) => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tsort: {\n\t\t\t\t\t\tdirection: view?.sort?.direction || 'desc',\n\t\t\t\t\t\tfield: value,\n\t\t\t\t\t},\n\t\t\t\t\tshowLevels: false,\n\t\t\t\t} );\n\t\t\t} }\n\t\t/>\n\t);\n}\n\nfunction SortDirectionControl() {\n\tconst { view, fields, onChangeView } = useContext( DataViewsContext );\n\n\tconst sortableFields = fields.filter(\n\t\t( field ) => field.enableSorting !== false\n\t);\n\tif ( sortableFields.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tlet value = view.sort?.direction;\n\tif ( ! value && view.sort?.field ) {\n\t\tvalue = 'desc';\n\t}\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\tclassName=\"dataviews-view-config__sort-direction\"\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Order' ) }\n\t\t\tvalue={ value }\n\t\t\tonChange={ ( newDirection ) => {\n\t\t\t\tif ( newDirection === 'asc' || newDirection === 'desc' ) {\n\t\t\t\t\tonChangeView( {\n\t\t\t\t\t\t...view,\n\t\t\t\t\t\tsort: {\n\t\t\t\t\t\t\tdirection: newDirection,\n\t\t\t\t\t\t\tfield:\n\t\t\t\t\t\t\t\tview.sort?.field ||\n\t\t\t\t\t\t\t\t// If there is no field assigned as the sorting field assign the first sortable field.\n\t\t\t\t\t\t\t\tfields.find(\n\t\t\t\t\t\t\t\t\t( field ) => field.enableSorting !== false\n\t\t\t\t\t\t\t\t)?.id ||\n\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t},\n\t\t\t\t\t\tshowLevels: false,\n\t\t\t\t\t} );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\twarning( 'Invalid direction' );\n\t\t\t} }\n\t\t>\n\t\t\t{ SORTING_DIRECTIONS.map( ( direction ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOptionIcon\n\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\tvalue={ direction }\n\t\t\t\t\t\ticon={ sortIcons[ direction ] }\n\t\t\t\t\t\tlabel={ sortLabels[ direction ] }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ItemsPerPageControl() {\n\tconst { view, config, onChangeView } = useContext( DataViewsContext );\n\tconst { infiniteScrollEnabled } = view;\n\tif (\n\t\t! config ||\n\t\t! config.perPageSizes ||\n\t\tconfig.perPageSizes.length < 2 ||\n\t\tconfig.perPageSizes.length > 6 ||\n\t\tinfiniteScrollEnabled\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ToggleGroupControl\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ __( 'Items per page' ) }\n\t\t\tvalue={ view.perPage || 10 }\n\t\t\tdisabled={ ! view?.sort?.field }\n\t\t\tonChange={ ( newItemsPerPage ) => {\n\t\t\t\tconst newItemsPerPageNumber =\n\t\t\t\t\ttypeof newItemsPerPage === 'number' ||\n\t\t\t\t\tnewItemsPerPage === undefined\n\t\t\t\t\t\t? newItemsPerPage\n\t\t\t\t\t\t: parseInt( newItemsPerPage, 10 );\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tperPage: newItemsPerPageNumber,\n\t\t\t\t\tpage: 1,\n\t\t\t\t} );\n\t\t\t} }\n\t\t>\n\t\t\t{ config.perPageSizes.map( ( value ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\t\tkey={ value }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tlabel={ value.toString() }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ToggleGroupControl>\n\t);\n}\n\nfunction ResetViewButton() {\n\tconst { onReset } = useContext( DataViewsContext );\n\n\t// Don't render if no persistence support (onReset is undefined)\n\tif ( onReset === undefined ) {\n\t\treturn null;\n\t}\n\n\tconst isDisabled = onReset === false;\n\n\treturn (\n\t\t<Button\n\t\t\tvariant=\"tertiary\"\n\t\t\tsize=\"compact\"\n\t\t\tdisabled={ isDisabled }\n\t\t\taccessibleWhenDisabled\n\t\t\tclassName=\"dataviews-view-config__reset-button\"\n\t\t\tonClick={ () => {\n\t\t\t\tif ( typeof onReset === 'function' ) {\n\t\t\t\t\tonReset();\n\t\t\t\t}\n\t\t\t} }\n\t\t>\n\t\t\t{ __( 'Reset view' ) }\n\t\t</Button>\n\t);\n}\n\nexport function DataviewsViewConfigDropdown() {\n\tconst { view, onReset } = useContext( DataViewsContext );\n\tconst popoverId = useInstanceId(\n\t\t_DataViewsViewConfig,\n\t\t'dataviews-view-config-dropdown'\n\t);\n\tconst activeLayout = VIEW_LAYOUTS.find(\n\t\t( layout ) => layout.type === view.type\n\t);\n\tconst isModified = typeof onReset === 'function';\n\treturn (\n\t\t<Dropdown\n\t\t\texpandOnMobile\n\t\t\tpopoverProps={ {\n\t\t\t\t...DATAVIEWS_CONFIG_POPOVER_PROPS,\n\t\t\t\tid: popoverId,\n\t\t\t} }\n\t\t\trenderToggle={ ( { onToggle, isOpen } ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"dataviews-view-config__toggle-wrapper\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\ticon={ cog }\n\t\t\t\t\t\t\tlabel={ _x(\n\t\t\t\t\t\t\t\t'View options',\n\t\t\t\t\t\t\t\t'View is used as a noun'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-expanded={ isOpen ? 'true' : 'false' }\n\t\t\t\t\t\t\taria-controls={ popoverId }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ isModified && (\n\t\t\t\t\t\t\t<span className=\"dataviews-view-config__modified-indicator\" />\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t} }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper\n\t\t\t\t\tpaddingSize=\"medium\"\n\t\t\t\t\tclassName=\"dataviews-config__popover-content-wrapper\"\n\t\t\t\t>\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\tclassName=\"dataviews-view-config\"\n\t\t\t\t\t\tgap=\"xl\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\t\tclassName=\"dataviews-view-config__header\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tclassName=\"dataviews-settings-section__title\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'Appearance' ) }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t\t<ResetViewButton />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t<Stack direction=\"column\" gap=\"lg\">\n\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\t\t\t\tclassName=\"dataviews-view-config__sort-controls\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SortFieldControl />\n\t\t\t\t\t\t\t\t<SortDirectionControl />\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t\t{ !! activeLayout?.viewConfigOptions && (\n\t\t\t\t\t\t\t\t<activeLayout.viewConfigOptions />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t<ItemsPerPageControl />\n\t\t\t\t\t\t\t<PropertiesSection />\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t</Stack>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t/>\n\t);\n}\n\nfunction _DataViewsViewConfig() {\n\treturn (\n\t\t<>\n\t\t\t<ViewTypeMenu />\n\t\t\t<DataviewsViewConfigDropdown />\n\t\t</>\n\t);\n}\n\nconst DataViewsViewConfig = memo( _DataViewsViewConfig );\n\nexport default DataViewsViewConfig;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["componentsPrivateApis", "DataViewsContext", "warning", "ToggleGroupControl", "ToggleGroupControlOptionIcon", "ToggleGroupControlOption", "DropdownContentWrapper", "Heading"]
|
|
7
7
|
}
|
|
@@ -42,9 +42,6 @@ function InfiniteScrollToggle() {
|
|
|
42
42
|
const context = (0, import_element.useContext)(import_dataviews_context.default);
|
|
43
43
|
const { view, onChangeView } = context;
|
|
44
44
|
const infiniteScrollEnabled = view.infiniteScrollEnabled ?? false;
|
|
45
|
-
if (!context.hasInfiniteScrollHandler) {
|
|
46
|
-
return null;
|
|
47
|
-
}
|
|
48
45
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
49
46
|
import_components.ToggleControl,
|
|
50
47
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/dataviews-view-config/infinite-scroll-toggle.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { ToggleControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\n\nexport default function InfiniteScrollToggle() {\n\tconst context = useContext( DataViewsContext );\n\tconst { view, onChangeView } = context;\n\tconst infiniteScrollEnabled = view.infiniteScrollEnabled ?? false;\n\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAA8B;AAC9B,kBAAmB;AACnB,qBAA2B;AAK3B,+BAA6B;
|
|
4
|
+
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { ToggleControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DataViewsContext from '../dataviews-context';\n\nexport default function InfiniteScrollToggle() {\n\tconst context = useContext( DataViewsContext );\n\tconst { view, onChangeView } = context;\n\tconst infiniteScrollEnabled = view.infiniteScrollEnabled ?? false;\n\n\treturn (\n\t\t<ToggleControl\n\t\t\tlabel={ __( 'Enable infinite scroll' ) }\n\t\t\thelp={ __(\n\t\t\t\t'Automatically load more content as you scroll, instead of showing pagination links.'\n\t\t\t) }\n\t\t\tchecked={ infiniteScrollEnabled }\n\t\t\tonChange={ ( newValue ) => {\n\t\t\t\tonChangeView( {\n\t\t\t\t\t...view,\n\t\t\t\t\tinfiniteScrollEnabled: newValue,\n\t\t\t\t} );\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAA8B;AAC9B,kBAAmB;AACnB,qBAA2B;AAK3B,+BAA6B;AAQ3B;AANa,SAAR,uBAAwC;AAC9C,QAAM,cAAU,2BAAY,yBAAAA,OAAiB;AAC7C,QAAM,EAAE,MAAM,aAAa,IAAI;AAC/B,QAAM,wBAAwB,KAAK,yBAAyB;AAE5D,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAQ,gBAAI,wBAAyB;AAAA,MACrC,UAAO;AAAA,QACN;AAAA,MACD;AAAA,MACA,SAAU;AAAA,MACV,UAAW,CAAE,aAAc;AAC1B,qBAAc;AAAA,UACb,GAAG;AAAA,UACH,uBAAuB;AAAA,QACxB,CAAE;AAAA,MACH;AAAA;AAAA,EACD;AAEF;",
|
|
6
6
|
"names": ["DataViewsContext"]
|
|
7
7
|
}
|