DataViews: Enable types (#61185)

Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
Co-authored-by: oandregal <oandregal@git.wordpress.org>

packages/dataviews/src/normalize-fields.js → packages/dataviews/src/normalize-fields.ts

@@ -1,10 +1,15 @@
+/**
+ * Internal dependencies
+ */
+import type { Field } from './types';
+
 /**
  * Apply default values and normalize the fields config.
  *
- * @param {Object[]} fields Raw Fields.
- * @return {Object[]} Normalized fields.
+ * @param fields Fields config.
+ * @return Normalized fields config.
  */
-export function normalizeFields( fields ) {
+export function normalizeFields( fields: Field[] ): Field[] {
 	return fields.map( ( field ) => {
 		const getValue = field.getValue || ( ( { item } ) => item[ field.id ] );
 

packages/dataviews/src/types.ts

@@ -0,0 +1,79 @@
+/**
+ * External dependencies
+ */
+import type { ReactNode } from 'react';
+
+type Item = Record< string, any >;
+
+interface Option {
+	value: any;
+	label: string;
+}
+
+interface filterByConfig {
+	operators?: string[];
+	isPrimary?: boolean;
+}
+
+export interface Field {
+	/**
+	 * The unique identifier of the field.
+	 */
+	id: string;
+
+	/**
+	 * The label of the field. Defaults to the id.
+	 */
+	header?: string;
+
+	/**
+	 * Callback used to retrieve the value of the field from the item.
+	 * Defaults to `item[ field.id ]`.
+	 */
+	getValue?: ( { item }: { item: Item } ) => any;
+
+	/**
+	 * Callback used to render the field. Defaults to `field.getValue`.
+	 */
+	render?: ( { item }: { item: Item } ) => ReactNode;
+
+	/**
+	 * The width of the field column.
+	 */
+	width?: string | number;
+
+	/**
+	 * The minimum width of the field column.
+	 */
+	maxWidth?: string | number;
+
+	/**
+	 * The maximum width of the field column.
+	 */
+	minWidth?: string | number;
+
+	/**
+	 * Whether the field is sortable.
+	 */
+	enableSorting?: boolean;
+
+	/**
+	 * Whether the field is searchable.
+	 */
+	enableGlobalSearch?: boolean;
+
+	/**
+	 * Whether the field is filterable.
+	 */
+	enableHiding?: boolean;
+
+	/**
+	 * The list of options to pick from when using the field as a filter.
+	 */
+	elements?: Option[];
+
+	/**
+	 * Filter config for the field.
+	 */
+	filterBy?: filterByConfig;
+}

packages/dataviews/tsconfig.json

@@ -0,0 +1,20 @@
+{
+	"$schema": "https://json.schemastore.org/tsconfig.json",
+	"extends": "../../tsconfig.base.json",
+	"compilerOptions": {
+		"rootDir": "src",
+		"declarationDir": "build-types"
+	},
+	"references": [
+		{ "path": "../a11y" },
+		{ "path": "../components" },
+		{ "path": "../compose" },
+		{ "path": "../element" },
+		{ "path": "../i18n" },
+		{ "path": "../icons" },
+		{ "path": "../keycodes" },
+		{ "path": "../primitives" },
+		{ "path": "../private-apis" }
+	],
+	"include": [ "src/**/*.ts", "src/**/*.tsx" ]
+}

tsconfig.json

@@ -13,6 +13,7 @@
 		{ "path": "packages/compose" },
 		{ "path": "packages/core-data" },
 		{ "path": "packages/data" },
+		{ "path": "packages/dataviews" },
 		{ "path": "packages/data-controls" },
 		{ "path": "packages/date" },
 		{ "path": "packages/deprecated" },