@hubspot/ui-extensions 0.11.5 → 0.12.0

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

@@ -6,53 +6,57 @@ import { BaseComponentProps } from '../shared.ts';
  */
 export interface CheckboxProps extends BaseComponentProps {
     /**
-     * A string representing the value of the input. This is not displayed on the client-side,
-     * but on the server this is the value given to the data submitted with the checkbox's name.
+     * The checkbox value. This value is not displayed on the card, but is passed on the server side when submitted, along with the checkbox name.
      */
     value?: string;
     /**
-     * The current status of the input.
+     * When set to `true`, the checkbox is selected.
+     *
+     * @defaultValue `false`
      */
     checked?: boolean;
     /** @deprecated use readOnly instead */
     readonly?: boolean;
     /**
-     * When set to `true`, the option cannot be selected.
+     * When set to `true`, the checkbox cannot be selected.
      */
     readOnly?: boolean;
     /**
-     * The string that displays below the toggle.
+     * Text that describes the field's purpose.
      */
     description?: string;
     /**
-     * The unique identifier for the checkbox element.
+     * The checkbox's unique identifier.
      */
     name?: string;
     /**
-     * The size variation of the checkbox.
+     * The size of the checkbox.
      *
      * @defaultValue `"default"`
      */
     variant?: 'default' | 'small';
     /**
-     * A function that is called when the `checked` input status changes.
+     * A callback function that is called when the checkbox is selected or cleared. Passes the new value.
      *
      * @event
      */
     onChange?: (checked: boolean, value: string) => void;
-    /** The text that displays in the dropdown menu. */
+    /** The text that displays next to the checkbox. */
     children?: React.ReactNode;
     /**
-     * Use the inline prop to arrange checkboxes side-by-side.
+     * When set to `true`, arranges checkboxes side by side.
+     *
+     * @defaultValue `false`
      */
     inline?: boolean;
     /**
-     * When set to `true`, the option will be selected by default. Use it to
-     * set the default `checked` state when the component is **uncontrolled**.
+     * When set to `true`, the checkbox is selected by default.
+     *
+     * @defaultValue `false`
      */
     initialIsChecked?: boolean;
     /**
-     * Accessibility label. It should be present when the checkbox has no label(children).
+     * The checkbox's accessibility label.
      */
     'aria-label'?: string;
 }
