Herramienta de localización de stock

La herramienta Stock Locator Tool es un componente de React que muestra precios y disponibilidad en tiempo real para un número de pieza del fabricante determinado: niveles de stock, tramos de precios y enlaces a distribuidores, impulsado por la API de Octopart. Intégralo en páginas de producto, herramientas de compras o cualquier aplicación de React.

Requisitos previos

• Un proyecto de React

• Un token de acceso OAuth 2.0 con el alcance supply.domain – el mismo token utilizado para consultas directas a la API (consulta Authorization)

Instalación

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" }}
    />
  );
}

Esto muestra una interfaz de búsqueda completa en la que los usuarios pueden introducir cualquier MPN para ver ofertas en vivo y stock.

Modo de una sola pieza

Para precargar una pieza y ocultar la barra de búsqueda, algo útil en una página de detalles del producto:

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

Gestión del token

Los tokens de acceso caducan después de 24 horas. Durante el desarrollo, puedes codificar temporalmente un token de forma fija. En producción, obtén el token desde tu backend mediante la concesión client_credentials y renuévalo antes de que caduque. Nunca expongas tu Client Secret en código del lado del cliente.

Referencias adicionales

El repositorio de GitHub documenta todas las props disponibles:

• searchParameters – región, moneda, filtros de autorizado/en stock, visibilidad de la barra de búsqueda, límite de ofertas y más

• styles – tema claro/oscuro, fuente y referencia completa de tokens de color personalizados

• hideColumns – controla qué columnas aparecen en la tabla de ofertas