@harnessio/idp-plugins-sdk
v0.1.2
Published
SDK for building Harness plugins with React
Readme
@harnessio/idp-plugins-sdk
SDK for building Harness plugins with React. Provides communication utilities, context management, and routing synchronization for plugins running in iframes.
Installation
npm install @harnessio/idp-plugins-sdkPeer Dependencies
This package requires the following peer dependencies:
react(^18.0.0 || ^19.0.0)react-dom(^18.0.0 || ^19.0.0)react-router-dom(^6.0.0 || ^7.0.0)
Usage
Basic Setup
import { PluginAPI, PluginContextProvider, PluginRouter } from '@harnessio/idp-plugins-sdk'
// Initialize the plugin as early as possible
PluginAPI.init()
function App() {
return (
<PluginContextProvider>
<PluginRouter>
{/* Your app routes here */}
</PluginRouter>
</PluginContextProvider>
)
}Using Plugin Context
import { usePluginContext } from '@harnessio/idp-plugins-sdk'
function MyComponent() {
const context = usePluginContext()
if (!context) {
return <div>Loading...</div>
}
return (
<div>
<p>Theme: {context.theme}</p>
<p>Location: {context.location}</p>
</div>
)
}Proxy Fetch (for authenticated API calls)
import { PluginAPI } from '@harnessio/idp-plugins-sdk'
async function fetchData() {
const response = await PluginAPI.proxyFetch('/api/some-endpoint')
const data = await response.json()
return data
}API Reference
PluginAPI
Static class for communication with the host application.
PluginAPI.init()- Signals to the host that the plugin is readyPluginAPI.getContext()- Retrieves the current plugin contextPluginAPI.proxyFetch(url, init?)- Proxies fetch requests through the host
PluginContextProvider
React context provider that manages plugin context state.
usePluginContext()
Hook to access the current plugin context.
PluginRouter
Router component that synchronizes with the parent page's URL.
useParentRoutingSync()
Hook for manual route synchronization with the parent page.
Development
# Install dependencies
npm install
# Build the package
npm run build
# Watch mode
npm run devLicense
MIT
