Skip to main content

​
Overview

The useWidgetProps hook provides access to the tool output data as props for your widget, with optional default values.

​
Import

import { useWidgetProps } from 'sunpeak';

​
Signature

function useWidgetProps<T = Record<string, unknown>>(
  defaultState?: T | (() => T)
): T

​
Parameters

​
defaultState
T | (() => T)
Optional default value or function that returns default value
​
T
type parameter
TypeScript type for the props

​
Returns

The tool output as props, or the default value if not available.

​
Usage

import { useWidgetProps } from 'sunpeak';

interface WeatherData {
  temperature: number;
  condition: string;
  city: string;
}

function WeatherWidget() {
  const weather = useWidgetProps<WeatherData>({
    temperature: 0,
    condition: 'Unknown',
    city: 'Loading...',
  });

  return (
    <div>
      <h2>{weather.city}</h2>
      <p>{weather.temperature}°F</p>
      <p>{weather.condition}</p>
    </div>
  );
}