APIs to unmount components with nested children

[littensy]

Because Vide's nested props allow you to nest children as well, I often declare multiple child elements in components. However, it's difficult to work with the underlying instances if I ever need to change their parent or delete them.

Currently, I delete nested children by applying them to a dummy folder and then destroying the folder:

local function Component()
    return { Foo(), Bar(), Baz() }
end

local function unmount(instances: { any })
    local container = create "Folder" { instances }
    container:Destroy()
end

-- cleaning up in lists
values(list, function()
    local children = Component()

    cleanup(function()
        unmount(children)
    end)

    return children
end)

-- cleaning up in stories
return function(target: Instance)
    local children = Component()

    apply(target)(children)

    return function()
        unmount(children)
    end
end

This works, but I would love it if Vide included APIs to help manage these types of components.

Other alternatives like using folders can behave weirdly with UI, and using invisible frames isn't always the same as directly parenting multiple children.

[littensy]

The upcoming changes to reactive scope will make story cleanup easier, since vide.root() returns a cleanup function. Additionally, my list cleanup example is redundant, as the default behavior will GC the instances just fine in most cases. I'm closing my issue for now because all of my use cases for unmount() will be covered by existing APIs.