# @24hr/react-structured-data

> A React component to render structured data

Latest version **1.0.2** (published 2022-06-22) · MIT license · 0 weekly downloads

## Install

```sh
npm install @24hr/react-structured-data
pnpm add @24hr/react-structured-data
yarn add @24hr/react-structured-data
bun add @24hr/react-structured-data
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.2 |
| Published | 2022-06-22 |
| First published | 2019-11-18 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 10.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Marcus Thelin |
| Maintainers | richardsweeney, alexander-nilsson, camilo.tapia, marcusthelin, 24hr-machine-user, insidenpm, bextex |

## Links

- npm: https://www.npmjs.com/package/@24hr/react-structured-data
- Repository: https://github.com/Macke97/react-structured-data
- Homepage: https://github.com/Macke97/react-structured-data#readme
- Issues: https://github.com/Macke97/react-structured-data/issues
- npm.io page: https://npm.io/package/@24hr/react-structured-data

## Recent versions

- 1.0.2 (latest) — 2022-06-22
- 1.0.1 — 2022-06-22
- 1.0.0 — 2019-11-28
- 1.0.0-beta.0 — 2019-11-20
- 0.0.6 — 2019-11-18
- 0.0.5 — 2019-11-18
- 0.0.4 — 2019-11-18
- 0.0.3 — 2019-11-18
- 0.0.2 — 2019-11-18
- 0.0.1 — 2019-11-18

## README

# @24hr/react-structured-data

This is a simple React component to render a script tag as type `application/ld+json`. This can be used to create structured data for Google search according to the [Schema.org](https://schema.org) definition.

## How to use

1. Import the module

```jsx
import StructuredData from '@24hr/react-structured-data';
```

2. Use it

```jsx
<StructuredData type={structureDataType} {...structuredDataObject} />
```

## Props - General

| Prop    |       Type        |      Default       |
|---------|:-----------------:|:------------------:|
| context |      string       | https://schema.org |
| type    | string (required) |     undefined      |

You can then pass it whatever structured data compatible objects as you want. These are just passed along.

## Props - FAQPage component
| Prop      |       Type       | Default |
|-----------|:----------------:|:-------:|
| questions | array (required) |         |

A question object should have the structure:
```js
{
    question: String,
    answer: String
}
```

## Example - FAQ Page

Import the built-in FAQPage component
```jsx
import React from 'react';
import { FAQPage } from '@24hr/react-structured-data';

const App = () => (
    <div>
        {/* Your content */}
        <FAQPage
            questions={[
                {
                    question: 'Test',
                    answer: 'Okey'
                }
            ]}
        />
    </div>
);
```

---
_Source: https://npm.io/package/@24hr/react-structured-data · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._