Release

apps/docs/package.json

@@ -10,7 +10,7 @@
     "clean": "rimraf .turbo && rimraf node_modules && rimraf .next"
   },
   "dependencies": {
-    "@react-awesome/components": "1.0.19",
+    "@react-awesome/components": "1.0.20",
     "classnames": "^2.5.1",
     "lodash": "^4.17.21",
     "lucide-react": "^0.315.0",

apps/docs/src/pages/docs/use-toggle.mdx

@@ -22,7 +22,7 @@ import { Container } from '../../components/Container'
 import { useToggle } from '@react-awesome/components'
 
 export const Example = () => {
-  const { toggle, isOn } = useToggle(true)
+  const [isOn, toggle] = useToggle(true)
 return (
 
 <>
@@ -47,7 +47,7 @@ return (
     </div>
     <label
       htmlFor="switch"
-      class="mt-px mb-0 ml-3 font-light cursor-pointer select-none"
+      className="mt-px mb-0 ml-3 font-light cursor-pointer select-none"
     >
       Click to toggle
     </label>
@@ -63,7 +63,7 @@ return (
 import { useToggle } from '@react-awesome/use-toggle'
 
 const Example = () => {
-  const { toggle, isOn } = useToggle(state)
+  const [isOn, toggle] = useToggle(state)
 
   return <input checked={isOn} type="checkbox" onClick={toggle} />
 }

packages/components/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @react-awesome/components
 
+## 1.0.20
+
+### Patch Changes
+
+- Updated dependencies
+  - @react-awesome/use-toggle@1.0.0
+
 ## 1.0.19
 
 ### Patch Changes

packages/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-awesome/components",
-  "version": "1.0.19",
+  "version": "1.0.20",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -44,7 +44,7 @@
     "@react-awesome/use-preserve-input-caret-position": "0.0.3",
     "@react-awesome/use-selection-range": "0.0.3",
     "@react-awesome/use-previous": "0.0.3",
-    "@react-awesome/use-toggle": "0.0.1",
+    "@react-awesome/use-toggle": "1.0.0",
     "@react-awesome/use-breakpoint": "1.0.0"
   }
 }

packages/use-toggle/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @react-awesome/use-previous
 
+## 1.0.0
+
+### Major Changes
+
+- Return as array of values instead of fixed named object key
+
 ## 0.0.1
 
 ### Patch Changes

packages/use-toggle/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-awesome/use-toggle",
-  "version": "0.0.1",
+  "version": "1.0.0",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",

packages/use-toggle/src/useToggle/useToggle.spec.tsx

@@ -1,24 +1,24 @@
 import { act, renderHook } from '@testing-library/react'
 import { useToggle } from './useToggle'
 
 describe('useToggle', () => {
   it('Should toggle the value', () => {
-    const { result, rerender } = renderHook(() => useToggle(true))
+    const { result } = renderHook(() => useToggle(true))
 
-    expect(result.current.isOn).toBe(true)
+    expect(result.current[1]).toBeInstanceOf(Function)
+
+    expect(result.current[0]).toBe(true)
 
     act(() => {
-      result.current.toggle()
-      rerender()
+      result.current[1]()
     })
 
-    expect(result.current.isOn).toBe(false)
+    expect(result.current[0]).toBe(false)
 
     act(() => {
-      result.current.toggle(true)
-      rerender()
+      result.current[1](true)
     })
 
-    expect(result.current.isOn).toBe(true)
+    expect(result.current[0]).toBe(true)
   })
 })

packages/use-toggle/src/useToggle/useToggle.tsx

@@ -1,6 +1,8 @@
-import React, { useCallback, useState } from 'react'
+import { useCallback, useMemo, useState } from 'react'
 
-export const useToggle = (initialValue: boolean) => {
+export const useToggle = (
+  initialValue: boolean,
+): [boolean, (value?: boolean) => void] => {
   const [value, setValue] = useState(initialValue)
 
   const toggle = useCallback(
@@ -9,8 +11,5 @@
     [],
   )
 
-  return {
-    toggle,
-    isOn: value,
-  }
+  return useMemo(() => [value, toggle], [toggle, value])
 }