Using the HierarchicalMenu widget you may have noticed that the URL only shows the first attribute level as the refinement even though you may have made a refinement lower deeper into the HierarchicalMenu.
The URL routeState will only show the categories as belonging to the first level of the hierarchy: hierarchicalCategories.lvl0. In the example URL below selecting hierarchicalCategories.lvl0: "Audio" and then hierarchicalCategories.lvl1: "Audio > Headphones" results in the following URL
The network request shows the following facetFilter is applied.
facetFilters: [["hierarchicalCategories.lvl1:Audio > Headphones"]]
So why is hierarchicalCategories.lvl1 not shown in the URL?
The key in the URL is the first attribute (that's actually the identifier of the hierarchical menu), but the value is always the most refined value.
In the URL we don't want to differentiate between different attributes for the same widget, so the first attribute is what's given for the key of the refinement, the value is always the deepest refinement.
The way this works in InstantSearch is actually by splitting by the separator, which allows us to know what facets to apply for which filter.