Alternative usage of Context Components

[sjiep]

The docs mentions the use of Context Components to expose state and functions to child components.

However I have noticed that an alternative way would be to use context hooks. For example in my case where I'm building logic around the Menu component I can do the following:

import { Menu, useContextMenu } from '@ark-ui/react/menu'

function CustomMenuItem() {
  const menu = useContextMenu();
  return (
    <Menu.Item>
      <button onClick={() => menu.setOpen(false)}>Close menu</button>
    </Menu.Item>
  )
}

I see no mention of this is the Documentation (perhaps because it is React specific), but is this a valid way of using the hook?

[segunadebayo]

Good point. I've updated the docs to showcase this.