Add text domains

blocks/bauhaus-centenary/index.php

@@ -15,4 +15,6 @@
 			'editor_style'    => 'wpcom-blocks-editor',
 		]
 	);
+
+	wp_set_script_translations( 'a8c/bauhaus-centenary', 'bauhaus-centenary' );
 } );

blocks/bauhaus-centenary/src/colors.js

@@ -4,9 +4,9 @@
 import { __ } from '@wordpress/i18n';
 
 export default [
-	{ name: __( 'Black' ), color: '#000000' },
-	{ name: __( 'Blue' ), color: '#051BF4' },
-	{ name: __( 'Red' ), color: '#D32121' },
-	{ name: __( 'Yellow' ), color: '#F7FC1C' },
-	{ name: __( 'White' ), color: '#FFFFFF' },
+	{ name: __( 'Black', 'bauhaus-centenary' ), color: '#000000' },
+	{ name: __( 'Blue', 'bauhaus-centenary' ), color: '#051BF4' },
+	{ name: __( 'Red', 'bauhaus-centenary' ), color: '#D32121' },
+	{ name: __( 'Yellow', 'bauhaus-centenary' ), color: '#F7FC1C' },
+	{ name: __( 'White', 'bauhaus-centenary' ), color: '#FFFFFF' },
 ];

blocks/bauhaus-centenary/src/edit.js

