@atlaskit/forge-react-types 0.37.7 → 0.37.8

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/forge-react-types
 
+## 0.37.8
+
+### Patch Changes
+
+- [#122965](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/122965)
+  [`398f570fbc446`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/398f570fbc446) -
+  Export UI Kit Component types with JSDoc comments
+
 ## 0.37.7
 
 ### Patch Changes

package/dist/types/components/__generated__/ButtonGroupProps.codegen.d.ts

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - ButtonGroupProps
  *
- * @codegen <<SignedSource::4daf3a960cc3108bbbc8ad0ede3b7011>>
+ * @codegen <<SignedSource::cfcaf362cef2884ded73338c52c8f437>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/__generated__/button-group.partial.tsx <<SignedSource::728cab6df690811513a66ea4bacb89c9>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/__generated__/button-group.partial.tsx <<SignedSource::83622155981d05f77224a32bab4969b5>>
  */
 import type { ButtonGroupProps as PlatformButtonGroupProps } from '@atlaskit/button';
 import type { ButtonProps } from '@atlaskit/button';
@@ -13,6 +13,6 @@ export type ButtonGroupProps = Pick<PlatformButtonGroupProps, 'children' | 'test
     appearance?: ButtonProps['appearance'];
 };
 /**
- * A button triggers an event or action. They let users know what will happen next.
+ * A button group gives users access to frequently performed, related actions.
  */
 export type TButtonGroup<T> = (props: ButtonGroupProps) => T;

package/dist/types/components/__generated__/ButtonProps.codegen.d.ts

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - ButtonProps
  *
