@wordpress/edit-site 5.19.3 → 5.20.0

package/build-module/components/block-editor/block-editor-provider/use-page-content-blocks.js.map

@@ -1 +1 @@
-{"version":3,"names":["useMemo","createBlock","PAGE_CONTENT_BLOCK_TYPES","flattenBlocks","blocks","transform","result","i","length","includes","name","transformedBlock","push","innerBlocks","usePageContentBlocks","isPageContentFocused","layout","type","style","spacing","margin","top","block"],"sources":["@wordpress/edit-site/src/components/block-editor/block-editor-provider/use-page-content-blocks.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { createBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { PAGE_CONTENT_BLOCK_TYPES } from '../../../utils/constants';\n\n/**\n * Helper method to iterate through all blocks, recursing into allowed inner blocks.\n * Returns a flattened object of transformed blocks.\n *\n * @param {Array}    blocks    Blocks to flatten.\n * @param {Function} transform Transforming function to be applied to each block. If transform returns `undefined`, the block is skipped.\n *\n * @return {Array} Flattened object.\n */\nfunction flattenBlocks( blocks, transform ) {\n\tconst result = [];\n\tfor ( let i = 0; i < blocks.length; i++ ) {\n\t\t// Since the Query Block could contain PAGE_CONTENT_BLOCK_TYPES block types,\n\t\t// we skip it because we only want to render stand-alone page content blocks in the block list.\n\t\tif ( [ 'core/query' ].includes( blocks[ i ].name ) ) {\n\t\t\tcontinue;\n\t\t}\n\t\tconst transformedBlock = transform( blocks[ i ] );\n\t\tif ( transformedBlock ) {\n\t\t\tresult.push( transformedBlock );\n\t\t}\n\t\tresult.push( ...flattenBlocks( blocks[ i ].innerBlocks, transform ) );\n\t}\n\n\treturn result;\n}\n\n/**\n * Returns a memoized array of blocks that contain only page content blocks,\n * surrounded by a group block to mimic the post editor.\n *\n * @param {Array}   blocks               Block list.\n * @param {boolean} isPageContentFocused Whether the page content has focus. If `true` return page content blocks. Default `false`.\n *\n * @return {Array} Page content blocks.\n */\nexport default function usePageContentBlocks(\n\tblocks,\n\tisPageContentFocused = false\n) {\n\treturn useMemo( () => {\n\t\tif ( ! isPageContentFocused || ! blocks || ! blocks.length ) {\n\t\t\treturn [];\n\t\t}\n\t\treturn [\n\t\t\tcreateBlock(\n\t\t\t\t'core/group',\n\t\t\t\t{\n\t\t\t\t\tlayout: { type: 'constrained' },\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\tspacing: {\n\t\t\t\t\t\t\tmargin: {\n\t\t\t\t\t\t\t\ttop: '4em', // Mimics the post editor.\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tflattenBlocks( blocks, ( block ) => {\n\t\t\t\t\tif ( PAGE_CONTENT_BLOCK_TYPES[ block.name ] ) {\n\t\t\t\t\t\treturn createBlock( block.name );\n\t\t\t\t\t}\n\t\t\t\t} )\n\t\t\t),\n\t\t];\n\t}, [ blocks, isPageContentFocused ] );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,WAAW,QAAQ,mBAAmB;;AAE/C;AACA;AACA;AACA,SAASC,wBAAwB,QAAQ,0BAA0B;;AAEnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,aAAaA,CAAEC,MAAM,EAAEC,SAAS,EAAG;EAC3C,MAAMC,MAAM,GAAG,EAAE;EACjB,KAAM,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,MAAM,CAACI,MAAM,EAAED,CAAC,EAAE,EAAG;IACzC;IACA;IACA,IAAK,CAAE,YAAY,CAAE,CAACE,QAAQ,CAAEL,MAAM,CAAEG,CAAC,CAAE,CAACG,IAAK,CAAC,EAAG;MACpD;IACD;IACA,MAAMC,gBAAgB,GAAGN,SAAS,CAAED,MAAM,CAAEG,CAAC,CAAG,CAAC;IACjD,IAAKI,gBAAgB,EAAG;MACvBL,MAAM,CAACM,IAAI,CAAED,gBAAiB,CAAC;IAChC;IACAL,MAAM,CAACM,IAAI,CAAE,GAAGT,aAAa,CAAEC,MAAM,CAAEG,CAAC,CAAE,CAACM,WAAW,EAAER,SAAU,CAAE,CAAC;EACtE;EAEA,OAAOC,MAAM;AACd;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASQ,oBAAoBA,CAC3CV,MAAM,EACNW,oBAAoB,GAAG,KAAK,EAC3B;EACD,OAAOf,OAAO,CAAE,MAAM;IACrB,IAAK,CAAEe,oBAAoB,IAAI,CAAEX,MAAM,IAAI,CAAEA,MAAM,CAACI,MAAM,EAAG;MAC5D,OAAO,EAAE;IACV;IACA,OAAO,CACNP,WAAW,CACV,YAAY,EACZ;MACCe,MAAM,EAAE;QAAEC,IAAI,EAAE;MAAc,CAAC;MAC/BC,KAAK,EAAE;QACNC,OAAO,EAAE;UACRC,MAAM,EAAE;YACPC,GAAG,EAAE,KAAK,CAAE;UACb;QACD;MACD;IACD,CAAC,EACDlB,aAAa,CAAEC,MAAM,EAAIkB,KAAK,IAAM;MACnC,IAAKpB,wBAAwB,CAAEoB,KAAK,CAACZ,IAAI,CAAE,EAAG;QAC7C,OAAOT,WAAW,CAAEqB,KAAK,CAACZ,IAAK,CAAC;MACjC;IACD,CAAE,CACH,CAAC,CACD;EACF,CAAC,EAAE,CAAEN,MAAM,EAAEW,oBAAoB,CAAG,CAAC;AACtC"}
+{"version":3,"names":["useMemo","createBlock","PAGE_CONTENT_BLOCK_TYPES","flattenBlocks","blocks","transform","result","i","length","includes","name","transformedBlock","push","innerBlocks","usePageContentBlocks","isPageContentFocused","wrapPageContent","block","undefined","layout","type","style","spacing","margin","top"],"sources":["@wordpress/edit-site/src/components/block-editor/block-editor-provider/use-page-content-blocks.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport { createBlock } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { PAGE_CONTENT_BLOCK_TYPES } from '../../../utils/constants';\n\n/**\n * Helper method to iterate through all blocks, recursing into allowed inner blocks.\n * Returns a flattened object of transformed blocks.\n *\n * @param {Array}    blocks    Blocks to flatten.\n * @param {Function} transform Transforming function to be applied to each block. If transform returns `undefined`, the block is skipped.\n *\n * @return {Array} Flattened object.\n */\nfunction flattenBlocks( blocks, transform ) {\n\tconst result = [];\n\tfor ( let i = 0; i < blocks.length; i++ ) {\n\t\t// Since the Query Block could contain PAGE_CONTENT_BLOCK_TYPES block types,\n\t\t// we skip it because we only want to render stand-alone page content blocks in the block list.\n\t\tif ( [ 'core/query' ].includes( blocks[ i ].name ) ) {\n\t\t\tcontinue;\n\t\t}\n\t\tconst transformedBlock = transform( blocks[ i ] );\n\t\tif ( transformedBlock ) {\n\t\t\tresult.push( transformedBlock );\n\t\t}\n\t\tresult.push( ...flattenBlocks( blocks[ i ].innerBlocks, transform ) );\n\t}\n\n\treturn result;\n}\n\n/**\n * Returns a memoized array of blocks that contain only page content blocks,\n * surrounded by an optional group block to mimic the post editor.\n *\n * @param {Object}  props                      The argument for the function.\n * @param {Array}   props.blocks               Block list.\n * @param {boolean} props.isPageContentFocused Whether the page content has focus (and the surrounding template is inert). If `true` return page content blocks. Default `false`.\n * @param {boolean} props.wrapPageContent      Whether to wrap the page content blocks in a group block to mimic the post editor. Default `false`.\n * @return {Array} Page content blocks.\n */\nexport default function usePageContentBlocks( {\n\tblocks = [],\n\tisPageContentFocused = false,\n\twrapPageContent = false,\n} ) {\n\treturn useMemo( () => {\n\t\tif ( ! isPageContentFocused || ! blocks?.length ) {\n\t\t\treturn [];\n\t\t}\n\n\t\tconst innerBlocks = flattenBlocks( blocks, ( block ) =>\n\t\t\tPAGE_CONTENT_BLOCK_TYPES[ block.name ]\n\t\t\t\t? createBlock( block.name )\n\t\t\t\t: undefined\n\t\t);\n\n\t\tif ( ! innerBlocks.length ) {\n\t\t\treturn [];\n\t\t}\n\n\t\tif ( ! wrapPageContent ) {\n\t\t\treturn innerBlocks;\n\t\t}\n\n\t\treturn [\n\t\t\tcreateBlock(\n\t\t\t\t'core/group',\n\t\t\t\t{\n\t\t\t\t\tlayout: { type: 'constrained' },\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\tspacing: {\n\t\t\t\t\t\t\tmargin: {\n\t\t\t\t\t\t\t\ttop: '4em', // Mimics the post editor.\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t},\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\tinnerBlocks\n\t\t\t),\n\t\t];\n\t}, [ blocks, isPageContentFocused ] );\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,QAAQ,oBAAoB;AAC5C,SAASC,WAAW,QAAQ,mBAAmB;;AAE/C;AACA;AACA;AACA,SAASC,wBAAwB,QAAQ,0BAA0B;;AAEnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,aAAaA,CAAEC,MAAM,EAAEC,SAAS,EAAG;EAC3C,MAAMC,MAAM,GAAG,EAAE;EACjB,KAAM,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGH,MAAM,CAACI,MAAM,EAAED,CAAC,EAAE,EAAG;IACzC;IACA;IACA,IAAK,CAAE,YAAY,CAAE,CAACE,QAAQ,CAAEL,MAAM,CAAEG,CAAC,CAAE,CAACG,IAAK,CAAC,EAAG;MACpD;IACD;IACA,MAAMC,gBAAgB,GAAGN,SAAS,CAAED,MAAM,CAAEG,CAAC,CAAG,CAAC;IACjD,IAAKI,gBAAgB,EAAG;MACvBL,MAAM,CAACM,IAAI,CAAED,gBAAiB,CAAC;IAChC;IACAL,MAAM,CAACM,IAAI,CAAE,GAAGT,aAAa,CAAEC,MAAM,CAAEG,CAAC,CAAE,CAACM,WAAW,EAAER,SAAU,CAAE,CAAC;EACtE;EAEA,OAAOC,MAAM;AACd;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASQ,oBAAoBA,CAAE;EAC7CV,MAAM,GAAG,EAAE;EACXW,oBAAoB,GAAG,KAAK;EAC5BC,eAAe,GAAG;AACnB,CAAC,EAAG;EACH,OAAOhB,OAAO,CAAE,MAAM;IACrB,IAAK,CAAEe,oBAAoB,IAAI,CAAEX,MAAM,EAAEI,MAAM,EAAG;MACjD,OAAO,EAAE;IACV;IAEA,MAAMK,WAAW,GAAGV,aAAa,CAAEC,MAAM,EAAIa,KAAK,IACjDf,wBAAwB,CAAEe,KAAK,CAACP,IAAI,CAAE,GACnCT,WAAW,CAAEgB,KAAK,CAACP,IAAK,CAAC,GACzBQ,SACJ,CAAC;IAED,IAAK,CAAEL,WAAW,CAACL,MAAM,EAAG;MAC3B,OAAO,EAAE;IACV;IAEA,IAAK,CAAEQ,eAAe,EAAG;MACxB,OAAOH,WAAW;IACnB;IAEA,OAAO,CACNZ,WAAW,CACV,YAAY,EACZ;MACCkB,MAAM,EAAE;QAAEC,IAAI,EAAE;MAAc,CAAC;MAC/BC,KAAK,EAAE;QACNC,OAAO,EAAE;UACRC,MAAM,EAAE;YACPC,GAAG,EAAE,KAAK,CAAE;UACb;QACD;MACD;IACD,CAAC,EACDX,WACD,CAAC,CACD;EACF,CAAC,EAAE,CAAET,MAAM,EAAEW,oBAAoB,CAAG,CAAC;AACtC"}

package/build-module/components/block-editor/block-inspector-button.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/block-editor/editor-canvas.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * External dependencies
  */

package/build-module/components/block-editor/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/block-editor/resizable-editor.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/block-editor/resize-handle.js

@@ -1,4 +1,4 @@
-import { createElement, Fragment } from "@wordpress/element";
+import { createElement, Fragment } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/block-editor/site-editor-canvas.js

@@ -1,4 +1,4 @@
-import { createElement, Fragment } from "@wordpress/element";
+import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */

package/build-module/components/canvas-loader/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/code-editor/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * External dependencies
  */

package/build-module/components/create-template-part-modal/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/dataviews/dataviews.js

@@ -0,0 +1,53 @@
+import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import { getCoreRowModel, getFilteredRowModel, getSortedRowModel, getPaginationRowModel, useReactTable } from '@tanstack/react-table';
+
+/**
+ * WordPress dependencies
+ */
+import { __experimentalVStack as VStack, __experimentalHStack as HStack } from '@wordpress/components';
+
+/**
+ * Internal dependencies
+ */
+import ListView from './list-view';
+import { Pagination } from './pagination';
+import ViewActions from './view-actions';
+import TextFilter from './text-filter';
+export default function DataViews({
+  data,
+  fields,
+  isLoading,
+  paginationInfo,
+  options
+}) {
+  const dataView = useReactTable({
+    data,
+    columns: fields,
+    ...options,
+    getCoreRowModel: getCoreRowModel(),
+    getFilteredRowModel: getFilteredRowModel(),
+    getSortedRowModel: getSortedRowModel(),
+    getPaginationRowModel: getPaginationRowModel()
+  });
+  return createElement("div", {
+    className: "dataviews-wrapper"
+  }, createElement(VStack, {
+    spacing: 4
+  }, createElement(HStack, {
+    justify: "space-between"
+  }, createElement(TextFilter, {
+    onChange: dataView.setGlobalFilter
+  }), createElement(ViewActions, {
+    dataView: dataView
+  })), createElement(ListView, {
+    dataView: dataView,
+    isLoading: isLoading
+  }), createElement(Pagination, {
+    dataView: dataView,
+    totalItems: paginationInfo?.totalItems
+  })));
+}
+//# sourceMappingURL=dataviews.js.map

package/build-module/components/dataviews/dataviews.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getCoreRowModel","getFilteredRowModel","getSortedRowModel","getPaginationRowModel","useReactTable","__experimentalVStack","VStack","__experimentalHStack","HStack","ListView","Pagination","ViewActions","TextFilter","DataViews","data","fields","isLoading","paginationInfo","options","dataView","columns","createElement","className","spacing","justify","onChange","setGlobalFilter","totalItems"],"sources":["@wordpress/edit-site/src/components/dataviews/dataviews.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tgetCoreRowModel,\n\tgetFilteredRowModel,\n\tgetSortedRowModel,\n\tgetPaginationRowModel,\n\tuseReactTable,\n} from '@tanstack/react-table';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport ListView from './list-view';\nimport { Pagination } from './pagination';\nimport ViewActions from './view-actions';\nimport TextFilter from './text-filter';\n\nexport default function DataViews( {\n\tdata,\n\tfields,\n\tisLoading,\n\tpaginationInfo,\n\toptions,\n} ) {\n\tconst dataView = useReactTable( {\n\t\tdata,\n\t\tcolumns: fields,\n\t\t...options,\n\t\tgetCoreRowModel: getCoreRowModel(),\n\t\tgetFilteredRowModel: getFilteredRowModel(),\n\t\tgetSortedRowModel: getSortedRowModel(),\n\t\tgetPaginationRowModel: getPaginationRowModel(),\n\t} );\n\treturn (\n\t\t<div className=\"dataviews-wrapper\">\n\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t<TextFilter onChange={ dataView.setGlobalFilter } />\n\t\t\t\t\t<ViewActions dataView={ dataView } />\n\t\t\t\t</HStack>\n\t\t\t\t{ /* This component will be selected based on viewConfigs. Now we only have the list view. */ }\n\t\t\t\t<ListView dataView={ dataView } isLoading={ isLoading } />\n\t\t\t\t<Pagination\n\t\t\t\t\tdataView={ dataView }\n\t\t\t\t\ttotalItems={ paginationInfo?.totalItems }\n\t\t\t\t/>\n\t\t\t</VStack>\n\t\t</div>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SACCA,eAAe,EACfC,mBAAmB,EACnBC,iBAAiB,EACjBC,qBAAqB,EACrBC,aAAa,QACP,uBAAuB;;AAE9B;AACA;AACA;AACA,SACCC,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,QACxB,uBAAuB;;AAE9B;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAClC,SAASC,UAAU,QAAQ,cAAc;AACzC,OAAOC,WAAW,MAAM,gBAAgB;AACxC,OAAOC,UAAU,MAAM,eAAe;AAEtC,eAAe,SAASC,SAASA,CAAE;EAClCC,IAAI;EACJC,MAAM;EACNC,SAAS;EACTC,cAAc;EACdC;AACD,CAAC,EAAG;EACH,MAAMC,QAAQ,GAAGf,aAAa,CAAE;IAC/BU,IAAI;IACJM,OAAO,EAAEL,MAAM;IACf,GAAGG,OAAO;IACVlB,eAAe,EAAEA,eAAe,CAAC,CAAC;IAClCC,mBAAmB,EAAEA,mBAAmB,CAAC,CAAC;IAC1CC,iBAAiB,EAAEA,iBAAiB,CAAC,CAAC;IACtCC,qBAAqB,EAAEA,qBAAqB,CAAC;EAC9C,CAAE,CAAC;EACH,OACCkB,aAAA;IAAKC,SAAS,EAAC;EAAmB,GACjCD,aAAA,CAACf,MAAM;IAACiB,OAAO,EAAG;EAAG,GACpBF,aAAA,CAACb,MAAM;IAACgB,OAAO,EAAC;EAAe,GAC9BH,aAAA,CAACT,UAAU;IAACa,QAAQ,EAAGN,QAAQ,CAACO;EAAiB,CAAE,CAAC,EACpDL,aAAA,CAACV,WAAW;IAACQ,QAAQ,EAAGA;EAAU,CAAE,CAC7B,CAAC,EAETE,aAAA,CAACZ,QAAQ;IAACU,QAAQ,EAAGA,QAAU;IAACH,SAAS,EAAGA;EAAW,CAAE,CAAC,EAC1DK,aAAA,CAACX,UAAU;IACVS,QAAQ,EAAGA,QAAU;IACrBQ,UAAU,EAAGV,cAAc,EAAEU;EAAY,CACzC,CACM,CACJ,CAAC;AAER"}

package/build-module/components/dataviews/index.js

@@ -0,0 +1,3 @@
+export { default as DataViews } from './dataviews';
+export { PAGE_SIZE_VALUES } from './view-actions';
+//# sourceMappingURL=index.js.map

package/build-module/components/dataviews/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["default","DataViews","PAGE_SIZE_VALUES"],"sources":["@wordpress/edit-site/src/components/dataviews/index.js"],"sourcesContent":["export { default as DataViews } from './dataviews';\nexport { PAGE_SIZE_VALUES } from './view-actions';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,SAAS,QAAQ,aAAa;AAClD,SAASC,gBAAgB,QAAQ,gBAAgB"}

package/build-module/components/dataviews/list-view.js

@@ -0,0 +1,80 @@
+import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+import { flexRender } from '@tanstack/react-table';
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { chevronDown, chevronUp } from '@wordpress/icons';
+import { Button } from '@wordpress/components';
+import { forwardRef } from '@wordpress/element';
+const sortIcons = {
+  asc: chevronUp,
+  desc: chevronDown
+};
+function Header({
+  header
+}) {
+  if (header.isPlaceholder) {
+    return null;
+  }
+  const text = flexRender(header.column.columnDef.header, header.getContext());
+  if (!header.column.getCanSort()) {
+    return text;
+  }
+  const sortDirection = header.column.getIsSorted();
+  return createElement(Button, {
+    onClick: header.column.getToggleSortingHandler(),
+    icon: sortIcons[sortDirection],
+    iconPosition: "right",
+    text: text,
+    style: {
+      padding: 0
+    }
+  });
+}
+function ListView({
+  dataView,
+  className,
+  isLoading = false
+}, ref) {
+  const {
+    rows
+  } = dataView.getRowModel();
+  const hasRows = !!rows?.length;
+  if (isLoading) {
+    // TODO:Add spinner or progress bar..
+    return createElement("h3", null, __('Loading'));
+  }
+  return createElement("div", {
+    className: "dataviews-list-view-wrapper"
+  }, hasRows && createElement("table", {
+    ref: ref,
+    className: classnames('dataviews-list-view', className)
+  }, createElement("thead", null, dataView.getHeaderGroups().map(headerGroup => createElement("tr", {
+    key: headerGroup.id
+  }, headerGroup.headers.map(header => createElement("th", {
+    key: header.id,
+    colSpan: header.colSpan,
+    style: {
+      width: header.column.columnDef.width || undefined,
+      maxWidth: header.column.columnDef.maxWidth || undefined
+    }
+  }, createElement(Header, {
+    header: header
+  })))))), createElement("tbody", null, rows.map(row => createElement("tr", {
+    key: row.id
+  }, row.getVisibleCells().map(cell => createElement("td", {
+    key: cell.id,
+    style: {
+      width: cell.column.columnDef.width || undefined,
+      maxWidth: cell.column.columnDef.maxWidth || undefined
+    }
+  }, flexRender(cell.column.columnDef.cell, cell.getContext()))))))), !hasRows && createElement("p", null, __('no results')));
+}
+export default forwardRef(ListView);
+//# sourceMappingURL=list-view.js.map

package/build-module/components/dataviews/list-view.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["classnames","flexRender","__","chevronDown","chevronUp","Button","forwardRef","sortIcons","asc","desc","Header","header","isPlaceholder","text","column","columnDef","getContext","getCanSort","sortDirection","getIsSorted","createElement","onClick","getToggleSortingHandler","icon","iconPosition","style","padding","ListView","dataView","className","isLoading","ref","rows","getRowModel","hasRows","length","getHeaderGroups","map","headerGroup","key","id","headers","colSpan","width","undefined","maxWidth","row","getVisibleCells","cell"],"sources":["@wordpress/edit-site/src/components/dataviews/list-view.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { flexRender } from '@tanstack/react-table';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { chevronDown, chevronUp } from '@wordpress/icons';\nimport { Button } from '@wordpress/components';\nimport { forwardRef } from '@wordpress/element';\n\nconst sortIcons = { asc: chevronUp, desc: chevronDown };\nfunction Header( { header } ) {\n\tif ( header.isPlaceholder ) {\n\t\treturn null;\n\t}\n\tconst text = flexRender(\n\t\theader.column.columnDef.header,\n\t\theader.getContext()\n\t);\n\tif ( ! header.column.getCanSort() ) {\n\t\treturn text;\n\t}\n\tconst sortDirection = header.column.getIsSorted();\n\treturn (\n\t\t<Button\n\t\t\tonClick={ header.column.getToggleSortingHandler() }\n\t\t\ticon={ sortIcons[ sortDirection ] }\n\t\t\ticonPosition=\"right\"\n\t\t\ttext={ text }\n\t\t\tstyle={ { padding: 0 } }\n\t\t/>\n\t);\n}\n\nfunction ListView( { dataView, className, isLoading = false }, ref ) {\n\tconst { rows } = dataView.getRowModel();\n\tconst hasRows = !! rows?.length;\n\tif ( isLoading ) {\n\t\t// TODO:Add spinner or progress bar..\n\t\treturn <h3>{ __( 'Loading' ) }</h3>;\n\t}\n\treturn (\n\t\t<div className=\"dataviews-list-view-wrapper\">\n\t\t\t{ hasRows && (\n\t\t\t\t<table\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tclassName={ classnames( 'dataviews-list-view', className ) }\n\t\t\t\t>\n\t\t\t\t\t<thead>\n\t\t\t\t\t\t{ dataView.getHeaderGroups().map( ( headerGroup ) => (\n\t\t\t\t\t\t\t<tr key={ headerGroup.id }>\n\t\t\t\t\t\t\t\t{ headerGroup.headers.map( ( header ) => (\n\t\t\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t\t\tkey={ header.id }\n\t\t\t\t\t\t\t\t\t\tcolSpan={ header.colSpan }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef.width ||\n\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth:\n\t\t\t\t\t\t\t\t\t\t\t\theader.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.maxWidth || undefined,\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<Header header={ header } />\n\t\t\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</thead>\n\t\t\t\t\t<tbody>\n\t\t\t\t\t\t{ rows.map( ( row ) => (\n\t\t\t\t\t\t\t<tr key={ row.id }>\n\t\t\t\t\t\t\t\t{ row.getVisibleCells().map( ( cell ) => (\n\t\t\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t\t\tkey={ cell.id }\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef.width ||\n\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth:\n\t\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef\n\t\t\t\t\t\t\t\t\t\t\t\t\t.maxWidth || undefined,\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{ flexRender(\n\t\t\t\t\t\t\t\t\t\t\tcell.column.columnDef.cell,\n\t\t\t\t\t\t\t\t\t\t\tcell.getContext()\n\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) ) }\n\t\t\t\t\t\t\t</tr>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</tbody>\n\t\t\t\t</table>\n\t\t\t) }\n\t\t\t{ ! hasRows && <p>{ __( 'no results' ) }</p> }\n\t\t</div>\n\t);\n}\n\nexport default forwardRef( ListView );\n"],"mappings":"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"}

package/build-module/components/dataviews/pagination.js

@@ -0,0 +1,83 @@
+import { createElement } from "react";
+/**
+ * WordPress dependencies
+ */
+import { Button, __experimentalHStack as HStack, __experimentalText as Text, __experimentalNumberControl as NumberControl } from '@wordpress/components';
+import { createInterpolateElement } from '@wordpress/element';
+import { sprintf, __, _x, _n } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import { PageSizeControl } from './view-actions';
+
+// For now this is copied from the patterns list Pagination component, because
+// the datatable pagination starts from index zero(`0`). Eventually all lists will be
+// using this one.
+export function Pagination({
+  dataView,
+  // If passed, use it, as it's for controlled pagination.
+  totalItems = 0
+}) {
+  const currentPage = dataView.getState().pagination.pageIndex + 1;
+  const numPages = dataView.getPageCount();
+  const _totalItems = totalItems || dataView.getCoreRowModel().rows.length;
+  return createElement(HStack, {
+    expanded: false,
+    spacing: 3,
+    justify: "space-between",
+    className: "dataviews-pagination"
+  }, createElement(Text, {
+    variant: "muted"
+  },
+  // translators: %s: Total number of entries.
+  sprintf(
+  // translators: %s: Total number of entries.
+  _n('%s item', '%s items', _totalItems), _totalItems)), !!_totalItems && createElement(HStack, {
+    expanded: false,
+    spacing: 1
+  }, createElement(Button, {
+    variant: "tertiary",
+    onClick: () => dataView.setPageIndex(0),
+    disabled: !dataView.getCanPreviousPage(),
+    "aria-label": __('First page')
+  }, "\xAB"), createElement(Button, {
+    variant: "tertiary",
+    onClick: () => dataView.previousPage(),
+    disabled: !dataView.getCanPreviousPage(),
+    "aria-label": __('Previous page')
+  }, "\u2039"), createElement(HStack, {
+    justify: "flex-start",
+    expanded: false,
+    spacing: 1
+  }, createInterpolateElement(sprintf(
+  // translators: %1$s: Current page number, %2$s: Total number of pages.
+  _x('<CurrenPageControl /> of %2$s', 'paging'), currentPage, numPages), {
+    CurrenPageControl: createElement(NumberControl, {
+      "aria-label": __('Current page'),
+      min: 1,
+      max: numPages,
+      onChange: value => {
+        if (value > numPages) return;
+        dataView.setPageIndex(value - 1);
+      },
+      step: "1",
+      value: currentPage,
+      isDragEnabled: false,
+      spinControls: "none"
+    })
+  })), createElement(Button, {
+    variant: "tertiary",
+    onClick: () => dataView.nextPage(),
+    disabled: !dataView.getCanNextPage(),
+    "aria-label": __('Next page')
+  }, "\u203A"), createElement(Button, {
+    variant: "tertiary",
+    onClick: () => dataView.setPageIndex(dataView.getPageCount() - 1),
+    disabled: !dataView.getCanNextPage(),
+    "aria-label": __('Last page')
+  }, "\xBB")), createElement(PageSizeControl, {
+    dataView: dataView
+  }));
+}
+//# sourceMappingURL=pagination.js.map

package/build-module/components/dataviews/pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Button","__experimentalHStack","HStack","__experimentalText","Text","__experimentalNumberControl","NumberControl","createInterpolateElement","sprintf","__","_x","_n","PageSizeControl","Pagination","dataView","totalItems","currentPage","getState","pagination","pageIndex","numPages","getPageCount","_totalItems","getCoreRowModel","rows","length","createElement","expanded","spacing","justify","className","variant","onClick","setPageIndex","disabled","getCanPreviousPage","previousPage","CurrenPageControl","min","max","onChange","value","step","isDragEnabled","spinControls","nextPage","getCanNextPage"],"sources":["@wordpress/edit-site/src/components/dataviews/pagination.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\t__experimentalHStack as HStack,\n\t__experimentalText as Text,\n\t__experimentalNumberControl as NumberControl,\n} from '@wordpress/components';\nimport { createInterpolateElement } from '@wordpress/element';\nimport { sprintf, __, _x, _n } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { PageSizeControl } from './view-actions';\n\n// For now this is copied from the patterns list Pagination component, because\n// the datatable pagination starts from index zero(`0`). Eventually all lists will be\n// using this one.\nexport function Pagination( {\n\tdataView,\n\t// If passed, use it, as it's for controlled pagination.\n\ttotalItems = 0,\n} ) {\n\tconst currentPage = dataView.getState().pagination.pageIndex + 1;\n\tconst numPages = dataView.getPageCount();\n\tconst _totalItems = totalItems || dataView.getCoreRowModel().rows.length;\n\treturn (\n\t\t<HStack\n\t\t\texpanded={ false }\n\t\t\tspacing={ 3 }\n\t\t\tjustify=\"space-between\"\n\t\t\tclassName=\"dataviews-pagination\"\n\t\t>\n\t\t\t<Text variant=\"muted\">\n\t\t\t\t{\n\t\t\t\t\t// translators: %s: Total number of entries.\n\t\t\t\t\tsprintf(\n\t\t\t\t\t\t// translators: %s: Total number of entries.\n\t\t\t\t\t\t_n( '%s item', '%s items', _totalItems ),\n\t\t\t\t\t\t_totalItems\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t</Text>\n\t\t\t{ !! _totalItems && (\n\t\t\t\t<HStack expanded={ false } spacing={ 1 }>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => dataView.setPageIndex( 0 ) }\n\t\t\t\t\t\tdisabled={ ! dataView.getCanPreviousPage() }\n\t\t\t\t\t\taria-label={ __( 'First page' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t«\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => dataView.previousPage() }\n\t\t\t\t\t\tdisabled={ ! dataView.getCanPreviousPage() }\n\t\t\t\t\t\taria-label={ __( 'Previous page' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t‹\n\t\t\t\t\t</Button>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\texpanded={ false }\n\t\t\t\t\t\tspacing={ 1 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// translators: %1$s: Current page number, %2$s: Total number of pages.\n\t\t\t\t\t\t\t\t_x( '<CurrenPageControl /> of %2$s', 'paging' ),\n\t\t\t\t\t\t\t\tcurrentPage,\n\t\t\t\t\t\t\t\tnumPages\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tCurrenPageControl: (\n\t\t\t\t\t\t\t\t\t<NumberControl\n\t\t\t\t\t\t\t\t\t\taria-label={ __( 'Current page' ) }\n\t\t\t\t\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\t\t\t\t\tmax={ numPages }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\t\t\t\t\t\tif ( value > numPages ) return;\n\t\t\t\t\t\t\t\t\t\t\tdataView.setPageIndex( value - 1 );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tstep=\"1\"\n\t\t\t\t\t\t\t\t\t\tvalue={ currentPage }\n\t\t\t\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\t\t\t\tspinControls=\"none\"\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\t) }\n\t\t\t\t\t</HStack>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => dataView.nextPage() }\n\t\t\t\t\t\tdisabled={ ! dataView.getCanNextPage() }\n\t\t\t\t\t\taria-label={ __( 'Next page' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t›\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\tdataView.setPageIndex( dataView.getPageCount() - 1 )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdisabled={ ! dataView.getCanNextPage() }\n\t\t\t\t\t\taria-label={ __( 'Last page' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t»\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t<PageSizeControl dataView={ dataView } />\n\t\t</HStack>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/dataviews/text-filter.js