@@ -91,15 +95,15 @@ export interface RadioButtonListProps extends ToggleGroupListBaseProps {
 type ToggleType = 'checkboxList' | 'radioButtonList';
 export interface CommonGroupProps extends BaseComponentProps {
     /**
-     * Denotes the type of list to render.
+     * The type of toggle, whether checkboxes or radio buttons. Radio buttons only allow one option to be selected.
      */
     toggleType?: ToggleType;
     /**
-     * The unique identifier for the toggle group element.
+     * The input's unique identifier.
      */
     name: string;
     /**
-     * The label that displays above the toggle group.
+     * The text that displays above the toggles.
      */
     label: string;
     /**
@@ -117,13 +121,13 @@ export interface CommonGroupProps extends BaseComponentProps {
      */
     tooltip?: string;
     /**
-     * When set to `true`, `validationMessage` is displayed as an error message if provided. The input will also render its error state to let the user know there is an error. If left false, `validationMessage` is displayed as a success message.
+     * When set to `true`, `validationMessage` is displayed as an error message if provided. The input will also render its error state to let the user know there is an error. If left `false`, `validationMessage` is displayed as a success message.
      *
      * @defaultValue `false`
      */
     error?: boolean;
     /**
-     * An array of options to display in the dropdown menu.
+     * An array of options to display in the group.
      *
      * @defaultValue `[]`
      */
@@ -135,11 +139,14 @@ export interface CommonGroupProps extends BaseComponentProps {
      */
     inline?: boolean;
     /**
-     * The size variation of the individual options.
+     * The size of the toggle.
      *
      * @defaultValue `"default"`
      */
     variant?: 'default' | 'small';
+    /**
+     * The value of the toggle group.
+     */
     value?: string[] | string;
 }
 type CheckboxGroupProps = {

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

@@ -6,7 +6,7 @@ export interface TooltipProps extends BaseComponentProps {
      */
     children: ReactNode;
     /**
-     * Sets the position of the tooltip relative to its trigger element.
+     * The position where the tooltip will be displayed, relative to the parent UI component.
      * @default 'top'
      */
     placement?: 'top' | 'bottom' | 'left' | 'right';

package/dist/shared/types/crm.d.ts

@@ -2,20 +2,54 @@ import { ReactNode } from 'react';
 import { TShirtSizes, BaseComponentProps } from './shared.ts';
 /** @ignore */
 export interface CrmDataHighlightProps extends BaseComponentProps {
+    /**
+     * The properties to display, up to four. By default, will display property data from the currently displaying record. To pull data from a specific record, include the `objectTypeId` and `objectId` props.
+     */
     properties: Array<string>;
+    /**
+     * The numeric ID of the type of associated object to display (e.g., `0-1` for contacts).
+     */
     objectTypeId?: string;
+    /**
+     * The ID of the CRM record to display property data from.
+     */
     objectId?: number;
 }
 /** @ignore */
 export interface CrmReportProps extends BaseComponentProps {
+    /**
+     * The numeric ID of the single object report, which can be found in the URL when viewing the report in HubSpot.
+     */
     reportId: string;
+    /**
+     * Specifies how the report should be filtered based on its relationship to the currently displaying CRM record:
+     * - `associations`: report will only include data from records associated with the currently displaying record.
+     * - `subject`: report will only include data from the currently displaying record. Will not include data from associated records.
+     * - `unfiltered`: report will display all data regardless of the currently displaying record and its associations.
+     *
+     * @defaultValue `"associations"`
+     */
     use?: 'associations' | 'subject' | 'unfiltered';
 }
 /** @ignore */
 export interface CrmPropertyListProps extends BaseComponentProps {
+    /**
+     * The properties to display, up to 24. By default, will display property data from the currently displaying record. To pull data from a specific record, include the `objectTypeId` and `objectId` props.
+     */
     properties: Array<string>;
+    /**
+     * The layout direction of the table.
+     *
+     * @defaultValue `"column"`
+     */
     direction?: string;
+    /**
+     * The numeric ID of the type of associated object to display (e.g., `0-1` for contacts).
+     */
     objectTypeId?: string;
+    /**
+     * The ID of the CRM record to display property data from.
+     */
     objectId?: number;
 }
 /** @ignore */
@@ -101,7 +135,13 @@ interface PercentileMetricItem extends BaseCrmStatisticItem {
 type CrmStatisticItem = BasicMetricItem | PercentileMetricItem;
 /** @ignore */
 export interface CrmStatisticsProps extends BaseComponentProps {
+    /**
+     * The numeric ID of the type of object to fetch statistics about (e.g., `0-1` for contacts).
+     */
     objectTypeId: string;
+    /**
+     * An array of objects that define each statistic to fetch.
+     */
     statistics: Array<CrmStatisticItem>;
 }
 /** @ignore */
@@ -117,9 +157,21 @@ interface Gradient {
 }
 /** @ignore */
 export interface CrmStageTrackerProps extends BaseComponentProps {
+    /**
+     * The ID of the CRM record to display property data from.
+     */
     objectId?: number;
+    /**
+     * The numeric ID of the type of associated object to display (e.g., `0-1` for contacts).
+     */
     objectTypeId?: string;
+    /**
+     * The properties to display, up to four. By default, will display property data from the currently displaying record.
+     */
     properties: Array<string>;
+    /**
+     * Whether to display the properties below the progress indicator.
+     */
     showProperties?: boolean;
 }
 /** @ignore */

package/dist/shared/types/http-requests.d.ts

@@ -66,8 +66,8 @@ export interface ServerlessExecutionRequest {
     serverlessFunction: string;
     location: keyof ExtensionPoints;
     objectQuery?: {
-        objectId: number;
-        objectTypeId: string;
+        objectId?: number;
+        objectTypeId?: string;
         objectPropertyNames: string[];
     };
     parameters?: JsonValue;

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

@@ -3,6 +3,6 @@ export type * from './actions.ts';
 export type * from './context.ts';
 export type * from './crm.ts';
 export type * from './extension-points.ts';
-export type * from './http-requests.ts';
+export * from './http-requests.ts';
 export type * from './reactions.ts';
 export * from './shared.ts';

package/dist/shared/types/index.js

@@ -1 +1,2 @@
+export * from "./http-requests.js"; // NOTE: `http-requests.ts` has some exported enums so we can't use `export type`
 export * from "./shared.js"; // NOTE: `shared.ts` has some exported classes so we can't use `export type` for now

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

@@ -38,151 +38,196 @@ export interface TShirtSizes {
 export type AllSizes = TShirtSizes['xs'] | TShirtSizes['sm'] | TShirtSizes['md'] | TShirtSizes['lg'] | TShirtSizes['xl'];
 export type AllDistances = 'flush' | AllSizes;
 export declare const iconNames: {
-    readonly success: "success";
-    readonly remove: "remove";
     readonly add: "add";
+    readonly appointment: "appointment";
+    readonly approvals: "approvals";
+    readonly artificialIntelligence: "artificialIntelligence";
+    readonly artificialIntelligenceEnhanced: "artificialIntelligenceEnhanced";
     readonly attach: "attach";
-    readonly date: "date";
+    readonly bank: "bank";
+    readonly block: "block";
+    readonly book: "knowledgeBase";
+    readonly bulb: "bulb";
+    readonly callTranscript: "callTranscript";
+    readonly calling: "calling";
+    readonly callingHangup: "callingHangup";
+    readonly callingMade: "callingMade";
+    readonly callingMissed: "callingMissed";
+    readonly callingVoicemail: "callingVoicemail";
+    readonly campaigns: "campaigns";
+    readonly cap: "cap";
+    readonly checkCircle: "checkCircle";
+    readonly circleFilled: "circleFilled";
+    readonly circleHollow: "circleHollow";
+    readonly clock: "time";
+    readonly comment: "comments";
+    readonly contact: "contacts";
     readonly copy: "duplicate";
+    readonly crm: "crm";
+    readonly dataSync: "dataSync";
+    readonly date: "date";
+    readonly delay: "delay";
     readonly delete: "delete";
+    readonly description: "description";
+    readonly developerProjects: "developerProjects";
+    readonly documents: "documents";
+    readonly downCarat: "downCarat";
+    readonly download: "download";
     readonly edit: "edit";
+    readonly ellipses: "ellipses";
     readonly email: "email";
+    readonly emailOpen: "emailOpen";
+    readonly emailThreadedReplies: "emailThreadedReplies";
+    readonly enrichment: "enrichment";
+    readonly enroll: "enroll";
     readonly exclamation: "exclamation";
-    readonly question: "question";
-    readonly home: "home";
-    readonly location: "location";
-    readonly upCarat: "upCarat";
-    readonly downCarat: "downCarat";
-    readonly warning: "warning";
-    readonly shoppingCart: "cart";
-    readonly clock: "time";
-    readonly comment: "comments";
-    readonly contact: "contacts";
-    readonly star: "favorite";
-    readonly file: "file";
-    readonly reports: "reports";
-    readonly video: "video";
-    readonly robot: "simpleBot";
-    readonly refresh: "refresh";
+    readonly exclamationCircle: "exclamationCircle";
     readonly faceHappy: "emoji";
+    readonly faceHappyFilled: "emojiFillHappy";
     readonly faceNeutral: "emojiLineNeutral";
+    readonly faceNeutralFilled: "emojiFillNeutral";
     readonly faceSad: "emojiLineSad";
-    readonly upload: "upload";
-    readonly download: "download";
-    readonly left: "left";
-    readonly right: "right";
-    readonly dataSync: "dataSync";
-    readonly imageGallery: "imageGallery";
-    readonly search: "search";
-    readonly save: "saveEditableView";
-    readonly notification: "notification";
-    readonly bulb: "bulb";
-    readonly settings: "settings";
+    readonly faceSadFilled: "emojiFillSad";
+    readonly facebook: "socialBlockFacebook";
+    readonly favoriteHollow: "favoriteHollow";
+    readonly file: "file";
+    readonly filledXCircleIcon: "filledXCircleIcon";
     readonly filter: "filter";
+    readonly flame: "highlyEngagedLead";
+    readonly folder: "folder";
+    readonly folderOpen: "folderOpen";
+    readonly forward: "forward";
     readonly gauge: "gauge";
-    readonly enroll: "enroll";
     readonly generateChart: "generateChart";
     readonly gift: "gift";
-    readonly flame: "highlyEngagedLead";
-    readonly inbox: "inbox";
+    readonly globe: "language";
+    readonly globeLine: "globe";
+    readonly goal: "goal";
+    readonly googlePlus: "socialBlockGoogleplus";
+    readonly guidedActions: "guidedActions";
+    readonly hash: "numericDataType";
+    readonly hide: "hide";
+    readonly home: "home";
+    readonly hubDB: "hubDB";
     readonly image: "insertImage";
-    readonly quote: "insertQuote";
+    readonly imageGallery: "imageGallery";
+    readonly inbox: "inbox";
+    readonly info: "info";
+    readonly infoNoCircle: "infoNoCircle";
     readonly insertVideo: "insertVideo";
+    readonly instagram: "socialBlockInstagram";
+    readonly integrations: "integrations";
     readonly invoice: "invoice";
     readonly key: "key";
-    readonly book: "knowledgeBase";
-    readonly globe: "language";
+    readonly language: "language";
+    readonly left: "left";
+    readonly lessCircle: "lessCircle";
     readonly lesson: "lesson";
+    readonly light: "light";
     readonly link: "link";
+    readonly linkedin: "socialBlockLinkedin";
     readonly listView: "listView";
+    readonly location: "location";
     readonly locked: "locked";
     readonly mention: "mention";
     readonly messages: "messages";
     readonly mobile: "mobile";
+    readonly moreCircle: "moreCircle";
+    readonly notEditable: "notEditable";
+    readonly notification: "notification";
     readonly notificationOff: "notificationOff";
-    readonly hash: "numericDataType";
     readonly objectAssociations: "objectAssociations";
     readonly objectAssociationsManyToMany: "objectAssociationsManyToMany";
     readonly objectAssociationsManyToOne: "objectAssociationsManyToOne";
     readonly office365: "office365";
     readonly order: "order";
     readonly paymentSubscriptions: "paymentSubscriptions";
-    readonly product: "product";
+    readonly pin: "pin";
+    readonly pinterest: "socialBlockPinterest";
     readonly powerPointFile: "powerPointFile";
     readonly presentation: "presentation";
+    readonly product: "product";
     readonly publish: "publish";
+    readonly question: "question";
     readonly questionAnswer: "questionAnswer";
+    readonly questionCircle: "questionCircle";
     readonly quickbooks: "quickbooks";
+    readonly quote: "insertQuote";
     readonly readMore: "readMore";
-    readonly realEstateListing: "realEstateListing";
     readonly readOnlyView: "readOnlyView";
+    readonly realEstateListing: "realEstateListing";
     readonly recentlySelected: "recentlySelected";
     readonly record: "record";
     readonly redo: "redo";
-    readonly undo: "undo";
+    readonly refresh: "refresh";
     readonly registration: "registration";
+    readonly remove: "remove";
     readonly replace: "replace";
+    readonly reports: "reports";
+    readonly right: "right";
+    readonly robot: "simpleBot";
     readonly rotate: "rotate";
+    readonly rss: "socialBlockRss";
     readonly salesQuote: "salesQuote";
     readonly salesTemplates: "salesTemplates";
+    readonly save: "saveEditableView";
+    readonly search: "search";
+    readonly send: "send";
     readonly sequences: "sequences";
+    readonly settings: "settings";
+    readonly shoppingCart: "cart";
+    readonly signal: "signal";
+    readonly signalPoor: "signalPoor";
+    readonly signature: "signature";
+    readonly snooze: "snooze";
+    readonly sortAlpAsc: "sortAlpAsc";
+    readonly sortAlpDesc: "sortAlpDesc";
+    readonly sortAmtAsc: "sortAmtAsc";
+    readonly sortAmtDesc: "sortAmtDesc";
+    readonly sortNumAsc: "sortNumAsc";
+    readonly sortNumDesc: "sortNumDesc";
+    readonly sortTableAsc: "sortTableAsc";
+    readonly sortTableDesc: "sortTableDesc";
     readonly spellCheck: "spellCheck";
+    readonly sprocket: "sprocket";
+    readonly star: "favorite";
+    readonly stopRecord: "stopRecord";
     readonly strike: "strike";
+    readonly styles: "styles";
+    readonly success: "success";
     readonly tablet: "tablet";
     readonly tag: "tag";
     readonly tasks: "tasks";
     readonly test: "test";
-    readonly ticket: "ticket";
-    readonly thumbsUp: "thumbsUp";
+    readonly text: "text";
+    readonly textBodyExpanded: "textBodyExpanded";
+    readonly textColor: "textColor";
+    readonly textDataType: "textDataType";
+    readonly textSnippet: "textSnippet";
     readonly thumbsDown: "thumbsDown";
+    readonly thumbsUp: "thumbsUp";
+    readonly ticket: "ticket";
     readonly translate: "translate";
     readonly trophy: "trophy";
+    readonly twitter: "socialBlockTwitter";
+    readonly undo: "undo";
+    readonly upCarat: "upCarat";
+    readonly upload: "upload";
+    readonly video: "video";
     readonly videoFile: "videoFile";
     readonly videoPlayerSubtitles: "videoPlayerSubtitles";
     readonly view: "view";
     readonly viewDetails: "viewDetails";
+    readonly warning: "warning";
     readonly website: "website";
     readonly workflows: "workflows";
-    readonly zoomIn: "zoomIn";
-    readonly zoomOut: "zoomOut";
-    readonly goal: "goal";
-    readonly campaigns: "campaigns";
-    readonly cap: "cap";
-    readonly block: "block";
-    readonly bank: "bank";
-    readonly approvals: "approvals";
-    readonly appointment: "appointment";
-    readonly facebook: "socialBlockFacebook";
-    readonly googlePlus: "socialBlockGoogleplus";
-    readonly instagram: "socialBlockInstagram";
-    readonly linkedin: "socialBlockLinkedin";
-    readonly pinterest: "socialBlockPinterest";
-    readonly rss: "socialBlockRss";
-    readonly twitter: "socialBlockTwitter";
     readonly x: "socialBlockX";
+    readonly xCircle: "xCircle";
     readonly xing: "socialBlockXing";
     readonly youtube: "socialBlockYoutube";
     readonly youtubePlay: "socialBlockYoutubeplay";
-    readonly sortAlpAsc: "sortAlpAsc";
-    readonly sortAlpDesc: "sortAlpDesc";
-    readonly sortAmtAsc: "sortAmtAsc";
-    readonly sortAmtDesc: "sortAmtDesc";
-    readonly sortNumAsc: "sortNumAsc";
-    readonly sortNumDesc: "sortNumDesc";
-    readonly sortTableAsc: "sortTableAsc";
-    readonly sortTableDesc: "sortTableDesc";
-    readonly text: "text";
-    readonly textColor: "textColor";
-    readonly textDataType: "textDataType";
-    readonly textSnippet: "textSnippet";
-    readonly calling: "calling";
-    readonly callingHangup: "callingHangup";
-    readonly callingMade: "callingMade";
-    readonly callingMissed: "callingMissed";
-    readonly callingVoicemail: "callingVoicemail";
-    readonly faceHappyFilled: "emojiFillHappy";
-    readonly faceNeutralFilled: "emojiFillNeutral";
-    readonly faceSadFilled: "emojiFillSad";
+    readonly zoomIn: "zoomIn";
+    readonly zoomOut: "zoomOut";
 };
 export type IconNames = keyof typeof iconNames;
 export type TypesOfReadOnlyArray<T extends ReadonlyArray<unknown>> = T extends ReadonlyArray<infer ElementType> ? ElementType : never;
@@ -195,5 +240,10 @@ export declare class RemoteEvent<V> {
     constructor(value: V, event: Event);
 }
 export interface BaseComponentProps {
+    /**
+     * Used by `findByTestId()` to locate this component in tests.
+     *
+     * @see {@link https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensibility/testing/reference#findbytestid | Testing utilities reference}
+     */
     testId?: string;
 }