Ferramenta de Localização de Estoque

A ferramenta Stock Locator Tool é um componente React que exibe preços e disponibilidade em tempo real para um determinado número de peça do fabricante – níveis de estoque, faixas de preço e links de distribuidores – com tecnologia da API Octopart. Incorpore-a em páginas de produtos, ferramentas de compras ou qualquer aplicação React.

Pré-requisitos

• Um projeto React

• Um token de acesso OAuth 2.0 com o escopo supply.domain – o mesmo token usado para consultas diretas à API (consulte Authorization)

Instalação

npm i @altiumnexar/stock-locator-tool

Uso básico

import { StockLocatorTool } from "@altiumnexar/stock-locator-tool";

function MyPage() {
  return (
    <StockLocatorTool
      searchParameters={{ token: "YOUR_ACCESS_TOKEN" }}
    />
  );
}

Isso renderiza uma interface de busca completa na qual os usuários podem inserir qualquer MPN para ver ofertas e estoque em tempo real.

Modo de peça única

Para preencher previamente uma peça e ocultar a barra de busca – útil em uma página de detalhes do produto:

<StockLocatorTool
  searchParameters={{
    token: "YOUR_ACCESS_TOKEN",
    q: "LM358DR",
    disableSearch: true,
  }}
/>

Tratamento de token

Os tokens de acesso expiram após 24 horas. Durante o desenvolvimento, você pode codificar um token temporariamente. Em produção, obtenha o token do seu backend por meio da concessão client_credentials e renove-o antes do vencimento. Nunca exponha seu Client Secret em código do lado do cliente.

Referência adicional

O repositório no GitHub documenta todas as props disponíveis:

• searchParameters – região, moeda, filtros de autorizado/em estoque, visibilidade da barra de busca, limite de ofertas e mais

• styles – tema claro/escuro, fonte e referência completa de tokens de cores personalizados

• hideColumns – controle quais colunas aparecem na tabela de ofertas