@@ -43,7 +43,7 @@ const Edit = ( {
 	return (
 		<>
 			<InspectorControls>
-				<PanelBody title={ __( 'Styles' ) }>
+				<PanelBody title={ __( 'Styles', 'bauhaus-centenary' ) }>
 					<div role="listbox">
 						{ Object.entries( categories ).map( ( [ category, { label, preview } ] ) => {
 							const isCategorySelected = category === attributes.category;
@@ -79,32 +79,32 @@ const Edit = ( {
 					{ ExtraStyles && <ExtraStyles setAttributes={ setAttributes } attributes={ attributes } /> }
 				</PanelBody>
 				<PanelColorSettings
-					title={ __( 'Color' ) }
+					title={ __( 'Color', 'bauhaus-centenary' ) }
 					initialOpen
 					colorSettings={ [
 						{
 							colors,
 							value: backgroundColor.color,
 							onChange: setBackgroundColor,
-							label: __( 'Background' ),
+							label: __( 'Background', 'bauhaus-centenary' ),
 						},
 						{
 							colors,
 							value: attributes.fill1Color,
 							onChange: ( fill1Color ) => setAttributes( { fill1Color } ),
-							label: __( 'Fill 1' ),
+							label: __( 'Fill 1', 'bauhaus-centenary' ),
 						},
 						{
 							colors,
 							value: attributes.fill2Color,
 							onChange: ( fill2Color ) => setAttributes( { fill2Color } ),
-							label: __( 'Fill 2' ),
+							label: __( 'Fill 2', 'bauhaus-centenary' ),
 						},
 						{
 							colors,
 							value: attributes.fill3Color,
 							onChange: ( fill3Color ) => setAttributes( { fill3Color } ),
-							label: __( 'Fill 3' ),
+							label: __( 'Fill 3', 'bauhaus-centenary' ),
 						},
 					] }
 				/>
@@ -124,7 +124,7 @@ const Edit = ( {
 					{ ( ! RichText.isEmpty( attributes.caption ) || isSelected ) && (
 						<RichText
 							tagName="figcaption"
-							placeholder={ __( 'Write caption…' ) }
+							placeholder={ __( 'Write caption…', 'bauhaus-centenary' ) }
 							value={ attributes.caption }
 							onChange={ ( caption ) => setAttributes( { caption } ) }
 							inlineToolbar
@@ -133,8 +133,8 @@ const Edit = ( {
 				</figure>
 			) : (
 				<Placeholder
-					label={ __( 'Bauhaus Centenary' ) }
-					instructions={ __( 'Celebrate the centenary of the design school' ) }
+					label={ __( 'Bauhaus Centenary', 'bauhaus-centenary' ) }
+					instructions={ __( 'Celebrate the centenary of the design school', 'bauhaus-centenary' ) }
 					icon={ <Icon.BauhausIcon /> }
 					className={ className }
 				>

blocks/bauhaus-centenary/src/forms.js

@@ -26,7 +26,7 @@ const Forms = ( { className, attributes } ) => {
 const Content = Forms;
 
 export default Object.assign( Forms, {
-	label: __( 'Forms' ),
+	label: __( 'Forms', 'bauhaus-centenary' ),
 	icon: <Icon.FormsIcon />,
 	preview: <Icon.FormsPreview />,
 	Content,

blocks/bauhaus-centenary/src/heights.js

@@ -4,7 +4,7 @@
 import { __ } from '@wordpress/i18n';
 
 export default [
-	{ label: __( 'Small' ), value: 64 },
-	{ label: __( 'Medium' ), value: 128 },
-	{ label: __( 'Large' ), value: 256 },
+	{ label: __( 'Small', 'bauhaus-centenary' ), value: 64 },
+	{ label: __( 'Medium', 'bauhaus-centenary' ), value: 128 },
+	{ label: __( 'Large', 'bauhaus-centenary' ), value: 256 },
 ];

blocks/bauhaus-centenary/src/index.js

@@ -14,7 +14,7 @@ import { BauhausIcon } from './icon';
 export const registerBlock = () => {
 	registerBlockType( 'a8c/bauhaus-centenary', {
 		title: 'Bauhaus Centenary',
-		description: __( 'Celebrate the centenary of the design school' ),
+		description: __( 'Celebrate the centenary of the design school', 'bauhaus-centenary' ),
 		icon: BauhausIcon,
 		category: 'widgets',
 		supports: {

blocks/bauhaus-centenary/src/ribbon.js

@@ -42,7 +42,7 @@ const Ribbon = ( { attributes } ) => {
 const Content = Ribbon;
 
 export default Object.assign( Ribbon, {
-	label: __( 'Ribbon' ),
+	label: __( 'Ribbon', 'bauhaus-centenary' ),
 	icon: <Icon.RibbonIcon />,
 	preview: <Icon.RibbonPreview />,
 	Content,

blocks/bauhaus-centenary/src/year.js

@@ -33,17 +33,17 @@ const Content = Year;
 const ExtraStyles = ( { attributes, setAttributes } ) => (
 	<SelectControl
 		options={ [
-			{ label: __( '1919' ), value: '1919' },
-			{ label: __( '2019' ), value: '2019' },
-			{ label: __( '1919–2019' ), value: 'range' },
+			{ label: __( '1919', 'bauhaus-centenary' ), value: '1919' },
+			{ label: __( '2019', 'bauhaus-centenary' ), value: '2019' },
+			{ label: __( '1919–2019', 'bauhaus-centenary' ), value: 'range' },
 		] }
 		value={ attributes.year }
 		onChange={ ( year ) => setAttributes( { year } ) }
 	/>
 );
 
 export default Object.assign( Year, {
-	label: __( 'Year' ),
+	label: __( 'Year', 'bauhaus-centenary' ),
 	icon: <Icon.YearIcon />,
 	preview: <Icon.YearPreview />,
 	Content,

blocks/layout-grid/index.php

@@ -12,6 +12,8 @@
 		'style' => 'wpcom-blocks',
 		'editor_style' => 'wpcom-blocks-editor',
 	] );
+
+	wp_set_script_translations( 'jetpack/layout-grid', 'layout-grid' );
 } );
 
 add_action( 'wp_head', function() {

blocks/layout-grid/src/constants.js

@@ -5,28 +5,28 @@
 import { __ } from '@wordpress/i18n';
 
 export const getPaddingValues = () => (	[
-	{ value: 'none', label: __( 'No padding' ) },
-	{ value: 'small', label: __( 'Small' ) },
-	{ value: 'medium', label: __( 'Medium' ) },
-	{ value: 'large', label: __( 'Large' ) },
-	{ value: 'huge', label: __( 'Huge' ) },
+	{ value: 'none', label: __( 'No padding', 'layout-grid' ) },
+	{ value: 'small', label: __( 'Small', 'layout-grid' ) },
+	{ value: 'medium', label: __( 'Medium', 'layout-grid' ) },
+	{ value: 'large', label: __( 'Large', 'layout-grid' ) },
+	{ value: 'huge', label: __( 'Huge', 'layout-grid' ) },
 ] );
 
 export const getColumns = () => ( [
 	{
-		label: __( '1 column' ),
+		label: __( '1 column', 'layout-grid' ),
 		value: 1,
 	},
 	{
-		label: __( '2 columns' ),
+		label: __( '2 columns', 'layout-grid' ),
 		value: 2,
 	},
 	{
-		label: __( '3 columns' ),
+		label: __( '3 columns', 'layout-grid' ),
 		value: 3,
 	},
 	{
-		label: __( '4 columns' ),
+		label: __( '4 columns', 'layout-grid' ),
 		value: 4,
 	},
 ] );
@@ -36,9 +36,9 @@ export const DEVICE_TABLET = 'Tablet';
 export const DEVICE_MOBILE = 'Mobile';
 
 export const getLayouts = () => ( [
-	{ value: DEVICE_DESKTOP, label: __( 'Desktop' ) },
-	{ value: DEVICE_TABLET, label: __( 'Tablet' ) },
-	{ value: DEVICE_MOBILE, label: __( 'Mobile' ) },
+	{ value: DEVICE_DESKTOP, label: __( 'Desktop', 'layout-grid' ) },
+	{ value: DEVICE_TABLET, label: __( 'Tablet', 'layout-grid' ) },
+	{ value: DEVICE_MOBILE, label: __( 'Mobile', 'layout-grid' ) },
 ] );
 
 export const MAX_COLUMNS = 4;

blocks/layout-grid/src/grid-column/edit.js

@@ -107,19 +107,19 @@ class Edit extends Component {
 
 				<InspectorControls>
 					<PanelColorSettings
-						title={ __( 'Column Color' ) }
+						title={ __( 'Column Color', 'layout-grid' ) }
 						initialOpen
 						colorSettings={ [
 							{
 								value: backgroundColor.color,
 								onChange: setBackgroundColor,
-								label: __( 'Background' ),
+								label: __( 'Background', 'layout-grid' ),
 							},
 						] }
 					/>
 
-					<PanelBody title={ __( 'Column Padding' ) }>
-						<p>{ __( 'Choose padding for this column:' ) }</p>
+					<PanelBody title={ __( 'Column Padding', 'layout-grid' ) }>
+						<p>{ __( 'Choose padding for this column:', 'layout-grid' ) }</p>
 						<SelectControl
 							value={ padding }
 							onChange={ newValue => setAttributes( { padding: newValue } ) }

blocks/layout-grid/src/grid/edit.js

@@ -125,19 +125,19 @@ class Edit extends Component {
 
 			settings.push( (
 				<div className="jetpack-layout-grid-settings" key={ column }>
-					<strong>{ __( 'Column' ) } { column + 1 }</strong>
+					<strong>{ __( 'Column', 'layout-grid' ) } { column + 1 }</strong>
 					<div className="jetpack-layout-grid-settings__group">
 						<TextControl
 							type="number"
-							label={ __( 'Offset' ) }
+							label={ __( 'Offset', 'layout-grid' ) }
 							value={ offset || 0 }
 							min={ 0 }
 							max={ getGridWidth( device ) - 1 }
 							onChange={ ( value ) => this.onChangeOffset( column, device, value ) }
 						/>
 						<TextControl
 							type="number"
-							label={ __( 'Span' ) }
+							label={ __( 'Span', 'layout-grid' ) }
 							value={ span }
 							min={ 1 }
 							max={ getGridWidth( device ) }
@@ -153,12 +153,12 @@ class Edit extends Component {
 
 	getPreviewText( device ) {
 		if ( device === 'Mobile' ) {
-			return __( 'Showing mobile layout' );
+			return __( 'Showing mobile layout', 'layout-grid' );
 		} else if ( device === 'Tablet' ) {
-			return __( 'Showing tablet layout' );
+			return __( 'Showing tablet layout', 'layout-grid' );
 		}
 
-		return __( 'Showing desktop layout' );
+		return __( 'Showing desktop layout', 'layout-grid' );
 	}
 
 	canResizeBreakpoint( device ) {
@@ -199,8 +199,8 @@ class Edit extends Component {
 			return (
 				<Placeholder
 					icon="layout"
-					label={ __( 'Choose Layout' ) }
-					instructions={ __( 'Select a layout to start with:' ) }
+					label={ __( 'Choose Layout', 'layout-grid' ) }
+					instructions={ __( 'Select a layout to start with:', 'layout-grid' ) }
 					className={ classes }
 				>
 					<ul className="block-editor-inner-blocks__template-picker-options">
@@ -240,7 +240,7 @@ class Edit extends Component {
 					/>
 
 					<InspectorControls>
-						<PanelBody title={ __( 'Layout' ) }>
+						<PanelBody title={ __( 'Layout', 'layout-grid' ) }>
 							<div className="jetpack-layout-grid-columns block-editor-block-styles">
 								{ getColumns().map( ( column ) => (
 									<div
@@ -271,10 +271,10 @@ class Edit extends Component {
 								) ) }
 							</div>
 
-							<p><em>{ __( 'Changing the number of columns will reset your layout and could remove content.' ) }</em></p>
+							<p><em>{ __( 'Changing the number of columns will reset your layout and could remove content.', 'layout-grid' ) }</em></p>
 						</PanelBody>
 
-						<PanelBody title={ __( 'Responsive Breakpoints' ) }>
+						<PanelBody title={ __( 'Responsive Breakpoints', 'layout-grid' ) }>
 							<p><em>{ __( "Note that previewing your post will show your browser's breakpoint, not the currently selected one." ) }</em></p>
 							<ButtonGroup>
 								{ getLayouts().map( ( layout ) => (
@@ -292,11 +292,11 @@ class Edit extends Component {
 							{ this.renderDeviceSettings( columns, selectedDevice, attributes ) }
 						</PanelBody>
 
-						<PanelBody title={ __( 'Gutter' ) }>
+						<PanelBody title={ __( 'Gutter', 'layout-grid' ) }>
 							<ToggleControl
-								label={ __( 'Add end gutters' ) }
+								label={ __( 'Add end gutters', 'layout-grid' ) }
 								help={
-									addGutterEnds ? __( 'Toggle off to remove the spacing left and right of the grid.' ) : __( 'Toggle on to add space left and right of the layout grid. ' )
+									addGutterEnds ? __( 'Toggle off to remove the spacing left and right of the grid.', 'layout-grid' ) : __( 'Toggle on to add space left and right of the layout grid. ', 'layout-grid' )
 								}
 								checked={ addGutterEnds }
 								onChange={ newValue => setAttributes( { addGutterEnds: newValue } )  }

blocks/layout-grid/src/index.js

@@ -31,8 +31,8 @@ function getColumnAttributes( total, breakpoints ) {
 
 export function registerBlock() {
 	registerBlockType( 'jetpack/layout-grid', {
-		title: __( 'Layout Grid' ),
-		description: __( 'Align blocks to to a global grid, with support for responsive breakpoints.' ),
+		title: __( 'Layout Grid', 'layout-grid' ),
+		description: __( 'Align blocks to to a global grid, with support for responsive breakpoints.', 'layout-grid' ),
 		icon: GridIcon,
 		category: 'layout',
 		supports: {
@@ -51,7 +51,7 @@ export function registerBlock() {
 							name: 'core/paragraph',
 							attributes: {
 								customFontSize: 32,
-								content: __( '<strong>Snow Patrol</strong>' ),
+								content: __( '<strong>Snow Patrol</strong>', 'layout-grid' ),
 								align: 'center',
 							},
 						},
@@ -86,8 +86,8 @@ export function registerBlock() {
 	} );
 
 	registerBlockType( 'jetpack/layout-grid-column', {
-		description: __( 'A column used inside a Layout Grid block.' ),
-		title: __( 'Column' ),
+		description: __( 'A column used inside a Layout Grid block.', 'layout-grid' ),
+		title: __( 'Column', 'layout-grid' ),
 		icon: GridIcon,
 		category: 'layout',
 		parent: [ 'jetpack/layout-grid' ],

blocks/starscape/index.php

@@ -6,4 +6,6 @@
 		'style' => 'wpcom-blocks',
 		'editor_style' => 'wpcom-blocks-editor',
 	] );
+
+	wp_set_script_translations( 'a8c/starscape', 'starscape' );
 } );