import { Meta } from '@storybook/addon-docs';
import Note from 'Storybook/components/Note';
import EditPage from 'Storybook/components/EditPage';

<Meta title="Utils/README" />

# Utils

The Utils directory contains all of the utility functions provided by this
library. Utility functions provide a wide range of functionality and aren't
subject to the same component lifecycle restrictions as hooks, meaning you can
call them conditionally or even outside of components without running into any
problems.

## How to use our utils documentation

Each utility function includes a documentation page in Storybook, made up of
one or more stories. (If you're new to Storybook, "story" is its term for
a live, interactive example of something being used.) If you look at the top of
this page, you should see two tabs: "Canvas" and "Docs". The Canvas tab will
allow you to isolate a single story, while the Docs tab will allow you to see
all of a hook's stories on one page and read the accompanying prose
documentation.

In general, each utility's Docs page starts with a general explanation of what
the function does and a basic example. Below that, you'll find a table listing
each argument that the function accepts, annotated with its type, its default
value, and a description of what it does. If you're trying to figure out
_everything_ a single function can do, that's the best place to look. Below the
arguments table, there's usually a set of additional stories that demonstrate
different specific uses of the function or how it behaves with different
inputs. The code for each story is expanded by default, because, unlike
components, the _code_ is generally much more useful and informative than the
rendered story.

<EditPage page={STORYBOOK_FILE_PATH} />
