@wordpress/dataviews 14.0.0 → 14.1.0

package/src/hooks/test/use-form-validity.ts

@@ -1039,6 +1039,485 @@ describe( 'useFormValidity', () => {
 		} );
 	} );
 
+	describe( 'isValid.min (date)', () => {
+		const MIN_MESSAGE = {
+			min: {
+				type: 'invalid',
+				message: 'Value is below the minimum.',
+			},
+		};
+
+		it( 'date is valid when value is at min', () => {
+			const item = { id: 1, eventDate: '2026-04-01' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+
+		it( 'date is invalid when value is before min', () => {
+			const item = { id: 1, eventDate: '2026-03-15' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.eventDate ).toEqual( MIN_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+
+		it( 'date is valid when value is empty and min is defined', () => {
+			const item = { id: 1, eventDate: undefined };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+
+		it( 'date range: from date is validated against min', () => {
+			const item = {
+				id: 1,
+				dateRange: [ '2026-03-15', '2026-04-10' ],
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'dateRange',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+					},
+				},
+			];
+			const form = { fields: [ 'dateRange' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.dateRange ).toEqual( MIN_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+	} );
+
+	describe( 'isValid.max (date)', () => {
+		const MAX_MESSAGE = {
+			max: {
+				type: 'invalid',
+				message: 'Value is above the maximum.',
+			},
+		};
+
+		it( 'date is valid when value is at max', () => {
+			const item = { id: 1, eventDate: '2026-04-20' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						max: '2026-04-20',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+
+		it( 'date is invalid when value is after max', () => {
+			const item = { id: 1, eventDate: '2026-05-01' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						max: '2026-04-20',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.eventDate ).toEqual( MAX_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+
+		it( 'date range: to date is validated against max', () => {
+			const item = {
+				id: 1,
+				dateRange: [ '2026-04-05', '2026-04-25' ],
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'dateRange',
+					type: 'date',
+					isValid: {
+						max: '2026-04-20',
+					},
+				},
+			];
+			const form = { fields: [ 'dateRange' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.dateRange ).toEqual( MAX_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+	} );
+
+	describe( 'isValid.min (datetime)', () => {
+		const MIN_MESSAGE = {
+			min: {
+				type: 'invalid',
+				message: 'Value is below the minimum.',
+			},
+		};
+
+		it( 'datetime is valid when value is at min', () => {
+			const item = {
+				id: 1,
+				createdAt: '2026-04-01T10:00:00.000Z',
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'createdAt',
+					type: 'datetime',
+					isValid: {
+						min: '2026-04-01T10:00:00.000Z',
+					},
+				},
+			];
+			const form = { fields: [ 'createdAt' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+
+		it( 'datetime is invalid when value is before min', () => {
+			const item = {
+				id: 1,
+				createdAt: '2026-03-31T23:59:59.000Z',
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'createdAt',
+					type: 'datetime',
+					isValid: {
+						min: '2026-04-01T10:00:00.000Z',
+					},
+				},
+			];
+			const form = { fields: [ 'createdAt' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.createdAt ).toEqual( MIN_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+
+		it( 'datetime is valid when min uses an offset-based ISO string', () => {
+			const item = {
+				id: 1,
+				createdAt: '2026-04-01T09:30:00.000Z',
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'createdAt',
+					type: 'datetime',
+					isValid: {
+						min: '2026-04-01T10:00:00+02:00',
+					},
+				},
+			];
+			const form = { fields: [ 'createdAt' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+	} );
+
+	describe( 'isValid.max (datetime)', () => {
+		const MAX_MESSAGE = {
+			max: {
+				type: 'invalid',
+				message: 'Value is above the maximum.',
+			},
+		};
+
+		it( 'datetime is valid when value is at max', () => {
+			const item = {
+				id: 1,
+				createdAt: '2026-04-30T23:59:59.000Z',
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'createdAt',
+					type: 'datetime',
+					isValid: {
+						max: '2026-04-30T23:59:59.000Z',
+					},
+				},
+			];
+			const form = { fields: [ 'createdAt' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+
+		it( 'datetime is invalid when value is after max', () => {
+			const item = {
+				id: 1,
+				createdAt: '2026-05-01T00:00:00.000Z',
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'createdAt',
+					type: 'datetime',
+					isValid: {
+						max: '2026-04-30T23:59:59.000Z',
+					},
+				},
+			];
+			const form = { fields: [ 'createdAt' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.createdAt ).toEqual( MAX_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+
+		it( 'datetime is invalid when max uses an offset-based ISO string', () => {
+			const item = {
+				id: 1,
+				createdAt: '2026-04-01T09:30:00.000Z',
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'createdAt',
+					type: 'datetime',
+					isValid: {
+						max: '2026-04-01T10:00:00+02:00',
+					},
+				},
+			];
+			const form = { fields: [ 'createdAt' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.createdAt ).toEqual( MAX_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+
+		it( 'datetime is invalid when value cannot be parsed', () => {
+			const item = {
+				id: 1,
+				createdAt: 'not-a-date',
+			};
+			const fields: Field< {} >[] = [
+				{
+					id: 'createdAt',
+					type: 'datetime',
+					isValid: {
+						max: '2026-04-30T23:59:59.000Z',
+					},
+				},
+			];
+			const form = { fields: [ 'createdAt' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.createdAt ).toEqual( MAX_MESSAGE );
+			expect( isValid ).toBe( false );
+		} );
+	} );
+
+	describe( 'isValid combined min and max (date)', () => {
+		it( 'date is valid when value is within range', () => {
+			const item = { id: 1, eventDate: '2026-04-10' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+						max: '2026-04-30',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+
+		it( 'date is invalid when value is below min with both min and max', () => {
+			const item = { id: 1, eventDate: '2026-03-15' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+						max: '2026-04-30',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.eventDate ).toEqual( {
+				min: {
+					type: 'invalid',
+					message: 'Value is below the minimum.',
+				},
+			} );
+			expect( isValid ).toBe( false );
+		} );
+
+		it( 'date is invalid when value is above max with both min and max', () => {
+			const item = { id: 1, eventDate: '2026-05-15' };
+			const fields: Field< {} >[] = [
+				{
+					id: 'eventDate',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+						max: '2026-04-30',
+					},
+				},
+			];
+			const form = { fields: [ 'eventDate' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity?.eventDate ).toEqual( {
+				max: {
+					type: 'invalid',
+					message: 'Value is above the maximum.',
+				},
+			} );
+			expect( isValid ).toBe( false );
+		} );
+	} );
+
+	describe( 'isValid empty array (date)', () => {
+		it( 'empty array is valid for min validation', () => {
+			const item = { id: 1, dateRange: [] as string[] };
+			const fields: Field< {} >[] = [
+				{
+					id: 'dateRange',
+					type: 'date',
+					isValid: {
+						min: '2026-04-01',
+					},
+				},
+			];
+			const form = { fields: [ 'dateRange' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+
+		it( 'empty array is valid for max validation', () => {
+			const item = { id: 1, dateRange: [] as string[] };
+			const fields: Field< {} >[] = [
+				{
+					id: 'dateRange',
+					type: 'date',
+					isValid: {
+						max: '2026-04-30',
+					},
+				},
+			];
+			const form = { fields: [ 'dateRange' ] };
+			const {
+				result: {
+					current: { validity, isValid },
+				},
+			} = renderHook( () => useFormValidity( item, fields, form ) );
+			expect( validity ).toEqual( undefined );
+			expect( isValid ).toBe( true );
+		} );
+	} );
+
 	describe( 'isValid.minLength', () => {
 		const MIN_LENGTH_MESSAGE = {
 			minLength: {

package/src/types/dataviews.ts

@@ -527,6 +527,15 @@ export type ViewPickerProps< Item > =
 	| ViewPickerTableProps< Item >;
 
 export interface SupportedLayouts {
+	list?: Omit< ViewList, 'type' > | true;
+	grid?: Omit< ViewGrid, 'type' > | true;
+	table?: Omit< ViewTable, 'type' > | true;
+	activity?: Omit< ViewActivity, 'type' > | true;
+	pickerGrid?: Omit< ViewPickerGrid, 'type' > | true;
+	pickerTable?: Omit< ViewPickerTable, 'type' > | true;
+}
+
+export interface NormalizedSupportedLayouts {
 	list?: Omit< ViewList, 'type' >;
 	grid?: Omit< ViewGrid, 'type' >;
 	table?: Omit< ViewTable, 'type' >;

package/src/types/field-api.ts

@@ -82,8 +82,8 @@ export type Rules< Item > = {
 	pattern?: string;
 	minLength?: number;
 	maxLength?: number;
-	min?: number;
-	max?: number;
+	min?: number | string;
+	max?: number | string;
 	custom?:
 		| ( ( item: Item, field: NormalizedField< Item > ) => null | string )
 		| ( (
@@ -125,8 +125,8 @@ export type NormalizedRules< Item > = {
 	pattern?: NormalizedRule< Item, string >;
 	minLength?: NormalizedRule< Item, number >;
 	maxLength?: NormalizedRule< Item, number >;
-	min?: NormalizedRule< Item, number >;
-	max?: NormalizedRule< Item, number >;
+	min?: NormalizedRule< Item, number > | NormalizedRule< Item, string >;
+	max?: NormalizedRule< Item, number > | NormalizedRule< Item, string >;
 	custom?: CustomValidator< Item >;
 };
 
@@ -184,12 +184,9 @@ export type EditConfig =
 	| EditConfigDatetime
 	| EditConfigGeneric;
 
-/**
- * A dataview field for a specific property of a data type.
- */
 export type Field< Item > = {
 	/**
-	 * Type of the fields.
+	 * Type of the field.
 	 */
 	type?: FieldTypeName;
 
@@ -235,7 +232,12 @@ export type Field< Item > = {
 	sort?: ( a: Item, b: Item, direction: SortDirection ) => number;
 
 	/**
-	 * Callback used to validate the field.
+	 * Validation config for the field.
+	 *
+	 * Range rules are normalized according to `type`:
+	 * - `'integer' | 'number'`: `min`/`max` accept `number`
+	 * - `'date' | 'datetime'`: `min`/`max` accept `string`
+	 * - all other field types ignore `min`/`max`
 	 */
 	isValid?: Rules< Item >;
 
@@ -244,6 +246,18 @@ export type Field< Item > = {
 	 */
 	isVisible?: ( item: Item ) => boolean;
 
+	/**
+	 * Whether a field should be disabled.
+	 * Can be a boolean or a callback receiving the current item and field.
+	 * Defaults to false.
+	 */
+	isDisabled?:
+		| boolean
+		| ( ( args: {
+				item: Item;
+				field: NormalizedField< Item >;
+		  } ) => boolean );
+
 	/**
 	 * Whether the field is sortable.
 	 */
@@ -380,6 +394,10 @@ export type NormalizedField< Item > = Omit<
 	filterBy: Required< FilterByConfig > | false;
 	filter: FilterOperatorMap< Item >;
 	readOnly: boolean;
+	isDisabled: ( args: {
+		item: Item;
+		field: NormalizedField< Item >;
+	} ) => boolean;
 	format:
 		| {}
 		| Required< FormatDate >