- * @codegen <<SignedSource::333890773f42cacce17cee560686b34c>>
+ * @codegen <<SignedSource::77d1847e88419084fc81129d7637b40b>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/__generated__/index.partial.tsx <<SignedSource::c3a07cf50f9f4f166b94a72b4c2d5784>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/__generated__/index.partial.tsx <<SignedSource::f9a16b36e0a307a53ee30a009373ab49>>
  */
 import type { ButtonProps as PlatformButtonProps } from '@atlaskit/button/new';
 export type Icon = 'activity' | 'add' | 'add-circle' | 'add-item' | 'addon' | 'app-access' | 'app-switcher' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'attachment' | 'audio' | 'audio-circle' | 'backlog' | 'billing' | 'billing-filled' | 'bitbucket-branches' | 'bitbucket-builds' | 'bitbucket-clone' | 'bitbucket-commits' | 'bitbucket-compare' | 'bitbucket-forks' | 'bitbucket-output' | 'bitbucket-pipelines' | 'bitbucket-pullrequests' | 'bitbucket-repos' | 'bitbucket-snippets' | 'bitbucket-source' | 'board' | 'book' | 'bullet-list' | 'calendar' | 'calendar-filled' | 'camera' | 'camera-filled' | 'camera-rotate' | 'camera-take-picture' | 'canvas' | 'check' | 'check-circle' | 'check-circle-outline' | 'checkbox' | 'checkbox-indeterminate' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-left-large' | 'chevron-right' | 'chevron-right-circle' | 'chevron-right-large' | 'chevron-up' | 'chevron-up-circle' | 'child-issues' | 'code' | 'comment' | 'component' | 'copy' | 'creditcard' | 'creditcard-filled' | 'cross' | 'cross-circle' | 'dashboard' | 'decision' | 'department' | 'detail-view' | 'discover' | 'discover-filled' | 'document' | 'document-filled' | 'documents' | 'download' | 'drag-handler' | 'dropbox' | 'edit' | 'edit-filled' | 'editor-add' | 'editor-addon' | 'editor-advanced' | 'editor-align-center' | 'editor-align-image-center' | 'editor-align-image-left' | 'editor-align-image-right' | 'editor-align-left' | 'editor-align-right' | 'editor-attachment' | 'editor-background-color' | 'editor-bold' | 'editor-bullet-list' | 'editor-close' | 'editor-code' | 'editor-collapse' | 'editor-date' | 'editor-decision' | 'editor-divider' | 'editor-done' | 'editor-edit' | 'editor-emoji' | 'editor-error' | 'editor-expand' | 'editor-feedback' | 'editor-file' | 'editor-file-preview' | 'editor-help' | 'editor-hint' | 'editor-horizontal-rule' | 'editor-image' | 'editor-image-border' | 'editor-image-resize' | 'editor-indent' | 'editor-info' | 'editor-italic' | 'editor-layout-single' | 'editor-layout-three-equal' | 'editor-layout-three-with-sidebars' | 'editor-layout-two-equal' | 'editor-layout-two-left-sidebar' | 'editor-layout-two-right-sidebar' | 'editor-link' | 'editor-media-center' | 'editor-media-full-width' | 'editor-media-wide' | 'editor-media-wrap-left' | 'editor-media-wrap-right' | 'editor-mention' | 'editor-more' | 'editor-note' | 'editor-number-list' | 'editor-open' | 'editor-outdent' | 'editor-panel' | 'editor-photo' | 'editor-quote' | 'editor-recent' | 'editor-redo' | 'editor-remove' | 'editor-remove-emoji' | 'editor-search' | 'editor-settings' | 'editor-strikethrough' | 'editor-success' | 'editor-table' | 'editor-table-display-options' | 'editor-task' | 'editor-text-color' | 'editor-text-style' | 'editor-underline' | 'editor-undo' | 'editor-unlink' | 'editor-warning' | 'email' | 'emoji' | 'emoji-add' | 'emoji-activity' | 'emoji-atlassian' | 'emoji-custom' | 'emoji-emoji' | 'emoji-flags' | 'emoji-food' | 'emoji-frequent' | 'emoji-keyboard' | 'emoji-nature' | 'emoji-objects' | 'emoji-people' | 'emoji-productivity' | 'emoji-symbols' | 'emoji-travel' | 'error' | 'export' | 'feedback' | 'file' | 'filter' | 'flag-filled' | 'folder' | 'folder-filled' | 'followers' | 'following' | 'googledrive' | 'graph-bar' | 'graph-line' | 'gsuite' | 'highlights' | 'hipchat-audio-only' | 'hipchat-chevron-double-down' | 'hipchat-chevron-double-up' | 'hipchat-chevron-down' | 'hipchat-chevron-up' | 'hipchat-dial-out' | 'hipchat-lobby' | 'hipchat-media-attachment-count' | 'hipchat-outgoing-sound' | 'hipchat-sd-video' | 'home' | 'home-circle' | 'image' | 'image-border' | 'image-resize' | 'info' | 'invite-team' | 'issue' | 'issue-raise' | 'issues' | 'jira-capture' | 'jira-failed-build-status' | 'jira-labs' | 'jira-test-session' | 'label' | 'lightbulb' | 'lightbulb-filled' | 'like' | 'link' | 'link-filled' | 'list' | 'location' | 'lock' | 'lock-circle' | 'lock-filled' | 'marketplace' | 'media-services-actual-size' | 'media-services-add-comment' | 'media-services-annotate' | 'media-services-arrow' | 'media-services-audio' | 'media-services-blur' | 'media-services-brush' | 'media-services-button-option' | 'media-services-code' | 'media-services-document' | 'media-services-filter' | 'media-services-fit-to-page' | 'media-services-full-screen' | 'media-services-grid' | 'media-services-image' | 'media-services-line' | 'media-services-line-thickness' | 'media-services-no-image' | 'media-services-open-mediaviewer' | 'media-services-oval' | 'media-services-pdf' | 'media-services-preselected' | 'media-services-presentation' | 'media-services-rectangle' | 'media-services-scale-large' | 'media-services-scale-small' | 'media-services-spreadsheet' | 'media-services-text' | 'media-services-unknown' | 'media-services-video' | 'media-services-zip' | 'media-services-zoom-in' | 'media-services-zoom-out' | 'mention' | 'menu' | 'menu-expand' | 'mobile' | 'more' | 'more-vertical' | 'notification' | 'notification-all' | 'notification-direct' | 'office-building' | 'office-building-filled' | 'open' | 'overview' | 'page' | 'page-filled' | 'pdf' | 'people' | 'people-group' | 'person' | 'person-circle' | 'person-with-circle' | 'person-with-cross' | 'person-with-tick' | 'portfolio' | 'preferences' | 'premium' | 'presence-active' | 'presence-busy' | 'presence-unavailable' | 'question' | 'question-circle' | 'questions' | 'queues' | 'quote' | 'radio' | 'recent' | 'redo' | 'refresh' | 'retry' | 'roadmap' | 'room-menu' | 'schedule' | 'schedule-filled' | 'screen' | 'search' | 'select-clear' | 'send' | 'settings' | 'share' | 'ship' | 'shortcut' | 'sign-in' | 'sign-out' | 'sprint' | 'star' | 'star-filled' | 'star-large' | 'status' | 'stopwatch' | 'subtask' | 'suitcase' | 'switcher' | 'table' | 'task' | 'teams' | 'trash' | 'tray' | 'undo' | 'unlink' | 'unlock' | 'unlock-circle' | 'unlock-filled' | 'upload' | 'user-avatar-circle' | 'vid-audio-muted' | 'vid-audio-on' | 'vid-backward' | 'vid-camera-off' | 'vid-camera-on' | 'vid-connection-circle' | 'vid-forward' | 'vid-full-screen-off' | 'vid-full-screen-on' | 'vid-hang-up' | 'vid-hd-circle' | 'vid-pause' | 'vid-play' | 'vid-raised-hand' | 'vid-share-screen' | 'vid-speaking-circle' | 'vid-volume-full' | 'vid-volume-half' | 'vid-volume-muted' | 'video-circle' | 'video-filled' | 'warning' | 'watch' | 'watch-filled' | 'world' | 'world-small';
@@ -15,5 +15,8 @@ export type ButtonProps = Pick<PlatformButtonProps, 'children' | 'autoFocus' | '
     iconAfter?: IconType;
     spacing?: PlatformButtonProps['spacing'] | 'none';
 };
+/**
+ * A button triggers an event or action. They let users know what will happen next.
+ */
 export type TButton<T> = (props: ButtonProps) => T;
 export {};

package/dist/types/components/__generated__/CheckboxGroupProps.codegen.d.ts

@@ -3,19 +3,38 @@
  *
  * Extract component prop types from UIKit 2 components - CheckboxGroupProps
  *
- * @codegen <<SignedSource::293ea13e93c4a78fe93d7192e0bdaddb>>
+ * @codegen <<SignedSource::89e98a25ac16f92b5d18b061bb6fce57>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/checkboxgroup/index.tsx <<SignedSource::e4f95cf79182924e927523227eebf6fc>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/checkboxgroup/index.tsx <<SignedSource::4db9e0c029805d1c1fd28b923f3dbae3>>
  */
 export interface CheckboxGroupProps {
+    /**
+     * Sets the name prop on each of the Checkbox elements in the group.
+     */
     name: string;
+    /**
+     * An array of objects, each object is mapped onto a Checkbox element within the group.
+     */
     options: {
         label: string;
         value: string;
         isDisabled?: boolean;
     }[];
+    /**
+     * Once set, controls the selected value on the `CheckboxGroup`.
+     */
     value?: string[];
     onChange?: (values: string[]) => void;
+    /**
+     * Sets the initial selected value on the `CheckboxGroup`.
+     */
     defaultValue?: string[];
+    /**
+     * Sets the disabled state of all Checkbox elements in the group.
+     */
     isDisabled?: boolean;
 }
