transitions parent-child, cousin, etc

[thorn pivot]

https://stately.ai/docs/transitions#parent-to-child-transitions
So I'm confused why target: "endRoot" is broken here?
I'd assume all states would be unique per machine, so you can directly address them, & don't have to do fancy special prefixes to climb/drop-down the tree?

export const machinebuglonefinaloutside = createMachine({
    id: "bug-lone-final-outside",
    initial: "Inner",
    states: {
        Inner: {
            id: "",
            initial: "choose",
            states: {
                choose: {
                    on: {
                        "choose--endInner": {
                            target: "endInner"
                        },
                        "choose--endRoot": {
                            target: "endRoot"
                        }
                    }
                },
                endInner: {
                    type: "final"
                }
            }
        },
        endRoot: {
            type: "final"
        }
    }
},

[gentle cloak]

By default, transitions assume you're targeting a sibling state node

choose and endInner are sibling state nodes

Inner is the parent node of those, and endRoot is a sibling node of Inner (so, like an "uncle/aunt" node to the previous two)

tl;dr Target it by ID instead

endRoot: {
  id: 'endRoot',
  type: 'final'
}

And then:

target: '#endRoot' // notice the #

Why do you have to specify an ID?

You don't, but then you'd need to specify the full path of that state: #bug-lone-final-outside.endRoot