@hubspot/ui-extensions 0.12.0 → 0.12.2

package/dist/hooks/useExtensionActions.d.ts

@@ -1,4 +1,20 @@
 import type { ExtensionPoints } from '../shared/types/extension-points.ts';
-declare function useExtensionActionsInternal<ExtensionPoint extends keyof ExtensionPoints>(): import("../shared/types/extension-points.ts").ExtensionPointApiActions<ExtensionPoint>;
+declare function useExtensionActionsInternal<TExtensionPoint extends keyof ExtensionPoints>(): import("../shared/types/extension-points.ts").ExtensionPointApiActions<TExtensionPoint>;
+/**
+ * Hook that provides access to extension actions for the specified extension point.
+ *
+ * Actions are methods provided by the host application that extensions can invoke to
+ * interact with the platform, such as showing notifications, opening modals, or
+ * navigating to different views.
+ *
+ * @typeParam TExtensionPoint - The extension point location (e.g., 'crm.record.tab', 'settings')
+ * @returns The actions object containing all available action methods for the extension point
+ *
+ * @example
+ * ```tsx
+ * const actions = useExtensionActions<'crm.record.tab'>();
+ * // Use actions like: actions.openIframeModal(...)
+ * ```
+ */
 export declare const useExtensionActions: typeof useExtensionActionsInternal;
 export {};

package/dist/hooks/useExtensionActions.js

@@ -3,4 +3,20 @@ import { createMockAwareHook } from "../internal/hook-utils.js";
 function useExtensionActionsInternal() {
     return getWorkerGlobals().hsWorkerAPI.useExtensionActions();
 }
+/**
+ * Hook that provides access to extension actions for the specified extension point.
+ *
+ * Actions are methods provided by the host application that extensions can invoke to
+ * interact with the platform, such as showing notifications, opening modals, or
+ * navigating to different views.
+ *
+ * @typeParam TExtensionPoint - The extension point location (e.g., 'crm.record.tab', 'settings')
+ * @returns The actions object containing all available action methods for the extension point
+ *
+ * @example
+ * ```tsx
+ * const actions = useExtensionActions<'crm.record.tab'>();
+ * // Use actions like: actions.openIframeModal(...)
+ * ```
+ */
 export const useExtensionActions = createMockAwareHook('useExtensionActions', useExtensionActionsInternal);

package/dist/hooks/useExtensionApi.d.ts

@@ -0,0 +1,20 @@
+import type { ExtensionPoints } from '../shared/types/extension-points.ts';
+declare function useExtensionApiInternal<TExtensionPoint extends keyof ExtensionPoints>(): import("../shared/types/extension-points.ts").ExtensionPointFullApi<TExtensionPoint>;
+/**
+ * Hook that provides access to the full extension API for the specified extension point.
+ *
+ * The extension API includes:
+ * - `actions`: Methods to interact with the host application
+ * - `context`: Contextual data about the current environment
+ * - `runServerlessFunction`: Function to execute serverless functions (deprecated)
+ *
+ * @typeParam TExtensionPoint - The extension point location (e.g., 'crm.record.tab', 'settings')
+ * @returns The complete extension API object containing actions, context, and runServerlessFunction
+ *
+ * @example
+ * ```tsx
+ * const { actions, context, runServerlessFunction } = useExtensionApi<'crm.record.tab'>();
+ * ```
+ */
+export declare const useExtensionApi: typeof useExtensionApiInternal;
+export {};

package/dist/hooks/useExtensionApi.js

@@ -0,0 +1,22 @@
+import { getWorkerGlobals } from "../internal/global-utils.js";
+import { createMockAwareHook } from "../internal/hook-utils.js";
+function useExtensionApiInternal() {
+    return getWorkerGlobals().hsWorkerAPI.useExtensionApi();
+}
+/**
+ * Hook that provides access to the full extension API for the specified extension point.
+ *
+ * The extension API includes:
+ * - `actions`: Methods to interact with the host application
+ * - `context`: Contextual data about the current environment
+ * - `runServerlessFunction`: Function to execute serverless functions (deprecated)
+ *
+ * @typeParam TExtensionPoint - The extension point location (e.g., 'crm.record.tab', 'settings')
+ * @returns The complete extension API object containing actions, context, and runServerlessFunction
+ *
+ * @example
+ * ```tsx
+ * const { actions, context, runServerlessFunction } = useExtensionApi<'crm.record.tab'>();
+ * ```
+ */
+export const useExtensionApi = createMockAwareHook('useExtensionApi', useExtensionApiInternal);