+/**
+ * A Checkbox group is a list of options where one or more choices can be selected.
+ */
+export type TCheckboxGroup<T> = (props: CheckboxGroupProps) => T;

package/dist/types/components/__generated__/DatePickerProps.codegen.d.ts

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - DatePickerProps
  *
- * @codegen <<SignedSource::14d82d10ae64e4333440817918f6e955>>
+ * @codegen <<SignedSource::a4fe0c77ab65e00b2bc8ebeadd33e2e3>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/datepicker/__generated__/index.partial.tsx <<SignedSource::6bc5d63c14b9dda11b370e386ccf4955>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/datepicker/__generated__/index.partial.tsx <<SignedSource::5dcbe693f00f3a2725b9e64932a3309c>>
  */
 import type { DateTimePickerSelectProps } from '@atlaskit/datetime-picker';
 export interface FieldProps {
@@ -48,7 +48,7 @@ export type DatePickerProps = {
     shouldShowCalendarButton?: boolean;
 } & Partial<Omit<FieldProps, 'onChange'>>;
 /**
- * A date time picker allows the user to select an associated date and time.
+ * A date picker allows the user to select a particular date.
  */
 export type TDatePicker<T> = (props: DatePickerProps) => T;
 export {};

package/dist/types/components/__generated__/ErrorMessageProps.codegen.d.ts

@@ -3,16 +3,17 @@
  *
  * Extract component prop types from UIKit 2 components - ErrorMessageProps
  *
- * @codegen <<SignedSource::3d3da7aa33a6ac0adb1524f89ee28208>>
+ * @codegen <<SignedSource::059ea63aef7f094365447bb300fed9f6>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/error-message.partial.tsx <<SignedSource::9e1a8d256d8d999a689140fbcda430fa>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/error-message.partial.tsx <<SignedSource::3758488a0115c629a624fcaae1f524c7>>
  */
 import React from 'react';
 import { ErrorMessage as PlatformErrorMessage } from '@atlaskit/form';
 type PlatformErrorMessageProps = React.ComponentProps<typeof PlatformErrorMessage>;
 export type ErrorMessageProps = Pick<PlatformErrorMessageProps, 'children' | 'testId'>;
 /**
- * A form allows users to input information.
+ * An error message is used to tell a user that the field input is invalid.
+ * For example, an error message could be "Invalid username, needs to be more than 4 characters".
  */
 export type TErrorMessage<T> = (props: ErrorMessageProps) => T;
 export {};

package/dist/types/components/__generated__/FormFooterProps.codegen.d.ts

@@ -3,16 +3,24 @@
  *
  * Extract component prop types from UIKit 2 components - FormFooterProps
  *
- * @codegen <<SignedSource::cb77ae443b27f1229afcd556eb365acf>>
+ * @codegen <<SignedSource::e6d74700f46888d63a013f997339596b>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/form-footer.partial.tsx <<SignedSource::ff2413efe154db0f89a03200caf50ced>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/form-footer.partial.tsx <<SignedSource::0b729df36afbc86cc134984bb4c16b3e>>
  */
 import React from 'react';
 import { FormFooter as PlatformFormFooter } from '@atlaskit/form';
-type PlatformFormFooterProps = React.ComponentProps<typeof PlatformFormFooter>;
+type _PlatformFormFooterProps = React.ComponentProps<typeof PlatformFormFooter>;
+export type PlatformFormFooterProps = Omit<_PlatformFormFooterProps, 'align'> & {
+    /**
+     * Sets the alignment of the footer contents. This is often a button. Defaults to `end`.
+     */
+    align?: _PlatformFormFooterProps['align'];
+};
 export type FormFooterProps = Pick<PlatformFormFooterProps, 'children' | 'align'>;
 /**
- * A form allows users to input information.
+ * Use a form footer to set the content at the end of the form. This is used for a button that submits the form.
+ *
+ * This is positioned after the last field in the form.
  */
 export type TFormFooter<T> = (props: FormFooterProps) => T;
 export {};

package/dist/types/components/__generated__/FormHeaderProps.codegen.d.ts

@@ -3,16 +3,18 @@
  *
  * Extract component prop types from UIKit 2 components - FormHeaderProps
  *
- * @codegen <<SignedSource::74a8285c7ae5a0c5db7b8cafa4d8226b>>
+ * @codegen <<SignedSource::7ef542fd2e0804c707145ab13db81db1>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/form-header.partial.tsx <<SignedSource::038ad7a850af23fb1c9b30de39ab0552>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/form-header.partial.tsx <<SignedSource::8791c333c19a64caa8dd6b7461a53082>>
  */
 import React from 'react';
 import { FormHeader as PlatformFormHeader } from '@atlaskit/form';
 type PlatformFormHeaderProps = React.ComponentProps<typeof PlatformFormHeader>;
 export type FormHeaderProps = Pick<PlatformFormHeaderProps, 'title' | 'description' | 'children'>;
 /**
- * A form allows users to input information.
+ * Use a form header to describe the contents of the form. This is the title and description of the form.
+ * If your form contains required fields, the form header is also where you should include a legend
+ * for sighted users to know that * indicates a required field.
  */
 export type TFormHeader<T> = (props: FormHeaderProps) => T;
 export {};

package/dist/types/components/__generated__/FormProps.codegen.d.ts

@@ -3,13 +3,25 @@
  *
  * Extract component prop types from UIKit 2 components - FormProps
  *
- * @codegen <<SignedSource::7b259a0bfc883f09eb65cdccee169a6a>>
+ * @codegen <<SignedSource::6ac049125d8d8c2436805c5e3a845802>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/index.tsx <<SignedSource::0e0a2f1184da9df422fb61ff7d906158>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/index.tsx <<SignedSource::b6dd991b4a5e73adbac9321d53cd909e>>
  */
 import type { ReactNode } from 'react';
 export type FormProps = {
+    /**
+     * Event handler called when the form is submitted. Fields must be free of validation errors.
+     *
+     * All modules except for `jiraServiceManagement:assetsImportType` must use `() => Promise<void>|void`.
+     *
+     * For the `jiraServiceManagement:assetsImportType` module, the `onSubmit` event handler returns
+     * a `boolean` value indicating if the form is valid (`true`) or invalid (`false`).
+     * If you use `() => Promise<void>|void` for this module, it will default to true.
+     */
     onSubmit: () => Promise<void | boolean> | void;
     children: ReactNode;
 };
+/**
+ * A form allows users to input information.
+ */
 export type TForm<T> = (props: FormProps) => T;

package/dist/types/components/__generated__/FormSectionProps.codegen.d.ts

@@ -3,16 +3,17 @@
  *
  * Extract component prop types from UIKit 2 components - FormSectionProps
  *
- * @codegen <<SignedSource::bb91841c1913229e7eb66d61b4ab693d>>
+ * @codegen <<SignedSource::2d079615b76393e9241b054b75fde5f3>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/form-section.partial.tsx <<SignedSource::7b30101c26550bb11c0f4ca6d4cf46fc>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/form-section.partial.tsx <<SignedSource::0dd9401d75f62dec7336bdea43302961>>
  */
 import React from 'react';
 import { FormSection as PlatformFormSection } from '@atlaskit/form';
 type PlatformFormSectionProps = React.ComponentProps<typeof PlatformFormSection>;
 export type FormSectionProps = Pick<PlatformFormSectionProps, 'title' | 'children' | 'description'>;
 /**
- * A form allows users to input information.
+ * Use a form section to group related information together, so that longer forms are easier to understand.
+ * There can be multiple form sections in one form.
  */
 export type TFormSection<T> = (props: FormSectionProps) => T;
 export {};

package/dist/types/components/__generated__/HelperMessageProps.codegen.d.ts

@@ -3,16 +3,17 @@
  *
  * Extract component prop types from UIKit 2 components - HelperMessageProps
  *
- * @codegen <<SignedSource::85d8a9188648ed81c09769eedb4935e6>>
+ * @codegen <<SignedSource::0da9514581e07c67f8f9a8ba0d9774b9>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/helper-message.partial.tsx <<SignedSource::f093808bbd8bf8738059aee750524013>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/helper-message.partial.tsx <<SignedSource::03fa772bfaf53905106f1cafbb428104>>
  */
 import React from 'react';
 import { HelperMessage as PlatformHelperMessage } from '@atlaskit/form';
 type PlatformHelperMessageProps = React.ComponentProps<typeof PlatformHelperMessage>;
 export type HelperMessageProps = Pick<PlatformHelperMessageProps, 'children' | 'testId'>;
 /**
- * A form allows users to input information.
+ * A helper message tells the user what kind of input the field takes.
+ * For example, a helper message could be "Password should be more than 4 characters".
  */
 export type THelperMessage<T> = (props: HelperMessageProps) => T;
 export {};

package/dist/types/components/__generated__/IconProps.codegen.d.ts

@@ -3,20 +3,40 @@
  *
  * Extract component prop types from UIKit 2 components - IconProps
  *
- * @codegen <<SignedSource::b20b7ee253d00fb37c349ea914f0f796>>
+ * @codegen <<SignedSource::b24cc22d6f60b86f1646a75a0bafc7cd>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/icon/index.tsx <<SignedSource::e8d3a49d7c0faccdf54a1e1ef3ec8d5b>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/icon/index.tsx <<SignedSource::54a87ae131386a26a52d09234f67aa98>>
  */
 import type { ActiveTokens } from '@atlaskit/tokens';
 export type Icon = 'activity' | 'add' | 'add-circle' | 'add-item' | 'addon' | 'app-access' | 'app-switcher' | 'archive' | 'arrow-down' | 'arrow-down-circle' | 'arrow-left' | 'arrow-left-circle' | 'arrow-right' | 'arrow-right-circle' | 'arrow-up' | 'arrow-up-circle' | 'attachment' | 'audio' | 'audio-circle' | 'backlog' | 'billing' | 'billing-filled' | 'bitbucket-branches' | 'bitbucket-builds' | 'bitbucket-clone' | 'bitbucket-commits' | 'bitbucket-compare' | 'bitbucket-forks' | 'bitbucket-output' | 'bitbucket-pipelines' | 'bitbucket-pullrequests' | 'bitbucket-repos' | 'bitbucket-snippets' | 'bitbucket-source' | 'board' | 'book' | 'bullet-list' | 'calendar' | 'calendar-filled' | 'camera' | 'camera-filled' | 'camera-rotate' | 'camera-take-picture' | 'canvas' | 'check' | 'check-circle' | 'check-circle-outline' | 'checkbox' | 'checkbox-indeterminate' | 'chevron-down' | 'chevron-down-circle' | 'chevron-left' | 'chevron-left-circle' | 'chevron-left-large' | 'chevron-right' | 'chevron-right-circle' | 'chevron-right-large' | 'chevron-up' | 'chevron-up-circle' | 'child-issues' | 'code' | 'comment' | 'component' | 'copy' | 'creditcard' | 'creditcard-filled' | 'cross' | 'cross-circle' | 'dashboard' | 'decision' | 'department' | 'detail-view' | 'discover' | 'discover-filled' | 'document' | 'document-filled' | 'documents' | 'download' | 'drag-handler' | 'dropbox' | 'edit' | 'edit-filled' | 'editor-add' | 'editor-addon' | 'editor-advanced' | 'editor-align-center' | 'editor-align-image-center' | 'editor-align-image-left' | 'editor-align-image-right' | 'editor-align-left' | 'editor-align-right' | 'editor-attachment' | 'editor-background-color' | 'editor-bold' | 'editor-bullet-list' | 'editor-close' | 'editor-code' | 'editor-collapse' | 'editor-date' | 'editor-decision' | 'editor-divider' | 'editor-done' | 'editor-edit' | 'editor-emoji' | 'editor-error' | 'editor-expand' | 'editor-feedback' | 'editor-file' | 'editor-file-preview' | 'editor-help' | 'editor-hint' | 'editor-horizontal-rule' | 'editor-image' | 'editor-image-border' | 'editor-image-resize' | 'editor-indent' | 'editor-info' | 'editor-italic' | 'editor-layout-single' | 'editor-layout-three-equal' | 'editor-layout-three-with-sidebars' | 'editor-layout-two-equal' | 'editor-layout-two-left-sidebar' | 'editor-layout-two-right-sidebar' | 'editor-link' | 'editor-media-center' | 'editor-media-full-width' | 'editor-media-wide' | 'editor-media-wrap-left' | 'editor-media-wrap-right' | 'editor-mention' | 'editor-more' | 'editor-note' | 'editor-number-list' | 'editor-open' | 'editor-outdent' | 'editor-panel' | 'editor-photo' | 'editor-quote' | 'editor-recent' | 'editor-redo' | 'editor-remove' | 'editor-remove-emoji' | 'editor-search' | 'editor-settings' | 'editor-strikethrough' | 'editor-success' | 'editor-table' | 'editor-table-display-options' | 'editor-task' | 'editor-text-color' | 'editor-text-style' | 'editor-underline' | 'editor-undo' | 'editor-unlink' | 'editor-warning' | 'email' | 'emoji' | 'emoji-add' | 'emoji-activity' | 'emoji-atlassian' | 'emoji-custom' | 'emoji-emoji' | 'emoji-flags' | 'emoji-food' | 'emoji-frequent' | 'emoji-keyboard' | 'emoji-nature' | 'emoji-objects' | 'emoji-people' | 'emoji-productivity' | 'emoji-symbols' | 'emoji-travel' | 'error' | 'export' | 'feedback' | 'file' | 'filter' | 'flag-filled' | 'folder' | 'folder-filled' | 'followers' | 'following' | 'googledrive' | 'graph-bar' | 'graph-line' | 'gsuite' | 'highlights' | 'hipchat-audio-only' | 'hipchat-chevron-double-down' | 'hipchat-chevron-double-up' | 'hipchat-chevron-down' | 'hipchat-chevron-up' | 'hipchat-dial-out' | 'hipchat-lobby' | 'hipchat-media-attachment-count' | 'hipchat-outgoing-sound' | 'hipchat-sd-video' | 'home' | 'home-circle' | 'image' | 'image-border' | 'image-resize' | 'info' | 'invite-team' | 'issue' | 'issue-raise' | 'issues' | 'jira-capture' | 'jira-failed-build-status' | 'jira-labs' | 'jira-test-session' | 'label' | 'lightbulb' | 'lightbulb-filled' | 'like' | 'link' | 'link-filled' | 'list' | 'location' | 'lock' | 'lock-circle' | 'lock-filled' | 'marketplace' | 'media-services-actual-size' | 'media-services-add-comment' | 'media-services-annotate' | 'media-services-arrow' | 'media-services-audio' | 'media-services-blur' | 'media-services-brush' | 'media-services-button-option' | 'media-services-code' | 'media-services-document' | 'media-services-filter' | 'media-services-fit-to-page' | 'media-services-full-screen' | 'media-services-grid' | 'media-services-image' | 'media-services-line' | 'media-services-line-thickness' | 'media-services-no-image' | 'media-services-open-mediaviewer' | 'media-services-oval' | 'media-services-pdf' | 'media-services-preselected' | 'media-services-presentation' | 'media-services-rectangle' | 'media-services-scale-large' | 'media-services-scale-small' | 'media-services-spreadsheet' | 'media-services-text' | 'media-services-unknown' | 'media-services-video' | 'media-services-zip' | 'media-services-zoom-in' | 'media-services-zoom-out' | 'mention' | 'menu' | 'menu-expand' | 'mobile' | 'more' | 'more-vertical' | 'notification' | 'notification-all' | 'notification-direct' | 'office-building' | 'office-building-filled' | 'open' | 'overview' | 'page' | 'page-filled' | 'pdf' | 'people' | 'people-group' | 'person' | 'person-circle' | 'person-with-circle' | 'person-with-cross' | 'person-with-tick' | 'portfolio' | 'preferences' | 'premium' | 'presence-active' | 'presence-busy' | 'presence-unavailable' | 'question' | 'question-circle' | 'questions' | 'queues' | 'quote' | 'radio' | 'recent' | 'redo' | 'refresh' | 'retry' | 'roadmap' | 'room-menu' | 'schedule' | 'schedule-filled' | 'screen' | 'search' | 'select-clear' | 'send' | 'settings' | 'share' | 'ship' | 'shortcut' | 'sign-in' | 'sign-out' | 'sprint' | 'star' | 'star-filled' | 'star-large' | 'status' | 'stopwatch' | 'subtask' | 'suitcase' | 'switcher' | 'table' | 'task' | 'teams' | 'trash' | 'tray' | 'undo' | 'unlink' | 'unlock' | 'unlock-circle' | 'unlock-filled' | 'upload' | 'user-avatar-circle' | 'vid-audio-muted' | 'vid-audio-on' | 'vid-backward' | 'vid-camera-off' | 'vid-camera-on' | 'vid-connection-circle' | 'vid-forward' | 'vid-full-screen-off' | 'vid-full-screen-on' | 'vid-hang-up' | 'vid-hd-circle' | 'vid-pause' | 'vid-play' | 'vid-raised-hand' | 'vid-share-screen' | 'vid-speaking-circle' | 'vid-volume-full' | 'vid-volume-half' | 'vid-volume-muted' | 'video-circle' | 'video-filled' | 'warning' | 'watch' | 'watch-filled' | 'world' | 'world-small';
 type Glyph = Icon;
 export type IconColor = Extract<ActiveTokens, `color.icon.${string}`> | 'color.icon';
 export interface IconProps {
+    /**
+     * There are three icon sizes – `small` (16px), `medium` (24px), `large` (32px), and `xlarge` (48px).
+     * This pixel size refers to the canvas the icon sits on, not the size of the icon shape itself.
+     */
     size?: 'small' | 'medium' | 'large';
+    /**
+     * Text used to describe what the icon is in context. A label is needed when there is no pairing visible text next to the icon.
+     * An empty string marks the icon as presentation only.
+     */
     label: string;
+    /**
+     * Name of the icon to be rendered.
+     */
     glyph: Glyph;
+    /**
+     * Primary color for the icon. Inherits the current font color by default.
+     */
     primaryColor?: IconColor;
+    /**
+     * Secondary color for the icon. Defaults to the page background for an icon that supports two colors.
+     */
     secondaryColor?: IconColor;
 }
+/**
+ * An icon is a visual representation of a command, device, directory, or common action.
+ */
 export type TIcon<T> = (props: IconProps) => T;
 export {};

package/dist/types/components/__generated__/InlineEditProps.codegen.d.ts

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - InlineEditProps
  *
- * @codegen <<SignedSource::a9f12cdb3310eb05479934fb78d94123>>
+ * @codegen <<SignedSource::450b0aa0943b6519e89ee7c91f4124ad>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/inline-edit/index.tsx <<SignedSource::9f519f258e72d24157290a0844371df9>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/inline-edit/index.tsx <<SignedSource::23f59ce10b527efc04d36919c24aa2b0>>
  */
 import React from 'react';
 import { default as PlatformInlineEdit } from '@atlaskit/inline-edit';
@@ -21,4 +21,8 @@ export type InlineEditProps<V = string> = Omit<React.ComponentProps<typeof Platf
     onConfirm: (value: V) => void;
     editView: (fieldProps: EditViewFieldProps<V>) => React.ReactNode;
 };
