add documentation and changeset

Signed-off-by: Juan Pablo Garcia Ripa <sarabadu@gmail.com>
2022-01-18 18:58:51 +01:00
parent 9f0d178a51
commit 1523926507
3 changed files with 26 additions and 1 deletions
@@ -147,6 +147,25 @@ export function SidebarPage(props: SidebarPageProps) {
  );
 }

+/**
+ * This hook provides a react ref to the main content.
+ * Allows to set an element as the main content and focus on that component.
+ *
+ * *Note: If `contentRef` is not set `focusContent` is noop. `Content` component sets this ref automaticaly*
+ *
+ * @public
+ * @example
+ *  const { focusContent} = useContent();
+ * ...
+ *  <Button onClick={focusContent}>
+ *     focus main content
+ *  </Button>
+ *
+ * @example
+ *  const { contentRef } = useContent();
+ * ...
+ *  <article ref={contentRef} tabIndex={-1}>Main Content</article>
+ */
 export function useContent() {
  const { content } = useContext(PageContext);