feat(useToggle): new function (vueuse#238)

packages/core/useToggle/index.md

@@ -0,0 +1,11 @@
+# useToggle
+
+> A boolean switcher with utility functions.
+
+## Usage
+
+```js
+import { useToggle } from '@vueuse/core'
+
+const [value, toggle] = useToggle()
+```

packages/core/useToggle/index.stories.tsx

@@ -0,0 +1,30 @@
+import { defineDemo, html } from '../../_docs'
+import { defineComponent } from 'vue-demi'
+import { useToggle } from '.'
+
+defineDemo(
+  {
+    name: 'useToggle',
+    category: 'State',
+    docs: require('./index.md'),
+    module,
+  },
+  defineComponent({
+    setup() {
+      const [value, toggle] = useToggle()
+      return {
+        value,
+        toggle,
+      }
+    },
+
+    template: html`
+      <div>
+        <p>Value: {{ value ? 'ON' : 'OFF' }}</p>
+        <button @click="toggle()">Toggle</button>
+        <button @click="value = true">Set ON</button>
+        <button @click="value = false">Set OFF</button>
+      </div>
+    `,
+  }),
+)

packages/core/useToggle/index.ts

@@ -0,0 +1,14 @@
+import { ref } from 'vue-demi'
+
+/**
+ * A boolean switcher with utility functions.
+ *
+ * @see   {@link https://vueuse.js.org/useToggle}
+ * @param [initialValue=false]
+ */
+export function useToggle(initialValue = false) {
+  const value = ref(initialValue)
+  const toggle = () => (value.value = !value.value)
+
+  return [value, toggle]
+}