WidgetShell
When to use
Section titled “When to use”Wrap Billboard, IncidentsWidget, charts, or custom widget content on store dashboards.
When NOT to use
Section titled “When NOT to use”Full page layout — use host shell. Cards with actions — use AccentCard.
Auto-generated from
src/components/WidgetShell/WidgetShell.types.ts. Do not edit by hand. Runpnpm docs:propsafter changing source JSDoc.
WidgetShellProps
Section titled “WidgetShellProps”| Prop | Type | Required | Description |
|---|---|---|---|
children |
ReactNode |
Yes | Widget content. |
style |
CSSProperties |
No | Optional additional inline styles merged on top of shell defaults. Prefer this only for minor adjustments. |
Examples
Section titled “Examples”Widget wrapper
Section titled “Widget wrapper”import { WidgetShell, Billboard } from '@nike/whisker-component-library';
<WidgetShell> <Billboard label="Open incidents" value="3" /></WidgetShell>;