Skip to main content

​
NoClick SDK

The NoClick SDK lets you build custom React components inside workflows and external applications that interact with NoClick’s workflow engine. Read node outputs, trigger execution, manage state, handle credentials, and work with files and datasets — all through a clean API.

​
Two Use Cases

Custom Components

React/JSX components that render inside the NoClick interface tab. Built with Tailwind CSS, any npm package, and the full SDK API. No build step needed — NoClick handles transpilation.

External Apps

Standalone TypeScript or Python applications that connect to NoClick via WebSocket. Same API, different transport. Authenticate with API keys.

​
SDK Namespaces

NamespacePurpose
nodesRead/write node outputs and configs
executionRun nodes and stream results
statePersistent key-value storage
authCredentials and OAuth
resourcesFile/blob upload and download
datasetTabular data CRUD
workflowWorkflow info and context

​
Quick Example

A custom component that reads data from a Gmail node and displays it: 
import React, { useState, useEffect } from 'react';
import ReactDOM from 'react-dom/client';
import { nodes } from '@noclick/sdk';

function App() {
  const [emails, setEmails] = useState([]);

  useEffect(() => {
    nodes.getOutput('gmail-node-id').then(output => {
      setEmails(output?.emails || []);
    });
  }, []);

  return (
    <div className="p-4">
      {emails.map(email => (
        <div key={email.id} className="border-b border-zinc-800 py-2">
          <div className="font-bold">{email.subject}</div>
          <div className="text-sm text-zinc-400">{email.from}</div>
        </div>
      ))}
    </div>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);
The same logic in a Python external app: 
import noclick

sdk = noclick.Client(api_key="nk_live_...", workflow_id="...")
await sdk.connect()

output = await sdk.nodes.get_output("gmail-node-id")
emails = output.get("emails", [])
for email in emails:
    print(f"{email['subject']} — {email['from']}")