Support negation operator in selectors in the Interactivity API (#50732)

* Support negation operator in selectors

* Change file block to use negation operator

lib/experimental/interactivity-api/blocks.php

@@ -23,7 +23,7 @@ function gutenberg_block_core_file_add_directives_to_content( $block_content, $b
 	$processor->next_tag();
 	$processor->set_attribute( 'data-wp-island', '' );
 	$processor->next_tag( 'object' );
-	$processor->set_attribute( 'data-wp-bind.hidden', 'selectors.core.file.hasNoPdfPreview' );
+	$processor->set_attribute( 'data-wp-bind.hidden', '!selectors.core.file.hasPdfPreview' );
 	$processor->set_attribute( 'hidden', true );
 	return $processor->get_updated_html();
 }

packages/block-library/src/file/interactivity.js

@@ -2,15 +2,13 @@
  * Internal dependencies
  */
 import { store } from '../utils/interactivity';
-import { browserSupportsPdfs } from './utils';
+import { browserSupportsPdfs as hasPdfPreview } from './utils';
 
 store( {
 	selectors: {
 		core: {
 			file: {
-				hasNoPdfPreview() {
-					return ! browserSupportsPdfs();
-				},
+				hasPdfPreview,
 			},
 		},
 	},

packages/block-library/src/utils/interactivity/hooks.js

@@ -19,26 +19,28 @@ export const directive = ( name, cb ) => {
 
 // Resolve the path to some property of the store object.
 const resolve = ( path, ctx ) => {
-	// If path starts with !, remove it and save a flag.
-	const hasNegationOperator =
-		path[ 0 ] === '!' && !! ( path = path.slice( 1 ) );
 	let current = { ...store, context: ctx };
 	path.split( '.' ).forEach( ( p ) => ( current = current[ p ] ) );
-	return hasNegationOperator ? ! current : current;
+	return current;
 };
 
 // Generate the evaluate function.
 const getEvaluate =
 	( { ref } = {} ) =>
 	( path, extraArgs = {} ) => {
+		// If path starts with !, remove it and save a flag.
+		const hasNegationOperator =
+			path[ 0 ] === '!' && !! ( path = path.slice( 1 ) );
 		const value = resolve( path, extraArgs.context );
-		return typeof value === 'function'
-			? value( {
-					ref: ref.current,
-					...store,
-					...extraArgs,
-			  } )
-			: value;
+		const returnValue =
+			typeof value === 'function'
+				? value( {
+						ref: ref.current,
+						...store,
+						...extraArgs,
+				  } )
+				: value;
+		return hasNegationOperator ? ! returnValue : returnValue;
 	};
 
 // Directive wrapper.