+/**
+ * An inline edit displays a custom input component that switches between reading and editing on the same page.
+ */
+export type TInlineEdit<T> = (props: InlineEditProps) => T;
 export {};

package/dist/types/components/__generated__/InlineProps.codegen.d.ts

@@ -3,16 +3,16 @@
  *
  * Extract component prop types from UIKit 2 components - InlineProps
  *
- * @codegen <<SignedSource::f154fd7caa18fc53a1369bb9f496909c>>
+ * @codegen <<SignedSource::7e0e8c23de8b2392bf101ad017431b86>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/inline/__generated__/index.partial.tsx <<SignedSource::6f1af1d5438263ed1f6833c78c741ed9>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/inline/__generated__/index.partial.tsx <<SignedSource::8123157b2afe19d52b47110fb754d43b>>
  */
 import React from 'react';
 import { Inline as PlatformInline } from '@atlaskit/primitives';
 type PlatformInlineProps = React.ComponentProps<typeof PlatformInline>;
 export type InlineProps = Pick<PlatformInlineProps, 'children' | 'alignBlock' | 'alignInline' | 'spread' | 'grow' | 'space' | 'shouldWrap' | 'separator' | 'rowSpace' | 'testId'>;
 /**
- * Primitives are token-backed low-level building blocks.
+ * An inline manages the horizontal layout of direct children using flexbox.
  */
 export type TInline<T> = (props: InlineProps) => T;
 export {};

