Rescreva essa parte da string com as seguintes condições:
      1. Não elimine NENHUMA informação dada no artigo.
      2. Conceitos, expressões ou referências devem ser mantidas em inglês.
      3. Apenas transcreva o artigo para português brasileiro, dentro de seu contexto.
      4. Não remova as tags HTML e nem os "#thedivisor#".
      5. Você deve me enviar sua resposta em texto puro, sem markdown.

      #thedivisor#<li class="leading-relaxed mb-1">The original list of products is <strong class="font-bold">passed in as props, so it’s not state.</strong></li>
<li class="leading-relaxed mb-1">The search text seems to be state since it changes over time and can’t be computed from anything.</li>
<li class="leading-relaxed mb-1">The value of the checkbox seems to be state since it changes over time and can’t be computed from anything.</li>
<li class="leading-relaxed mb-1">The filtered list of products <strong class="font-bold">isn’t state because it can be computed</strong> by taking the original list of products and filtering it according to the search text and value of the checkbox.</li>#thedivisor#This means only the search text and the value of the checkbox are state! Nicely done!#thedivisor#There are two types of “model” data in React: props and state. The two are very different:#thedivisor#<li class="leading-relaxed mb-1"><a class="inline text-link dark:text-link-dark border-b border-link border-opacity-0 hover:border-opacity-100 duration-100 ease-in transition leading-normal" href="/learn/passing-props-to-a-component"><strong class="font-bold">Props</strong> are like arguments you pass</a> to a function. They let a parent component pass data to a child component and customize its appearance. For example, a <code dir="ltr" class="inline text-code text-secondary dark:text-secondary-dark px-1 rounded-md no-underline bg-gray-30 bg-opacity-10 py-px">Form</code> can pass a <code dir="ltr" class="inline text-code text-secondary dark:text-secondary-dark px-1 rounded-md no-underline bg-gray-30 bg-opacity-10 py-px">color</code> prop to a <code dir="ltr" class="inline text-code text-secondary dark:text-secondary-dark px-1 rounded-md no-underline bg-gray-30 bg-opacity-10 py-px">Button</code>.</li>
<li class="leading-relaxed mb-1"><a class="inline text-link dark:text-link-dark border-b border-link border-opacity-0 hover:border-opacity-100 duration-100 ease-in transition leading-normal" href="/learn/state-a-components-memory"><strong class="font-bold">State</strong> is like a component’s memory.</a> It lets a component keep track of some information and change it in response to interactions. For example, a <code dir="ltr" class="inline text-code text-secondary dark:text-secondary-dark px-1 rounded-md no-underline bg-gray-30 bg-opacity-10 py-px">Button</code> might keep track of <code dir="ltr" class="inline text-code text-secondary dark:text-secondary-dark px-1 rounded-md no-underline bg-gray-30 bg-opacity-10 py-px">isHovered</code> state.</li>#thedivisor#Props and state are different, but they work together. A parent component will often keep some information in state (so that it can change it), and <em>pass it down</em> to child components as their props. It’s okay if the difference still feels fuzzy on the first read. It takes a bit of practice for it to really stick!