@nice2dev/ui-api

Nice2Dev API & Integration Platform — OpenAPI editor, API testing, integration builder for React applications.

Features

• NiceAPIDesigner - Visual OpenAPI/Swagger editor

  • OpenAPI 3.0 schema editing
  • Endpoint definition
  • Schema editor
  • Mock server configuration
  • Documentation generation

• NiceAPITester - API testing studio (Postman-like)

  • Request builder
  • Environment management
  • Collection runner
  • Test scripts
  • Response validation

• NiceIntegrationBuilder - Visual flow builder

  • Drag-and-drop flow design
  • Connector library
  • Transformation mapping
  • Error handling
  • Scheduling

Installation

npm install @nice2dev/ui-api
# or
pnpm add @nice2dev/ui-api

Usage

API Designer

import { NiceAPIDesigner } from '@nice2dev/ui-api';
import '@nice2dev/ui-api/style.css';

function App() {
  return (
    <NiceAPIDesigner
      onChange={(schema) => console.log('Schema updated:', schema)}
      onSave={(schema) => saveToBackend(schema)}
    />
  );
}

API Tester

import { NiceAPITester } from '@nice2dev/ui-api';
import '@nice2dev/ui-api/style.css';

function App() {
  return (
    <NiceAPITester
      environments={[
        { id: '1', name: 'Development', variables: { baseUrl: { value: 'http://localhost:3000' } }, isActive: true },
        { id: '2', name: 'Production', variables: { baseUrl: { value: 'https://api.example.com' } }, isActive: false },
      ]}
    />
  );
}

Integration Builder

import { NiceIntegrationBuilder } from '@nice2dev/ui-api';
import '@nice2dev/ui-api/style.css';

function App() {
  return (
    <NiceIntegrationBuilder
      connectors={[
        { id: '1', name: 'Slack', type: 'communication', authType: 'oauth2', operations: [] },
        { id: '2', name: 'Salesforce', type: 'crm', authType: 'oauth2', operations: [] },
      ]}
      onSave={(flow) => saveFlow(flow)}
      onRun={(flow) => executeFlow(flow)}
    />
  );
}

License

See LICENSE file.