package/dist/types/components/__generated__/LabelProps.codegen.d.ts

@@ -3,15 +3,15 @@
  *
  * Extract component prop types from UIKit 2 components - LabelProps
  *
- * @codegen <<SignedSource::0a894a2ad4f4410a2c67f12f0287dbcd>>
+ * @codegen <<SignedSource::f12ab4339e5503f7db96ce306da7f685>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/label.partial.tsx <<SignedSource::60bad4561265206e7c10d92a99fce9f4>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/form/__generated__/label.partial.tsx <<SignedSource::55ecafcd1d98afb9b7f6f37d5168725c>>
  */
 import type { LabelProps as PlatformLabelProps } from '@atlaskit/form';
 export type LabelProps = Pick<PlatformLabelProps, 'children' | 'testId' | 'id'> & {
     labelFor: string;
 };
 /**
- * A form allows users to input information.
+ * A label represents a caption for an item in a user interface.
  */
 export type TLabel<T> = (props: LabelProps) => T;

package/dist/types/components/__generated__/LinkButtonProps.codegen.d.ts

@@ -3,9 +3,9 @@
  *
  * Extract component prop types from UIKit 2 components - LinkButtonProps
  *
- * @codegen <<SignedSource::ac79b85bde2efadf2186ea5acd6d267e>>
+ * @codegen <<SignedSource::7c841825fdf02347d10084f2cd032f66>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/__generated__/link-button.partial.tsx <<SignedSource::4f0e6eb251c01a13ba006b3d7569820d>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/__generated__/link-button.partial.tsx <<SignedSource::e74ee4aaf752a6e85a57950dce7a3683>>
  */
 import type { LinkButtonProps as PlatformLinkButtonProps } from '@atlaskit/button/new';
 import React from 'react';
