{
  "version": 3,
  "sources": ["../../../../src/components/dataviews-layouts/picker-grid/index.tsx"],
  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\nimport type { ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tSpinner,\n\tFlex,\n\tFlexItem,\n\tprivateApis as componentsPrivateApis,\n\tComposite,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useContext, useRef } from '@wordpress/element';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../../lock-unlock';\nimport DataViewsSelectionCheckbox from '../../dataviews-selection-checkbox';\nimport DataViewsContext from '../../dataviews-context';\nimport { useIsMultiselectPicker } from '../../dataviews-picker-footer';\nimport type {\n\tNormalizedField,\n\tViewPickerGrid as ViewPickerGridType,\n\tViewPickerGridProps,\n} from '../../../types';\nimport type { SetSelection } from '../../../types/private';\nimport { GridItems } from '../utils/grid-items';\nconst { Badge } = unlock( componentsPrivateApis );\nimport getDataByGroup from '../utils/get-data-by-group';\nimport { useGridColumns } from '../grid/preview-size-picker';\nimport {\n\tuseIntersectionObserver,\n\tusePlaceholdersNeeded,\n} from '../utils/use-infinite-scroll';\n\ninterface GridItemProps< Item > {\n\tview: ViewPickerGridType;\n\tmultiselect?: boolean;\n\tselection: string[];\n\tonChangeSelection: SetSelection;\n\tgetItemId: ( item: Item ) => string;\n\titem: Item;\n\ttitleField?: NormalizedField< Item >;\n\tmediaField?: NormalizedField< Item >;\n\tdescriptionField?: NormalizedField< Item >;\n\tregularFields: NormalizedField< Item >[];\n\tbadgeFields: NormalizedField< Item >[];\n\tconfig: {\n\t\tsizes: string;\n\t};\n\tposinset?: number;\n\tsetsize?: number;\n}\n\nfunction GridItem< Item >( {\n\tview,\n\tmultiselect,\n\tselection,\n\tonChangeSelection,\n\tgetItemId,\n\titem,\n\tmediaField,\n\ttitleField,\n\tdescriptionField,\n\tregularFields,\n\tbadgeFields,\n\tconfig,\n\tposinset,\n\tsetsize,\n}: GridItemProps< Item > ) {\n\tconst { showTitle = true, showMedia = true, showDescription = true } = view;\n\tconst id = getItemId( item );\n\tconst elementRef = useRef< HTMLElement | null >( null );\n\n\tconst isSelected = selection.includes( id );\n\n\tconst setElementRef = ( element: HTMLElement | null ) => {\n\t\telementRef.current = element;\n\t};\n\n\tuseIntersectionObserver( elementRef, posinset );\n\n\tconst renderedMediaField = mediaField?.render ? (\n\t\t<mediaField.render\n\t\t\titem={ item }\n\t\t\tfield={ mediaField }\n\t\t\tconfig={ config }\n\t\t/>\n\t) : null;\n\tconst renderedTitleField =\n\t\tshowTitle && titleField?.render ? (\n\t\t\t<titleField.render item={ item } field={ titleField } />\n\t\t) : null;\n\n\treturn (\n\t\t<Composite.Item\n\t\t\tref={ setElementRef }\n\t\t\taria-label={\n\t\t\t\ttitleField\n\t\t\t\t\t? titleField.getValue( { item } ) || __( '(no title)' )\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\tkey={ id }\n\t\t\trender={ ( { children, ...props } ) => (\n\t\t\t\t<Stack direction=\"column\" children={ children } { ...props } />\n\t\t\t) }\n\t\t\trole=\"option\"\n\t\t\taria-posinset={ posinset }\n\t\t\taria-setsize={ setsize }\n\t\t\tclassName={ clsx( 'dataviews-view-picker-grid__card', {\n\t\t\t\t'is-selected': isSelected,\n\t\t\t} ) }\n\t\t\taria-selected={ isSelected }\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{ showMedia && renderedMediaField && (\n\t\t\t\t<div className=\"dataviews-view-picker-grid__media\">\n\t\t\t\t\t{ renderedMediaField }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ showMedia && renderedMediaField && (\n\t\t\t\t<DataViewsSelectionCheckbox\n\t\t\t\t\titem={ item }\n\t\t\t\t\tselection={ selection }\n\t\t\t\t\tonChangeSelection={ onChangeSelection }\n\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\tdisabled={ false }\n\t\t\t\t\taria-hidden\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ showTitle && (\n\t\t\t\t<Stack\n\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\tclassName=\"dataviews-view-picker-grid__title-actions\"\n\t\t\t\t>\n\t\t\t\t\t<div className=\"dataviews-view-picker-grid__title-field dataviews-title-field\">\n\t\t\t\t\t\t{ renderedTitleField }\n\t\t\t\t\t</div>\n\t\t\t\t</Stack>\n\t\t\t) }\n\t\t\t<Stack direction=\"column\" gap=\"xs\">\n\t\t\t\t{ showDescription && descriptionField?.render && (\n\t\t\t\t\t<descriptionField.render\n\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\tfield={ descriptionField }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ !! badgeFields?.length && (\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\tclassName=\"dataviews-view-picker-grid__badge-fields\"\n\t\t\t\t\t\tgap=\"sm\"\n\t\t\t\t\t\twrap=\"wrap\"\n\t\t\t\t\t\talign=\"top\"\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ badgeFields.map( ( field ) => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Badge\n\t\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-picker-grid__field-value\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<field.render\n\t\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\t\tfield={ field }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</Stack>\n\t\t\t\t) }\n\t\t\t\t{ !! regularFields?.length && (\n\t\t\t\t\t<Stack\n\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\tclassName=\"dataviews-view-picker-grid__fields\"\n\t\t\t\t\t\tgap=\"xs\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ regularFields.map( ( field ) => {\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-picker-grid__field\"\n\t\t\t\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\t\t\t\tgap={ 1 }\n\t\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\t\texpanded\n\t\t\t\t\t\t\t\t\tstyle={ { height: 'auto' } }\n\t\t\t\t\t\t\t\t\tdirection=\"row\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<FlexItem className=\"dataviews-view-picker-grid__field-name\">\n\t\t\t\t\t\t\t\t\t\t\t{ field.header }\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-picker-grid__field-value\"\n\t\t\t\t\t\t\t\t\t\t\tstyle={ { maxHeight: 'none' } }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<field.render\n\t\t\t\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\t\t\t\tfield={ field }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t</Flex>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</Stack>\n\t\t\t\t) }\n\t\t\t</Stack>\n\t\t</Composite.Item>\n\t);\n}\n\nfunction GridGroup< Item >( {\n\tgroupName,\n\tgroupField,\n\tshowLabel = true,\n\tchildren,\n}: {\n\tgroupName: string;\n\tgroupField: NormalizedField< Item >;\n\tshowLabel?: boolean;\n\tchildren: ReactNode;\n} ) {\n\tconst headerId = useInstanceId(\n\t\tGridGroup,\n\t\t'dataviews-view-picker-grid-group__header'\n\t);\n\treturn (\n\t\t<Stack\n\t\t\tdirection=\"column\"\n\t\t\tkey={ groupName }\n\t\t\tgap=\"sm\"\n\t\t\trole=\"group\"\n\t\t\taria-labelledby={ headerId }\n\t\t>\n\t\t\t<h3\n\t\t\t\tclassName=\"dataviews-view-picker-grid-group__header\"\n\t\t\t\tid={ headerId }\n\t\t\t>\n\t\t\t\t{ showLabel\n\t\t\t\t\t? sprintf(\n\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__( '%1$s: %2$s' ),\n\t\t\t\t\t\t\tgroupField.label,\n\t\t\t\t\t\t\tgroupName\n\t\t\t\t\t  )\n\t\t\t\t\t: groupName }\n\t\t\t</h3>\n\t\t\t{ children }\n\t\t</Stack>\n\t);\n}\n\nfunction ViewPickerGrid< Item >( {\n\tactions,\n\tdata,\n\tfields,\n\tgetItemId,\n\tisLoading,\n\tonChangeSelection,\n\tselection,\n\tview,\n\tclassName,\n\tempty,\n}: ViewPickerGridProps< Item > ) {\n\tconst { resizeObserverRef, paginationInfo, itemListLabel } =\n\t\tuseContext( DataViewsContext );\n\tconst titleField = fields.find(\n\t\t( field ) => field.id === view?.titleField\n\t);\n\tconst mediaField = fields.find(\n\t\t( field ) => field.id === view?.mediaField\n\t);\n\tconst descriptionField = fields.find(\n\t\t( field ) => field.id === view?.descriptionField\n\t);\n\tconst otherFields = view.fields ?? [];\n\tconst { regularFields, badgeFields } = otherFields.reduce(\n\t\t(\n\t\t\taccumulator: Record< string, NormalizedField< Item >[] >,\n\t\t\tfieldId\n\t\t) => {\n\t\t\tconst field = fields.find( ( f ) => f.id === fieldId );\n\t\t\tif ( ! field ) {\n\t\t\t\treturn accumulator;\n\t\t\t}\n\t\t\t// If the field is a badge field, add it to the badgeFields array\n\t\t\t// otherwise add it to the rest visibleFields array.\n\t\t\tconst key = view.layout?.badgeFields?.includes( fieldId )\n\t\t\t\t? 'badgeFields'\n\t\t\t\t: 'regularFields';\n\t\t\taccumulator[ key ].push( field );\n\t\t\treturn accumulator;\n\t\t},\n\t\t{ regularFields: [], badgeFields: [] }\n\t);\n\tconst hasData = !! data?.length;\n\tconst usedPreviewSize = view.layout?.previewSize;\n\tconst isMultiselect = useIsMultiselectPicker( actions );\n\n\t/*\n\t * This is the maximum width that an image can achieve in the grid. The reasoning is:\n\t * The biggest min image width available is 430px (see /dataviews-layouts/grid/preview-size-picker.tsx).\n\t * Because the grid is responsive, once there is room for another column, the images shrink to accommodate it.\n\t * So each image will never grow past 2*430px plus a little more to account for the gaps.\n\t */\n\tconst size = '900px';\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\n\tconst isInfiniteScroll =\n\t\t( view.infiniteScrollEnabled && ! dataByGroup ) ?? false;\n\n\tconst currentPage = view?.page ?? 1;\n\tconst perPage = view?.perPage ?? 0;\n\tconst setSize = isInfiniteScroll ? paginationInfo?.totalItems : undefined;\n\n\t// Calculate placeholders needed for infinite scroll\n\tconst gridColumns = useGridColumns();\n\tconst placeholdersNeeded = usePlaceholdersNeeded(\n\t\tdata,\n\t\tisInfiniteScroll,\n\t\tgridColumns\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{\n\t\t\t\t// Render multiple groups.\n\t\t\t\thasData && groupField && dataByGroup && (\n\t\t\t\t\t<Composite\n\t\t\t\t\t\tvirtualFocus\n\t\t\t\t\t\torientation=\"horizontal\"\n\t\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\t\taria-multiselectable={ isMultiselect }\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'dataviews-view-picker-grid',\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t[ `has-${ view.layout?.density }-density` ]:\n\t\t\t\t\t\t\t\t\tview.layout?.density &&\n\t\t\t\t\t\t\t\t\t[ 'compact', 'comfortable' ].includes(\n\t\t\t\t\t\t\t\t\t\tview.layout.density\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\taria-label={ itemListLabel }\n\t\t\t\t\t\trender={ ( { children, ...props } ) => (\n\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\t\t\tgap=\"lg\"\n\t\t\t\t\t\t\t\tchildren={ children }\n\t\t\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Array.from( dataByGroup.entries() ).map(\n\t\t\t\t\t\t\t( [ groupName, groupItems ] ) => (\n\t\t\t\t\t\t\t\t<GridGroup\n\t\t\t\t\t\t\t\t\tkey={ groupName }\n\t\t\t\t\t\t\t\t\tgroupName={ groupName }\n\t\t\t\t\t\t\t\t\tgroupField={ groupField }\n\t\t\t\t\t\t\t\t\tshowLabel={\n\t\t\t\t\t\t\t\t\t\tview.groupBy?.showLabel !== 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\t\t<GridItems\n\t\t\t\t\t\t\t\t\t\tpreviewSize={ usedPreviewSize }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tgridTemplateColumns:\n\t\t\t\t\t\t\t\t\t\t\t\tusedPreviewSize &&\n\t\t\t\t\t\t\t\t\t\t\t\t`repeat(auto-fill, minmax(${ usedPreviewSize }px, 1fr))`,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t\t\t\t\t\t\tref={\n\t\t\t\t\t\t\t\t\t\t\tresizeObserverRef as React.RefObject< HTMLDivElement >\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ groupItems.map( ( item ) => {\n\t\t\t\t\t\t\t\t\t\t\t// Use position from item if available (infinite scroll), otherwise calculate.\n\t\t\t\t\t\t\t\t\t\t\tconst posInSet =\n\t\t\t\t\t\t\t\t\t\t\t\t( item as any ).position ??\n\t\t\t\t\t\t\t\t\t\t\t\t( currentPage - 1 ) * perPage +\n\t\t\t\t\t\t\t\t\t\t\t\t\tdata.indexOf( item ) +\n\t\t\t\t\t\t\t\t\t\t\t\t\t1;\n\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\t\t\t\t\tmultiselect={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisMultiselect\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselection={ selection }\n\t\t\t\t\t\t\t\t\t\t\t\t\tonChangeSelection={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChangeSelection\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\t\t\t\t\t\t\t\tdescriptionField={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdescriptionField\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tregularFields={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tregularFields\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tbadgeFields={ badgeFields }\n\t\t\t\t\t\t\t\t\t\t\t\t\tconfig={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsizes: size,\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tposinset={ posInSet }\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetsize={ setSize }\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t\t\t</GridItems>\n\t\t\t\t\t\t\t\t</GridGroup>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Composite>\n\t\t\t\t)\n\t\t\t}\n\n\t\t\t{\n\t\t\t\t// Render a single grid with all data.\n\t\t\t\thasData && ! dataByGroup && (\n\t\t\t\t\t<Composite\n\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t<GridItems\n\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t'dataviews-view-picker-grid',\n\t\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t[ `has-${ view.layout?.density }-density` ]:\n\t\t\t\t\t\t\t\t\t\t\tview.layout?.density &&\n\t\t\t\t\t\t\t\t\t\t\t[\n\t\t\t\t\t\t\t\t\t\t\t\t'compact',\n\t\t\t\t\t\t\t\t\t\t\t\t'comfortable',\n\t\t\t\t\t\t\t\t\t\t\t].includes( view.layout.density ),\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\tpreviewSize={ usedPreviewSize }\n\t\t\t\t\t\t\t\taria-busy={ isLoading }\n\t\t\t\t\t\t\t\tref={\n\t\t\t\t\t\t\t\t\tresizeObserverRef as React.RefObject< HTMLDivElement >\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvirtualFocus\n\t\t\t\t\t\torientation=\"horizontal\"\n\t\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\t\taria-multiselectable={ isMultiselect }\n\t\t\t\t\t\taria-label={ itemListLabel }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ /* Render placeholders for unloaded items in first row */ }\n\t\t\t\t\t\t{ Array.from( { length: placeholdersNeeded } ).map(\n\t\t\t\t\t\t\t( _, index ) => (\n\t\t\t\t\t\t\t\t<Composite.Item\n\t\t\t\t\t\t\t\t\tkey={ `placeholder-${ index }` }\n\t\t\t\t\t\t\t\t\trender={ ( { children, ...props } ) => (\n\t\t\t\t\t\t\t\t\t\t<Stack\n\t\t\t\t\t\t\t\t\t\t\tdirection=\"column\"\n\t\t\t\t\t\t\t\t\t\t\tchildren={ children }\n\t\t\t\t\t\t\t\t\t\t\t{ ...props }\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\trole=\"option\"\n\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t\t\t\t\tclassName=\"dataviews-view-picker-grid__card dataviews-view-picker-grid__placeholder\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ data.map( ( item ) => {\n\t\t\t\t\t\t\t// Use position from item for accessibility in infinite scroll mode.\n\t\t\t\t\t\t\tconst posinset = ( item as any ).position;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<GridItem\n\t\t\t\t\t\t\t\t\tkey={ getItemId( item ) }\n\t\t\t\t\t\t\t\t\tview={ view }\n\t\t\t\t\t\t\t\t\tmultiselect={ isMultiselect }\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\tgetItemId={ getItemId }\n\t\t\t\t\t\t\t\t\titem={ item }\n\t\t\t\t\t\t\t\t\tmediaField={ mediaField }\n\t\t\t\t\t\t\t\t\ttitleField={ titleField }\n\t\t\t\t\t\t\t\t\tdescriptionField={ descriptionField }\n\t\t\t\t\t\t\t\t\tregularFields={ regularFields }\n\t\t\t\t\t\t\t\t\tbadgeFields={ badgeFields }\n\t\t\t\t\t\t\t\t\tconfig={ {\n\t\t\t\t\t\t\t\t\t\tsizes: size,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tposinset={ posinset }\n\t\t\t\t\t\t\t\t\tsetsize={ setSize }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</Composite>\n\t\t\t\t)\n\t\t\t}\n\t\t\t{\n\t\t\t\t// Render empty state.\n\t\t\t\t! hasData && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ clsx( {\n\t\t\t\t\t\t\t'dataviews-loading': isLoading,\n\t\t\t\t\t\t\t'dataviews-no-results': ! isLoading,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ isLoading ? (\n\t\t\t\t\t\t\t<p>\n\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\tempty\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\t{ hasData && isLoading && (\n\t\t\t\t<p className=\"dataviews-loading-more\">\n\t\t\t\t\t<Spinner />\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default ViewPickerGrid;\n"],
  "mappings": "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",
  "names": ["componentsPrivateApis", "clsx", "DataViewsSelectionCheckbox", "DataViewsContext", "getDataByGroup"]
}
