Add a control to allow columns to be changed.

WordPress · Nov 8, 2023 · 6bab98c · 6bab98c
1 parent 4162d7a
commit 6bab98c
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 4 deletions.
diff --git a/source/wp-content/themes/wporg-main-2022/src/remembers-list/edit.js b/source/wp-content/themes/wporg-main-2022/src/remembers-list/edit.js
@@ -2,13 +2,26 @@
  * WordPress dependencies
  */
 
-import { useBlockProps } from '@wordpress/block-editor';
-import { Disabled } from '@wordpress/components';
+import { Disabled, PanelBody, RangeControl } from '@wordpress/components';
 import ServerSideRender from '@wordpress/server-side-render';
+import { InspectorControls, useBlockProps } from '@wordpress/block-editor';
+import { __ } from '@wordpress/i18n';
 
-export default function Edit( { attributes, name } ) {
+export default function Edit( { attributes, name, setAttributes } ) {
+	const { columns } = attributes;
 	return (
 		<div { ...useBlockProps() }>
+			<InspectorControls>
+				<PanelBody title={ __( 'Settings', 'wporg' ) }>
+					<RangeControl
+						label={ __( 'Columns', 'wporg' ) }
+						value={ columns }
+						onChange={ ( newNumber ) => setAttributes( { columns: parseInt( newNumber ) } ) }
+						min={ Math.max( 1, 1 ) }
+						max={ Math.max( 6, 10 ) }
+					/>
+				</PanelBody>
+			</InspectorControls>
 			<Disabled>
 				<ServerSideRender block={ name } attributes={ attributes } />
 			</Disabled>

diff --git a/source/wp-content/themes/wporg-main-2022/src/remembers-list/style.scss b/source/wp-content/themes/wporg-main-2022/src/remembers-list/style.scss
@@ -7,4 +7,4 @@
 		color: var(--wp--custom--link--color--text);
 		text-decoration: underline;
 	}
-}
+}
-Original file line number
+Diff line change
@@ Expand Up / @@ -7,4 +7,4 @@ @@
     		color: var(--wp--custom--link--color--text);
     		text-decoration: underline;
     	}
-    }
+    }