package/dist/hooks/useExtensionContext.d.ts

@@ -1,4 +1,20 @@
 import type { ExtensionPoints } from '../shared/types/extension-points.ts';
-declare function useExtensionContextInternal<ExtensionPoint extends keyof ExtensionPoints>(): import("../shared/types/extension-points.ts").ExtensionPointApiContext<ExtensionPoint>;
+declare function useExtensionContextInternal<TExtensionPoint extends keyof ExtensionPoints>(): import("../shared/types/extension-points.ts").ExtensionPointApiContext<TExtensionPoint>;
+/**
+ * Hook that provides access to contextual data for the specified extension point.
+ *
+ * The context contains information about the current environment where the extension
+ * is running, such as the current CRM object, user information, portal settings,
+ * and other relevant data specific to the extension point location.
+ *
+ * @typeParam TExtensionPoint - The extension point location (e.g., 'crm.record.tab', 'settings')
+ * @returns The context object containing environment-specific data for the extension point
+ *
+ * @example
+ * ```tsx
+ * const context = useExtensionContext<'crm.record.tab'>();
+ * // Access properties like: context.crm.objectId, context.user, context.portal
+ * ```
+ */
 export declare const useExtensionContext: typeof useExtensionContextInternal;
 export {};

package/dist/hooks/useExtensionContext.js

@@ -3,4 +3,20 @@ import { createMockAwareHook } from "../internal/hook-utils.js";
 function useExtensionContextInternal() {
     return getWorkerGlobals().hsWorkerAPI.useExtensionContext();
 }
+/**
+ * Hook that provides access to contextual data for the specified extension point.
+ *
+ * The context contains information about the current environment where the extension
+ * is running, such as the current CRM object, user information, portal settings,
+ * and other relevant data specific to the extension point location.
+ *
+ * @typeParam TExtensionPoint - The extension point location (e.g., 'crm.record.tab', 'settings')
+ * @returns The context object containing environment-specific data for the extension point
+ *
+ * @example
+ * ```tsx
+ * const context = useExtensionContext<'crm.record.tab'>();
+ * // Access properties like: context.crm.objectId, context.user, context.portal
+ * ```
+ */
 export const useExtensionContext = createMockAwareHook('useExtensionContext', useExtensionContextInternal);

package/dist/index.d.ts

@@ -2,6 +2,7 @@ import './clientTypes.ts';
 export { hubspot } from './hubspot.ts';
 export { logger } from './logger.ts';
 export * from './shared/types/index.ts';
-export { Accordion, Alert, AutoGrid, BarChart, Box, Button, ButtonRow, Card, Checkbox, CurrencyInput, DateInput, DescriptionList, DescriptionListItem, Divider, Dropdown, EmptyState, ErrorState, Flex, Form, Heading, Icon, Illustration, Image, Inline, Input, LineChart, Link, List, LoadingButton, LoadingSpinner, Modal, ModalBody, ModalFooter, MultiSelect, NumberInput, Panel, PanelBody, PanelFooter, PanelSection, ProgressBar, RadioButton, ScoreCircle, SearchInput, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, StatusTag, StepIndicator, StepperInput, Tab, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Tag, Text, TextArea, Textarea, Tile, TimeInput, Toggle, ToggleGroup, Tooltip, } from './shared/remoteComponents.tsx';
+export { Accordion, Alert, AutoGrid, BarChart, Box, Button, ButtonRow, Card, Checkbox, CurrencyInput, DateInput, DescriptionList, DescriptionListItem, Divider, Dropdown, EmptyState, ErrorState, Flex, Form, Heading, Icon, Illustration, Image, Inline, Input, LineChart, Link, List, LoadingButton, LoadingSpinner, Modal, ModalBody, ModalFooter, MultiSelect, NumberInput, Panel, PanelBody, PanelFooter, PanelSection, ProgressBar, RadioButton, ScoreCircle, SearchInput, Select, Spacer, Stack, Statistics, StatisticsItem, StatisticsTrend, StatusTag, StepIndicator, StepperInput, Tab, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Tag, Text, TextArea, Textarea, Tile, TimeInput, Toggle, ToggleGroup, Tooltip, } from './shared/remoteComponents.tsx';
 export { useExtensionContext } from './hooks/useExtensionContext.tsx';
 export { useExtensionActions } from './hooks/useExtensionActions.tsx';
