Components

Switch

Brytere - eller switches - lar brukerne velge mellom ja og nei.

Examples

En enkel switch

<Switch />

Forskjellige størrelser

<Flex gap={1}>
  <Switch size="sm" /> 
  <Switch size="md" /> 
  <Switch size="lg" /> 
</Flex>

En disablet switch

<Flex gap={1}>
  <Switch isDisabled />
  <Switch isDisabled isChecked />
</Flex>

En switch med label

<FormControl>
  <FormLabel>Ekstra features?</FormLabel>
  <Switch />
</FormControl>

En kontrollert switch

() => {
  const { isOpen, onToggle } = useDisclosure();
  return (
    <Box>
      <FormControl>
        <Center>
          <FormLabel>Vise logo?</FormLabel>
          <Switch isChecked={isOpen} onChange={onToggle} />
        </Center>
      </FormControl>
      {isOpen ? <VyLogo colorScheme="light" /> : null}
    </Box>
  );
}