Fix ESLint errors (https://github.com/woocommerce/woocommerce-blocks/pull/7556)

* Add type to imports that need it

* Add type to imports that need it

* Fix the sanitize lint error

* Include missing dep

* Remove check from deps

* bot: update checkstyle.xml

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

plugins/woocommerce-blocks/.vscode/storybook.code-snippets

@@ -5,7 +5,7 @@
 			"/**",
 			" * External dependencies",
 			" */",
-			"import { Story, Meta } from '@storybook/react';",
+			"import type { Story, Meta } from '@storybook/react';",
 			"",
 			"/**",
 			" * Internal dependencies",

plugins/woocommerce-blocks/assets/js/atomic/blocks/product-elements/rating/edit.tsx

@@ -3,7 +3,7 @@
  */
 import { __ } from '@wordpress/i18n';
 import { useBlockProps } from '@wordpress/block-editor';
-import { BlockEditProps } from '@wordpress/blocks';
+import type { BlockEditProps } from '@wordpress/blocks';
 import { useEffect } from 'react';
 import { ProductQueryContext as Context } from '@woocommerce/blocks/product-query/types';
 

plugins/woocommerce-blocks/assets/js/base/components/button/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/coupon/stories/index.tsx

@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { useArgs } from '@storybook/client-api';
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { INTERACTION_TIMEOUT } from '@woocommerce/storybook-controls';
 import { useDispatch } from '@wordpress/data';
 import { VALIDATION_STORE_KEY } from '@woocommerce/block-data';

plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/discount/stories/index.tsx

@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { useArgs } from '@storybook/client-api';
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import {
 	currenciesAPIShape as currencies,
 	currencyControl,

plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/footer-item/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { allSettings } from '@woocommerce/settings';
 import { Currency } from '@woocommerce/types';
 

plugins/woocommerce-blocks/assets/js/base/components/chip/stories/chip.stories.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/base/components/chip/stories/removable-chip.stories.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/base/components/country-input/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { useDispatch } from '@wordpress/data';
 import { useState, useEffect } from '@wordpress/element';
 import { VALIDATION_STORE_KEY } from '@woocommerce/block-data';

plugins/woocommerce-blocks/assets/js/base/components/form-token-field/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { useState } from '@wordpress/element';
 
 /**

plugins/woocommerce-blocks/assets/js/base/components/price-slider/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { useState } from '@wordpress/element';
 import { currencies, currencyControl } from '@woocommerce/storybook-controls';
 

plugins/woocommerce-blocks/assets/js/base/components/product-name/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/base/components/product-price/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { currencyControl } from '@woocommerce/storybook-controls';
 
 /**

plugins/woocommerce-blocks/assets/js/base/components/quantity-selector/stories/index.tsx

@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { useArgs } from '@storybook/client-api';
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/base/components/read-more/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/blocks/active-filters/edit.tsx

@@ -3,7 +3,7 @@
  */
 import { __ } from '@wordpress/i18n';
 import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
-import { BlockEditProps } from '@wordpress/blocks';
+import type { BlockEditProps } from '@wordpress/blocks';
 import BlockTitle from '@woocommerce/editor-components/block-title';
 import {
 	Disabled,

plugins/woocommerce-blocks/assets/js/blocks/cart-checkout-shared/block-settings/index.tsx

@@ -4,7 +4,7 @@
 import { InspectorControls } from '@wordpress/block-editor';
 import { PanelBody, ToggleControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
-import { BlockAttributes } from '@wordpress/blocks';
+import type { BlockAttributes } from '@wordpress/blocks';
 
 export const BlockSettings = ( {
 	attributes,

plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-shipping-address-block/block.tsx

@@ -69,7 +69,12 @@ const Block = ( {
 			setBillingAddress( shippingAddress );
 		}
 		setAddressesSynced( true );
-	}, [ setBillingAddress, shippingAddress, useShippingAsBilling ] );
+	}, [
+		addressesSynced,
+		setBillingAddress,
+		shippingAddress,
+		useShippingAsBilling,
+	] );
 
 	const addressFieldsConfig = useMemo( () => {
 		return {

plugins/woocommerce-blocks/assets/js/blocks/classic-template/index.tsx

@@ -2,12 +2,12 @@
  * External dependencies
  */
 import {
-	BlockEditProps,
 	createBlock,
 	getBlockType,
 	registerBlockType,
 	unregisterBlockType,
 } from '@wordpress/blocks';
+import type { BlockEditProps } from '@wordpress/blocks';
 import {
 	isExperimentalBuild,
 	WC_BLOCKS_IMAGE_URL,

plugins/woocommerce-blocks/assets/js/blocks/classic-template/utils.ts

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Block } from '@wordpress/blocks';
+import type { Block } from '@wordpress/blocks';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/blocks/handpicked-products/types.ts

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { BlockAlignment } from '@wordpress/blocks';
+import type { BlockAlignment } from '@wordpress/blocks';
 
 export interface Attributes {
 	align?: BlockAlignment;

plugins/woocommerce-blocks/assets/js/blocks/product-query/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Block } from '@wordpress/blocks';
+import type { Block } from '@wordpress/blocks';
 import { addFilter } from '@wordpress/hooks';
 
 /**

plugins/woocommerce-blocks/assets/js/blocks/products-by-attribute/types.ts

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { BlockAlignment } from '@wordpress/blocks';
+import type { BlockAlignment } from '@wordpress/blocks';
 
 export interface Attributes {
 	align?: BlockAlignment;

plugins/woocommerce-blocks/assets/js/blocks/stock-filter/block.tsx

@@ -232,12 +232,7 @@ const StockStatusFilterBlock = ( {
 
 			updateFilterUrl( checkedOptions );
 		},
-		[
+		[ isEditor, setProductStockStatusQuery, filteringForPhpTemplate ]
-			isEditor,
-			setProductStockStatusQuery,
-			checked,
-			filteringForPhpTemplate,
-		]
 	);
 
 	// Track checked STATE changes - if state changes, update the query.

plugins/woocommerce-blocks/assets/js/editor-components/error-placeholder/stories/error-message.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/editor-components/error-placeholder/stories/error-placeholder.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { useArgs } from '@storybook/client-api';
 import { INTERACTION_TIMEOUT } from '@woocommerce/storybook-controls';
 

plugins/woocommerce-blocks/assets/js/editor-components/external-link-card/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/assets/js/icons/stories/index.tsx

@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { omitBy } from 'lodash';
-import { Story } from '@storybook/react';
+import type { Story } from '@storybook/react';
 import { useState } from '@wordpress/element';
 import { Icon } from '@wordpress/icons';
 

plugins/woocommerce-blocks/assets/js/utils/sanitize-html.ts

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { sanitize } from 'dompurify';
+import DOMPurify from 'dompurify';
 
 const ALLOWED_TAGS = [ 'a', 'b', 'em', 'i', 'strong', 'p', 'br' ];
 const ALLOWED_ATTR = [ 'target', 'href', 'rel', 'name', 'download' ];
@@ -13,7 +13,7 @@ export const sanitizeHTML = (
 	const tagsValue = config?.tags || ALLOWED_TAGS;
 	const attrValue = config?.attr || ALLOWED_ATTR;
 
-	return sanitize( html, {
+	return DOMPurify.sanitize( html, {
 		ALLOWED_TAGS: tagsValue,
 		ALLOWED_ATTR: attrValue,
 	} );

plugins/woocommerce-blocks/packages/checkout/components/checkbox-control/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 
 /**
  * Internal dependencies

plugins/woocommerce-blocks/packages/checkout/components/totals/fees/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import {
 	currenciesAPIShape,
 	currencies,

plugins/woocommerce-blocks/packages/checkout/components/totals/item/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { currencies, currencyControl } from '@woocommerce/storybook-controls';
 
 /**

plugins/woocommerce-blocks/packages/checkout/components/totals/subtotal/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { currencies, currencyControl } from '@woocommerce/storybook-controls';
 
 /**

plugins/woocommerce-blocks/packages/checkout/components/totals/taxes/stories/index.tsx

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import { currencies, currencyControl } from '@woocommerce/storybook-controls';
 
 /**

plugins/woocommerce-blocks/storybook/README.md

@@ -38,7 +38,7 @@ Let's see the code in detail.
 This is the minimal scaffold you need for your new Story:
 
 ```tsx
-import { Story, Meta } from '@storybook/react';
+import type { Story, Meta } from '@storybook/react';
 import MyComponent, { MyComponentProps } from '..';
 
 export default {