@hubspot/ui-extensions 0.8.39 → 0.8.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,11 @@
1
1
  import type * as types from './types';
2
2
  /**
3
- * @link https://developers.hubspot.com/beta-docs/reference/ui-components/standard-components/alert
3
+ * The `Alert` component renders an alert within a card. Use this component to give usage guidance, notify users of action results, or warn them about potential issues or failures.
4
+ *
5
+ * **Links:**
6
+ *
7
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/alert Docs}
8
+ * - {@link https://app.hubspot.com/docs/48008916/reference/ui-components/standard-components/alert#variants Variants}
4
9
  */
5
10
  export declare const Alert: "Alert" & {
6
11
  readonly type?: "Alert" | undefined;
@@ -12,14 +17,21 @@ export declare const Alert: "Alert" & {
12
17
  *
13
18
  * **Links:**
14
19
  *
15
- * - {@link https://developers.hubspot.com/beta-docs/reference/ui-components/standard-components/button Docs}
16
- * - {@link https://developers.hubspot.com/beta-docs/reference/ui-components/standard-components/button#usage-examples Examples}
20
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/button Docs}
21
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/button#usage-examples Examples}
17
22
  */
18
23
  export declare const Button: "Button" & {
19
24
  readonly type?: "Button" | undefined;
20
25
  readonly props?: types.ButtonProps | undefined;
21
26
  readonly children?: true | undefined;
22
27
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Button", types.ButtonProps, true>>;
28
+ /**
29
+ * The `ButtonRow` component renders a row of specified `Button` components. Use this component when you want to include multiple buttons in a row.
30
+ *
31
+ * **Links:**
32
+ *
33
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/button-row Docs}
34
+ */
23
35
  export declare const ButtonRow: "ButtonRow" & {
24
36
  readonly type?: "ButtonRow" | undefined;
25
37
  readonly props?: types.ButtonRowProps | undefined;
@@ -30,56 +42,133 @@ export declare const Card: "Card" & {
30
42
  readonly props?: types.CardProps | undefined;
31
43
  readonly children?: true | undefined;
32
44
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Card", types.CardProps, true>>;
45
+ /**
46
+ * The `DescriptionList` component renders pairs of labels and values. Use this component to display pairs of labels and values in a way that's easy to read at a glance.
47
+ *
48
+ * **Links:**
49
+ *
50
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/description-list Docs}
51
+ */
33
52
  export declare const DescriptionList: "DescriptionList" & {
34
53
  readonly type?: "DescriptionList" | undefined;
35
54
  readonly props?: types.DescriptionListProps | undefined;
36
55
  readonly children?: true | undefined;
37
56
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"DescriptionList", types.DescriptionListProps, true>>;
57
+ /**
58
+ * The `DescriptionListItem` component renders a single set of a label and value. Use this component within a `DescriptionList` component.
59
+ *
60
+ * **Links:**
61
+ *
62
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/description-list Docs}
63
+ */
38
64
  export declare const DescriptionListItem: "DescriptionListItem" & {
39
65
  readonly type?: "DescriptionListItem" | undefined;
40
66
  readonly props?: types.DescriptionListItemProps | undefined;
41
67
  readonly children?: true | undefined;
42
68
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"DescriptionListItem", types.DescriptionListItemProps, true>>;
69
+ /**
70
+ * The `Divider` component renders a grey, horizontal line for spacing out components vertically or creating sections in an extension. Use this component to space out other components when the content needs more separation than white space.
71
+ *
72
+ * **Links:**
73
+ *
74
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/divider Docs}
75
+ */
43
76
  export declare const Divider: "Divider" & {
44
77
  readonly type?: "Divider" | undefined;
45
78
  readonly props?: types.DividerProps | undefined;
46
79
  readonly children?: true | undefined;
47
80
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Divider", types.DividerProps, true>>;
81
+ /**
82
+ * 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.
83
+ *
84
+ * **Links:**
85
+ *
86
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/empty-state Docs}
87
+ */
48
88
  export declare const EmptyState: "EmptyState" & {
49
89
  readonly type?: "EmptyState" | undefined;
50
90
  readonly props?: types.EmptyStateProps | undefined;
51
91
  readonly children?: true | undefined;
52
92
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"EmptyState", types.EmptyStateProps, true>>;
93
+ /**
94
+ * The `ErrorState` component sets the content of an erroring extension. Use this component to guide users through resolving errors that your extension might encounter.
95
+ *
96
+ * **Links:**
97
+ *
98
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/error-state Docs}
99
+ */
53
100
  export declare const ErrorState: "ErrorState" & {
54
101
  readonly type?: "ErrorState" | undefined;
55
102
  readonly props?: types.ErrorStateProps | undefined;
56
103
  readonly children?: true | undefined;
57
104
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"ErrorState", types.ErrorStateProps, true>>;
105
+ /**
106
+ * The `Form` component renders a form that can contain other subcomponents, such as `Input`, `Select`, and `Button`. Use this component to enable users to submit data to HubSpot or an external system.
107
+ *
108
+ * **Links:**
109
+ *
110
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/form Docs}
111
+ */
58
112
  export declare const Form: "Form" & {
59
113
  readonly type?: "Form" | undefined;
60
114
  readonly props?: types.FormProps | undefined;
61
115
  readonly children?: true | undefined;
62
116
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Form", types.FormProps, true>>;
117
+ /**
118
+ * The `Heading` component renders large heading text. Use this component to introduce or differentiate sections of your component.
119
+ *
120
+ * **Links:**
121
+ *
122
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/heading Docs}
123
+ */
63
124
  export declare const Heading: "Heading" & {
64
125
  readonly type?: "Heading" | undefined;
65
126
  readonly props?: types.HeadingProps | undefined;
66
127
  readonly children?: true | undefined;
67
128
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Heading", types.HeadingProps, true>>;
129
+ /**
130
+ * The `Image` component renders an image. Use this component to add a logo or other visual brand identity asset, or to accentuate other content in the extension.
131
+ *
132
+ * **Links:**
133
+ *
134
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/image Docs}
135
+ */
68
136
  export declare const Image: "Image" & {
69
137
  readonly type?: "Image" | undefined;
70
138
  readonly props?: types.ImageProps | undefined;
71
139
  readonly children?: true | undefined;
72
140
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Image", types.ImageProps, true>>;
141
+ /**
142
+ * The `Input` component renders a text input field where a user can enter a custom text value. Like other inputs, this component should be used within a `Form` that has a submit button.
143
+ *
144
+ * **Links:**
145
+ *
146
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/input Docs}
147
+ */
73
148
  export declare const Input: "Input" & {
74
149
  readonly type?: "Input" | undefined;
75
150
  readonly props?: types.InputProps | undefined;
76
151
  readonly children?: true | undefined;
77
152
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Input", types.InputProps, true>>;
153
+ /**
154
+ * The `Link` component renders a clickable hyperlink. Use links to direct users to an external web page or another part of the HubSpot app.
155
+ *
156
+ * **Links:**
157
+ *
158
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/link Docs}
159
+ */
78
160
  export declare const Link: "Link" & {
79
161
  readonly type?: "Link" | undefined;
80
162
  readonly props?: types.LinkProps | undefined;
81
163
  readonly children?: true | undefined;
82
164
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Link", types.LinkProps, true>>;
165
+ /**
166
+ * The `TextArea` component renders a fillable text field. Like other inputs, this component should be used within a `Form` that has a submit button.
167
+ *
168
+ * **Links:**
169
+ *
170
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/text-area Docs}
171
+ */
83
172
  export declare const TextArea: "TextArea" & {
84
173
  readonly type?: "TextArea" | undefined;
85
174
  readonly props?: types.TextAreaProps | undefined;
@@ -91,31 +180,73 @@ export declare const Textarea: "Textarea" & {
91
180
  readonly props?: types.TextAreaProps | undefined;
92
181
  readonly children?: true | undefined;
93
182
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Textarea", types.TextAreaProps, true>>;
183
+ /**
184
+ * The `LoadingSpinner` component renders a visual indicator for when an extension is loading or processing data.
185
+ *
186
+ * **Links:**
187
+ *
188
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/loading-spinner Docs}
189
+ */
94
190
  export declare const LoadingSpinner: "LoadingSpinner" & {
95
191
  readonly type?: "LoadingSpinner" | undefined;
96
192
  readonly props?: types.LoadingSpinnerProps | undefined;
97
193
  readonly children?: true | undefined;
98
194
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"LoadingSpinner", types.LoadingSpinnerProps, true>>;
195
+ /**
196
+ * The `ProgressBar` component renders a visual indicator showing a numeric and/or percentage-based representation of progress. The percentage is calculated based on the maximum possible value specified in the component.
197
+ *
198
+ * **Links:**
199
+ *
200
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/progress-bar Docs}
201
+ */
99
202
  export declare const ProgressBar: "ProgressBar" & {
100
203
  readonly type?: "ProgressBar" | undefined;
101
204
  readonly props?: types.ProgressBarProps | undefined;
102
205
  readonly children?: true | undefined;
103
206
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"ProgressBar", types.ProgressBarProps, true>>;
207
+ /**
208
+ * The `Select` component renders a dropdown menu select field where a user can select a single value. A search bar will be automatically included when there are more than seven options. Like other inputs, this component should be used within a `Form` that has a submit button.
209
+ *
210
+ * **Links:**
211
+ *
212
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/select Docs}
213
+ */
104
214
  export declare const Select: "Select" & {
105
215
  readonly type?: "Select" | undefined;
106
216
  readonly props?: types.SelectProps | undefined;
107
217
  readonly children?: true | undefined;
108
218
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Select", types.SelectProps, true>>;
219
+ /**
220
+ * The `Tag` component renders a tag to label or categorize information or other components. Tags can be static or clickable for invoking functions.
221
+ *
222
+ * **Links:**
223
+ *
224
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/tag Docs}
225
+ */
109
226
  export declare const Tag: "Tag" & {
110
227
  readonly type?: "Tag" | undefined;
111
228
  readonly props?: types.TagProps | undefined;
112
229
  readonly children?: true | undefined;
113
230
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Tag", types.TagProps, true>>;
231
+ /**
232
+ * The `Text` component renders text with formatting options.
233
+ *
234
+ * **Links:**
235
+ *
236
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/text Docs}
237
+ */
114
238
  export declare const Text: "Text" & {
115
239
  readonly type?: "Text" | undefined;
116
240
  readonly props?: types.TextProps | undefined;
117
241
  readonly children?: true | undefined;
118
242
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Text", types.TextProps, true>>;
243
+ /**
244
+ * The `Tile` component renders a square tile that can contain other components. Use this component to create groups of related components.
245
+ *
246
+ * **Links:**
247
+ *
248
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/tile Docs}
249
+ */
119
250
  export declare const Tile: "Tile" & {
120
251
  readonly type?: "Tile" | undefined;
121
252
  readonly props?: types.TileProps | undefined;
@@ -127,6 +258,13 @@ export declare const Stack: "Stack" & {
127
258
  readonly props?: types.StackProps | undefined;
128
259
  readonly children?: true | undefined;
129
260
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Stack", types.StackProps, true>>;
261
+ /**
262
+ * The `ToggleGroup` component renders a list of selectable options, either in radio button or checkbox form.
263
+ *
264
+ * **Links:**
265
+ *
266
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/toggle-group Docs}
267
+ */
130
268
  export declare const ToggleGroup: "ToggleGroup" & {
131
269
  readonly type?: "ToggleGroup" | undefined;
132
270
  readonly props?: ({
@@ -148,176 +286,431 @@ export declare const ToggleGroup: "ToggleGroup" & {
148
286
  onChange?: ((value: string) => void) | undefined;
149
287
  value?: string | undefined;
150
288
  } & types.CommonGroupProps), true>>;
289
+ /**
290
+ * The `StatisticsItem` component renders a single data point within a `Statistics` component. Use this component to display a single data point, such as a number or percentage.
291
+ *
292
+ * **Links:**
293
+ *
294
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/statistics Docs}
295
+ */
151
296
  export declare const StatisticsItem: "StatisticsItem" & {
152
297
  readonly type?: "StatisticsItem" | undefined;
153
298
  readonly props?: types.StatisticsItemProps | undefined;
154
299
  readonly children?: true | undefined;
155
300
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"StatisticsItem", types.StatisticsItemProps, true>>;
301
+ /**
302
+ * The `Statistics` component renders a visual spotlight of one or more data points. Includes the `StatisticsItem` and `StatisticsTrend` subcomponents.
303
+ *
304
+ * **Links:**
305
+ *
306
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/statistics Docs}
307
+ */
156
308
  export declare const Statistics: "Statistics" & {
157
309
  readonly type?: "Statistics" | undefined;
158
310
  readonly props?: types.StatisticsProps | undefined;
159
311
  readonly children?: true | undefined;
160
312
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Statistics", types.StatisticsProps, true>>;
313
+ /**
314
+ * The `StatisticsTrend` component renders a percentage trend value and direction alonside a `StatisticsItem` component. Use this component within the `StatisticsItem` component.
315
+ *
316
+ * **Links:**
317
+ *
318
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/statistics Docs}
319
+ */
161
320
  export declare const StatisticsTrend: "StatisticsTrend" & {
162
321
  readonly type?: "StatisticsTrend" | undefined;
163
322
  readonly props?: types.StatisticsTrendProps | undefined;
164
323
  readonly children?: true | undefined;
165
324
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"StatisticsTrend", types.StatisticsTrendProps, true>>;
325
+ /**
326
+ * The `Table` component renders a table. To format the table, use the subcomponents `TableHead`, `TableRow`, `TableHeader`, `TableBody`, `TableCell`and `TableFooter`.
327
+ *
328
+ * **Links:**
329
+ *
330
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/table Docs}
331
+ */
166
332
  export declare const Table: "Table" & {
167
333
  readonly type?: "Table" | undefined;
168
334
  readonly props?: types.TableProps | undefined;
169
335
  readonly children?: true | undefined;
170
336
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Table", types.TableProps, true>>;
337
+ /**
338
+ * The `TableFooter` component renders a footer within a `Table` component. Use this component to display totals or other summary information.
339
+ *
340
+ * **Links:**
341
+ *
342
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/table Docs}
343
+ */
171
344
  export declare const TableFooter: "TableFooter" & {
172
345
  readonly type?: "TableFooter" | undefined;
173
346
  readonly props?: types.TableElementProps | undefined;
174
347
  readonly children?: true | undefined;
175
348
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"TableFooter", types.TableElementProps, true>>;
349
+ /**
350
+ * The `TableCell` component renders individual cells within the `TableBody` component.
351
+ *
352
+ * **Links:**
353
+ *
354
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/table Docs}
355
+ */
176
356
  export declare const TableCell: "TableCell" & {
177
357
  readonly type?: "TableCell" | undefined;
178
358
  readonly props?: types.TableCellProps | undefined;
179
359
  readonly children?: true | undefined;
180
360
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"TableCell", types.TableCellProps, true>>;
361
+ /**
362
+ * The `TableRow` component renders a row within the `TableBody` or `TableHead` component.
363
+ *
364
+ * **Links:**
365
+ *
366
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/table Docs}
367
+ */
181
368
  export declare const TableRow: "TableRow" & {
182
369
  readonly type?: "TableRow" | undefined;
183
370
  readonly props?: types.TableElementProps | undefined;
184
371
  readonly children?: true | undefined;
185
372
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"TableRow", types.TableElementProps, true>>;
373
+ /**
374
+ * The `TableBody` component renders the body (rows and cells) of a table within the `Table` component.
375
+ *
376
+ * **Links:**
377
+ *
378
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/table Docs}
379
+ */
186
380
  export declare const TableBody: "TableBody" & {
187
381
  readonly type?: "TableBody" | undefined;
188
382
  readonly props?: types.TableElementProps | undefined;
189
383
  readonly children?: true | undefined;
190
384
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"TableBody", types.TableElementProps, true>>;
385
+ /**
386
+ * The `TableHeader` component renders individual cells containing bolded column labels, within `TableHead`.
387
+ *
388
+ * **Links:**
389
+ *
390
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/table Docs}
391
+ */
191
392
  export declare const TableHeader: "TableHeader" & {
192
393
  readonly type?: "TableHeader" | undefined;
193
394
  readonly props?: types.TableHeaderProps | undefined;
194
395
  readonly children?: true | undefined;
195
396
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"TableHeader", types.TableHeaderProps, true>>;
397
+ /**
398
+ * The `TableHead` component renders the header section of the `Table` component, containing column labels.
399
+ *
400
+ * **Links:**
401
+ *
402
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/table Docs}
403
+ */
196
404
  export declare const TableHead: "TableHead" & {
197
405
  readonly type?: "TableHead" | undefined;
198
406
  readonly props?: types.TableElementProps | undefined;
199
407
  readonly children?: true | undefined;
200
408
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"TableHead", types.TableElementProps, true>>;
409
+ /**
410
+ * The `NumberInput` component renders a number input field. Like other inputs, this component should be used within a `Form` that has a submit button.
411
+ *
412
+ * **Links:**
413
+ *
414
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/number-input Docs}
415
+ */
201
416
  export declare const NumberInput: "NumberInput" & {
202
417
  readonly type?: "NumberInput" | undefined;
203
418
  readonly props?: types.NumberInputProps | undefined;
204
419
  readonly children?: true | undefined;
205
420
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"NumberInput", types.NumberInputProps, true>>;
421
+ /**
422
+ * The `Box` component renders an empty div container for fine tuning the spacing of components. Commonly used with the `Flex` component.
423
+ *
424
+ * **Links:**
425
+ *
426
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/box Docs}
427
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/flex-and-box Flex and Box Example}
428
+ */
206
429
  export declare const Box: "Box" & {
207
430
  readonly type?: "Box" | undefined;
208
431
  readonly props?: types.BoxProps | undefined;
209
432
  readonly children?: true | undefined;
210
433
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Box", types.BoxProps, true>>;
434
+ /**
435
+ * The `StepIndicator` component renders an indicator to show the current step of a multi-step process.
436
+ *
437
+ * **Links:**
438
+ *
439
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/step-indicator Docs}
440
+ */
211
441
  export declare const StepIndicator: "StepIndicator" & {
212
442
  readonly type?: "StepIndicator" | undefined;
213
443
  readonly props?: types.StepIndicatorProps | undefined;
214
444
  readonly children?: true | undefined;
215
445
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"StepIndicator", types.StepIndicatorProps, true>>;
446
+ /**
447
+ * The `Accordion` component renders an expandable and collapsable section that can contain other components. This component can be helpful for saving space and breaking up extension content.
448
+ *
449
+ * **Links:**
450
+ *
451
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/accordion Docs}
452
+ */
216
453
  export declare const Accordion: "Accordion" & {
217
454
  readonly type?: "Accordion" | undefined;
218
455
  readonly props?: types.AccordionProps | undefined;
219
456
  readonly children?: true | undefined;
220
457
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Accordion", types.AccordionProps, true>>;
458
+ /**
459
+ * The MultiSelect component renders a dropdown menu select field where a user can select multiple values. Commonly used within the `Form` component.
460
+ *
461
+ * **Links:**
462
+ *
463
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/multi-select Docs}
464
+ */
221
465
  export declare const MultiSelect: "MultiSelect" & {
222
466
  readonly type?: "MultiSelect" | undefined;
223
467
  readonly props?: types.MultiSelectProps | undefined;
224
468
  readonly children?: true | undefined;
225
469
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"MultiSelect", types.MultiSelectProps, true>>;
470
+ /**
471
+ * The `Flex` component renders a flex container that can contain other components, and arrange them with props. Use this component to create a flexible and responsive layout.
472
+ *
473
+ * **Links:**
474
+ *
475
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/flex Docs}
476
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/flex-and-box Flex and Box Example}
477
+ */
226
478
  export declare const Flex: "Flex" & {
227
479
  readonly type?: "Flex" | undefined;
228
480
  readonly props?: types.FlexProps | undefined;
229
481
  readonly children?: true | undefined;
230
482
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Flex", types.FlexProps, true>>;
483
+ /**
484
+ * The `DateInput` component renders an input field where a user can select a date. Commonly used within the `Form` component.
485
+ *
486
+ * **Links:**
487
+ *
488
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/date-input Docs}
489
+ */
231
490
  export declare const DateInput: "DateInput" & {
232
491
  readonly type?: "DateInput" | undefined;
233
492
  readonly props?: types.DateInputProps | undefined;
234
493
  readonly children?: true | undefined;
235
494
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"DateInput", types.DateInputProps, true>>;
495
+ /**
496
+ * The `Checkbox` component renders a single checkbox input. Commonly used within the `Form` component. If you want to display multiple checkboxes, you should use `ToggleGroup` instead, as it comes with extra logic for handling multiple checkboxes.
497
+ *
498
+ * **Links:**
499
+ *
500
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/checkbox Docs}
501
+ */
236
502
  export declare const Checkbox: "Checkbox" & {
237
503
  readonly type?: "Checkbox" | undefined;
238
504
  readonly props?: types.CheckboxProps | undefined;
239
505
  readonly children?: true | undefined;
240
506
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Checkbox", types.CheckboxProps, true>>;
507
+ /**
508
+ * The `RadioButton` component renders a single radio input. Commonly used within the `Form` component. If you want to display multiple radio inputs, you should use `ToggleGroup` instead, as it comes with extra logic for handling multiple inputs.
509
+ */
241
510
  export declare const RadioButton: "RadioButton" & {
242
511
  readonly type?: "RadioButton" | undefined;
243
512
  readonly props?: types.RadioButtonProps | undefined;
244
513
  readonly children?: true | undefined;
245
514
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"RadioButton", types.RadioButtonProps, true>>;
515
+ /**
516
+ * The `List` component renders a list of items. Use this component to display a list of items, such as a list of contacts, tasks, or other data. A list can be styled as a bulleted list or a numbered list.
517
+ *
518
+ * **Links:**
519
+ *
520
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/list Docs}
521
+ */
246
522
  export declare const List: "List" & {
247
523
  readonly type?: "List" | undefined;
248
524
  readonly props?: types.ListProps | undefined;
249
525
  readonly children?: true | undefined;
250
526
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"List", types.ListProps, true>>;
527
+ /**
528
+ * The `Toggle` component renders a boolean toggle switch that can be configured with sizing, label position, read-only, and more.
529
+ *
530
+ * **Links:**
531
+ *
532
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/toggle Docs}
533
+ */
251
534
  export declare const Toggle: "Toggle" & {
252
535
  readonly type?: "Toggle" | undefined;
253
536
  readonly props?: types.ToggleProps | undefined;
254
537
  readonly children?: true | undefined;
255
538
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Toggle", types.ToggleProps, true>>;
539
+ /**
540
+ * The `Dropdown` component renders a dropdown menu that can appear as a button or hyperlink. Use this component to enable users to select from multiple options in a compact list.
541
+ *
542
+ * **Links:**
543
+ *
544
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/dropdown Docs}
545
+ */
256
546
  export declare const Dropdown: "Dropdown" & {
257
547
  readonly type?: "Dropdown" | undefined;
258
548
  readonly props?: types.DropdownProps | undefined;
259
549
  readonly children?: true | undefined;
260
550
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Dropdown", types.DropdownProps, true>>;
551
+ /**
552
+ * The Panel component renders a panel overlay on the right side of the page and contains other components.
553
+ *
554
+ * **Links:**
555
+ *
556
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/panel Docs}
557
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/overlay-example Overlay Example}
558
+ */
261
559
  export declare const Panel: "Panel" & {
262
560
  readonly type?: "Panel" | undefined;
263
561
  readonly props?: types.PanelProps | undefined;
264
562
  readonly children?: true | undefined;
265
563
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Panel", types.PanelProps, true>>;
564
+ /**
565
+ * The `PanelFooter` is a sticky footer component displayed at the bottom of a `Panel` component. Use this component to display actions or other content that should be visible at all times. Include only one `PanelFooter` component per `Panel`.
566
+ *
567
+ * **Links:**
568
+ *
569
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/panel-footer Docs}
570
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/overlay-example Overlay Example}
571
+ */
266
572
  export declare const PanelFooter: "PanelFooter" & {
267
573
  readonly type?: "PanelFooter" | undefined;
268
574
  readonly props?: types.PanelFooterProps | undefined;
269
575
  readonly children?: true | undefined;
270
576
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"PanelFooter", types.PanelFooterProps, true>>;
577
+ /**
578
+ * The `PanelBody` component is a container that wraps the panel's content and makes it scrollable. Include only one `PanelBody` component per `Panel`.
579
+ *
580
+ * **Links:**
581
+ *
582
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/panel-footer Docs}
583
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/overlay-example Overlay Example}
584
+ */
271
585
  export declare const PanelBody: "PanelBody" & {
272
586
  readonly type?: "PanelBody" | undefined;
273
587
  readonly props?: types.PanelBodyProps | undefined;
274
588
  readonly children?: true | undefined;
275
589
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"PanelBody", types.PanelBodyProps, true>>;
590
+ /**
591
+ * The `PanelSection` component is a container that adds padding and bottom margin to provide spacing between content. Use the `PanelSection` component to separate content within a `PanelBody`.
592
+ *
593
+ * **Links:**
594
+ *
595
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/panel-footer Docs}
596
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/overlay-example Overlay Example}
597
+ */
276
598
  export declare const PanelSection: "PanelSection" & {
277
599
  readonly type?: "PanelSection" | undefined;
278
600
  readonly props?: types.PanelSectionProps | undefined;
279
601
  readonly children?: true | undefined;
280
602
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"PanelSection", types.PanelSectionProps, true>>;
603
+ /**
604
+ * The `StepperInput` component renders a number input field that can be increased or decreased by a set number. Commonly used within the `Form` component.
605
+ *
606
+ * **Links:**
607
+ *
608
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/stepper-input Docs}
609
+ */
281
610
  export declare const StepperInput: "StepperInput" & {
282
611
  readonly type?: "StepperInput" | undefined;
283
612
  readonly props?: types.StepperInputProps | undefined;
284
613
  readonly children?: true | undefined;
285
614
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"StepperInput", types.StepperInputProps, true>>;
615
+ /**
616
+ * The Modal component renders a pop-up overlay that can contain other components.
617
+ *
618
+ * **Links:**
619
+ *
620
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/modal Docs}
621
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/overlay-example Overlay Example}
622
+ */
286
623
  export declare const Modal: "Modal" & {
287
624
  readonly type?: "Modal" | undefined;
288
625
  readonly props?: types.ModalProps | undefined;
289
626
  readonly children?: true | undefined;
290
627
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Modal", types.ModalProps, true>>;
628
+ /**
629
+ * The `ModalBody` component contains the main content of the modal. One `ModalBody` is required per `Modal`.
630
+ *
631
+ * **Links:**
632
+ *
633
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/modal Docs}
634
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/overlay-example Overlay Example}
635
+ */
291
636
  export declare const ModalBody: "ModalBody" & {
292
637
  readonly type?: "ModalBody" | undefined;
293
638
  readonly props?: types.ModalBodyProps | undefined;
294
639
  readonly children?: true | undefined;
295
640
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"ModalBody", types.ModalBodyProps, true>>;
641
+ /**
642
+ * The `ModalFooter` component is an optional component to format the footer section of the modal. Use one `ModalFooter` per `Modal`.
643
+ *
644
+ * **Links:**
645
+ *
646
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/modal Docs}
647
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/overlay-example Overlay Example}
648
+ */
296
649
  export declare const ModalFooter: "ModalFooter" & {
297
650
  readonly type?: "ModalFooter" | undefined;
298
651
  readonly props?: types.ModalFooterProps | undefined;
299
652
  readonly children?: true | undefined;
300
653
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"ModalFooter", types.ModalFooterProps, true>>;
654
+ /**
655
+ * Use the `Icon` component to render a visual icon within other components. It can generally be used inside most components, excluding ones that don't support child components.
656
+ *
657
+ * **Links:**
658
+ *
659
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/icon Docs}
660
+ */
301
661
  export declare const Icon: "Icon" & {
302
662
  readonly type?: "Icon" | undefined;
303
663
  readonly props?: types.IconProps | undefined;
304
664
  readonly children?: true | undefined;
305
665
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Icon", types.IconProps, true>>;
666
+ /**
667
+ * The `StatusTag` component renders a visual indicator to display the current status of an item. Status tags can be static or clickable.
668
+ *
669
+ * **Links:**
670
+ *
671
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/status-tag Docs}
672
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/status-tag#variants Variants}
673
+ */
306
674
  export declare const StatusTag: "StatusTag" & {
307
675
  readonly type?: "StatusTag" | undefined;
308
676
  readonly props?: types.StatusTagProps | undefined;
309
677
  readonly children?: true | undefined;
310
678
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"StatusTag", types.StatusTagProps, true>>;
679
+ /**
680
+ * The `LoadingButton` component renders a button with loading state options.
681
+ *
682
+ * **Links:**
683
+ *
684
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/loading-button Docs}
685
+ */
311
686
  export declare const LoadingButton: "LoadingButton" & {
312
687
  readonly type?: "LoadingButton" | undefined;
313
688
  readonly props?: types.LoadingButtonProps | undefined;
314
689
  readonly children?: true | undefined;
315
690
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"LoadingButton", types.LoadingButtonProps, true>>;
691
+ /**
692
+ * The `BarChart` component renders a bar chart for visualizing data. This type of chart is best suited for comparing categorical data.
693
+ *
694
+ * **Links:**
695
+ *
696
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/bar-chart BarChart Docs}
697
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/charts Charts Docs}
698
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/charts-example Charts Example}
699
+ */
316
700
  export declare const BarChart: "BarChart" & {
317
701
  readonly type?: "BarChart" | undefined;
318
702
  readonly props?: types.ChartProps | undefined;
319
703
  readonly children?: true | undefined;
320
704
  } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"BarChart", types.ChartProps, true>>;
705
+ /**
706
+ * The `LineChart` component renders a line chart for visualizing data. This type of chart is best suited for time series plots or trend data.
707
+ *
708
+ * **Links:**
709
+ *
710
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/line-chart LineChart Docs}
711
+ * - {@link https://developers.hubspot.com/docs/reference/ui-components/standard-components/charts Charts Docs}
712
+ * - {@link https://github.com/HubSpot/ui-extensions-examples/tree/main/charts-example Charts Example}
713
+ */
321
714
  export declare const LineChart: "LineChart" & {
322
715
  readonly type?: "LineChart" | undefined;
323
716
  readonly props?: types.ChartProps | undefined;