@@ -15,4 +15,7 @@ export type LinkButtonProps = Pick<PlatformLinkButtonProps, 'children' | 'target
     appearance?: PlatformLinkButtonProps['appearance'] | 'link' | 'subtle-link';
     spacing?: PlatformLinkButtonProps['spacing'] | 'none';
 };
+/**
+ * Renders a link in the style of a button.
+ */
 export type TLinkButton<T> = (props: LinkButtonProps) => T;

package/dist/types/components/__generated__/ListItemProps.codegen.d.ts

@@ -3,11 +3,12 @@
  *
  * Extract component prop types from UIKit 2 components - ListItemProps
  *
- * @codegen <<SignedSource::5b0a462f70b0acd50425ef1c98dc4acd>>
+ * @codegen <<SignedSource::498ef4606a16b666a2b159d16dc69460>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/list/listitem.tsx <<SignedSource::979a16db9afd0d737ded8388e6563c2f>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/list/listitem.tsx <<SignedSource::73cdf1aa500fb4ffb5cbe4ecd40276a9>>
  */
 import React from 'react';
 export interface ListItemProps {
     children: React.ReactNode;
 }
+export type TListItem<T> = (props: ListItemProps) => T;

package/dist/types/components/__generated__/ListProps.codegen.d.ts

@@ -3,12 +3,24 @@
  *
  * Extract component prop types from UIKit 2 components - ListProps
  *
