> ## Documentation Index
> Fetch the complete documentation index at: https://velt.dev/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Setup

> [tab] React / Next.js
>
> ## 1. Import Velt Inline Reactions Section component
>
> Import the `VeltInlineReactionsSection` component.
>
> ```js theme={null}
> import { VeltInlineReactionsSection } from '@veltdev/react';
> ```
>
> ## 2. Add container to hold Inline Reactions component
>
> * Create an element to hold your Inline Reactions component, such as a `div` or `section`.
> * Add a unique element `id` to it.
>
> ```jsx theme={null}
> <section id="container-id">
> 	<div>Your Article</div>
> </section>
> ```
>
> ## 3. Add VeltInlineReactionsSection component
>
> * Add `VeltInlineReactionsSection` component inside your container.
> * Add `targetReactionElementId` property to the Velt Inline Reactions component. This needs to match the id you set to the container. This binds the Inline Reactions component with the desired container.
>
> ```jsx theme={null}
> <section id="container-id">
> 	<div>Your Article</div>
>
> 	<VeltInlineReactionsSection
> 		targetReactionElementId="container-id"
> 	/>
>
> </section>
> ```

> [tab] Other Frameworks
>
> ## 1. Add container to hold Inline Reactions component
>
> * Create an element to hold your Inline Reactions component, such as a `div` or `section`.
> * Add a unique element `id` to it.
>
> ```html theme={null}
> <section id="container-id">
> 	<div>Your Article</div>
> </section>
> ```
>
> ## 2. Add Velt Inline Reactions Section component
>
> * Add `velt-inline-reactions-section` component inside your container.
> * Add `target-reaction-element-id` property to the Velt Inline Reactions component. This needs to match the id you set to the container. This binds the Inline Reactions component with the desired container.
>
> ```jsx theme={null}
>
> <section id="container-id">
> 	<div>Your Article</div>
>
> 	<velt-inline-reactions-section
> 		target-reaction-element-id="container-id">
> 	</velt-inline-reactions-section>
>
> </section>
> ```

```jsx React / Next.js theme={null}
import { VeltInlineReactionsSection } from '@veltdev/react';

export default function App() {

  return (
      <section id="container-id">
        <div>Your Article</div>

        <VeltInlineReactionsSection
          targetReactionElementId="container-id"
        />

      </section>  
  );
}
```

```html HTML theme={null}
<!DOCTYPE html>
<html lang="en">
  <body>

    <section id="container-id">
      <div>Your Article</div>

      <velt-inline-reactions-section
        target-reaction-element-id="container-id">
      </velt-inline-reactions-section>

    </section>

  </body>
</html>
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.