+export { useExtensionApi } from './hooks/useExtensionApi.tsx';

package/dist/index.js

@@ -3,6 +3,7 @@ import "./clientTypes.js";
 export { hubspot } from "./hubspot.js";
 export { logger } from "./logger.js";
 export * from "./shared/types/index.js";
-export { Accordion, Alert, AutoGrid, BarChart, Box, Button, ButtonRow, Card, Checkbox, CurrencyInput, DateInput, DescriptionList, DescriptionListItem, Divider, Dropdown, EmptyState, ErrorState, Flex, Form, Heading, Icon, Illustration, Image, Inline, Input, LineChart, Link, List, LoadingButton, LoadingSpinner, Modal, ModalBody, ModalFooter, MultiSelect, NumberInput, Panel, PanelBody, PanelFooter, PanelSection, ProgressBar, RadioButton, ScoreCircle, SearchInput, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, StatusTag, StepIndicator, StepperInput, Tab, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Tag, Text, TextArea, Textarea, Tile, TimeInput, Toggle, ToggleGroup, Tooltip, } from "./shared/remoteComponents.js";
+export { Accordion, Alert, AutoGrid, BarChart, Box, Button, ButtonRow, Card, Checkbox, CurrencyInput, DateInput, DescriptionList, DescriptionListItem, Divider, Dropdown, EmptyState, ErrorState, Flex, Form, Heading, Icon, Illustration, Image, Inline, Input, LineChart, Link, List, LoadingButton, LoadingSpinner, Modal, ModalBody, ModalFooter, MultiSelect, NumberInput, Panel, PanelBody, PanelFooter, PanelSection, ProgressBar, RadioButton, ScoreCircle, SearchInput, Select, Spacer, Stack, Statistics, StatisticsItem, StatisticsTrend, StatusTag, StepIndicator, StepperInput, Tab, Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, Tag, Text, TextArea, Textarea, Tile, TimeInput, Toggle, ToggleGroup, Tooltip, } from "./shared/remoteComponents.js";
 export { useExtensionContext } from "./hooks/useExtensionContext.js";
 export { useExtensionActions } from "./hooks/useExtensionActions.js";
+export { useExtensionApi } from "./hooks/useExtensionApi.js";

package/dist/shared/remoteComponents.d.ts

@@ -59,6 +59,15 @@ export declare const DescriptionListItem: import("./types/shared.ts").HubSpotRea
  * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/divider Docs}
  */
 export declare const Divider: import("./types/shared.ts").HubSpotReactComponent<componentTypes.DividerProps>;
+/**
+ * The `Spacer` component renders vertical space between components. Use this component
+ * to add consistent spacing without using empty wrapper components.
+ *
+ * **Links:**
+ *
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/spacer Docs}
+ */
+export declare const Spacer: import("./types/shared.ts").HubSpotReactComponent<componentTypes.SpacerProps>;
 /**
  * The `EmptyState` component sets the content that appears when the extension is in an empty state. Use this component when there's no content or data to help guide users.
  *
@@ -483,7 +492,7 @@ export declare const LoadingButton: import("./types/shared.ts").HubSpotReactComp
  * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/charts Charts Docs}
  * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/charts-example Charts Example}
  */
-export declare const BarChart: import("./types/shared.ts").HubSpotReactComponent<componentTypes.ChartProps>;
+export declare const BarChart: import("./types/shared.ts").HubSpotReactComponent<componentTypes.BarChartProps>;
 /**
  * The `LineChart` component renders a line chart for visualizing data. This type of chart is best suited for time series plots or trend data.
  *
@@ -493,7 +502,7 @@ export declare const BarChart: import("./types/shared.ts").HubSpotReactComponent
  * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/charts Charts Docs}
  * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/charts-example Charts Example}
  */
