fix some components deprecated notices

nk-crew · Nov 28, 2024 · 816b9bb · 816b9bb
1 parent 972bfb6
commit 816b9bb
Show file tree

Hide file tree

Showing 42 changed files with 184 additions and 20 deletions.
diff --git a/assets/admin/templates/index.js b/assets/admin/templates/index.js
@@ -14,7 +14,7 @@ import { useSelect } from '@wordpress/data';
 import { useEntityProp } from '@wordpress/core-data';
 import { PanelRow, SelectControl } from '@wordpress/components';
 import { useDebounce } from '@wordpress/compose';
-import { PluginDocumentSettingPanel } from '@wordpress/edit-post';
+import { PluginDocumentSettingPanel } from '@wordpress/editor';
 
 /**
  * Internal dependencies
@@ -182,6 +182,8 @@ function UpdateEditor() {
 						onChange={(value) => {
 							updateMeta('_lzb_template_post_types', value);
 						}}
+						__next40pxDefaultSize
+						__nextHasNoMarginBottom
 					/>
 				</div>
 			</PanelRow>
@@ -194,6 +196,8 @@ function UpdateEditor() {
 						onChange={(value) => {
 							updateMeta('_lzb_template_lock', value);
 						}}
+						__next40pxDefaultSize
+						__nextHasNoMarginBottom
 					/>
 				</div>
 			</PanelRow>

diff --git a/assets/admin/tools/tools.js b/assets/admin/tools/tools.js
@@ -112,7 +112,7 @@ export default function Templates() {
 		return (
 			<>
 				<div className="lzb-export-select-items">
-					<BaseControl>
+					<BaseControl __nextHasNoMarginBottom>
 						<ToggleControl
 							label={__('Select all', 'lazy-blocks')}
 							checked={
@@ -140,6 +140,7 @@ export default function Templates() {
 									setDisabledTemplates(newDisabled);
 								}
 							}}
+							__nextHasNoMarginBottom
 						/>
 						{data[type].map((item) => {
 							const isSelected =
@@ -215,6 +216,7 @@ export default function Templates() {
 											setDisabledTemplates(newDisabled);
 										}
 									}}
+									__nextHasNoMarginBottom
 								/>
 							);
 						})}
@@ -228,6 +230,8 @@ export default function Templates() {
 								className="lzb-export-code"
 								readOnly
 								value={getPHPStringCode(type)}
+								__next40pxDefaultSize
+								__nextHasNoMarginBottom
 							/>
 						</div>
 						<div className="lzb-export-buttons">

diff --git a/assets/components/block-slug/editor.scss b/assets/components/block-slug/editor.scss
@@ -13,7 +13,7 @@
 		white-space: nowrap;
 		padding: 6px 8px;
 		padding-right: 10px;
-		height: 32px;
+		height: 40px;
 		border: 1px solid #949494;
 		line-height: normal;
 		color: $gray-800;
@@ -39,7 +39,9 @@
 		flex: 1;
 		margin-bottom: 0 !important;
 
-		input {
+		input.components-text-control__input {
+			padding-left: 5px;
+			padding-right: 5px;
 			margin-left: 0;
 			border-left: none;
 			border-top-left-radius: 0;

diff --git a/assets/components/block-slug/index.js b/assets/components/block-slug/index.js
@@ -17,7 +17,11 @@ import { __ } from '@wordpress/i18n';
 
 export default function BlockSlug(props) {
 	return (
-		<BaseControl id={props.label} label={props.label || ''}>
+		<BaseControl
+			id={props.label}
+			label={props.label || ''}
+			__nextHasNoMarginBottom
+		>
 			<div className="lazyblocks-component-block-slug">
 				<Dropdown
 					className="lazyblocks-component-block-slug-prefix-dropdown"
@@ -61,6 +65,8 @@ export default function BlockSlug(props) {
 						...props,
 						...{ label: '' },
 					}}
+					__next40pxDefaultSize
+					__nextHasNoMarginBottom
 				/>
 			</div>
 		</BaseControl>

diff --git a/assets/components/icon-picker/index.js b/assets/components/icon-picker/index.js
@@ -88,6 +88,8 @@ function IconPickerDropdown(props) {
 							onChange={(searchVal) => setSearch(searchVal)}
 							placeholder={__('Type to Search…', 'lazy-blocks')}
 							autoComplete="off"
+							__next40pxDefaultSize
+							__nextHasNoMarginBottom
 						/>
 					</Fragment>
 				),
@@ -297,7 +299,12 @@ function IconPickerDropdown(props) {
 	);
 
 	return label ? (
-		<BaseControl id={label} label={label} className={className}>
+		<BaseControl
+			id={label}
+			label={label}
+			className={className}
+			__nextHasNoMarginBottom
+		>
 			{dropdown}
 		</BaseControl>
 	) : (

diff --git a/assets/components/pro-notice/index.js b/assets/components/pro-notice/index.js
@@ -22,6 +22,7 @@ export default function ProNotice() {
 				id="lazyblocks-pro-notice"
 				label={__('Lazy Blocks Pro', 'lazy-blocks')}
 				className="lazyblocks-component-pro-notice"
+				__nextHasNoMarginBottom
 			>
 				<div>
 					<a
@@ -34,7 +35,10 @@ export default function ProNotice() {
 					</a>
 					<ul className="ul-square">
 						<li>
-							{__('Custom Slugs and Collections', 'lazy-blocks')}
+							{__(
+								'Custom block collections and slug namespaces',
+								'lazy-blocks'
+							)}
 						</li>
 						<li>
 							{__('Controls Conditional Logic', 'lazy-blocks')}

diff --git a/assets/components/tabs/index.js b/assets/components/tabs/index.js
@@ -10,7 +10,7 @@ import { BaseControl, TabPanel } from '@wordpress/components';
 
 export default function Tabs({ tabs, children }) {
 	return (
-		<BaseControl>
+		<BaseControl __nextHasNoMarginBottom>
 			<TabPanel tabs={tabs} className="lazyblocks-component-tabs">
 				{children}
 			</TabPanel>

diff --git a/assets/editor-constructor/boxes/code/index.js b/assets/editor-constructor/boxes/code/index.js
@@ -101,6 +101,8 @@ export default function CustomCodeSettings(props) {
 				value={data.code_output_method || 'html'}
 				onChange={(value) => updateData({ code_output_method: value })}
 				isAdaptiveWidth
+				__next40pxDefaultSize
+				__nextHasNoMarginBottom
 			>
 				<ToggleGroupControlOption
 					value="html"
@@ -128,7 +130,7 @@ export default function CustomCodeSettings(props) {
 		data.code_output_method !== 'template' ? (
 			<>
 				<PanelBody>
-					<BaseControl>
+					<BaseControl __nextHasNoMarginBottom>
 						{tabs.length > 1 ? (
 							<TabPanel
 								className="lazyblocks-control-tabs"
@@ -153,7 +155,7 @@ export default function CustomCodeSettings(props) {
 							}}
 						/>
 					</BaseControl>
-					<BaseControl>
+					<BaseControl __nextHasNoMarginBottom>
 						{!showInfo ? (
 							<Button
 								isLink
@@ -209,7 +211,7 @@ export default function CustomCodeSettings(props) {
 				</PanelBody>
 
 				<PanelBody>
-					<BaseControl>
+					<BaseControl __nextHasNoMarginBottom>
 						<ToggleControl
 							label={__(
 								'Single output code for Frontend and Editor',
@@ -219,6 +221,7 @@ export default function CustomCodeSettings(props) {
 							onChange={(value) =>
 								updateData({ code_single_output: value })
 							}
+							__nextHasNoMarginBottom
 						/>
 					</BaseControl>
 				</PanelBody>
@@ -287,6 +290,7 @@ export default function CustomCodeSettings(props) {
 			<BaseControl
 				id="lazyblocks-settings-output-in-editor"
 				label={__('Code Output in Editor', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				<SelectControl
 					id="lazyblocks-settings-output-in-editor"
@@ -318,6 +322,8 @@ export default function CustomCodeSettings(props) {
 					onChange={(value) =>
 						updateData({ code_show_preview: value })
 					}
+					__next40pxDefaultSize
+					__nextHasNoMarginBottom
 				/>
 			</BaseControl>
 		</PanelBody>,

diff --git a/assets/editor-constructor/boxes/condition/index.js b/assets/editor-constructor/boxes/condition/index.js
@@ -50,6 +50,7 @@ export default function ConditionSettings(props) {
 		<BaseControl
 			id="lazyblocks-boxes-condition-posts"
 			label={__('Show in posts', 'lazy-blocks')}
+			__nextHasNoMarginBottom
 		>
 			<Select
 				id="lazyblocks-boxes-condition-posts"

diff --git a/assets/editor-constructor/boxes/general/index.js b/assets/editor-constructor/boxes/general/index.js
@@ -112,6 +112,7 @@ export default function GeneralSettings({ data, updateData }) {
 			<BaseControl
 				id="lazyblocks-boxes-general-category"
 				label={__('Category', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				<Select
 					id="lazyblocks-boxes-general-category"
@@ -138,6 +139,7 @@ export default function GeneralSettings({ data, updateData }) {
 					'Make it easier to discover a block with keyword aliases',
 					'lazy-blocks'
 				)}
+				__nextHasNoMarginBottom
 			>
 				<Select
 					id="lazyblocks-boxes-general-keywords"
@@ -187,6 +189,7 @@ export default function GeneralSettings({ data, updateData }) {
 				label={__('Description', 'lazy-blocks')}
 				value={description}
 				onChange={(value) => updateData({ description: value })}
+				__nextHasNoMarginBottom
 			/>
 		</PanelBody>,
 		settingsData

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/default.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/default.js
@@ -26,6 +26,8 @@ export default function DefaultRow(props) {
 				help={__('Appears when inserting a new block', 'lazy-blocks')}
 				value={data.default}
 				onChange={(value) => updateData({ default: value })}
+				__next40pxDefaultSize
+				__nextHasNoMarginBottom
 			/>
 		</PanelBody>
 	);

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/group.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/group.js
@@ -12,6 +12,7 @@ export default function GroupRow(props) {
 			<BaseControl
 				id="lazyblocks-settings-group"
 				label={__('Group', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				<SelectControl
 					id="lazyblocks-settings-row-group"
@@ -26,6 +27,8 @@ export default function GroupRow(props) {
 							group: value,
 						})
 					}
+					__next40pxDefaultSize
+					__nextHasNoMarginBottom
 				/>
 			</BaseControl>
 		</PanelBody>

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/help.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/help.js
@@ -14,6 +14,7 @@ export default function HelpRow(props) {
 				help={__('Instructions under control', 'lazy-blocks')}
 				value={data.help}
 				onChange={(value) => updateData({ help: value })}
+				__nextHasNoMarginBottom
 			/>
 		</PanelBody>
 	);

diff --git a/.../editor-constructor/boxes/selected-control-settings/settings-rows/hide-if-not-selected.js b/.../editor-constructor/boxes/selected-control-settings/settings-rows/hide-if-not-selected.js
@@ -12,6 +12,7 @@ export default function HideIfNotSelectedRow(props) {
 			<BaseControl
 				id="lazyblocks-settings-row-hide-if-no-selected"
 				label={__('Hide if block is not selected', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				<ToggleControl
 					id="lazyblocks-settings-row-hide-if-no-selected"
@@ -22,6 +23,7 @@ export default function HideIfNotSelectedRow(props) {
 							hide_if_not_selected: value ? 'true' : 'false',
 						})
 					}
+					__nextHasNoMarginBottom
 				/>
 			</BaseControl>
 		</PanelBody>

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/label.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/label.js
@@ -51,6 +51,8 @@ export default function LabelRow(props) {
 				onBlur={allowNameUpdate ? generateUniqueName : () => {}}
 				// eslint-disable-next-line jsx-a11y/no-autofocus
 				autoFocus
+				__next40pxDefaultSize
+				__nextHasNoMarginBottom
 			/>
 		</PanelBody>
 	);

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/name.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/name.js
@@ -30,6 +30,8 @@ export default function NameRow(props) {
 				label={__('Name', 'lazy-blocks')}
 				value={name}
 				onChange={(value) => updateData({ name: value })}
+				__next40pxDefaultSize
+				__nextHasNoMarginBottom
 			/>
 			{!isNameValid ? (
 				<Notice

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/placement.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/placement.js
@@ -43,6 +43,7 @@ export default function PlacementRow(props) {
 			<BaseControl
 				id="lazyblocks-settings-row-placement"
 				label={__('Placement', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				<div />
 				<ButtonGroup>

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/required.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/required.js
@@ -12,6 +12,7 @@ export default function RequiredRow(props) {
 			<BaseControl
 				id="lazyblocks-settings-row-required"
 				label={__('Required', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				<ToggleControl
 					id="lazyblocks-settings-row-required"
@@ -20,6 +21,7 @@ export default function RequiredRow(props) {
 					onChange={(value) =>
 						updateData({ required: value ? 'true' : 'false' })
 					}
+					__nextHasNoMarginBottom
 				/>
 			</BaseControl>
 		</PanelBody>

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/save-in-meta.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/save-in-meta.js
@@ -33,13 +33,15 @@ export default function SaveInMetaRow(props) {
 						{__('How to use?', 'lazy-blocks')}
 					</Button>
 				}
+				__nextHasNoMarginBottom
 			>
 				<ToggleControl
 					label={__('Yes', 'lazy-blocks')}
 					checked={data.save_in_meta === 'true'}
 					onChange={(value) =>
 						updateData({ save_in_meta: value ? 'true' : 'false' })
 					}
+					__nextHasNoMarginBottom
 				/>
 			</BaseControl>
 			{data.save_in_meta === 'true' ? (
@@ -52,6 +54,8 @@ export default function SaveInMetaRow(props) {
 					placeholder={
 						data.name || __('Unique metabox name', 'lazy-blocks')
 					}
+					__next40pxDefaultSize
+					__nextHasNoMarginBottom
 				/>
 			) : (
 				''

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/translate.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/translate.js
@@ -12,6 +12,7 @@ export default function WPMLRow(props) {
 			<BaseControl
 				id="lazyblocks-settings-row-wpml"
 				label={__('WPML Translation', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				<ToggleControl
 					id="lazyblocks-settings-row-wpml"
@@ -24,6 +25,7 @@ export default function WPMLRow(props) {
 					onChange={(value) =>
 						updateData({ translate: value ? 'true' : 'false' })
 					}
+					__nextHasNoMarginBottom
 				/>
 			</BaseControl>
 		</PanelBody>

diff --git a/assets/editor-constructor/boxes/selected-control-settings/settings-rows/type.js b/assets/editor-constructor/boxes/selected-control-settings/settings-rows/type.js
@@ -107,6 +107,7 @@ export default function TypeRow(props) {
 			<BaseControl
 				id="lazyblocks-settings-row-type"
 				label={__('Type', 'lazy-blocks')}
+				__nextHasNoMarginBottom
 			>
 				{/* eslint-disable-next-line react/button-has-type */}
 				<button
@@ -151,6 +152,8 @@ export default function TypeRow(props) {
 								className="lzb-constructor-type-search"
 								// eslint-disable-next-line jsx-a11y/no-autofocus
 								autoFocus
+								__next40pxDefaultSize
+								__nextHasNoMarginBottom
 							/>
 							{Object.keys(allCategories).map((cat) => {
 								if (!availableCategories[cat]) {