Fix: Bottom margin style is deprecated since version 6.7

assets/js/blocks/facets/common/components/facet-display-count-control.js

@@ -19,6 +19,7 @@ export default ({ onChange, checked }) => {
 			checked={checked}
 			label={__('Display count', 'elasticpress')}
 			onChange={onChange}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/blocks/facets/common/components/facet-meta-control.js

@@ -50,6 +50,7 @@ export default ({ onChange, value }) => {
 			onChange={onChange}
 			options={options}
 			value={value}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/blocks/facets/common/components/facet-order-control.js

@@ -52,6 +52,7 @@ export default ({ onChange, orderby, order }) => {
 			}}
 			options={options}
 			value={`${orderby}/${order}`}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/blocks/facets/common/components/facet-search-placeholder-control.js

@@ -19,6 +19,7 @@ export default ({ onChange, value }) => {
 			label={__('Search field placeholder', 'elasticpress')}
 			value={value}
 			onChange={onChange}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/blocks/facets/common/components/facet-taxonomy-control.js

@@ -44,6 +44,7 @@ export default ({ onChange, value }) => {
 			onChange={onChange}
 			options={options}
 			value={value}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/blocks/facets/date/edit.js

@@ -25,6 +25,7 @@ const FacetDate = (props) => {
 						label={__('Display custom date option', 'elasticpress')}
 						checked={displayCustomDate}
 						onChange={(displayCustomDate) => setAttributes({ displayCustomDate })}
+						__nextHasNoMarginBottom
 					/>
 				</PanelBody>
 			</InspectorControls>

assets/js/blocks/facets/meta-range/edit.js

@@ -94,13 +94,15 @@ export default ({ attributes, name, setAttributes }) => {
 								label={__('Value prefix', 'elasticpress')}
 								onChange={onChangePrefix}
 								value={prefix}
+								__nextHasNoMarginBottom
 							/>
 						</FlexItem>
 						<FlexItem>
 							<TextControl
 								label={__('Value suffix', 'elasticpress')}
 								onChange={onChangeSuffix}
 								value={suffix}
+								__nextHasNoMarginBottom
 							/>
 						</FlexItem>
 					</Flex>

assets/js/features/components/control.js

@@ -159,6 +159,7 @@ export default ({
 									label={label}
 									onChange={onChangeCheckbox}
 									disabled={isDisabled}
+									__nextHasNoMarginBottom
 								/>
 							);
 						}
@@ -184,6 +185,7 @@ export default ({
 									disabled={isDisabled}
 									suggestions={suggestions}
 									value={values}
+									__nextHasNoMarginBottom
 								/>
 							);
 						}
@@ -208,6 +210,7 @@ export default ({
 									options={options}
 									disabled={isDisabled}
 									value={value}
+									__nextHasNoMarginBottom
 								/>
 							);
 						}
@@ -219,6 +222,7 @@ export default ({
 									label={label}
 									onChange={onChange}
 									disabled={isDisabled}
+									__nextHasNoMarginBottom
 								/>
 							);
 						}
@@ -242,6 +246,7 @@ export default ({
 									disabled={isDisabled}
 									value={value}
 									type={type}
+									__nextHasNoMarginBottom
 								/>
 							);
 						}

assets/js/search/editor/plugins/exclude-from-search.js

@@ -18,15 +18,10 @@ export default () => {
 		editPost({ meta: { ...meta, ep_exclude_from_search } });
 	};
 
-	let WrapperElement = null;
-	let marginBottomProp = {};
-
-	if (typeof PluginPostStatusInfo !== 'undefined') {
-		WrapperElement = PluginPostStatusInfo;
-		marginBottomProp = { __nextHasNoMarginBottom: true };
-	} else {
-		WrapperElement = PluginPostStatusInfoLegacy;
-	}
+	const WrapperElement =
+		typeof PluginPostStatusInfo !== 'undefined'
+			? PluginPostStatusInfo
+			: PluginPostStatusInfoLegacy;
 
 	return (
 		<WrapperElement>
@@ -38,7 +33,7 @@ export default () => {
 				)}
 				checked={ep_exclude_from_search}
 				onChange={onChange}
-				{...marginBottomProp}
+				__nextHasNoMarginBottom
 			/>
 		</WrapperElement>
 	);

assets/js/sites-admin.js

@@ -57,6 +57,7 @@ const ElasticPressToggleControl = ({ blogId, isDefaultChecked }) => {
 			disabled={isLoading}
 			label={isChecked ? __('On', 'elasticpress') : __('Off', 'elasticpress')}
 			onChange={onChange}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/sync-ui/components/include.js

@@ -53,6 +53,7 @@ export default () => {
 				onChange={onChange}
 				saveTransform={saveTransform}
 				value={args.include}
+				__nextHasNoMarginBottom
 			/>
 		</div>
 	);

assets/js/sync-ui/components/indexables.js

@@ -57,6 +57,7 @@ export default () => {
 					key={indexable}
 					label={label}
 					onChange={(checked) => onChange(indexable, checked)}
+					__nextHasNoMarginBottom
 				/>
 			))}
 		</fieldset>

assets/js/sync-ui/components/limits.js

@@ -56,6 +56,7 @@ export default () => {
 					onChange={onChangeLower}
 					type="number"
 					value={args.lower_limit_object_id}
+					__nextHasNoMarginBottom
 				/>
 			</FlexItem>
 			<FlexItem grow="2">
@@ -67,6 +68,7 @@ export default () => {
 					onChange={onChangeUpper}
 					type="number"
 					value={args.upper_limit_object_id}
+					__nextHasNoMarginBottom
 				/>
 			</FlexItem>
 		</Flex>

assets/js/sync-ui/components/offset.js

@@ -29,6 +29,7 @@ export default () => {
 			onChange={(offset) => setArgs({ ...args, offset })}
 			type="number"
 			value={args.offset}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/sync-ui/components/post-types.js

@@ -52,6 +52,7 @@ export default () => {
 					key={postType}
 					label={label}
 					onChange={(checked) => onChange(postType, checked)}
+					__nextHasNoMarginBottom
 				/>
 			))}
 		</fieldset>

assets/js/sync-ui/components/put-mapping.js

@@ -41,6 +41,7 @@ export default () => {
 				indeterminate={isSyncing && isDeleting && !args.put_mapping}
 				label={__('Delete all data and start fresh sync', 'elasticpress')}
 				onChange={(checked) => setArgs({ ...args, put_mapping: checked })}
+				__nextHasNoMarginBottom
 			/>
 		</>
 	);

assets/js/sync-ui/css/advanced-control.css

@@ -8,6 +8,10 @@
 	&.components-flex .components-flex-item {
 		flex-grow: 2;
 	}
+
+	& .components-checkbox-control {
+		margin-bottom: 1em;
+	}
 }
 
 .ep-sync-advanced-control__label {

assets/js/sync-ui/css/controls.css

@@ -9,3 +9,7 @@
 		justify-self: end;
 	}
 }
+
+.ep-sync-delete {
+	margin-bottom: 1em;
+}

assets/js/synonyms/components/common/edit-panel.js

@@ -69,6 +69,7 @@ const EditPanel = (
 							label={labels.primary}
 							onChange={onChangePrimary}
 							value={primaryValue.map((p) => p.value).join('')}
+							__nextHasNoMarginBottom
 						/>
 					) : null}
 					{mode === 'replacements' ? (
@@ -77,13 +78,15 @@ const EditPanel = (
 							label={labels.primary}
 							onChange={onChangePrimary}
 							value={primaryValue.map((p) => p.value)}
+							__nextHasNoMarginBottom
 						/>
 					) : null}
 					<FormTokenField
 						disabled={disabled}
 						label={labels.synonyms}
 						onChange={onChangeSynonyms}
 						value={synonymsValue.map((h) => h.value)}
+						__nextHasNoMarginBottom
 					/>
 					<Flex justify="start">
 						<FlexItem>

assets/js/synonyms/components/common/list-table.js

@@ -130,6 +130,7 @@ export default ({ children, Colgroup, Head, onDelete, ...props }) => {
 				checked={isAllChecked}
 				indeterminate={checked.length && !isAllChecked}
 				onChange={onCheckAll}
+				__nextHasNoMarginBottom
 			/>
 		),
 		[checked, isAllChecked, onCheckAll],

assets/js/synonyms/components/editors/solr-editor.js

@@ -35,6 +35,7 @@ const SolrEditor = () => {
 			rows="20"
 			value={solr}
 			onChange={onChange}
+			__nextHasNoMarginBottom
 		/>
 	);
 };

assets/js/synonyms/components/editors/visual-editor.js

@@ -300,6 +300,7 @@ export default ({ labels, messages, mode, rules }) => {
 								<CheckboxControl
 									checked={checked.includes(i)}
 									onChange={(isChecked) => check(i, isChecked)}
+									__nextHasNoMarginBottom
 								/>
 							</td>
 							{labels.primary ? (

assets/js/synonyms/css/edit-panel.css

@@ -11,5 +11,14 @@
 			padding-bottom: 4px;
 			padding-top: 4px;
 		}
+
+		& .components-form-token-field__help {
+			margin-bottom: 1em;
+			margin-top: 1em;
+		}
+	}
+
+	& .components-text-control__input {
+		margin-bottom: 1em;
 	}
 }

assets/js/weighting/components/field.js

@@ -60,6 +60,7 @@ export default ({ label, onChange, onDelete, value, showTooltip }) => {
 						checked={enabled}
 						label={__('Searchable', 'elasticpress')}
 						onChange={onChangeSearchable}
+						__nextHasNoMarginBottom
 					/>
 				</div>
 				<div className="ep-weighting-field__weighting">
@@ -70,6 +71,7 @@ export default ({ label, onChange, onDelete, value, showTooltip }) => {
 						min={1}
 						onChange={onChangeWeight}
 						value={weight}
+						__nextHasNoMarginBottom
 					/>
 				</div>
 				<div className="ep-weighting-field__actions">

assets/js/weighting/components/group.js

@@ -184,6 +184,7 @@ export default ({ group, postType }) => {
 						onKeyDown={onKeyDown}
 						placeholder={__('Metadata key', 'elasticpress')}
 						value={toAdd}
+						__nextHasNoMarginBottom
 					/>
 					<Button disabled={!toAdd} isSecondary onClick={onClick} variant="secondary">
 						{__('Add', 'elasticpress')}