change request part 2

-hover state notice
-orange indicator
-reset button
-bug fixes

Author: Gambit

src/block/columns/editor.scss

@@ -28,7 +28,7 @@
 
 .stk-block-columns > .stk-block-content > .block-editor-inner-blocks > .block-editor-block-list__layout {
 	column-gap: var(--stk-column-gap, 0px);
-	row-gap: var(--stk-column-row-gap, 0px);
+	row-gap: var(--stk-columns-row-gap, 0px);
 }
 
 // For Firefox polyfill

src/block/columns/style.scss

@@ -9,8 +9,9 @@
 }
 
 .stk-block-columns > .stk-block-content {
-	// --stk-column-gap: 0px; // For nested columns, this takes precedence.
-	column-gap: var(--stk-column-gap, 0px);
+	--stk-column-gap: var(--stk-columns-column-gap, 0px); // For nested columns, this takes precedence.
+	column-gap: var(--stk-column-gap);
+	row-gap: var(--stk-columns-row-gap, 0px);
 	margin-left: auto;
 	margin-right: auto;
 }

src/components/base-control2/hover-state-toggle.js

@@ -94,6 +94,13 @@ const HoverStateToggle = props => {
 		}
 		return state
 	} ).map( state => {
+		if ( props.forceUpdateHoverState ) {
+			return {
+				...state,
+				hasValue: props.hasHoverStateValue?.[ state.value ] ?? false,
+			}
+		}
+
 		if ( state.value === 'normal' || ! props.attribute ) {
 			return state
 		}
@@ -118,6 +125,7 @@ HoverStateToggle.defaultProps = {
 	attribute: '',
 	hasResponsive: false, // Wether the attribute has responsive attributes (where we have hover states per device type)
 	forceUpdateHoverState: false,
+	hasHoverStateValue: undefined,
 }
 
 export default memo( HoverStateToggle )

src/components/base-control2/index.js

@@ -88,6 +88,7 @@ export const BaseControl = props => {
 								attribute={ props.attribute }
 								hasResponsive={ hasResponsive }
 								forceUpdateHoverState={ props.forceUpdateHoverState }
+								hasHoverStateValue={ props.hasHoverStateValue }
 							/>
 						) }
 					</div>
@@ -141,6 +142,12 @@ BaseControl.defaultProps = {
 	helpTooltip: EMPTY_OBJ, // If supplied, displays a help tooltip when hovering on the label.
 
 	forceUpdateHoverState: false,
+
+	// If hasHoverStateValue is supplied, it should contain the following:
+	// { hover: boolean, 'parent-hover': boolean }
+	// If 'hover' or 'parent-hover' is true, then the hover toggle will be highlighted to show that the hover state value has been set
+	hasHoverStateValue: undefined,
+
 }
 
 const AdvancedControl = props => {
@@ -195,6 +202,11 @@ AdvancedControl.defaultProps = {
 	helpTooltip: EMPTY_OBJ, // If supplied, displays a help tooltip when hovering on the label.
 
 	forceUpdateHoverState: false,
+
+	// If hasHoverStateValue is supplied, it should contain the following:
+	// { hover: boolean, 'parent-hover': boolean }
+	// If 'hover' or 'parent-hover' is true, then the hover toggle will be highlighted to show that the hover state value has been set
+	hasHoverStateValue: undefined,
 }
 
 export default AdvancedControl

src/components/help-tooltip/index.js

@@ -26,8 +26,8 @@ const HelpTooltip = props => {
 		placement="left"
 		offset={ 28 }
 		noArrow={ false }
-		onFocusOutside={ props.onClose }
-		onEscape={ props.onClose }
+		onFocusOutside={ props.closeOnEscape ? props.onClose : NOOP }
+		onEscape={ props.closeOnEscape ? props.onClose : NOOP }
 	>
 		<PanelBody>
 			<button
@@ -48,12 +48,14 @@ const HelpTooltip = props => {
 			}
 			<h4>{ props.title }</h4>
 			<p>{ props.description }</p>
-			<CheckboxControl
-				label={ __( 'Stop showing tooltips', i18n ) }
-				className="ugb-help-tooltip__checkbox"
-				checked={ ! props.tooltipsEnabled }
-				onChange={ checked => props.onTooltipsEnabledChange( ! checked ) }
-			/>
+			{ props.showTooltipCheckbox &&
+				<CheckboxControl
+					label={ __( 'Stop showing tooltips', i18n ) }
+					className="ugb-help-tooltip__checkbox"
+					checked={ ! props.tooltipsEnabled }
+					onChange={ checked => props.onTooltipsEnabledChange( ! checked ) }
+				/>
+			}
 		</PanelBody>
 	</Popover>
 }
@@ -62,7 +64,9 @@ HelpTooltip.defaultProps = {
 	title: '',
 	video: '',
 	description: '',
+	closeOnEscape: true,
 	onClose: NOOP,
+	showTooltipCheckbox: true,
 	tooltipsEnabled: true,
 	onTooltipsEnabledChange: NOOP,
 }