-export declare const LineChart: import("./types/shared.ts").HubSpotReactComponent<componentTypes.ChartProps>;
+export declare const LineChart: import("./types/shared.ts").HubSpotReactComponent<componentTypes.LineChartProps>;
 /**
  * The `ScoreCircle` component displays a score value (0-100) as a circular progress indicator with color-coded bands.
  * Scores are color-coded: 0-32 (alert/red), 33-65 (warning/yellow), 66-100 (success/green).

package/dist/shared/remoteComponents.js

@@ -63,6 +63,15 @@ export const DescriptionListItem = createAndRegisterRemoteReactComponent('Descri
  * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/divider Docs}
  */
 export const Divider = createAndRegisterRemoteReactComponent('Divider');
+/**
+ * The `Spacer` component renders vertical space between components. Use this component
+ * to add consistent spacing without using empty wrapper components.
+ *
+ * **Links:**
+ *
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/spacer Docs}
+ */
+export const Spacer = createAndRegisterRemoteReactComponent('Spacer');
 /**
  * The `EmptyState` component sets the content that appears when the extension is in an empty state. Use this component when there's no content or data to help guide users.
  *

package/dist/shared/types/components/accordion.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { TShirtSizes, BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.Accordion}.
+ * The props type for [Accordion](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/accordion).
  *
  * @category Component Props
  */

package/dist/shared/types/components/alert.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.Alert}.
+ * The props type for [Alert](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/alert).
  *
  * @category Component Props
  */

package/dist/shared/types/components/app-home-header-actions.d.ts

@@ -2,7 +2,7 @@ import { ReactNode } from 'react';
 import { ReactionsHandler } from '../reactions.ts';
 import { ExtensionEvent, OverlayComponentProps, HrefProp, BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.HeaderActions}.
