YML of a selection block with a nested second selection query

I have the following problem. I have a block with a selection “family”.

fields:
  family:
    type: select
    pretty: true
    options:
      type: query
      query: site.find("fonts").children

  style:
    type: select
    pretty: true
    options:
      type: query
      query: site.find("fonts").children.find("fontName").styles.toStructure
      text: "{{ item.fontstyle }}"

The fonts have subpages for each individual font. I want the second selection to be dependent of what was selected in the first one. Basically I want to select my font, and then on the second selection only be shown a list of that selected fonts different styles.

Basically what I need is instead of children.find(“fontName”). I would need a value that is generated from the first selection.

That’s not possible. The blueprint is read and evaluated server-side once, what you select is happening client-side, however.

So you would need something custom that listens to a change event in the first field, then updates the selection.

Would it be possible with a save in between? So that the server side gets up to speed? That would be a bit clunky but enough for my use-case.

In that case the following query should work:

query: site.find("fonts").children.find(page.family).styles.toStructure