@secretstache/wordpress-gutenberg 0.7.0 → 0.7.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@secretstache/wordpress-gutenberg",
-  "version": "0.7.0",
+  "version": "0.7.2",
   "description": "",
   "author": "Secret Stache",
   "license": "GPL-2.0-or-later",

package/src/components/MediaControl.jsx

@@ -27,7 +27,7 @@ export const ImageRenderer = ({
             <Button
                 className="bc-remove-btn"
                 onClick={onRemoveClick}
-                isSecondary
+                variant="secondary"
                 isDestructive
             >
                 {removeButtonLabel}
@@ -61,7 +61,7 @@ export const VideoRenderer = ({
             <Button
                 className="bc-remove-btn"
                 onClick={onRemoveClick}
-                isSecondary
+                variant="secondary"
                 isDestructive
             >
                 {removeButtonLabel}
@@ -158,16 +158,15 @@ export const MediaControl = ({
 
                 {
                     hasFocalPoint && mediaId && mediaUrl && (
-                        <BaseControl label={focalPointLabel}>
-                            <FocalPointPicker
-                                __nextHasNoMarginBottom
-                                url={mediaUrl}
-                                value={focalPoint}
-                                onDragStart={onFocalPointChange}
-                                onDrag={onFocalPointChange}
-                                onChange={onFocalPointChange}
-                            />
-                        </BaseControl>
+                        <FocalPointPicker
+                            __nextHasNoMarginBottom
+                            label={focalPointLabel}
+                            url={mediaUrl}
+                            value={focalPoint}
+                            onDragStart={onFocalPointChange}
+                            onDrag={onFocalPointChange}
+                            onChange={onFocalPointChange}
+                        />
                     )
                 }
             </>

package/src/components/MediaWithFocalPointControl.jsx

@@ -36,7 +36,7 @@ export const MediaWithFocalPointControl = memo(({
 
             [focalPointAttributeName]: { x: 0.5, y: 0.5 }
         });
-    }, [ mediaAttributeName ]);
+    }, [ mediaAttributeName, focalPointAttributeName ]);
 
     const onMediaRemove = useCallback(() => {
         setAttributes({
@@ -62,16 +62,15 @@ export const MediaWithFocalPointControl = memo(({
             </BaseControl>
 
             {media?.url && (
-                <BaseControl label={focalPointLabel}>
-                    <FocalPointPicker
-                        __nextHasNoMarginBottom
-                        url={media.url}
-                        value={focalPoint}
-                        onDragStart={onFocalPointChange}
-                        onDrag={onFocalPointChange}
-                        onChange={onFocalPointChange}
-                    />
-                </BaseControl>
+                <FocalPointPicker
+                    __nextHasNoMarginBottom
+                    label={focalPointLabel}
+                    url={media.url}
+                    value={focalPoint}
+                    onDragStart={onFocalPointChange}
+                    onDrag={onFocalPointChange}
+                    onChange={onFocalPointChange}
+                />
             )}
         </>
     );

package/src/components/index.js

@@ -13,7 +13,6 @@ export * from './MediaTypeControl.jsx';
 export * from './InsertBlockToolbar.jsx';
 export * from './PreviewControl.jsx';
 export * from './MediaWithFocalPointControl.jsx';
-export * from './MediaWithFocalPointControl.jsx';
 export * from './EmptyBlockPlaceholder.jsx';
 export * from './PatternAppender.jsx';
 export * from './PatternsModal.jsx';

package/src/filters/index.js

@@ -3,6 +3,7 @@ import { dispatch } from '@wordpress/data';
 export * from './hide-root-block-for-other.js';
 export * from './inner-blocks-cleanup.jsx';
 export * from './root-block.js';
+export * from './root-block-default.js';
 export * from './block-categories.js';
 
 export const setPostTypeFilters = (filters, currentPostType, onSet) => {

package/src/filters/root-block-default.js

@@ -0,0 +1,44 @@
+import { subscribe, select, dispatch } from '@wordpress/data';
+import { createBlock } from '@wordpress/blocks';
+
+/* WordPress's own empty-canvas fallback (clicking/focusing the "Type / to
+   choose a block" prompt) inserts core/paragraph with no ancestor check,
+   bypassing RootBlockFilter's "everything lives inside the root block" rule.
+   getBlockCount() with no rootClientId only ever reflects the top-level
+   canvas, so this never fires for an emptied-out Column/Group — those still
+   fall back to the normal default block. */
+export class RootBlockDefaultFilter {
+    name = 'ssm/root-block-default';
+    isAdded = false;
+    unsubscribe = null;
+
+    constructor(
+        rootBlockName = 'ssm/section-wrapper',
+        postTypes = ['page', 'post', 'ssm_design_system'],
+    ) {
+        this.rootBlockName = rootBlockName;
+        this.postTypes = postTypes;
+    }
+
+    add() {
+        let previousCount = select('core/block-editor').getBlockCount();
+
+        this.unsubscribe = subscribe(() => {
+            const currentCount = select('core/block-editor').getBlockCount();
+
+            if (previousCount > 0 && currentCount === 0) {
+                dispatch('core/block-editor').insertBlock(createBlock(this.rootBlockName));
+            }
+
+            previousCount = currentCount;
+        }, 'core/block-editor');
+
+        this.isAdded = true;
+    }
+
+    remove() {
+        this.unsubscribe?.();
+        this.unsubscribe = null;
+        this.isAdded = false;
+    }
+}