Improve inline blocks to be able to easily access a block in context

[chrisdmacrae]

Summary

I want to render a tooltip on the focussed inline block when it is focussed. Right now, it's hard to figure this out, because in the context of a block, you only know what index of the block is, and the form name is dictated by the implementation of InlineBlocks, and can only be well-known at runtime.

I'd like an InlineBlock to receive name of the parent blocks instance. I'd also be able to do useInlineField and get the closest field in the context of the hook.

Basic example

For example:

export const ExampleBlocks = () => {
const [,form] = useForm(MyBlocksData);

return (
  <InlineForm form={form}>
    <InlineBlocks
      name="blocks"
      blocks={MyBlocks}
    />
  </InlineForm>
}

export const MyBlocksData = {
  blocks: [
    { _template: Example }
  ]
}

export const MyBlocks = {
  Example: {
    component: (props) => <div>{props.name}.{props.index}</div>
  }
}

In this case, my "Example" block would receive name as blocks.0.

Alternatively, I could just call useInlineField inside the block and get the name off of the context returned:

export type useInlineField: () => InlineField;

Motivation

Allow people to easily add inline form functionality to a block without having to have an extremely intimate understanding of how the form field inheritance works.