- * @codegen <<SignedSource::e5d3409e37e543116ea009ca173ec496>>
+ * @codegen <<SignedSource::400e8f876b65d0f5902e544922d64a54>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/list/list.tsx <<SignedSource::15041a942a0c0a671c5d60df014ead74>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/list/list.tsx <<SignedSource::08290162e7f9e2a672b27cec286206cf>>
  */
 import React from 'react';
 export interface ListProps {
+    /**
+     * The `ordered` type should be used when representing an ordered list of items.
+     * The `unordered` type should be used when representing an unordered list of items.
+     * The type is set to `unordered` by default.
+     */
     type: 'ordered' | 'unordered';
+    /**
+     * The items to render inside a `List` group.
+     */
     children: React.ReactNode;
 }
+/**
+ * An unordered (bulleted) or ordered (numbered) list.
+ */
+export type TList<T> = (props: ListProps) => T;

package/dist/types/components/__generated__/LoadingButtonProps.codegen.d.ts

@@ -3,16 +3,16 @@
  *
  * Extract component prop types from UIKit 2 components - LoadingButtonProps
  *
- * @codegen <<SignedSource::58521a43391f996afe6923d5a591a82c>>
+ * @codegen <<SignedSource::3abc490a74619a5e969b95b74b8ee6f6>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/__generated__/loading-button.partial.tsx <<SignedSource::078e02aff0fd36fb6bbf64711f0c5490>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/button/loading-button.tsx <<SignedSource::66edb728e0e941c5f53236e94cd02c18>>
  */
 import React from 'react';
 import { LoadingButton as PlatformLoadingButton } from '@atlaskit/button';
 type PlatformLoadingButtonProps = React.ComponentProps<typeof PlatformLoadingButton>;
 export type LoadingButtonProps = Pick<PlatformLoadingButtonProps, 'children' | 'appearance' | 'autoFocus' | 'isDisabled' | 'isSelected' | 'onBlur' | 'onClick' | 'onFocus' | 'spacing' | 'testId' | 'shouldFitContainer' | 'type' | 'isLoading'>;
 /**
- * A button triggers an event or action. They let users know what will happen next.
+ * A button that shows an spinner as an overlay on the button when you set an isLoading prop to true.
  */
 export type TLoadingButton<T> = (props: LoadingButtonProps) => T;
 export {};

package/dist/types/components/__generated__/ModalBodyProps.codegen.d.ts

@@ -3,16 +3,16 @@
  *
  * Extract component prop types from UIKit 2 components - ModalBodyProps
  *
