Get parent block in Builder.registerComponent

Technical Questions
7

Hi @mossen,

We shipped an update recently that passes an array containing the component’s parent elements to showIf. For example, if I wanted to create an input that only shows if the component the input is on is inside a Columns component, I would write something like this:

{
  name: 'title',
  type: 'string',
  defaultValue: 'Your Title Here',
  showIf: (options, parent, parentElements) => {
    return parentElements.some(el => el && el.component && el.component.name === 'Columns');
  }
}

You can use this approach to accomplish what you wanted to do by adding multiple inputs and showing/hiding them depending on what name of the parent component, something like:

inputs: [
  {
    type: 'string',
    name: 'tag',
    enum: ['tag1', 'tag2', 'tag3'],
    showIf: (options, parent, parentElements) => {
      return parentElements.some(el => el && el.component && el.component.name === 'Columns');
    }
  },
  {
    type: 'string',
    name: 'tag',
    enum: ['tag4', 'tag5', 'tag6'],
    showIf: (options, parent, parentElements) => {
      return parentElements.some(el => el && el.component && el.component.name === 'Rows');
    }
  }
]

Hope that helps!