Faq

O componente Faq é utilizado para responder as perguntas mais frequentes para agilizar e otimizar o atendimento ao cliente nos principais sites, e-commerces e blogs.

Importação

import { Faq } from '@escaletech/delta'

Utilização

<Faq
  image={{
    src: 'https://placekitten.com/500/250',
    alt: 'A cat'
  }}
  items={[
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    },
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    },
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    },
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    }
  ]}
/>

<Faq
  image={{
    src: 'https://placekitten.com/500/250',
    alt: 'A cat'
  }}
  items={[
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    },
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    },
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    },
    {
      title: 'Lorem ipsum dolor sit amet consectetur adipisicing elit?',
      content: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolor nam, recusandae quae itaque officiis libero. Quibusdam ipsam magni illum ullam dignissimos sed enim, officia repellendus similique ad, obcaecati quo. Explicabo.'
    }
  ]}
/>

Resultado

Props

Propriedade	Descrição	Tipo	Padrão	Obrigatório
title	Define o título do Faq.	THeadingProps	`{ children: 'Perguntas frequentes' }`	❌
image	Objeto contendo as chaves `alt`, `src`, `placeholder`, `width`, `height` e `id`.	TImage	-	✅
items	Array de objetos contendo as chaves `title` e `content`.	`TItem[]`	-	✅

Faq

Importação​

Utilização​

Props​

Importação

Utilização

Props