Add filter hook to disable the preview button (#16)

.distignore

@@ -9,6 +9,7 @@
 .editorconfig
 .eslintignore
 .eslintrc.js
+.markdownlint.json
 .gitignore
 .npmrc
 .nvmrc

.markdownlint.json

@@ -0,0 +1,6 @@
+{
+	"default": true,
+	"MD013": { "line_length": 9999 },
+	"MD024": false,
+	"no-hard-tabs": false
+}

README.md

@@ -41,6 +41,23 @@ function custom_enable_responsive_image_default_media_value( $default_media_valu
 add_filter( 'enable_responsive_image_default_media_value', 'custom_enable_responsive_image_default_media_value' );
 ```
 
+### `enable_responsive_image_show_preview_button( $show_preview_button )`
+
+Filters whether the preview button is displayed on the block toolbar.
+
+#### Parameters
+
+- `$show_preview_button`
+
+  *(boolean)* Whether the preview button is displayed on the block toolbar. Default is `true`.
+
+#### Example
+
+```php
+// Disable the preview button.
+add_filter( 'enable_responsive_image_show_preview_button', '__return_false' );
+```
+
 ## Resources
 
 ### Image for screenshot

enable-responsive-image.php

@@ -35,6 +35,7 @@ function enable_responsive_image_enqueue_block_editor_assets() {
 		'enableResponsiveImage',
 		array(
 			'defaultMediaValue' => (int) apply_filters( 'enable_responsive_image_default_media_value', 600 ),
+			'showPreviewButton' => (bool) apply_filters( 'enable_responsive_image_show_preview_button', true ),
 		)
 	);
 

src/constants.ts

@@ -9,6 +9,8 @@ export const DEFAULT_MEDIA_VALUE = isNaN(
 	? 600
 	: parseInt( window?.enableResponsiveImage?.defaultMediaValue );
 
+export const SHOW_PREVIEW_BUTTON = window?.enableResponsiveImage?.showPreviewButton === '1';
+
 export const MEDIA_TYPES = [
 	{
 		label: __( 'max-width', 'enable-responsive-image' ),

src/index.tsx

@@ -16,6 +16,7 @@ import BlockEditPreview from './block-edit-preview';
 import SourceList from './source-list';
 import './editor.scss';
 import './store';
+import { SHOW_PREVIEW_BUTTON } from './constants';
 import type { BlockAttributes } from './types';
 
 const addSourceAttributes = ( settings: { [ key: string ]: any } ) => {
@@ -70,7 +71,7 @@ const withInspectorControl =
 				) : (
 					<BlockEdit { ...props } />
 				) }
-				{ url && sources?.length > 0 && (
+				{ url && sources?.length > 0 && SHOW_PREVIEW_BUTTON && (
 					<BlockControls
 						// @ts-ignore
 						group="parent"

src/types.ts

@@ -18,6 +18,7 @@ export interface Media {
 
 export interface enableResponsiveImageVars {
 	defaultMediaValue: string;
+	showPreviewButton: string;
 }
 
 declare global {