+ * The props type for [HeaderActions](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/create-an-app-home-page#headeractions).
  *
  * @category Component Props
  */
@@ -13,7 +13,7 @@ export interface HeaderActionsProps extends BaseComponentProps {
     children: ReactNode;
 }
 /**
- * The props type for {@link !components.HeaderActions}.
+ * The props type for [HeaderActions](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/create-an-app-home-page#headeractions).
  *
  * @category Component Props
  */

package/dist/shared/types/components/button-row.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { TShirtSizes, BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.ButtonRow}.
+ * The props type for [ButtonRow](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/button-row).
  *
  * @category Component Props
  */

package/dist/shared/types/components/button.d.ts

@@ -3,7 +3,8 @@ import { OverlayComponentProps, HrefProp, TShirtSizes, IconNames, ExtensionEvent
 import { ReactionsHandler } from '../reactions.ts';
 export interface BaseButtonProps extends BaseComponentProps {
     /**
-     * A function that will be invoked when the button is clicked. It receives no arguments and its return value is ignored.
+     * A function that will be invoked when the button is clicked. It receives an event object and a reactions object
+     * with methods to control overlays. Its return value is ignored.
      *
      * @event
      */
@@ -52,7 +53,7 @@ export interface BaseButtonProps extends BaseComponentProps {
     truncate?: boolean;
 }
 /**
- * The props type for {@link !components.Button}.
+ * The props type for [Button](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/button).
  *
  * @category Component Props
  */
@@ -71,7 +72,7 @@ export interface LoadingButtonOverlayOptions {
     openBehavior?: 'onClick' | 'onLoadingFinish';
 }
 /**
- * The props type for {@link !components.LoadingButton}.
+ * The props type for [LoadingButton](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/loading-button).
  *
  * @category Component Props
  */

package/dist/shared/types/components/chart.d.ts

@@ -1,32 +1,93 @@
 import { BaseComponentProps } from '../shared.ts';
+export interface ChartProps extends BaseComponentProps {
+    /**
+     * An object containing the chart's data in an array.
+     */
+    data: ChartDataRow[] | {
+        data: ChartDataRow[];
+        options?: ChartDataOptions;
+    };
+    /**
+     * Configures the chart's axes.
+     */
+    axes: ChartAxisPair;
+    /**
+     * Additional chart configuration options. Options include:
+     * - `title` (string): a title for the chart.
+     * - `showLegend` (boolean): set to `true` to display a legend above the chart.
+     * - `showDataLabels` (boolean): set to `true` to display labels above data points.
+     * - `showTooltips` (boolean): set to `true` to display tooltips for data points on hover.
+     * - `colorList` (array): specify a custom order for colors to be used in the report.
+     *
+     * Learn more about [chart options](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/overview#chart-options).
+     */
+    options?: ChartOptions;
+}
 /**
- * The props type for {@link !components.BarChart}.
+ * The props type for [BarChart](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/bar-chart).
  *
  * @category Component Props
  */
-export type BarChartProps = ChartProps;
+export interface BarChartProps extends ChartProps {
+    /**
+     * An object containing the chart's data in an array.
+     * - Data should be formatted as comma-separated objects containing key-value pairs.
+     * - Data will be displayed in the order it's provided, so any sorting will need to be done before passing it to the component.
+     * - While it's recommended to pre-format your data to be human-readable, you can also provide the `propertyLabels` parameter via this prop's `options` to relabel data values. See example in the [Stacking section](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/bar-chart#stacking).
+     *
+     * Learn more about [formatting data](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/overview#formatting-data).
+     */
+    data: ChartDataRow[] | {
+        data: ChartDataRow[];
+        options?: ChartDataOptions;
+    };
+    /**
+     * Configures the chart's axes. Using the `x` and `y` fields, you'll configure each axis individually with `field` and `fieldType` parameters, along with an optional `label` parameter:
+     * - `field` (Required): the field from your dataset to use. This value will be used as the displayed axis label if no `label` is specified.
+     * - `fieldType` (Required): the type of field. Can be `category`, `datetime`, or `linear`. Learn more about [field types](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/overview#configuring-axes).
+     * - `label`: the axis label. If not specified, the `field` value will be used.
+     *
+     * You can also include an `options` field to further configure the axes with the following options:
+     * - `groupFieldByColor` (string): specify a field to [apply color](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/bar-chart#colors) to for visual clarity.
+     * - `stacking` (boolean): [stack grouped data](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/bar-chart#stacking) instead of always rendering separate bars.
+     * - `colors` (object): [specify colors for values](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/bar-chart#specify-colors-per-field-value) in the field specified in `groupFieldByColor`.
+     *
+     * Learn more about [chart axes](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/overview#configuring-axes).
+     */
+    axes: ChartAxisPair;
+}
 /**
- * The props type for {@link !components.LineChart}.
+ * The props type for [LineChart](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/line-chart).
  *
  * @category Component Props
  */
-export type LineChartProps = ChartProps;
-export interface ChartProps extends BaseComponentProps {
+export interface LineChartProps extends ChartProps {
     /**
      * An object containing the chart's data in an array.
+     * - Data should be formatted as comma-separated objects containing key-value pairs.
+     * - Data will be displayed in the order it's provided, so any sorting will need to be done before passing it to the component.
+     * - While it's recommended to pre-format your data to be human-readable, you can also provide the `propertyLabels` parameter via this prop's `options` to relabel data values. See example in the [Stacking section](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/line-chart#stacking).
+     *
+     * Learn more about [formatting data](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/overview#formatting-data).
      */
     data: ChartDataRow[] | {
         data: ChartDataRow[];
         options?: ChartDataOptions;
     };
     /**
-     * Configures the chart's axes.
+     * Configures the chart's axes. Using the `x` and `y` fields, you'll configure each axis individually with `field` and `fieldType` parameters, along with an optional `label` parameter:
+     * - `field` (Required): the field from your dataset to use. This value will be used as the displayed axis label if no `label` is specified.
+     * - `fieldType` (Required): the type of field. Can be `category`, `datetime`, or `linear`. Learn more about [field types](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/overview#configuring-axes).
+     * - `label`: the axis label. If not specified, the `field` value will be used.
+     *
+     * You can also include an `options` field to further configure the axes with the following options:
+     * - `groupFieldByColor` (string): specify a field to [apply color](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/line-chart#colors) to for visual clarity.
+     * - `stacking` (boolean): [stack grouped data](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/line-chart#stacking) instead of always rendering separated lines.
+     * - `colors` (object): [specify colors for values](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/line-chart#specify-colors-per-field-value) in the field specified in `groupFieldByColor`.
+     *
+     * Learn more about [chart axes](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/charts/overview#configuring-axes).
      */
     axes: ChartAxisPair;
-    /**
-     * Additional chart configuration options.
-     */
-    options?: ChartOptions;
 }
 export type ChartDataRow = {
     [key: string]: number | string;

package/dist/shared/types/components/description-list.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.DescriptionListItem}.
+ * The props type for [DescriptionListItem](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/description-list).
  *
  * @category Component Props
  */
@@ -18,13 +18,13 @@ export interface DescriptionListItemProps extends BaseComponentProps {
     label: string;
 }
 /**
- * The props type for {@link !components.DescriptionList}.
+ * The props type for [DescriptionList](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/description-list).
  *
  * @category Component Props
  */
 export interface DescriptionListProps extends BaseComponentProps {
     /**
-     * Sets the content that will render inside the component. This prop is passed implicitly by providing sub-components. The children should be {@link !components.DescriptionListItem}.
+     * Sets the content that will render inside the component. This prop is passed implicitly by providing sub-components. The children should be [DescriptionListItem](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/description-list).
      *
      */
     children: ReactNode;

package/dist/shared/types/components/divider.d.ts

@@ -1,6 +1,6 @@
 import { AllDistances, BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.Divider}.
+ * The props type for [Divider](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/divider).
  *
  * @category Component Props
  */
@@ -10,5 +10,9 @@ export interface DividerProps extends BaseComponentProps {
      *
      * @defaultValue `"small"`
      */
+    size?: AllDistances;
+    /**
+     * @deprecated Use `size` instead.
+     */
     distance?: AllDistances;
 }

package/dist/shared/types/components/dropdown.d.ts

@@ -20,7 +20,7 @@ export interface DropdownOption {
     onClick?: () => void;
 }
 /**
- * The props type for {@link !components.DropdownButtonItem}.
+ * The props type for [DropdownButtonItem](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/dropdown).
  *
  * @category Component Props
  */
@@ -38,7 +38,7 @@ export interface DropdownButtonItemProps extends OverlayComponentProps, BaseComp
     onClick?: ReactionsHandler<ExtensionEvent>;
 }
 /**
- * The props type for {@link !components.Dropdown}.
+ * The props type for [Dropdown](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/dropdown).
  *
  * @category Component Props
  */

package/dist/shared/types/components/empty-state.d.ts

@@ -2,7 +2,7 @@ import { ReactNode } from 'react';
 import { BaseComponentProps } from '../shared.ts';
 export type EmptyStateImageName = 'addOnReporting' | 'announcement' | 'api' | 'automatedTesting' | 'beta' | 'building' | 'callingSetUp' | 'companies' | 'components' | 'cone' | 'contacts' | 'contentStrategy' | 'customObjects' | 'customerExperience' | 'customerSupport' | 'deals' | 'developerSecurityUpdate' | 'electronicSignature' | 'electronicSignatureEmptyState' | 'emailConfirmation' | 'emptyStateCharts' | 'idea' | 'integrations' | 'leads' | 'lock' | 'meetings' | 'missedGoal' | 'multipleObjects' | 'object' | 'productsShoppingCart' | 'registration' | 'sandboxAddOn' | 'social' | 'store' | 'storeDisabled' | 'successfullyConnectedEmail' | 'target' | 'task' | 'tickets' | 'voteAndSearch';
 /**
- * The props type for {@link !components.EmptyState}.
+ * The props type for [EmptyState](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/empty-state).
  *
  * @category Component Props
  */

package/dist/shared/types/components/error-state.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.ErrorState}.
+ * The props type for [ErrorState](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/error-state).
  *
  * @category Component Props
  */

package/dist/shared/types/components/form.d.ts

@@ -3,7 +3,7 @@ import { FormSubmitExtensionEvent, BaseComponentProps } from '../shared.ts';
 import { ReactionsHandler } from '../reactions.ts';
 export type FormInputValues = Record<string, string | number>;
 /**
- * The props type for {@link !components.Form}.
+ * The props type for [Form](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/form).
  *
  * @category Component Props
  */

package/dist/shared/types/components/heading.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.Heading}.
+ * The props type for [Heading](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/heading).
  *
  * @category Component Props
  */

package/dist/shared/types/components/icon.d.ts

@@ -1,7 +1,7 @@
 import { TShirtSizes, IconNames, BaseComponentProps } from '../shared.ts';
 export type IconColor = 'alert' | 'warning' | 'success' | 'inherit';
 /**
- * The props type for {@link !components.Icon}.
+ * The props type for [Icon](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/icon).
  *
  * @category Component Props
  */

package/dist/shared/types/components/illustration.d.ts

@@ -1,6 +1,6 @@
 import { BaseComponentProps } from '../shared.ts';
 /**
- * The props type for {@link !components.Illustration}.
+ * The props type for [Illustration](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/illustration).
  *
  * @category Component Props
  */

package/dist/shared/types/components/image.d.ts

@@ -1,7 +1,7 @@
 import { OverlayComponentProps, HrefProp, ExtensionEvent, BaseComponentProps } from '../shared.ts';
 import { ReactionsHandler } from '../reactions.ts';
 /**
- * The props type for {@link !components.Image}.
+ * The props type for [Image](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/image).
  *
  * @category Component Props
  */
@@ -22,7 +22,8 @@ export interface ImageProps extends OverlayComponentProps, BaseComponentProps {
      */
     href?: HrefProp;
     /**
-     * A function that will be called when the image is clicked. This function will receive no arguments and any returned values will be ignored.
+     * A function that will be invoked when the button is clicked. It receives an event object and a reactions object
+     * with methods to control overlays. Its return value is ignored.
      *
      * @event
      */

package/dist/shared/types/components/index.d.ts

@@ -26,6 +26,7 @@ export type * from './panel.ts';
 export type * from './progress-bar.ts';
 export type * from './score.ts';
 export type * from './selects.ts';
+export type * from './spacer.ts';
 export type * from './statistics.ts';
 export type * from './status-tag.ts';
 export type * from './step-indicator.ts';

package/dist/shared/types/components/inputs.d.ts

@@ -80,7 +80,7 @@ interface BaseInputProps<T = string, V = string> extends BaseComponentProps {
     onFocus?: (value: V) => void;
 }
 /**
- * The props type for {@link !components.Input}.
+ * The props type for [Input](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/input).
  *
  * @category Component Props
  */
@@ -93,7 +93,7 @@ export interface InputProps extends BaseInputProps {
     type?: 'text' | 'password';
 }
 /**
- * The props type for {@link !components.TextArea}.
+ * The props type for [TextArea](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/text-area).
  *
  * @category Component Props
  */
@@ -130,7 +130,7 @@ export type TextareaProps = TextAreaProps;
  * */
 type BaseInputForNumber = Omit<BaseInputProps<number, number>, 'onInput'>;
 /**
- * The props type for {@link !components.NumberInput}.
+ * The props type for [NumberInput](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/number-input).
  *
  * @category Component Props
  */
@@ -157,7 +157,7 @@ export interface NumberInputProps extends BaseInputForNumber {
     onInput?: (value: number) => void;
 }
 /**
- * The props type for {@link !components.CurrencyInput}.
+ * The props type for [CurrencyInput](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/currency-input).
  *
  * @category Component Props
  */
@@ -181,7 +181,7 @@ export interface CurrencyInputProps extends BaseInputForNumber {
     max?: number;
 }
 /**
- * The props type for {@link !components.StepperInput}.
+ * The props type for [StepperInput](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/stepper-input).
  *
  * @category Component Props
  */
@@ -219,7 +219,7 @@ export interface DateInputEventsPayload extends BaseDate {
  * */
 type BaseDateInputForDate = Omit<BaseInputProps<BaseDate | null, DateInputEventsPayload>, 'onInput' | 'placeholder'>;
 /**
- * The props type for {@link !components.DateInput}.
+ * The props type for [DateInput](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/date-input).
  *
  * @category Component Props
  */
@@ -306,7 +306,7 @@ export interface TimeInputEventsPayload extends BaseTime {
  * */
 type BaseTimeInputForTime = Omit<BaseInputProps<BaseTime | null, TimeInputEventsPayload>, 'onInput' | 'placeholder' | 'onChange'>;
 /**
- * The props type for {@link !components.TimeInput}.
+ * The props type for [TimeInput](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/time-input).
  *
  * @category Component Props
  */
@@ -338,7 +338,7 @@ export interface TimeInputProps extends BaseTimeInputForTime {
     timezone?: 'userTz' | 'portalTz';
 }
 /**
- * The props type for {@link !components.SearchInput}.
+ * The props type for [SearchInput](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/ui-components/standard-components/search-input).
  *
  * @category Component Props
  */