# All files / src useToggle.ts

100% Statements 56/56
100% Branches 5/5
100% Functions 1/1
100% Lines 56/56

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    571x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    296x
    296x
    296x
    296x
    296x
    296x
    296x
    296x
    13x
    296x
    296x
    29x
    296x
    296x
    28x
    296x
    296x
    296x
     "use client";
    import { useCallback, useState } from "react";
    import type { UseStateInitializer, UseStateSetter } from "./types.js";

    /**
     * @remarks \@since 6.0.0
     */
    export interface ToggleHookReturnValue {
      toggled: boolean;
      setToggled: UseStateSetter<boolean>;
      toggle(): void;
      enable(): void;
      disable(): void;
    }

    /**
     *
     * @example
     * Simple Example
     * ```tsx
     * import { Button, useToggle } from "@react-md/core";
     * import type { ReactElement } from "react";
     *
     * function Example(): ReactElement {
     *   const { toggled, toggle } = useToggle();
     *
     *   return (
     *     <>
     *       <Button onClick=[toggle]>Toggle</Button>
     *       {`Toggled: ${toggled}`}
     *     </>
     *   );
     * }
     * ```
     *
     * @param defaultValue - `false`
     */
    export function useToggle(
      defaultValue: UseStateInitializer<boolean> = false
    ): Readonly<ToggleHookReturnValue> {
      const [toggled, setToggled] = useState(defaultValue);

      return {
        toggled,
        setToggled,
        toggle: useCallback(() => {
          setToggled((prevToggled) => !prevToggled);
        }, []),
        enable: useCallback(() => {
          setToggled(true);
        }, []),
        disable: useCallback(() => {
          setToggled(false);
        }, []),
      };
    }