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 | import { ChevronDownIcon, ChevronUpIcon } from "@chakra-ui/icons";
import { Button, ButtonProps } from "@chakra-ui/react";
import { FunctionComponent } from "react";
interface ToggleButtonProps extends ButtonProps {
isOpen: boolean;
openText: string;
closeText: string;
}
export const ToggleButton: FunctionComponent<ToggleButtonProps> = ({
openText,
closeText,
isOpen,
...buttonProps
}) => (
<Button
color="link"
colorScheme="blue"
leftIcon={isOpen ? <ChevronUpIcon /> : <ChevronDownIcon />}
variant="link"
{...buttonProps}
>
{isOpen ? closeText : openText}
</Button>
);
|