@hubspot/ui-extensions 0.0.1-prealpha.6 → 0.0.1-prealpha.7

package/README.md

@@ -13,6 +13,7 @@
 - [Heading](#heading)
 - [Image](#image)
 - [Input](#input)
+- [Link](#link)
 - [LoadingSpinner](#loadingspinner)
 - [ProgressBar](#progressbar)
 - [Select](#select)
@@ -29,6 +30,7 @@
     - [TableRow](#tablerow)
 - [Tag](#tag)
 - [Text](#text)
+- [Textarea](#textarea)
 - [Tile](#tile)
 
 ## Components
@@ -115,8 +117,8 @@ interface ButtonProps {
 | `onClick` | `() => void` `(optional)` | `N/A` | A function that will be invoked when the button is clicked.  It receives no arguments and it's return value is ignored|
 | `href` | `string(optional)`| `N/A` | A URL that will be opened when the button is clicked.  If the value is a URL external to HubSpot it will be opened in a new tab. |
 | `disabled` | `boolean(optional)` | `N/A` | Determines if the button should be disabled or not.|
-| `variant` | ` 'primary' | 'secondary' | 'destructive'` `(optional)` |`'secondary'`| Sets the color variation of the button |
-| `type` | `'button' \| 'reset' \| 'submit'` `(optional)` | `'button'`| Sets the HTML attribute "role" of the button |
+| `variant` | `'primary' \| 'secondary' \| 'destructive'` `(optional)` | `'secondary'` | Sets the color variation of the button |
+| `type` | `'button' \| 'reset' \| 'submit'` `(optional)` | `'button'` | Sets the HTML attribute "role" of the button |
 
 ##### Usage
 ```javascript
@@ -385,7 +387,7 @@ interface EmptyStateProps {
 | `children` | `ReactNode` | `N/A` | Sets the content that will render inside the component.  This prop is passed implicitly by providing sub-components. |
 | `flush` | `boolean(optional)` | `false` | Removes the default vertical margins for the component. |
 | `imageWidth` | `number(optional)` | `250`| The max-width for the image container. |
-| `layout` | `'horizontal' | 'vertical'` `(optional)` | `'horizontal'` | Sets the layout direction for the content. |
+| `layout` | `'horizontal' \| 'vertical'` `(optional)` | `'horizontal'` | Sets the layout direction for the content. |
 | `reverseOrder` | `boolean(optional)` | `false` | Swaps the visual order of the text (primary) and image (secondary) content. This ensures the primary content is still presented first to assistive technology. |
 | `title` | `string(optional)` | `Intl("All is not lost.")` | The text for the title header rendered above the `children`. |
 
@@ -427,7 +429,7 @@ interface ErrorStateProps {
 | - | - | - | - |
 | `children` | `ReactNode` | `N/A` | Sets the content that will render inside the component.  This prop is passed implicitly by providing sub-components. |
 | `title` | `string(optional)` | `Intl("All is not lost.")` | The text for the title header rendered above the `children`. |
-| `type` | `'error' | 'support' | 'lock'` `(optional)` | `'error'` | Sets the type of error image that will be shown. |
+| `type` | `'error' \| 'support' \| 'lock'` `(optional)` | `'error'` | Sets the type of error image that will be shown. |
 
 ##### Usage
 ```javascript
@@ -556,7 +558,7 @@ interface InputProps {
   name: string;
   value?: string;
   required?: boolean;
-  readonly?: boolean;
+  readOnly?: boolean;
   description?: string;
   tooltip?: string;
   placeholder?: string;
@@ -574,7 +576,7 @@ interface InputProps {
 | `name` | `string` | `N/A`| The unique identifier for the input element, this could be thought of as the HTML5 [Input element's name attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name) |
 | `value` | `string(optional)` | `''`| The value of the input |
 | `required` | `boolean(optional)` | `false`| Determines if the required indicator should be displayed |
-| `readonly` | `boolean(optional)` | `false`| Determines if the field is editable or not. |
+| `readOnly` | `boolean(optional)` | `false`| Determines if the field is editable or not. |
 | `description` | `string(optional)` | `N/A`| Instructional message to display to the user to help understand the purpose of the input. |
 | `tooltip` | `string(optional)` | `N/A`| Text that will appear in a tooltip next to the input label. |
 | `placeholder` | `string(optional)` | `N/A`| Text that appears in the input when it has no value set. |
@@ -626,6 +628,33 @@ const Extension = () => {
 }
 ```
 
+### Link
+
+##### Import
+```javascript
+import { Link } from '@hubspot/ui-extensions';
+```
+
+##### Props
+```typescript
+export interface LinkProps {
+  href: string;
+  variant?: 'primary' | 'destructive' | 'light' | 'dark';
+  children: ReactNode;
+}
+```
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `href` | `string`| `N/A` | A URL that will be opened when the link is clicked.  If the value is a URL external to HubSpot it will be opened in a new tab. |
+| `variant` | `'primary' \| 'light' \| 'dark' \| 'destructive'` `(optional)` | `'primary'` | Sets the color variation of the link |
+| `children` | `ReactNode` | `N/A`| Sets the content that will render inside the component. |
+
+##### Usage
+```javascript
+const Extension = () => {
+  return <Link href="https://app.hubspot.com/">HubSpot</Link>
+}
+```
 ### LoadingSpinner
 
 ##### Import
@@ -712,7 +741,7 @@ interface SelectProps {
   name: string;
   value?: string | number | boolean;
   required?: boolean;
-  readonly?: boolean;
+  readOnly?: boolean;
   description?: string;
   tooltip?: string;
   placeholder?: string;
@@ -732,7 +761,7 @@ interface SelectProps {
 | `name` | `string` | `N/A`| The unique identifier for the select element. |
 | `value` | `string \| number \| boolean` | `''`| The value of the select input. |
 | `required` | `boolean` | `false`| Determines if the required indicator should be displayed |
-| `readonly` | `boolean` | `false`| Determines if the field is editable or not. |
+| `readOnly` | `boolean` | `false`| Determines if the field is editable or not. |
 | `description` | `string` | `N/A`| Instructional message to display to the user to help understand the purpose of the input. |
 | `tooltip` | `string` | `N/A`| Text that will appear in a tooltip next to the input label. |
 | `placeholder` | `string` | `N/A`| Text that appears in the input when it has no value set. |
@@ -1368,6 +1397,96 @@ const Extension = () => {
 }
 ```
 
+### Textarea
+
+##### Import
+```javascript
+import { Textarea } from '@hubspot/ui-extensions';
+```
+
+##### Props
+```typescript
+interface TextareaProps {
+  label: string;
+  name: string;
+  value?: string;
+  required?: boolean;
+  readOnly?: boolean;
+  description?: string;
+  tooltip?: string;
+  placeholder?: string;
+  error?: boolean;
+  validationMessage?: string;
+  onChange?: (value: string) => void;
+  onInput?: (value: string) => void;
+  onBlur?: (value: string) => void;
+  onFocus?: (value: string) => void;
+  cols?: number;
+  maxLength?: number;
+  rows?: number;
+  resize?: 'vertical' | 'horizontal' | 'both' | 'none';
+}
+```
+| Prop | Type | Default | Description |
+| - | - | - | - |
+| `label` | `string` | `N/A`| The label text to display for the textarea element |
+| `name` | `string` | `N/A`| The unique identifier for the textarea element, this could be thought of as the HTML5 [Textarea element's name attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#name) |
+| `value` | `string(optional)` | `''`| The value of the textarea |
+| `required` | `boolean(optional)` | `false`| Determines if the required indicator should be displayed |
+| `readOnly` | `boolean(optional)` | `false`| Determines if the field is editable or not. |
+| `description` | `string(optional)` | `N/A`| Instructional message to display to the user to help understand the purpose of the textarea. |
+| `tooltip` | `string(optional)` | `N/A`| Text that will appear in a tooltip next to the textarea label. |
+| `placeholder` | `string(optional)` | `N/A`| Text that appears in the textarea when it has no value set. |
+| `error` | `boolean(optional)` | `false`| If set to true, `validationMessage` is displayed as an error message, if it was provided. The textarea will also render it's error state to let the user know there is an error.  If false, `validationMessage` is displayed as a success message. |
+| `validationMessage` | `string(optional)` | `''`| The text to show if the textarea has an error. |
+| `onChange` | `(value: string) => void(optional)` | `N/A` | A callback function that is invoked when the value is committed.  Currently these times are `onBlur` of the textarea and when the user submits the form.  |
+| `onInput` | `(value: string) => void(optional)` | `N/A`| A function that is called and passed the value every time the field is edited by the user.  It is recommended that you do not use this value to update state, that is what `onChange` should be used for. Instead this should be used for validation. |
+| `onBlur` | `(value: string) => void(optional)` | `N/A`| A function that is called and passed the value every time the field loses focus. |
+| `onFocus` | `(value: string) => void(optional)` | `N/A`| A function that is called and passed the value every time the field gets focused. |
+| `cols` | `number(optional)` | `N/A` | The visible width of the text control, in average character widths. |
+| `rows` | `number(optional)` | `N/A` | The number of visible text lines for the control. |
+| `maxLength` | `number(optional)` | `N/A` | The maximum number of characters (UTF-16 code units) that the user can enter. If this value isn't specified, the user can enter an unlimited number of characters. |
+| `resize` | `'vertical' \| 'horizontal' \| 'both' \| 'none'` `(optional)`| `'vertical'` | Sets whether an element is resizable, and if so, in which directions. |
+
+##### Usage
+```javascript
+import { useState } from 'react';
+
+const Extension = () => {
+  const [ desciptiption, setDescription ] = useState('');
+  const [ validationMessage, setValidationMessage ] = useState('');
+  const [ isValid, setIsValid ] = useState(true);
+
+  return (
+    <Form>
+      <Textarea
+        label="Description"
+        name="description"
+        tooltip="Provide as much detail as possible"
+        description="Please include a link"
+        placeholder="My desription"
+        required={true}
+        error={!isValid}
+        validationMessage={validationMessage}
+        onChange={(value) => {
+          setDescription(value)
+        }}
+        onInput={(value) => {
+          if (!value.includes('http')) {
+            setValidationMessage('A link must be included.');
+            setIsValid(false);
+          } else {
+            setValidationMessage('Valid description!')
+            setIsValid(true);
+          }
+        }}
+      />
+    </Form>
+  );
+}
+```
+
+
 ### Tile
 
 ##### Import

package/dist/coreComponents.d.ts

@@ -1,4 +1,4 @@
-import type { AlertProps, ButtonProps, ButtonRowProps, CardProps, DescriptionListProps, DescriptionListItemProps, DividerProps, EmptyStateProps, ErrorStateProps, FormProps, HeadingProps, ImageProps, InputProps, LoadingSpinnerProps, ProgressBarProps, SelectProps, TagProps, TextProps, TileProps, StackProps, StatisticsProps, StatisticsItemProps, StatisticsTrendProps, TableProps, TableElementProps } from './types';
+import type { AlertProps, ButtonProps, ButtonRowProps, CardProps, DescriptionListProps, DescriptionListItemProps, DividerProps, EmptyStateProps, ErrorStateProps, FormProps, HeadingProps, ImageProps, InputProps, TextareaProps, LoadingSpinnerProps, ProgressBarProps, SelectProps, TagProps, TextProps, TileProps, StackProps, StatisticsProps, StatisticsItemProps, StatisticsTrendProps, TableProps, TableElementProps, LinkProps } from './types';
 declare const Alert: "Alert" & {
     readonly type?: "Alert" | undefined;
     readonly props?: AlertProps | undefined;
@@ -64,6 +64,11 @@ declare const Input: "Input" & {
     readonly props?: InputProps | undefined;
     readonly children?: true | undefined;
 } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Input", InputProps, true>>;
+declare const Textarea: "Textarea" & {
+    readonly type?: "Textarea" | undefined;
+    readonly props?: TextareaProps | undefined;
+    readonly children?: true | undefined;
+} & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Textarea", TextareaProps, true>>;
 declare const LoadingSpinner: "LoadingSpinner" & {
     readonly type?: "LoadingSpinner" | undefined;
     readonly props?: LoadingSpinnerProps | undefined;
@@ -149,4 +154,9 @@ declare const TableHead: "TableHead" & {
     readonly props?: TableElementProps | undefined;
     readonly children?: true | undefined;
 } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"TableHead", TableElementProps, true>>;
-export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, LoadingSpinner, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Tile, };
+declare const Link: "Link" & {
+    readonly type?: "Link" | undefined;
+    readonly props?: LinkProps | undefined;
+    readonly children?: true | undefined;
+} & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"Link", LinkProps, true>>;
+export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, Textarea, LoadingSpinner, Link, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Tile, };

package/dist/coreComponents.js

@@ -12,6 +12,7 @@ const Form = createRemoteReactComponent('Form');
 const Heading = createRemoteReactComponent('Heading');
 const Image = createRemoteReactComponent('Image');
 const Input = createRemoteReactComponent('Input');
+const Textarea = createRemoteReactComponent('Textarea');
 const LoadingSpinner = createRemoteReactComponent('LoadingSpinner');
 const ProgressBar = createRemoteReactComponent('ProgressBar');
 const Select = createRemoteReactComponent('Select');
@@ -29,4 +30,5 @@ const TableRow = createRemoteReactComponent('TableRow');
 const TableBody = createRemoteReactComponent('TableBody');
 const TableHeader = createRemoteReactComponent('TableHeader');
 const TableHead = createRemoteReactComponent('TableHead');
-export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, LoadingSpinner, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Tile, };
+const Link = createRemoteReactComponent('Link');
+export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, Textarea, LoadingSpinner, Link, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Tile, };

package/dist/crm/components.d.ts

@@ -1,12 +1,12 @@
-import { CrmAssociationsTableProps, CrmPropertyListProps } from '../types';
+import { CrmAssociationTableProps, CrmPropertyListProps } from '../types';
 declare const CrmPropertyList: "CrmPropertyList" & {
     readonly type?: "CrmPropertyList" | undefined;
     readonly props?: CrmPropertyListProps | undefined;
     readonly children?: true | undefined;
 } & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"CrmPropertyList", CrmPropertyListProps, true>>;
-declare const CrmAssociationsTable: "CrmAssociationsTable" & {
-    readonly type?: "CrmAssociationsTable" | undefined;
-    readonly props?: CrmAssociationsTableProps | undefined;
+declare const CrmAssociationTable: "CrmAssociationTable" & {
+    readonly type?: "CrmAssociationTable" | undefined;
+    readonly props?: CrmAssociationTableProps | undefined;
     readonly children?: true | undefined;
-} & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"CrmAssociationsTable", CrmAssociationsTableProps, true>>;
-export { CrmPropertyList, CrmAssociationsTable };
+} & import("@remote-ui/react").ReactComponentTypeFromRemoteComponentType<import("@remote-ui/types").RemoteComponentType<"CrmAssociationTable", CrmAssociationTableProps, true>>;
+export { CrmPropertyList, CrmAssociationTable };

package/dist/crm/components.js

@@ -1,4 +1,4 @@
 import { createExtensionComponent } from '../utils/createExtensionComponent';
 const CrmPropertyList = createExtensionComponent('CrmPropertyList');
-const CrmAssociationsTable = createExtensionComponent('CrmAssociationsTable');
-export { CrmPropertyList, CrmAssociationsTable };
+const CrmAssociationTable = createExtensionComponent('CrmAssociationTable');
+export { CrmPropertyList, CrmAssociationTable };

package/dist/crm/index.d.ts

@@ -1,2 +1,2 @@
-import { CrmPropertyList, CrmAssociationsTable } from './components';
-export { CrmPropertyList, CrmAssociationsTable };
+import { CrmPropertyList, CrmAssociationTable } from './components';
+export { CrmPropertyList, CrmAssociationTable };

package/dist/crm/index.js

@@ -1,2 +1,2 @@
-import { CrmPropertyList, CrmAssociationsTable } from './components';
-export { CrmPropertyList, CrmAssociationsTable };
+import { CrmPropertyList, CrmAssociationTable } from './components';
+export { CrmPropertyList, CrmAssociationTable };

package/dist/index.d.ts

@@ -1,3 +1,3 @@
-export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, LoadingSpinner, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Tile, } from './coreComponents';
+export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, LoadingSpinner, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Textarea, Tile, Link, } from './coreComponents';
 export { hubspot } from './hubspot';
 export * from './types';

package/dist/index.js

@@ -1,3 +1,3 @@
-export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, LoadingSpinner, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Tile, } from './coreComponents';
+export { Alert, Button, ButtonRow, Card, DescriptionList, DescriptionListItem, Divider, EmptyState, ErrorState, Form, Heading, Image, Input, LoadingSpinner, ProgressBar, Select, Stack, Statistics, StatisticsItem, StatisticsTrend, Table, TableFooter, TableCell, TableRow, TableBody, TableHeader, TableHead, Tag, Text, Textarea, Tile, Link, } from './coreComponents';
 export { hubspot } from './hubspot';
 export * from './types';

package/dist/types.d.ts

@@ -6,12 +6,12 @@ export interface AlertProps {
     variant?: 'info' | 'warning' | 'success' | 'error' | 'danger';
 }
 export interface ButtonProps {
-    text: string;
     onClick?: () => void;
     href?: string;
     disabled?: boolean;
     variant?: 'primary' | 'secondary' | 'destructive';
     type?: 'button' | 'reset' | 'submit';
+    children: ReactNode;
 }
 export interface ButtonRowProps {
     children: ReactNode;
@@ -66,7 +66,7 @@ export interface InputProps {
     name: string;
     value?: string;
     required?: boolean;
-    readonly?: boolean;
+    readOnly?: boolean;
     description?: string;
     tooltip?: string;
     placeholder?: string;
@@ -77,6 +77,12 @@ export interface InputProps {
     onBlur?: (value: string) => void;
     onFocus?: (value: string) => void;
 }
+export interface TextareaProps extends InputProps {
+    cols?: number;
+    maxLength?: number;
+    rows?: number;
+    resize?: 'vertical' | 'horizontal' | 'both' | 'none';
+}
 export interface ProgressBarProps {
     title?: string;
     showPercentage?: boolean;
@@ -90,7 +96,7 @@ export interface SelectProps {
     name: string;
     value?: string | number;
     required?: boolean;
-    readonly?: boolean;
+    readOnly?: boolean;
     description?: string;
     tooltip?: string;
     placeholder?: string;
@@ -107,19 +113,17 @@ export interface TagProps {
     onClick?: () => void;
     variant?: 'default' | 'warning' | 'success' | 'error';
 }
-interface BaseTextProps {
-    variant?: 'bodytext' | 'microcopy';
-    tagName?: 'p' | 'span' | 'small';
+export interface TextFormatOptions {
+    fontWeight?: 'regular' | 'bold' | 'demibold';
+    italic?: boolean;
+    lineDecoration?: 'none' | 'underline' | 'strikethrough';
 }
-export interface PlainTextProps extends BaseTextProps {
-    format?: 'plaintext';
+export type TextProps = {
+    variant?: 'bodytext' | 'microcopy';
+    inline?: boolean;
     children: ReactNode;
-}
-export interface MarkdownTextProps extends BaseTextProps {
-    format: 'markdown';
-    text: string;
-}
-export type TextProps = PlainTextProps | MarkdownTextProps;
+    format?: TextFormatOptions;
+};
 export interface TileProps {
     children: ReactNode;
     flush?: boolean;
@@ -166,21 +170,55 @@ export interface StatisticsProps {
     children: ReactNode;
 }
 export interface ServerlessRunnerParams {
+    /**
+     * Name of the serverless function
+     */
     name: string;
-    payload: Record<string, unknown>;
-    onError?: () => void;
+    /**
+     * Names of CRM object properties to be retrieved and supplied to the function as `context.propertiesToSend`
+     */
+    propertiesToSend?: string[];
+    /**
+     * Additional parameters to be supplied to the function as `context.parameters`
+     */
+    parameters?: JsonValue;
+    /**
+     * @deprecated Optional payload supplied to the function as `context.event.payload`.
+     * Support for this param may be removed in the future. Use `parameters` instead.
+     */
+    payload?: JsonValue;
+}
+export declare enum ServerlessExecutionStatus {
+    Success = "SUCCESS",
+    Error = "ERROR"
+}
+export type ServerlessExecutionResult = {
+    status: ServerlessExecutionStatus.Success;
+    response: JsonValue;
+} | {
+    status: ServerlessExecutionStatus.Error;
+    message: string;
+};
+export type ServerlessFuncRunner = (params: ServerlessRunnerParams) => Promise<ServerlessExecutionResult>;
+export interface ServerlessExecutionRequest {
+    appId: number;
+    extensibleCardId: number;
+    serverlessFunction: string;
+    location: keyof ExtensionPoints;
+    objectQuery?: {
+        objectId: number;
+        objectTypeId: string;
+        objectPropertyNames: string[];
+    };
+    parameters?: JsonValue;
+    event?: {
+        type: 'SERVERLESS_ACTION_HOOK';
+        payload: JsonValue;
+    };
 }
-export type ServerlessFuncRunner = (params: ServerlessRunnerParams) => Promise<any>;
-export interface ServerlessSuccessResponse {
+export interface ServerlessExecutionResponse {
     logId: string;
-    response: {
-        message?: {
-            type: 'SUCCESS' | 'ERROR';
-            body: string;
-        } | string;
-        context?: Record<string, unknown>;
-        section?: Record<string, unknown>;
-    };
+    response?: JsonValue;
 }
 export interface ServerlessErrorResponse {
     responseJSON?: {
@@ -215,10 +253,7 @@ export type AddAlertAction = (args: {
     message: string;
 }) => void;
 export type ReloadPageAction = () => void;
-export type FetchCrmObjectPropertiesAction = (properties: string[]) => Promise<{
-    name: string;
-    value: string;
-}[]>;
+export type FetchCrmObjectPropertiesAction = (properties: string[]) => Promise<Record<string, string>>;
 export type OpenIframeModalAction = (action: OpenIframeActionPayload) => void;
 export interface CrmMiddleExtensionPoint extends ExtensionPointContract {
     actions: {
@@ -228,8 +263,8 @@ export interface CrmMiddleExtensionPoint extends ExtensionPointContract {
         openIframeModal: OpenIframeModalAction;
     };
     customComponents: {
-        CrmPropertyList?: ComponentType<CrmPropertyListProps>;
-        CrmAssociationsTable?: ComponentType<CrmAssociationsTableProps>;
+        CrmPropertyList: ComponentType<CrmPropertyListProps>;
+        CrmAssociationTable: ComponentType<CrmAssociationTableProps>;
     };
 }
 export interface CrmPropertyListProps {
@@ -246,7 +281,7 @@ interface CrmSearchFilter {
     highValue?: string | number;
     property: string;
 }
-export interface CrmAssociationsTableProps {
+export interface CrmAssociationTableProps {
     objectTypeId: string;
     propertyColumns: Array<string>;
     quickFilterProperties?: Array<string>;
@@ -326,4 +361,12 @@ export declare class RemoteEvent<V> {
     targetValue: V;
     constructor(value: V, event: Event);
 }
+export interface LinkProps {
+    children: ReactNode;
+    href: string;
+    variant?: 'primary' | 'destructive' | 'light' | 'dark';
+}
+export type JsonValue = string | number | boolean | null | JsonValue[] | {
+    [key: string]: JsonValue;
+};
 export {};

package/dist/types.js

@@ -1,3 +1,8 @@
+export var ServerlessExecutionStatus;
+(function (ServerlessExecutionStatus) {
+    ServerlessExecutionStatus["Success"] = "SUCCESS";
+    ServerlessExecutionStatus["Error"] = "ERROR";
+})(ServerlessExecutionStatus || (ServerlessExecutionStatus = {}));
 export class RemoteEvent {
     type;
     bubbles;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hubspot/ui-extensions",
-  "version": "0.0.1-prealpha.6",
+  "version": "0.0.1-prealpha.7",
   "description": "",
   "type": "module",
   "main": "dist/index.js",
@@ -48,5 +48,5 @@
   "devDependencies": {
     "typescript": "5.0.4"
   },
-  "gitHead": "1dfa4048c08a39c6f50a5f87e92eddf1b19dde5c"
+  "gitHead": "b5968f431fe29ee9977e6aacdd9b9ab3aa08af0c"
 }