paulodutra

import React from 'react'

type ButtonProps = {
    increment: React.Dispatch<React.SetStateAction<number>>
}
export const Button = ({increment }: ButtonProps) => {
  return <button onClick={() => increment((number) => number + 1)}>Increment</button>
}

paulodutra

import React, { useEffect } from 'react';
import { Button } from './Button';

function App() {
  const [total, setTotal] = React.useState(0);
  return (
     <div>
       <p>Total: {total}</p>
       <Button increment={setTotal} />
     </div>

paulodutra

import React from 'react';
import { Button } from './Button';
import { Input } from './Input';
import { Checkbox } from './Checkbox';

function App() {
  const [total, setTotal] = React.useState(0)
  const [data, setData] = React.useState('');

  function increment() {

paulodutra

import React from 'react'

export const Checkbox = ({ label} : {label: string}) => {
  const [value, setValue] = React.useState(false);
  return (
    <label style={{
        padding: "1rem",
        border: value ? "2px solid #8D2" : "2px solid #F70" 
    }}>
        <input 

paulodutra

import React from 'react'

export const Checkbox = ({ label} : {label: string}) => {
  const [value, setValue] = React.useState(false);
  const handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {
    setValue(event.currentTarget.checked)
  }
  return (
    <label style={{
        padding: "1rem",

paulodutra

import React from 'react'

type ButtonProps = React.ComponentProps<"button"> & {
    lenghtButton?: string
}
export const Button = ({children, lenghtButton, ...props}: ButtonProps) => {
  return (
    <button 
        style={{fontSize: lenghtButton}}
        {...props}

paulodutra

import React from 'react'

type ButtonProps = React.PropsWithChildren<{
    lenghtButton?: string;
    onClick?: () => void
}>

export const Button = ({children, lenghtButton, onClick}: ButtonProps) => {
  return (
    <button onClick={onClick} style={{fontSize: lenghtButton}}>

paulodutra

import React, { ReactNode } from 'react'

type ButtonProps = {
    lenghtButton?: string;
    children: ReactNode;
    onClick?: () => void
};
export const Button = (props: ButtonProps) => {
  return (
    <button onClick={props.onClick} style={{fontSize: props.lenghtButton}}>

paulodutra

import React, { ReactNode } from 'react'

type ButtonProps = {
    lenghtButton?: string;
    children: ReactNode;
    onClick?: () => void
};
export const Button = (props: ButtonProps) => {
  return (
    <button onClick={props.onClick} style={{fontSize: props.lenghtButton}}>

paulodutra

validacao = False
while (validacao is False):
    sexo = str(input('Informe o seu sexo, sendo M - Masculino e F- Feminimo: '))
    if sexo == 'M' or sexo == 'm' or sexo == 'F' or sexo == 'f': 
        validacao = True
    else:
        validacao = False