remix-nlux/docs/versioned_docs/version-1.0.15/reference/003-adapters/002-hugging-face.mdx

Remix IDE NLUX integration. Remix IDE is the leading IDE for building and deploying smart contracts on Ethereum. NLUX is a JavaScript and React library for building conversational AI experiences.

---
sidebar_label: 'Hugging Face'
---

import {PlatformSelector} from '@site/src/components/PlatformSelector/PlatformSelector';
import {PlatformSection} from '@site/src/components/PlatformSection/PlatformSection';

import ReactJs from './_002-hugging-face/#react.mdx';
import Javascript from './_002-hugging-face/#js.mdx';

import InstallationJavascript from './_002-hugging-face/#js/installation.mdx';
import InstallationReactJs from './_002-hugging-face/#react/installation.mdx';

import UsageJavascript from './_002-hugging-face/#js/usage.mdx';
import UsageReactJs from './_002-hugging-face/#react/usage.mdx';

import ConfigJavascript from './_002-hugging-face/#js/config.mdx';
import ConfigReactJs from './_002-hugging-face/#react/config.mdx';

import ConfigModelJavascript from './_002-hugging-face/#js/config/model.mdx';
import ConfigModelReactJs from './_002-hugging-face/#react/config/model.mdx';

import ConfigEndpointJavascript from './_002-hugging-face/#js/config/endpoint.mdx';
import ConfigEndpointReactJs from './_002-hugging-face/#react/config/endpoint.mdx';

import ConfigAuthTokenJavascript from './_002-hugging-face/#js/config/authToken.mdx';
import ConfigAuthTokenReactJs from './_002-hugging-face/#react/config/authToken.mdx';

import ConfigDataTransferModeJavascript from './_002-hugging-face/#js/config/dataTransferMode.mdx';
import ConfigDataTransferModeReactJs from './_002-hugging-face/#react/config/dataTransferMode.mdx';

import ConfigSystemMessageJavascript from './_002-hugging-face/#js/config/systemMessage.mdx';
import ConfigSystemMessageReactJs from './_002-hugging-face/#react/config/systemMessage.mdx';

import ConfigInputPreProcessorJavascript from './_002-hugging-face/#js/config/inputPreProcessor.mdx';
import ConfigInputPreProcessorReactJs from './_002-hugging-face/#react/config/inputPreProcessor.mdx';

import ConfigOutputPreProcessorJavascript from './_002-hugging-face/#js/config/outputPreProcessor.mdx';
import ConfigOutputPreProcessorReactJs from './_002-hugging-face/#react/config/outputPreProcessor.mdx';

import ConfigMaxNewTokensJavascript from './_002-hugging-face/#js/config/maxNewTokens.mdx';
import ConfigMaxNewTokensReactJs from './_002-hugging-face/#react/config/maxNewTokens.mdx';

# Hugging Face

Hugging Face is a popular platform for hosting and accessing machine learning models. It provides a unified
interface and inference API to interact with many state-of-the-art open-source models such as LLAMA2, DeciLM,
and more.

This documentation page is about the standard adapter provided by `NLUX` for [Hugging Face Inference API](https://huggingface.co/inference-endpoints/serverless).

<PlatformSelector reactJs={ReactJs} javascript={Javascript}/>

## Installation

<PlatformSection reactJs={InstallationReactJs} javascript={InstallationJavascript}/>

## Usage

<PlatformSection reactJs={UsageReactJs} javascript={UsageJavascript}/>

## Configuration

<PlatformSection reactJs={ConfigReactJs} javascript={ConfigJavascript}/>

---

### Model

<PlatformSection reactJs={ConfigModelReactJs} javascript={ConfigModelJavascript}/>

---

### Endpoint

<PlatformSection reactJs={ConfigEndpointReactJs} javascript={ConfigEndpointJavascript}/>

---

### Auth Token

This is the authorization token to use for Hugging Face Inference API.
This will be passed to the `Authorization` header of the HTTP request.
If no token is provided, the request will be sent without an `Authorization` header as in this example:

```
"Authorization": "Bearer {AUTH_TOKEN}"
```

Public models on Hugging face do not require an authorization token, but if your model is private, you will
need to provide one.

<PlatformSection reactJs={ConfigAuthTokenReactJs} javascript={ConfigAuthTokenJavascript}/>

---

### Data Transfer Mode

<PlatformSection reactJs={ConfigDataTransferModeReactJs} javascript={ConfigDataTransferModeJavascript}/>

---

### System Message

The initial system to send to the Hugging Face Inference API.
This will be used during the pre-processing step to construct the payload that will be sent to the API.

<PlatformSection reactJs={ConfigSystemMessageReactJs} javascript={ConfigSystemMessageJavascript}/>

---

### Input Pre-Processor

The `inputPreProcessor` is a function that takes the user input and some additional options, and returns
the string that will be sent to the Hugging Face Inference API. It is used to transform the user input
to the format expected by the model.

<PlatformSection reactJs={ConfigInputPreProcessorReactJs} javascript={ConfigInputPreProcessorJavascript}/>

---

### Output Pre-Processor

The `outputPreProcessor` is a function that takes the response from the model and returns a string that
will be displayed to the user.

<PlatformSection reactJs={ConfigOutputPreProcessorReactJs} javascript={ConfigOutputPreProcessorJavascript}/>

---

### Max New Tokens

The maximum number of new tokens that can be generated by the Hugging Face Inference API.<br />
This is useful if you want to limit the number of tokens that can be generated by the API.

<PlatformSection reactJs={ConfigMaxNewTokensReactJs} javascript={ConfigMaxNewTokensJavascript}/>