lzb.constructor.general-settings.category

Filters the Category field of the block builder general settings. Put a notice above it when your site groups blocks by a convention the plain field cannot express, so the person editing the block reads the rule before picking a value.

Attributes

settingsData.data is the whole block data, so data.category holds the current value and data.slug, data.icon, data.keywords and data.description hold the values behind the other four general settings. settingsData.updateData shallow merges the object you pass it into that block data.

The five general settings render in a fixed order: slug, icon, category, keywords, description. This filter changes what stands in the category position, it cannot move the field.

Usage

const { Notice } = wp.components;
 
wp.hooks.addFilter(
  "lzb.constructor.general-settings.category",
  "my.custom.namespace",
  function (element, settingsData) {
    const { data } = settingsData;
    const slug = data.slug || "";
 
    if (slug.indexOf("lazyblock/marketing-") !== 0) {
      return element;
    }
 
    if (data.category === "design") {
      return element;
    }
 
    return (
      <>
        <Notice status="warning" isDismissible={false}>
          Marketing blocks belong in the Design category.
        </Notice>
        {element}
      </>
    );
  },
);

data.slug is falsy until the block has been given a slug, so fall back before calling string methods on it. The builder renders the filtered value as {settingsCategory || null}, so returning false, null or an empty string removes the Category field and the block stays in whatever category it already has. The other four fields go through lzb.constructor.general-settings.slug, lzb.constructor.general-settings.icon, lzb.constructor.general-settings.keywords and lzb.constructor.general-settings.description.