@automattic/newspack-blocks - npm Package Compare versions

Comparing version 4.3.6-hotfix-hpp-find-coauthors-posts.1 to 4.4.0-alpha.1

dist/blocks/author-list/block.json

 {
   "name": "author-list",
   "category": "newspack",
+  "apiVersion": 3,
   "attributes": {
@@ -5,0 +6,0 @@ "className": {

dist/blocks/author-profile/block.json

 {
   "name": "author-profile",
   "category": "newspack",
+  "apiVersion": 3,
   "attributes": {
@@ -5,0 +6,0 @@ "className": {

dist/blocks/checkout-button/block.json

 {
   "$schema": "https://schemas.wp.org/trunk/block.json",
-  "apiVersion": 2,
+  "apiVersion": 3,
   "name": "newspack-blocks/checkout-button",
@@ -5,0 +5,0 @@ "title": "Checkout Button",

dist/blocks/donate/block.json

 {
   "name": "donate",
   "category": "newspack",
+  "apiVersion": 3,
   "attributes": {
@@ -5,0 +6,0 @@ "className": {

dist/blocks/homepage-articles/block.json

 {
   "name": "homepage-articles",
   "category": "newspack",
+  "apiVersion": 3,
   "attributes": {
@@ -5,0 +6,0 @@ "className": {

dist/blocks/iframe/block.json

 {
   "name": "iframe",
   "category": "newspack",
+  "apiVersion": 3,
   "attributes": {
@@ -5,0 +6,0 @@ "className": {

package.json

 {
 	"name": "@automattic/newspack-blocks",
-	"version": "4.3.6-hotfix-hpp-find-coauthors-posts.1",
+	"version": "4.4.0-alpha.1",
 	"author": "Automattic",
@@ -16,3 +16,3 @@ "devDependencies": {
 		"lint-staged": "^15.2.10",
-		"newspack-components": "^3.0.0",
+		"newspack-components": "^3.1.0",
 		"newspack-scripts": "^5.5.2",
@@ -19,0 +19,0 @@ "postcss-scss": "^4.0.9"

src/blocks/author-list/block.json

 {
 	"name": "author-list",
 	"category": "newspack",
+	"apiVersion": 3,
 	"attributes": {
@@ -87,2 +88,2 @@ "className": {
 	}
-}
+}

src/blocks/author-profile/block.json

 {
 	"name": "author-profile",
 	"category": "newspack",
+	"apiVersion": 3,
 	"attributes": {
@@ -58,2 +59,2 @@ "className": {
 	}
-}
+}

src/blocks/checkout-button/block.json

 {
 	"$schema": "https://schemas.wp.org/trunk/block.json",
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "newspack-blocks/checkout-button",
@@ -8,3 +8,8 @@ "title": "Checkout Button",
 	"description": "Modal checkout button for WooCommerce products.",
-	"keywords": [ "woocommerce", "product", "checkout", "button" ],
+	"keywords": [
+		"woocommerce",
+		"product",
+		"checkout",
+		"button"
+	],
 	"textdomain": "newspack-blocks",
@@ -56,3 +61,6 @@ "attributes": {
 		"anchor": true,
-		"align": [ "center", "wide" ],
+		"align": [
+			"center",
+			"wide"
+		],
 		"color": {
@@ -82,3 +90,6 @@ "__experimentalSkipSerialization": true,
 			"__experimentalSkipSerialization": true,
-			"padding": [ "horizontal", "vertical" ],
+			"padding": [
+				"horizontal",
+				"vertical"
+			],
 			"__experimentalDefaultControls": {
@@ -97,7 +108,14 @@ "padding": true
 	"styles": [
-		{ "name": "fill", "label": "Fill", "isDefault": true },
-		{ "name": "outline", "label": "Outline" }
+		{
+			"name": "fill",
+			"label": "Fill",
+			"isDefault": true
+		},
+		{
+			"name": "outline",
+			"label": "Outline"
+		}
 	],
 	"editorStyle": "newspack-checkout-button-editor",
 	"style": "newspack-checkout-block-button"
-}
+}

src/blocks/donate/block.json

 {
 	"name": "donate",
 	"category": "newspack",
+	"apiVersion": 3,
 	"attributes": {
@@ -101,2 +102,2 @@ "className": {
 	}
-}
+}

src/blocks/donate/utils.ts

@@ -54,2 +54,18 @@ import { __, _x, sprintf } from '@wordpress/i18n';
 export const getFrequencyLabel = (
+	frequencySlug: DonationFrequencySlug,
+	hideOnceLabel = false
+) => {
+	// eslint-disable-next-line no-nested-ternary
+	return frequencySlug === 'once'
+		? hideOnceLabel
+			? ''
+			: __( ' once', 'newspack-blocks' )
+		: sprintf(
+			// Translators: %s is the frequency (e.g. per month, per year).
+			_x( ' per %s', 'per `Frequency`', 'newspack-blocks' ),
+			frequencySlug
+		);
+}
+
+export const getFrequencyLabelWithAmount = (
 	amount: number,
@@ -92,13 +108,3 @@ frequencySlug: DonationFrequencySlug,
 
-	const frequency =
-		// eslint-disable-next-line no-nested-ternary
-		frequencySlug === 'once'
-			? hideOnceLabel
-				? ''
-				: __( ' once', 'newspack-blocks' )
-			: sprintf(
-				// Translators: %s is the frequency (e.g. per month, per year).
-				_x( ' per %s', 'per `Frequency`', 'newspack-blocks' ),
-				frequencySlug
-			);
+	const frequency = getFrequencyLabel(frequencySlug, hideOnceLabel)
 
@@ -105,0 +111,0 @@ return template

src/blocks/homepage-articles/block.json

 {
 	"name": "homepage-articles",
 	"category": "newspack",
+	"apiVersion": 3,
 	"attributes": {
@@ -225,3 +226,5 @@ "className": {
 			"type": "array",
-			"default": ["post"],
+			"default": [
+				"post"
+			],
 			"items": {
@@ -237,3 +240,5 @@ "type": "string"
 			"type": "array",
-			"default": ["publish"],
+			"default": [
+				"publish"
+			],
 			"items": {
@@ -248,2 +253,2 @@ "type": "string"
 	}
-}
+}

src/blocks/homepage-articles/index.js

@@ -25,3 +25,3 @@ /**
 
-export const title = __( 'Homepage Posts', 'newspack-blocks' );
+export const title = __( 'Content Loop', 'newspack-blocks' );
 
@@ -52,7 +52,19 @@ export const icon = (
 		__( 'latest', 'newspack-blocks' ),
+		__( 'homepage', 'newspack-blocks' ),
+		__( 'query', 'newspack-blocks' ),
 	],
-	description: __( 'A block for displaying homepage posts.', 'newspack-blocks' ),
+	description: __(
+		'An advanced block that allows displaying content based on different parameters and visual configurations.',
+		'newspack-blocks'
+	),
 	styles: [
-		{ name: 'default', label: _x( 'Default', 'block style', 'newspack-blocks' ), isDefault: true },
-		{ name: 'borders', label: _x( 'Borders', 'block style', 'newspack-blocks' ) },
+		{
+			name: 'default',
+			label: _x('Default', 'block style', 'newspack-blocks'),
+			isDefault: true,
+		},
+		{
+			name: 'borders',
+			label: _x('Borders', 'block style', 'newspack-blocks'),
+		},
 	],
@@ -59,0 +71,0 @@ supports: {

src/blocks/homepage-articles/utils.ts

@@ -271,3 +271,3 @@ /**
 		// Only editor blocks can trigger reflows.
-		// @ts-ignore It's a string.
+		// @ts-expect-error It's a string.
 		triggerReflow: isEditorBlock ? dispatch( STORE_NAMESPACE ).reflow : () => undefined,
@@ -274,0 +274,0 @@ };

src/blocks/iframe/block.json

 {
 	"name": "iframe",
 	"category": "newspack",
+	"apiVersion": 3,
 	"attributes": {
@@ -34,2 +35,2 @@ "className": {
 	}
-}
+}

src/components/autocomplete-tokenfield.js

@@ -184,2 +184,3 @@ /**
 					label={ label }
+					__next40pxDefaultSize
 				/>
@@ -186,0 +187,0 @@ { loading && <Spinner /> }

src/components/editor-panels.js

@@ -5,3 +5,3 @@ /**
 import { __ } from '@wordpress/i18n';
-import { Spinner, CheckboxControl, PanelBody, PanelRow } from '@wordpress/components';
+import { BaseControl, CheckboxControl, PanelBody, Spinner } from '@wordpress/components';
 import { useSelect } from '@wordpress/data';
@@ -14,17 +14,16 @@
 	return options.map( ( { name, slug } ) => (
-		<PanelRow key={ slug }>
-			<CheckboxControl
-				label={ name }
-				checked={ values.indexOf( slug ) > -1 }
-				onChange={ value => {
-					const cleanPostType = [ ...new Set( values ) ];
-					if ( value && cleanPostType.indexOf( slug ) === -1 ) {
-						cleanPostType.push( slug );
-					} else if ( ! value && cleanPostType.indexOf( slug ) > -1 ) {
-						cleanPostType.splice( cleanPostType.indexOf( slug ), 1 );
-					}
-					onChange( cleanPostType );
-				} }
-			/>
-		</PanelRow>
+		<CheckboxControl
+			label={ name }
+			checked={ values.indexOf( slug ) > -1 }
+			onChange={ value => {
+				const cleanPostType = [ ...new Set( values ) ];
+				if ( value && cleanPostType.indexOf( slug ) === -1 ) {
+					cleanPostType.push( slug );
+				} else if ( ! value && cleanPostType.indexOf( slug ) > -1 ) {
+					cleanPostType.splice( cleanPostType.indexOf( slug ), 1 );
+				}
+				onChange( cleanPostType );
+			} }
+			key={ slug }
+		/>
 	) );
@@ -55,3 +54,3 @@ };
 	return (
-		<PanelBody title={ __( 'Post Types', 'newspack-blocks' ) }>
+		<PanelBody title={ __( 'Post Types', 'newspack-blocks' ) } initialOpen={ false }>
 			<CheckboxesGroup
@@ -68,11 +67,4 @@ options={ availablePostTypes }
 	return (
-		<PanelBody title={ __( 'Additional Post Statuses', 'newspack-blocks' ) }>
-			<PanelRow>
-				<i>
-					{ __(
-						'Selection here has effect only for editors, regular users will only see published posts.',
-						'newspack-blocks'
-					) }
-				</i>
-			</PanelRow>
+		<PanelBody title={ __( 'Additional Post Statuses', 'newspack-blocks' ) } initialOpen={ false }>
+			<BaseControl help={ __( 'Selection here has effect only for editors, regular users will only see published posts.', 'newspack-blocks' ) } />
 			<CheckboxesGroup
@@ -79,0 +71,0 @@ values={ attributes.includedPostStatuses }

src/components/query-controls.js

@@ -6,3 +6,9 @@ /**
 import { Component } from '@wordpress/element';
-import { Button, QueryControls as BasicQueryControls, ToggleControl } from '@wordpress/components';
+import {
+	BaseControl,
+	Button,
+	ButtonGroup,
+	CheckboxControl,
+	QueryControls as BasicQueryControls
+} from '@wordpress/components';
 import apiFetch from '@wordpress/api-fetch';
@@ -23,6 +29,2 @@ import { addQueryArgs } from '@wordpress/url';
 class QueryControls extends Component {
-	state = {
-		showAdvancedFilters: false,
-	};
-
 	fetchPostSuggestions = search => {
@@ -222,2 +224,3 @@ const { postType } = this.props;
 			onSpecificModeChange,
+			onLoopModeChange,
 			specificPosts,
@@ -243,3 +246,2 @@ onSpecificPostsChange,
 		} = this.props;
-		const { showAdvancedFilters } = this.state;
 
@@ -262,7 +264,29 @@ const registeredCustomTaxonomies = window.newspack_blocks_data?.custom_taxonomies;
 				{ enableSpecific && (
-					<ToggleControl
-						checked={ specificMode }
-						onChange={ onSpecificModeChange }
-						label={ __( 'Choose Specific Posts', 'newspack-blocks' ) }
-					/>
+					<BaseControl
+						label={ __( 'Type', 'newspack-blocks' ) }
+						id="newspack-block__loop-type"
+						className="newspack-block__button-group"
+						help={ specificMode ? (
+							__( 'The block will display only the specifically selected post(s).', 'newspack-blocks' )
+						) : (
+							__( 'The block will display content based on the filtering settings below.', 'newspack-blocks' )
+						) }
+					>
+						<ButtonGroup>
+							<Button
+								variant={ ! specificMode && 'primary' }
+								aria-pressed={ ! specificMode }
+								onClick={ onLoopModeChange }
+							>
+								{ __( 'Query', 'newspack-blocks' ) }
+							</Button>
+							<Button
+								variant={ specificMode && 'primary' }
+								aria-pressed={ specificMode }
+								onClick={ onSpecificModeChange }
+							>
+								{ __( 'Specific', 'newspack-blocks' ) }
+							</Button>
+						</ButtonGroup>
+					</BaseControl>
 				) }
@@ -303,3 +327,3 @@ { specificMode ? (
 						{ onIncludeSubcategoriesChange && (
-							<ToggleControl
+							<CheckboxControl
 								checked={ includeSubcategories }
@@ -320,5 +344,5 @@ onChange={ onIncludeSubcategoriesChange }
 						{ onCustomTaxonomiesChange &&
-							registeredCustomTaxonomies.map( tax => (
+							registeredCustomTaxonomies.map( ( tax, index ) => (
 								<AutocompleteTokenField
-									key={ `${ customTaxonomies[ tax.slug ] }-selector` }
+									key={ index }
 									tokens={ getTermsOfCustomTaxonomy( customTaxonomies, tax.slug ) }
@@ -340,61 +364,45 @@ onChange={ value => {
 							) ) }
+						{ onCategoryExclusionsChange && (
+							<AutocompleteTokenField
+								tokens={ categoryExclusions || [] }
+								onChange={ onCategoryExclusionsChange }
+								fetchSuggestions={ this.fetchCategorySuggestions }
+								fetchSavedInfo={ this.fetchSavedCategories }
+								label={ __( 'Excluded categories', 'newspack-blocks' ) }
+							/>
+						) }
 						{ onTagExclusionsChange && (
-							<p>
-								<Button
-									isLink
-									onClick={ () => this.setState( { showAdvancedFilters: ! showAdvancedFilters } ) }
-								>
-									{ showAdvancedFilters
-										? __( 'Hide Advanced Filters', 'newspack-blocks' )
-										: __( 'Show Advanced Filters', 'newspack-blocks' ) }
-								</Button>
-							</p>
+							<AutocompleteTokenField
+								tokens={ tagExclusions || [] }
+								onChange={ onTagExclusionsChange }
+								fetchSuggestions={ this.fetchTagSuggestions }
+								fetchSavedInfo={ this.fetchSavedTags }
+								label={ __( 'Excluded tags', 'newspack-blocks' ) }
+							/>
 						) }
-						{ showAdvancedFilters && (
-							<>
-								{ onTagExclusionsChange && (
-									<AutocompleteTokenField
-										tokens={ tagExclusions || [] }
-										onChange={ onTagExclusionsChange }
-										fetchSuggestions={ this.fetchTagSuggestions }
-										fetchSavedInfo={ this.fetchSavedTags }
-										label={ __( 'Excluded Tags', 'newspack-blocks' ) }
-									/>
-								) }
-								{ onCategoryExclusionsChange && (
-									<AutocompleteTokenField
-										tokens={ categoryExclusions || [] }
-										onChange={ onCategoryExclusionsChange }
-										fetchSuggestions={ this.fetchCategorySuggestions }
-										fetchSavedInfo={ this.fetchSavedCategories }
-										label={ __( 'Excluded Categories', 'newspack-blocks' ) }
-									/>
-								) }
-								{ registeredCustomTaxonomies &&
-									onCustomTaxonomyExclusionsChange &&
-									registeredCustomTaxonomies.map( ( { label, slug } ) => (
-										<AutocompleteTokenField
-											fetchSavedInfo={ termIds => this.fetchSavedCustomTaxonomies( slug, termIds ) }
-											fetchSuggestions={ search =>
-												this.fetchCustomTaxonomiesSuggestions( slug, search )
-											}
-											key={ `${ slug }-exclusions-selector` }
-											label={ sprintf(
-												// translators: %s is the custom taxonomy label.
-												__( 'Excluded %s', 'newspack-blocks' ),
-												label
-											) }
-											onChange={ value =>
-												customTaxonomiesPrepareChange(
-													customTaxonomyExclusions,
-													onCustomTaxonomyExclusionsChange,
-													slug,
-													value
-												)
-											}
-											tokens={ getTermsOfCustomTaxonomy( customTaxonomyExclusions, slug ) }
-										/>
-									) ) }
-							</>
-						) }
+						{ registeredCustomTaxonomies &&
+							onCustomTaxonomyExclusionsChange &&
+							registeredCustomTaxonomies.map( ( { label, slug } ) => (
+								<AutocompleteTokenField
+									fetchSavedInfo={ termIds => this.fetchSavedCustomTaxonomies( slug, termIds ) }
+									fetchSuggestions={ search =>
+										this.fetchCustomTaxonomiesSuggestions( slug, search )
+									}
+									key={ `${ slug }-exclusions-selector` }
+									label={ sprintf(
+										// translators: %s is the custom taxonomy label.
+										__( 'Excluded %s', 'newspack-blocks' ),
+										label
+									) }
+									onChange={ value =>
+										customTaxonomiesPrepareChange(
+											customTaxonomyExclusions,
+											onCustomTaxonomyExclusionsChange,
+											slug,
+											value
+										)
+									}
+									tokens={ getTermsOfCustomTaxonomy( customTaxonomyExclusions, slug ) }
+								/>
+							) ) }
 					</>
@@ -401,0 +409,0 @@ ) }

webpack.config.js

@@ -36,4 +36,11 @@ /**
 const viewBlocksScripts = blocks.reduce( ( viewBlocks, block ) => {
-	const viewScriptPath = path.join( __dirname, 'src', 'blocks', block, 'view.js' );
-	if ( fs.existsSync( viewScriptPath ) ) {
+	const pathToBlock = [ __dirname, 'src', 'blocks', block ];
+	let viewScriptPath = path.join( ...pathToBlock, 'view.js' );
+	let fileExists = fs.existsSync( viewScriptPath );
+	if ( !fileExists ) {
+		// Try TS.
+		viewScriptPath = path.join( ...pathToBlock, 'view.ts' );
+		fileExists = fs.existsSync( viewScriptPath );
+	}
+	if ( fileExists ) {
 		viewBlocks[ block + '/view' ] = viewScriptPath;
@@ -40,0 +47,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

3809645

increased by0.28%

Lines of code

14095

increased by0.96%

No dependency changes