@@ -0,0 +1,36 @@
+import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { useEffect } from '@wordpress/element';
+import { SearchControl } from '@wordpress/components';
+
+/**
+ * Internal dependencies
+ */
+import useDebouncedInput from '../../utils/use-debounced-input';
+export default function TextFilter({
+  className,
+  searchLabel = __('Filter list'),
+  onChange
+}) {
+  const [search, setSearch, debouncedSearch] = useDebouncedInput();
+  useEffect(() => {
+    onChange(debouncedSearch);
+  }, [debouncedSearch, onChange]);
+  return createElement(SearchControl, {
+    className: classnames('dataviews__text-filter', className),
+    onChange: setSearch,
+    value: search,
+    label: searchLabel,
+    placeholder: searchLabel,
+    size: "compact"
+  });
+}
+//# sourceMappingURL=text-filter.js.map

package/build-module/components/dataviews/text-filter.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["classnames","__","useEffect","SearchControl","useDebouncedInput","TextFilter","className","searchLabel","onChange","search","setSearch","debouncedSearch","createElement","value","label","placeholder","size"],"sources":["@wordpress/edit-site/src/components/dataviews/text-filter.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useEffect } from '@wordpress/element';\nimport { SearchControl } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport useDebouncedInput from '../../utils/use-debounced-input';\n\nexport default function TextFilter( {\n\tclassName,\n\tsearchLabel = __( 'Filter list' ),\n\tonChange,\n} ) {\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput();\n\tuseEffect( () => {\n\t\tonChange( debouncedSearch );\n\t}, [ debouncedSearch, onChange ] );\n\treturn (\n\t\t<SearchControl\n\t\t\tclassName={ classnames( 'dataviews__text-filter', className ) }\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"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,QAAQ,oBAAoB;AAC9C,SAASC,aAAa,QAAQ,uBAAuB;;AAErD;AACA;AACA;AACA,OAAOC,iBAAiB,MAAM,iCAAiC;AAE/D,eAAe,SAASC,UAAUA,CAAE;EACnCC,SAAS;EACTC,WAAW,GAAGN,EAAE,CAAE,aAAc,CAAC;EACjCO;AACD,CAAC,EAAG;EACH,MAAM,CAAEC,MAAM,EAAEC,SAAS,EAAEC,eAAe,CAAE,GAAGP,iBAAiB,CAAC,CAAC;EAClEF,SAAS,CAAE,MAAM;IAChBM,QAAQ,CAAEG,eAAgB,CAAC;EAC5B,CAAC,EAAE,CAAEA,eAAe,EAAEH,QAAQ,CAAG,CAAC;EAClC,OACCI,aAAA,CAACT,aAAa;IACbG,SAAS,EAAGN,UAAU,CAAE,wBAAwB,EAAEM,SAAU,CAAG;IAC/DE,QAAQ,EAAGE,SAAW;IACtBG,KAAK,EAAGJ,MAAQ;IAChBK,KAAK,EAAGP,WAAa;IACrBQ,WAAW,EAAGR,WAAa;IAC3BS,IAAI,EAAC;EAAS,CACd,CAAC;AAEJ"}

package/build-module/components/dataviews/view-actions.js

@@ -0,0 +1,179 @@
+import { createElement, Fragment } from "react";
+/**
+ * WordPress dependencies
+ */
+import { Button, Icon, SelectControl, privateApis as componentsPrivateApis, __experimentalInputControlPrefixWrapper as InputControlPrefixWrapper } from '@wordpress/components';
+import { chevronRightSmall, check, blockTable, chevronDown, arrowUp, arrowDown } from '@wordpress/icons';
+import { __ } from '@wordpress/i18n';
+
+/**
+ * Internal dependencies
+ */
+import { unlock } from '../../lock-unlock';
+const {
+  DropdownMenuV2,
+  DropdownMenuGroupV2,
+  DropdownMenuItemV2,
+  DropdownSubMenuV2,
+  DropdownSubMenuTriggerV2
+} = unlock(componentsPrivateApis);
+export const PAGE_SIZE_VALUES = [5, 20, 50];
+export function PageSizeControl({
+  dataView
+}) {
+  const label = __('Rows per page:');
+  return createElement(SelectControl, {
+    __nextHasNoMarginBottom: true,
+    label: label,
+    hideLabelFromVision: true
+    // TODO: This should probably use a label based on the wanted design
+    // and we could remove InputControlPrefixWrapper usage.
+    ,
+    prefix: createElement(InputControlPrefixWrapper, {
+      as: "span",
+      className: "dataviews__per-page-control-prefix"
+    }, label),
+    value: dataView.getState().pagination.pageSize,
+    options: PAGE_SIZE_VALUES.map(pageSize => ({
+      value: pageSize,
+      label: pageSize
+    })),
+    onChange: value => dataView.setPageSize(+value)
+  });
+}
+function PageSizeMenu({
+  dataView
+}) {
+  const currenPageSize = dataView.getState().pagination.pageSize;
+  return createElement(DropdownSubMenuV2, {
+    trigger: createElement(DropdownSubMenuTriggerV2, {
+      suffix: createElement(Fragment, null, currenPageSize, createElement(Icon, {
+        icon: chevronRightSmall
+      }))
+    }, __('Rows per page'))
+  }, PAGE_SIZE_VALUES.map(size => {
+    return createElement(DropdownMenuItemV2, {
+      key: size,
+      prefix: currenPageSize === size && createElement(Icon, {
+        icon: check
+      }),
+      onSelect: event => {
+        // We need to handle this on DropDown component probably..
+        event.preventDefault();
+        dataView.setPageSize(size);
+      }
+      // TODO: check about role and a11y.
+      ,
+      role: "menuitemcheckbox"
+    }, size);
+  }));
+}
+function FieldsVisibilityMenu({
+  dataView
+}) {
+  const hideableFields = dataView.getAllColumns().filter(columnn => columnn.getCanHide());
+  if (!hideableFields?.length) {
+    return null;
+  }
+  return createElement(DropdownSubMenuV2, {
+    trigger: createElement(DropdownSubMenuTriggerV2, {
+      suffix: createElement(Icon, {
+        icon: chevronRightSmall
+      })
+    }, __('Fields'))
+  }, hideableFields?.map(field => {
+    return createElement(DropdownMenuItemV2, {
+      key: field.id,
+      prefix: field.getIsVisible() && createElement(Icon, {
+        icon: check
+      }),
+      onSelect: event => {
+        event.preventDefault();
+        field.getToggleVisibilityHandler()(event);
+      },
+      role: "menuitemcheckbox"
+    }, field.columnDef.header);
+  }));
+}
+
+// This object is used to construct the sorting options per sortable field.
+const sortingItemsInfo = {
+  asc: {
+    icon: arrowUp,
+    label: __('Sort ascending')
+  },
+  desc: {
+    icon: arrowDown,
+    label: __('Sort descending')
+  }
+};
+function SortMenu({
+  dataView
+}) {
+  const sortableFields = dataView.getAllColumns().filter(columnn => columnn.getCanSort());
+  if (!sortableFields?.length) {
+    return null;
+  }
+  const currentSortedField = sortableFields.find(field => field.getIsSorted());
+  return createElement(DropdownSubMenuV2, {
+    trigger: createElement(DropdownSubMenuTriggerV2, {
+      suffix: createElement(Fragment, null, currentSortedField?.columnDef.header, createElement(Icon, {
+        icon: chevronRightSmall
+      }))
+    }, __('Sort by'))
+  }, sortableFields?.map(field => {
+    const sortedDirection = field.getIsSorted();
+    return createElement(DropdownSubMenuV2, {
+      key: field.id,
+      trigger: createElement(DropdownSubMenuTriggerV2, {
+        suffix: createElement(Icon, {
+          icon: chevronRightSmall
+        })
+      }, field.columnDef.header),
+      side: "left"
+    }, Object.entries(sortingItemsInfo).map(([direction, info]) => {
+      return createElement(DropdownMenuItemV2, {
+        key: direction,
+        prefix: createElement(Icon, {
+          icon: info.icon
+        }),
+        suffix: sortedDirection === direction && createElement(Icon, {
+          icon: check
+        }),
+        onSelect: event => {
+          event.preventDefault();
+          if (sortedDirection === direction) {
+            dataView.resetSorting();
+          } else {
+            dataView.setSorting([{
+              id: field.id,
+              desc: direction === 'desc'
+            }]);
+          }
+        }
+      }, info.label);
+    }));
+  }));
+}
+export default function ViewActions({
+  dataView,
+  className
+}) {
+  return createElement(DropdownMenuV2, {
+    label: __('Actions'),
+    className: className,
+    trigger: createElement(Button, {
+      variant: "tertiary",
+      icon: blockTable
+    }, __('View'), createElement(Icon, {
+      icon: chevronDown
+    }))
+  }, createElement(DropdownMenuGroupV2, null, createElement(SortMenu, {
+    dataView: dataView
+  }), createElement(FieldsVisibilityMenu, {
+    dataView: dataView
+  }), createElement(PageSizeMenu, {
+    dataView: dataView
+  })));
+}
+//# sourceMappingURL=view-actions.js.map

package/build-module/components/dataviews/view-actions.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Button","Icon","SelectControl","privateApis","componentsPrivateApis","__experimentalInputControlPrefixWrapper","InputControlPrefixWrapper","chevronRightSmall","check","blockTable","chevronDown","arrowUp","arrowDown","__","unlock","DropdownMenuV2","DropdownMenuGroupV2","DropdownMenuItemV2","DropdownSubMenuV2","DropdownSubMenuTriggerV2","PAGE_SIZE_VALUES","PageSizeControl","dataView","label","createElement","__nextHasNoMarginBottom","hideLabelFromVision","prefix","as","className","value","getState","pagination","pageSize","options","map","onChange","setPageSize","PageSizeMenu","currenPageSize","trigger","suffix","Fragment","icon","size","key","onSelect","event","preventDefault","role","FieldsVisibilityMenu","hideableFields","getAllColumns","filter","columnn","getCanHide","length","field","id","getIsVisible","getToggleVisibilityHandler","columnDef","header","sortingItemsInfo","asc","desc","SortMenu","sortableFields","getCanSort","currentSortedField","find","getIsSorted","sortedDirection","side","Object","entries","direction","info","resetSorting","setSorting","ViewActions","variant"],"sources":["@wordpress/edit-site/src/components/dataviews/view-actions.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tIcon,\n\tSelectControl,\n\tprivateApis as componentsPrivateApis,\n\t__experimentalInputControlPrefixWrapper as InputControlPrefixWrapper,\n} from '@wordpress/components';\nimport {\n\tchevronRightSmall,\n\tcheck,\n\tblockTable,\n\tchevronDown,\n\tarrowUp,\n\tarrowDown,\n} from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\tDropdownMenuV2,\n\tDropdownMenuGroupV2,\n\tDropdownMenuItemV2,\n\tDropdownSubMenuV2,\n\tDropdownSubMenuTriggerV2,\n} = unlock( componentsPrivateApis );\n\nexport const PAGE_SIZE_VALUES = [ 5, 20, 50 ];\n\nexport function PageSizeControl( { dataView } ) {\n\tconst label = __( 'Rows per page:' );\n\treturn (\n\t\t<SelectControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision\n\t\t\t// TODO: This should probably use a label based on the wanted design\n\t\t\t// and we could remove InputControlPrefixWrapper usage.\n\t\t\tprefix={\n\t\t\t\t<InputControlPrefixWrapper\n\t\t\t\t\tas=\"span\"\n\t\t\t\t\tclassName=\"dataviews__per-page-control-prefix\"\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</InputControlPrefixWrapper>\n\t\t\t}\n\t\t\tvalue={ dataView.getState().pagination.pageSize }\n\t\t\toptions={ PAGE_SIZE_VALUES.map( ( pageSize ) => ( {\n\t\t\t\tvalue: pageSize,\n\t\t\t\tlabel: pageSize,\n\t\t\t} ) ) }\n\t\t\tonChange={ ( value ) => dataView.setPageSize( +value ) }\n\t\t/>\n\t);\n}\n\nfunction PageSizeMenu( { dataView } ) {\n\tconst currenPageSize = dataView.getState().pagination.pageSize;\n\treturn (\n\t\t<DropdownSubMenuV2\n\t\t\ttrigger={\n\t\t\t\t<DropdownSubMenuTriggerV2\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ currenPageSize }\n\t\t\t\t\t\t\t<Icon icon={ chevronRightSmall } />\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ /* TODO: probably label per view type. */ }\n\t\t\t\t\t{ __( 'Rows per page' ) }\n\t\t\t\t</DropdownSubMenuTriggerV2>\n\t\t\t}\n\t\t>\n\t\t\t{ PAGE_SIZE_VALUES.map( ( size ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuItemV2\n\t\t\t\t\t\tkey={ size }\n\t\t\t\t\t\tprefix={\n\t\t\t\t\t\t\tcurrenPageSize === size && <Icon icon={ check } />\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\t// We need to handle this on DropDown component probably..\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tdataView.setPageSize( size );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\t// TODO: check about role and a11y.\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ size }\n\t\t\t\t\t</DropdownMenuItemV2>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownSubMenuV2>\n\t);\n}\n\nfunction FieldsVisibilityMenu( { dataView } ) {\n\tconst hideableFields = dataView\n\t\t.getAllColumns()\n\t\t.filter( ( columnn ) => columnn.getCanHide() );\n\tif ( ! hideableFields?.length ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<DropdownSubMenuV2\n\t\t\ttrigger={\n\t\t\t\t<DropdownSubMenuTriggerV2\n\t\t\t\t\tsuffix={ <Icon icon={ chevronRightSmall } /> }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Fields' ) }\n\t\t\t\t</DropdownSubMenuTriggerV2>\n\t\t\t}\n\t\t>\n\t\t\t{ hideableFields?.map( ( field ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownMenuItemV2\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\tprefix={\n\t\t\t\t\t\t\tfield.getIsVisible() && <Icon icon={ check } />\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tfield.getToggleVisibilityHandler()( event );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ field.columnDef.header }\n\t\t\t\t\t</DropdownMenuItemV2>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownSubMenuV2>\n\t);\n}\n\n// This object is used to construct the sorting options per sortable field.\nconst sortingItemsInfo = {\n\tasc: { icon: arrowUp, label: __( 'Sort ascending' ) },\n\tdesc: { icon: arrowDown, label: __( 'Sort descending' ) },\n};\nfunction SortMenu( { dataView } ) {\n\tconst sortableFields = dataView\n\t\t.getAllColumns()\n\t\t.filter( ( columnn ) => columnn.getCanSort() );\n\tif ( ! sortableFields?.length ) {\n\t\treturn null;\n\t}\n\tconst currentSortedField = sortableFields.find( ( field ) =>\n\t\tfield.getIsSorted()\n\t);\n\treturn (\n\t\t<DropdownSubMenuV2\n\t\t\ttrigger={\n\t\t\t\t<DropdownSubMenuTriggerV2\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ currentSortedField?.columnDef.header }\n\t\t\t\t\t\t\t<Icon icon={ chevronRightSmall } />\n\t\t\t\t\t\t</>\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Sort by' ) }\n\t\t\t\t</DropdownSubMenuTriggerV2>\n\t\t\t}\n\t\t>\n\t\t\t{ sortableFields?.map( ( field ) => {\n\t\t\t\tconst sortedDirection = field.getIsSorted();\n\t\t\t\treturn (\n\t\t\t\t\t<DropdownSubMenuV2\n\t\t\t\t\t\tkey={ field.id }\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<DropdownSubMenuTriggerV2\n\t\t\t\t\t\t\t\tsuffix={ <Icon icon={ chevronRightSmall } /> }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ field.columnDef.header }\n\t\t\t\t\t\t\t</DropdownSubMenuTriggerV2>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tside=\"left\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ Object.entries( sortingItemsInfo ).map(\n\t\t\t\t\t\t\t( [ direction, info ] ) => {\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<DropdownMenuItemV2\n\t\t\t\t\t\t\t\t\t\tkey={ direction }\n\t\t\t\t\t\t\t\t\t\tprefix={ <Icon icon={ info.icon } /> }\n\t\t\t\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\t\t\t\tsortedDirection === direction && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon icon={ check } />\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\tonSelect={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\tsortedDirection === direction\n\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\tdataView.resetSorting();\n\t\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\t\tdataView.setSorting( [\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\t\tid: field.id,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tdesc:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tdirection ===\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'desc',\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] );\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ info.label }\n\t\t\t\t\t\t\t\t\t</DropdownMenuItemV2>\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</DropdownSubMenuV2>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</DropdownSubMenuV2>\n\t);\n}\n\nexport default function ViewActions( { dataView, className } ) {\n\treturn (\n\t\t<DropdownMenuV2\n\t\t\tlabel={ __( 'Actions' ) }\n\t\t\tclassName={ className }\n\t\t\ttrigger={\n\t\t\t\t<Button variant=\"tertiary\" icon={ blockTable }>\n\t\t\t\t\t{ __( 'View' ) }\n\t\t\t\t\t<Icon icon={ chevronDown } />\n\t\t\t\t</Button>\n\t\t\t}\n\t\t>\n\t\t\t<DropdownMenuGroupV2>\n\t\t\t\t<SortMenu dataView={ dataView } />\n\t\t\t\t<FieldsVisibilityMenu dataView={ dataView } />\n\t\t\t\t<PageSizeMenu dataView={ dataView } />\n\t\t\t</DropdownMenuGroupV2>\n\t\t</DropdownMenuV2>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/editor/index.js

@@ -1,4 +1,4 @@
-import { createElement, Fragment } from "@wordpress/element";
+import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */

package/build-module/components/editor-canvas-container/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/error-boundary/index.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */

package/build-module/components/error-boundary/warning.js

@@ -1,4 +1,4 @@
-import { createElement } from "@wordpress/element";
+import { createElement } from "react";
 /**
  * WordPress dependencies
  */