- * @codegen <<SignedSource::f6704cd3ad5b9e900de7e400b133ad53>>
+ * @codegen <<SignedSource::8999036a80e16ad1e4655a8fec69ccdd>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-body.partial.tsx <<SignedSource::0fe5715703e89dfc44882777af179380>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-body.partial.tsx <<SignedSource::627540a6559205080b7e35c17eb83204>>
  */
 import React from 'react';
 import { ModalBody as PlatformModalBody } from '@atlaskit/modal-dialog';
 type PlatformModalBodyProps = React.ComponentProps<typeof PlatformModalBody>;
 export type ModalBodyProps = Pick<PlatformModalBodyProps, 'children' | 'testId'>;
 /**
- * A modal dialog displays content that requires user interaction, in a layer above the page.
+ * A modal body is used to display the main content of a modal.
  */
 export type TModalBody<T> = (props: ModalBodyProps) => T;
 export {};

package/dist/types/components/__generated__/ModalFooterProps.codegen.d.ts

@@ -3,16 +3,17 @@
  *
  * Extract component prop types from UIKit 2 components - ModalFooterProps
  *
- * @codegen <<SignedSource::05f974150dc64ca59a44eb0b121cf773>>
+ * @codegen <<SignedSource::4760b46222d502cf6397bfc1ee866e35>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-footer.partial.tsx <<SignedSource::fd05c385dd42dfcac111c9ddd8c13a28>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-footer.partial.tsx <<SignedSource::0ff399d8f02a70c539a63e9466091768>>
  */
 import React from 'react';
 import { ModalFooter as PlatformModalFooter } from '@atlaskit/modal-dialog';
 type PlatformModalFooterProps = React.ComponentProps<typeof PlatformModalFooter>;
 export type ModalFooterProps = Pick<PlatformModalFooterProps, 'children' | 'testId'>;
 /**
- * A modal dialog displays content that requires user interaction, in a layer above the page.
+ * A modal footer often contains a primary action and the ability to cancel and close the dialog,
+ * though can contain any React element.
  */
 export type TModalFooter<T> = (props: ModalFooterProps) => T;
 export {};

package/dist/types/components/__generated__/ModalHeaderProps.codegen.d.ts

@@ -3,16 +3,16 @@
  *
  * Extract component prop types from UIKit 2 components - ModalHeaderProps
  *
- * @codegen <<SignedSource::c3bc5fde61f2e698aba9b95565c0d268>>
+ * @codegen <<SignedSource::d870076a8f40ef1ca2f514ccccd8d14c>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-header.partial.tsx <<SignedSource::932c9f34f6cd6919fe5b8bcf072745dc>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-header.partial.tsx <<SignedSource::9102fefee5c2fe6cbee65bf860d29652>>
  */
 import React from 'react';
 import { ModalHeader as PlatformModalHeader } from '@atlaskit/modal-dialog';
 type PlatformModalHeaderProps = React.ComponentProps<typeof PlatformModalHeader>;
 export type ModalHeaderProps = Pick<PlatformModalHeaderProps, 'children' | 'testId'>;
 /**
- * A modal dialog displays content that requires user interaction, in a layer above the page.
+ * A modal header contains the title of the modal and can contain other React elements such as a close button.
  */
 export type TModalHeader<T> = (props: ModalHeaderProps) => T;
 export {};

package/dist/types/components/__generated__/ModalTitleProps.codegen.d.ts

@@ -3,16 +3,16 @@
  *
  * Extract component prop types from UIKit 2 components - ModalTitleProps
  *
- * @codegen <<SignedSource::18cc7e23ba187aae2f8e2d8631801b53>>
+ * @codegen <<SignedSource::1742968eb34a6998cf335abcdb9ecd22>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-title.partial.tsx <<SignedSource::996c8299a68e072c936b0023b61bdc20>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-title.partial.tsx <<SignedSource::8f0848e3fabd3cf3660c08e2b1863bd9>>
  */
 import React from 'react';
 import { ModalTitle as PlatformModalTitle } from '@atlaskit/modal-dialog';
 type PlatformModalTitleProps = React.ComponentProps<typeof PlatformModalTitle>;
 export type ModalTitleProps = Pick<PlatformModalTitleProps, 'appearance' | 'children' | 'isMultiline' | 'testId'>;
 /**
- * A modal dialog displays content that requires user interaction, in a layer above the page.
+ * A modal title is used to display a title within a modal.
  */
 export type TModalTitle<T> = (props: ModalTitleProps) => T;
 export {};

package/dist/types/components/__generated__/ModalTransitionProps.codegen.d.ts

@@ -3,16 +3,16 @@
  *
  * Extract component prop types from UIKit 2 components - ModalTransitionProps
  *
- * @codegen <<SignedSource::9d4490cd7b1938efec7181c83258a4c5>>
+ * @codegen <<SignedSource::fbd2e79db623371d79d173ce8c807737>>
  * @codegenCommand yarn workspace @atlaskit/forge-react-types codegen
- * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-transition.partial.tsx <<SignedSource::7f1f7ea64369d3e65533dffbbcec26d7>>
+ * @codegenDependency ../../../../forge-ui/src/components/UIKit/modal/__generated__/modal-transition.partial.tsx <<SignedSource::9a5d35aaedbe614414c801acffdbeeff>>
  */
 import React from 'react';
 import { ModalTransition as PlatformModalTransition } from '@atlaskit/modal-dialog';
 type PlatformModalTransitionProps = React.ComponentProps<typeof PlatformModalTransition>;
 export type ModalTransitionProps = Pick<PlatformModalTransitionProps, 'children'>;
 /**
- * A modal dialog displays content that requires user interaction, in a layer above the page.
+ * A modal transition wraps a modal to provide a fluid transition upon opening and closing.
  */
 export type TModalTransition<T> = (props: ModalTransitionProps) => T;
 export {};