@baseline-ui/core 0.8.5 → 0.9.0

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import React, { Key, Dispatch, SetStateAction } from 'react';
-import { DraggableCollectionStateOptions, DroppableCollectionStateOptions, ListState, Orientation, SliderStateOptions, ToggleProps, OverlayTriggerProps, OverlayTriggerState, MenuTriggerProps, TooltipTriggerProps, NumberFieldStateOptions, ListProps, SelectStateOptions, Item as Item$1 } from 'react-stately';
+import { DraggableCollectionStateOptions, DroppableCollectionStateOptions, Orientation, ListState, SliderStateOptions, ToggleProps, OverlayTriggerProps, OverlayTriggerState, MenuTriggerProps, TooltipTriggerProps, NumberFieldStateOptions, ListProps, SelectStateOptions, Item as Item$1 } from 'react-stately';
 import * as react_aria from 'react-aria';
 import { DraggableCollectionOptions, DroppableCollectionOptions, AriaListBoxProps, AriaListBoxOptions, OptionAria, AriaButtonProps, AriaSliderProps, AriaSwitchProps, AriaSearchFieldProps, AriaPopoverProps, useOverlayTrigger, AriaMenuProps, AriaMenuTriggerProps, AriaLinkOptions, SeparatorProps as SeparatorProps$1, AriaProgressBarProps, AriaTextFieldProps, AriaTooltipProps, AriaPositionProps, OverlayProps, AriaToggleButtonProps, AriaCheckboxProps, AriaNumberFieldProps, I18nProviderProps as I18nProviderProps$1, LocalizedStrings, useNumberFormatter, useDateFormatter, AriaTagGroupProps, AriaSelectOptions, AriaDialogProps, DropOptions, ClipboardProps, PressProps, AriaRadioGroupProps, AriaModalOverlayProps, Locale } from 'react-aria';
 export { I18nProviderProps, useCollator, useDateFormatter, useNumberFormatter } from 'react-aria';
@@ -17,7 +17,20 @@ type DragAndDropProps = Omit<DraggableCollectionStateOptions & DraggableCollecti
      *
      * @default false
      */
-    enableReorder?: boolean;
+    enableReorder: boolean;
+    /**
+     * Whether the items are arranged in a stack or grid.
+     *
+     * @default stack
+     */
+    layout: "grid" | "stack";
+    /**
+     * The primary orientation of the items. Usually this is the direction that
+     * the collection scrolls.
+     *
+     * @default vertical
+     */
+    orientation: Orientation;
 };
 
 interface BlockProps {
@@ -42,6 +55,7 @@ type ListOption = {
     label: string;
     description?: string;
     icon?: React.FC<IconProps>;
+    data?: Record<string, any>;
     /**
      * The type of item.
      *
@@ -56,7 +70,7 @@ type ListSection = {
     children: ListOption[];
 };
 type ListItem = ListOption | ListSection;
-interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & AriaListBoxOptions<ListItem>, "children" | "linkBehavior" | "isVirtualized" | "keyboardDelegate">, Omit<DragAndDropProps, "preview"> {
+interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & AriaListBoxOptions<ListItem>, "children" | "linkBehavior" | "isVirtualized" | "keyboardDelegate">, Omit<DragAndDropProps, "preview" | "enableReorder" | "orientation" | "layout">, Partial<Pick<DragAndDropProps, "enableReorder" | "orientation" | "layout">> {
     /**
      * The items to render in the listbox. Items have the following shape:
      *
@@ -95,6 +109,7 @@ interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & A
         dropIndicatorProps: React.HTMLAttributes<HTMLLIElement>;
         isDropTarget: boolean;
         isHidden: boolean;
+        orientation: Orientation;
     }, ref: React.RefObject<HTMLLIElement>) => React.ReactNode;
     /**
      * The custom render function for the drag preview. This can be used to render
@@ -105,19 +120,10 @@ interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & A
     showSelectedIcon?: boolean;
     /** The label for the listbox. */
     label?: React.ReactNode;
-    /**
-     * Whether the items are arranged in a stack or grid.
-     *
-     * @default stack
-     */
-    layout?: "grid" | "stack";
-    /**
-     * The primary orientation of the items. Usually this is the direction that
-     * the collection scrolls.
-     *
-     * @default vertical
-     */
-    orientation?: Orientation;
+    /** The CSS class name for the drop indicator. */
+    dropIndicatorClassName?: string;
+    /** The style of the drop indicator used in a component. */
+    dropIndicatorStyle?: React.CSSProperties;
 }
 
 declare const ListBox: React.ForwardRefExoticComponent<ListBoxProps & React.RefAttributes<HTMLUListElement>>;
@@ -1173,7 +1179,7 @@ type TextProps<T extends keyof React.JSX.IntrinsicElements = "span"> = StylingPr
      *
      * @default "title"
      */
-    type?: "subtitle" | "title" | "body" | "value" | "helper";
+    type?: "subtitle" | "title" | "label" | "value" | "helper" | "body";
     /**
      * The size of the text.
      *
@@ -1296,7 +1302,7 @@ type TransformProps = {
 
 declare const Transform: React.ForwardRefExoticComponent<TransformProps & React.RefAttributes<HTMLDivElement>>;
 
-interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "variant">, Omit<DropOptions, "ref" | "getDropOperation" | "hasDropButton" | "getDropOperationForPoint">, Omit<ClipboardProps, "getItems" | "onCut" | "onCopy">, AriaLabelingProps {
+interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "variant">, Omit<DropOptions, "ref" | "getDropOperation" | "hasDropButton" | "getDropOperationForPoint">, Omit<ClipboardProps, "getItems" | "onCut" | "onCopy">, Pick<FreehandCanvasProps, "footerClassName" | "footerStyle" | "placeholder" | "clearLabel">, AriaLabelingProps {
     /**
      * The initial image to display. This will be used as the `src` attribute of
      * the `<img>` element. You will be able to choose a new image.
@@ -1316,8 +1322,6 @@ interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "vari
     imageAlt?: string;
     /** The label to display for the picker button. */
     pickerButtonLabel?: string;
-    /** The label to display for the remove button. */
-    removeButtonLabel?: string;
     /**
      * Whether to show the checkered background behind the image. This is useful
      * when the image has transparency.
@@ -1331,9 +1335,13 @@ interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "vari
     pickerButtonClassName?: string;
     /** The style to apply to the picker button. */
     pickerButtonStyle?: React.CSSProperties;
+    /** The class name to apply to the label. */
+    labelClassName?: string;
+    /** The style to apply to the label. */
+    labelStyle?: React.CSSProperties;
 }
 
-declare const ImageDropZone: React.ForwardRefExoticComponent<ImageDropZoneProps & React.RefAttributes<HTMLLabelElement>>;
+declare const ImageDropZone: React.ForwardRefExoticComponent<ImageDropZoneProps & React.RefAttributes<HTMLDivElement>>;
 
 interface PreviewProps extends StylingProps, AriaLabelingProps {
     /**
@@ -1448,7 +1456,7 @@ declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & Reac
 
 interface ModalProps extends OverlayTriggerProps {
 }
-interface ModalContentProps extends AriaModalOverlayProps, StylingProps {
+interface ModalContentProps extends Omit<AriaModalOverlayProps, "isDismissable" | "isKeyboardDismissDisabled">, StylingProps {
     /**
      * The contents of the modal. Can be a React node or a function that returns a
      * React node.
@@ -1470,6 +1478,31 @@ interface ModalContentProps extends AriaModalOverlayProps, StylingProps {
      * @default false
      */
     disableAnimation?: boolean;
+    /**
+     * Whether the modal should be rendered as a drawer. This will render the
+     * modal with a transparent background and no border at the bottom. The `auto`
+     * value will render the modal as a drawer on mobile and as a dialog on
+     * desktop and tablet.
+     *
+     * @default false
+     */
+    enableDrawer?: boolean | "auto";
+    /**
+     * Specifies if the component is dismissable or not. If the value is a
+     * function, it will be called with a boolean indicating if the modal is
+     * rendered as a drawer or not.
+     *
+     * @default true
+     */
+    isDismissable?: boolean | ((isDrawer: boolean) => boolean);
+    /**
+     * Determines if keyboard dismissal is disabled. If the value is a function,
+     * it will be called with a boolean indicating if the modal is rendered as a
+     * drawer or not.
+     *
+     * @default false
+     */
+    isKeyboardDismissDisabled?: boolean | ((isDrawer: boolean) => boolean);
 }
 
 declare const Modal: React.FC<ModalProps>;
@@ -1559,6 +1592,140 @@ interface ToggleIconButtonProps extends StylingProps, Omit<ToggleProps, "childre
 
 declare const ToggleIconButton: React.ForwardRefExoticComponent<ToggleIconButtonProps & React.RefAttributes<HTMLButtonElement>>;
 
+type MentionableUser = {
+    id: string;
+    name: string;
+    displayName: string;
+    avatar?: AvatarProps;
+    description?: string;
+};
+type EditorHandle = {
+    setCaretPosition: (index: number) => void;
+};
+interface EditorProps extends StylingProps, AriaLabelingProps {
+    /**
+     * The function to be called when `Enter` key is pressed or Save button is
+     * clicked.
+     */
+    onSave?: (value: string) => void;
+    /**
+     * The function to be called when Cancel button is clicked. If not provided,
+     * the Cancel button will not be rendered.
+     */
+    onCancel?: () => void;
+    /** The default value of the editor. */
+    defaultValue?: string;
+    /** The value of the editor. */
+    value?: string;
+    /**
+     * The function to be called when the value of the editor changes.
+     *
+     * @param value
+     */
+    onChange?: (value: string) => void;
+    /** Whether the editor is disabled. */
+    isDisabled?: boolean;
+    /**
+     * Indicates whether rich text is enabled or not.
+     *
+     * @default true
+     */
+    enableRichText?: boolean;
+    /** The placeholder text to be displayed when the editor is empty. */
+    placeholder?: string;
+    /**
+     * The variant of the editor.
+     *
+     * @default default
+     */
+    variant?: "default" | "minimal";
+    /** Whether the editor is inline or not. */
+    isInline?: boolean;
+    /** Specifies whether spell checking is enabled or disabled. */
+    spellCheck?: boolean;
+    /**
+     * Optional property that represents the ARIA label for the submit button.
+     * This property is used to provide an accessible label for the button, which
+     * is read by screen readers to assist visually impaired users.
+     *
+     * @default Save
+     */
+    submitButtonAriaLabel?: string;
+    /**
+     * The React node representing the icon to be displayed on the submit button.
+     *
+     * @default ArrowUpCircleFilledIcon
+     */
+    submitButtonIcon?: React.FC<IconProps>;
+    /**
+     * The name of the avatar. The avatar is visible when `variant` is set to
+     * `minimal` and `enableRichText` is set to `false`.
+     */
+    avatarName?: string;
+    /**
+     * The ARIA label for the editable content. In case of rich text, this label
+     * is used to provide an accessible label for the contenteditable element,
+     * which is read by screen readers to assist visually impaired users. In case
+     * of plain text, this label is used to provide an accessible label for the
+     * textarea element.
+     *
+     * @default Editing Area
+     */
+    editableContentAriaLabel?: string;
+    /**
+     * An optional array of mentionable users. Mention feature is only available
+     * when `enableRichText` is set to `true` and this prop is provided.
+     *
+     * ```tsx
+     * type MentionableUser = {
+     *   id: string;
+     *   name: string;
+     *   displayName: string;
+     *   avatar?: AvatarProps;
+     *   description?: string;
+     * };
+     * ```
+     */
+    mentionableUsers?: MentionableUser[];
+    /** Footer button represents an array of ActionIconButtonProps. */
+    footerButtons?: ActionIconButtonProps[];
+    /** The imperative handle for manipulating editor. */
+    editorHandle?: React.RefObject<EditorHandle>;
+}
+
+declare const Editor: React.ForwardRefExoticComponent<EditorProps & React.RefAttributes<HTMLDivElement>>;
+
+interface ScrollControlButtonProps extends StylingProps, Pick<ActionButtonProps, "label"> {
+    /**
+     * The ref to the scrollable element.
+     *
+     * @default document.body
+     */
+    scrollRef?: React.RefObject<HTMLElement>;
+    /**
+     * Indicates whether the button should be hidden when the keyboard is being
+     * used.
+     *
+     * @default false
+     */
+    hideForKeyboard?: boolean;
+    /**
+     * The delay in milliseconds before the button is hidden when the scrolling
+     * stops.
+     *
+     * @default 1500
+     */
+    delay?: number;
+    /**
+     * Indicates whether the scroll should be smooth.
+     *
+     * @default true
+     */
+    smoothScroll?: boolean;
+}
+
+declare const ScrollControlButton: React.ForwardRefExoticComponent<ScrollControlButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
 /**
  * A hook that creates an IntersectionObserver and observes a target element.
  *
@@ -1898,4 +2065,4 @@ interface TextSelectionProps {
  */
 declare function useDevice(element?: HTMLElement | null): "mobile" | "tablet" | "desktop";
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Menu, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Editor, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Menu, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, ScrollControlButton, type ScrollControlButtonProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import React, { Key, Dispatch, SetStateAction } from 'react';
-import { DraggableCollectionStateOptions, DroppableCollectionStateOptions, ListState, Orientation, SliderStateOptions, ToggleProps, OverlayTriggerProps, OverlayTriggerState, MenuTriggerProps, TooltipTriggerProps, NumberFieldStateOptions, ListProps, SelectStateOptions, Item as Item$1 } from 'react-stately';
+import { DraggableCollectionStateOptions, DroppableCollectionStateOptions, Orientation, ListState, SliderStateOptions, ToggleProps, OverlayTriggerProps, OverlayTriggerState, MenuTriggerProps, TooltipTriggerProps, NumberFieldStateOptions, ListProps, SelectStateOptions, Item as Item$1 } from 'react-stately';
 import * as react_aria from 'react-aria';
 import { DraggableCollectionOptions, DroppableCollectionOptions, AriaListBoxProps, AriaListBoxOptions, OptionAria, AriaButtonProps, AriaSliderProps, AriaSwitchProps, AriaSearchFieldProps, AriaPopoverProps, useOverlayTrigger, AriaMenuProps, AriaMenuTriggerProps, AriaLinkOptions, SeparatorProps as SeparatorProps$1, AriaProgressBarProps, AriaTextFieldProps, AriaTooltipProps, AriaPositionProps, OverlayProps, AriaToggleButtonProps, AriaCheckboxProps, AriaNumberFieldProps, I18nProviderProps as I18nProviderProps$1, LocalizedStrings, useNumberFormatter, useDateFormatter, AriaTagGroupProps, AriaSelectOptions, AriaDialogProps, DropOptions, ClipboardProps, PressProps, AriaRadioGroupProps, AriaModalOverlayProps, Locale } from 'react-aria';
 export { I18nProviderProps, useCollator, useDateFormatter, useNumberFormatter } from 'react-aria';
@@ -17,7 +17,20 @@ type DragAndDropProps = Omit<DraggableCollectionStateOptions & DraggableCollecti
      *
      * @default false
      */
-    enableReorder?: boolean;
+    enableReorder: boolean;
+    /**
+     * Whether the items are arranged in a stack or grid.
+     *
+     * @default stack
+     */
+    layout: "grid" | "stack";
+    /**
+     * The primary orientation of the items. Usually this is the direction that
+     * the collection scrolls.
+     *
+     * @default vertical
+     */
+    orientation: Orientation;
 };
 
 interface BlockProps {
@@ -42,6 +55,7 @@ type ListOption = {
     label: string;
     description?: string;
     icon?: React.FC<IconProps>;
+    data?: Record<string, any>;
     /**
      * The type of item.
      *
@@ -56,7 +70,7 @@ type ListSection = {
     children: ListOption[];
 };
 type ListItem = ListOption | ListSection;
-interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & AriaListBoxOptions<ListItem>, "children" | "linkBehavior" | "isVirtualized" | "keyboardDelegate">, Omit<DragAndDropProps, "preview"> {
+interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & AriaListBoxOptions<ListItem>, "children" | "linkBehavior" | "isVirtualized" | "keyboardDelegate">, Omit<DragAndDropProps, "preview" | "enableReorder" | "orientation" | "layout">, Partial<Pick<DragAndDropProps, "enableReorder" | "orientation" | "layout">> {
     /**
      * The items to render in the listbox. Items have the following shape:
      *
@@ -95,6 +109,7 @@ interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & A
         dropIndicatorProps: React.HTMLAttributes<HTMLLIElement>;
         isDropTarget: boolean;
         isHidden: boolean;
+        orientation: Orientation;
     }, ref: React.RefObject<HTMLLIElement>) => React.ReactNode;
     /**
      * The custom render function for the drag preview. This can be used to render
@@ -105,19 +120,10 @@ interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & A
     showSelectedIcon?: boolean;
     /** The label for the listbox. */
     label?: React.ReactNode;
-    /**
-     * Whether the items are arranged in a stack or grid.
-     *
-     * @default stack
-     */
-    layout?: "grid" | "stack";
-    /**
-     * The primary orientation of the items. Usually this is the direction that
-     * the collection scrolls.
-     *
-     * @default vertical
-     */
-    orientation?: Orientation;
+    /** The CSS class name for the drop indicator. */
+    dropIndicatorClassName?: string;
+    /** The style of the drop indicator used in a component. */
+    dropIndicatorStyle?: React.CSSProperties;
 }
 
 declare const ListBox: React.ForwardRefExoticComponent<ListBoxProps & React.RefAttributes<HTMLUListElement>>;
@@ -1173,7 +1179,7 @@ type TextProps<T extends keyof React.JSX.IntrinsicElements = "span"> = StylingPr
      *
      * @default "title"
      */
-    type?: "subtitle" | "title" | "body" | "value" | "helper";
+    type?: "subtitle" | "title" | "label" | "value" | "helper" | "body";
     /**
      * The size of the text.
      *
@@ -1296,7 +1302,7 @@ type TransformProps = {
 
 declare const Transform: React.ForwardRefExoticComponent<TransformProps & React.RefAttributes<HTMLDivElement>>;
 
-interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "variant">, Omit<DropOptions, "ref" | "getDropOperation" | "hasDropButton" | "getDropOperationForPoint">, Omit<ClipboardProps, "getItems" | "onCut" | "onCopy">, AriaLabelingProps {
+interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "variant">, Omit<DropOptions, "ref" | "getDropOperation" | "hasDropButton" | "getDropOperationForPoint">, Omit<ClipboardProps, "getItems" | "onCut" | "onCopy">, Pick<FreehandCanvasProps, "footerClassName" | "footerStyle" | "placeholder" | "clearLabel">, AriaLabelingProps {
     /**
      * The initial image to display. This will be used as the `src` attribute of
      * the `<img>` element. You will be able to choose a new image.
@@ -1316,8 +1322,6 @@ interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "vari
     imageAlt?: string;
     /** The label to display for the picker button. */
     pickerButtonLabel?: string;
-    /** The label to display for the remove button. */
-    removeButtonLabel?: string;
     /**
      * Whether to show the checkered background behind the image. This is useful
      * when the image has transparency.
@@ -1331,9 +1335,13 @@ interface ImageDropZoneProps extends Omit<SharedFileUploadProps, "label" | "vari
     pickerButtonClassName?: string;
     /** The style to apply to the picker button. */
     pickerButtonStyle?: React.CSSProperties;
+    /** The class name to apply to the label. */
+    labelClassName?: string;
+    /** The style to apply to the label. */
+    labelStyle?: React.CSSProperties;
 }
 
-declare const ImageDropZone: React.ForwardRefExoticComponent<ImageDropZoneProps & React.RefAttributes<HTMLLabelElement>>;
+declare const ImageDropZone: React.ForwardRefExoticComponent<ImageDropZoneProps & React.RefAttributes<HTMLDivElement>>;
 
 interface PreviewProps extends StylingProps, AriaLabelingProps {
     /**
@@ -1448,7 +1456,7 @@ declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & Reac
 
 interface ModalProps extends OverlayTriggerProps {
 }
-interface ModalContentProps extends AriaModalOverlayProps, StylingProps {
+interface ModalContentProps extends Omit<AriaModalOverlayProps, "isDismissable" | "isKeyboardDismissDisabled">, StylingProps {
     /**
      * The contents of the modal. Can be a React node or a function that returns a
      * React node.
@@ -1470,6 +1478,31 @@ interface ModalContentProps extends AriaModalOverlayProps, StylingProps {
      * @default false
      */
     disableAnimation?: boolean;
+    /**
+     * Whether the modal should be rendered as a drawer. This will render the
+     * modal with a transparent background and no border at the bottom. The `auto`
+     * value will render the modal as a drawer on mobile and as a dialog on
+     * desktop and tablet.
+     *
+     * @default false
+     */
+    enableDrawer?: boolean | "auto";
+    /**
+     * Specifies if the component is dismissable or not. If the value is a
+     * function, it will be called with a boolean indicating if the modal is
+     * rendered as a drawer or not.
+     *
+     * @default true
+     */
+    isDismissable?: boolean | ((isDrawer: boolean) => boolean);
+    /**
+     * Determines if keyboard dismissal is disabled. If the value is a function,
+     * it will be called with a boolean indicating if the modal is rendered as a
+     * drawer or not.
+     *
+     * @default false
+     */
+    isKeyboardDismissDisabled?: boolean | ((isDrawer: boolean) => boolean);
 }
 
 declare const Modal: React.FC<ModalProps>;
@@ -1559,6 +1592,140 @@ interface ToggleIconButtonProps extends StylingProps, Omit<ToggleProps, "childre
 
 declare const ToggleIconButton: React.ForwardRefExoticComponent<ToggleIconButtonProps & React.RefAttributes<HTMLButtonElement>>;
 
+type MentionableUser = {
+    id: string;
+    name: string;
+    displayName: string;
+    avatar?: AvatarProps;
+    description?: string;
+};
+type EditorHandle = {
+    setCaretPosition: (index: number) => void;
+};
+interface EditorProps extends StylingProps, AriaLabelingProps {
+    /**
+     * The function to be called when `Enter` key is pressed or Save button is
+     * clicked.
+     */
+    onSave?: (value: string) => void;
+    /**
+     * The function to be called when Cancel button is clicked. If not provided,
+     * the Cancel button will not be rendered.
+     */
+    onCancel?: () => void;
+    /** The default value of the editor. */
+    defaultValue?: string;
+    /** The value of the editor. */
+    value?: string;
+    /**
+     * The function to be called when the value of the editor changes.
+     *
+     * @param value
+     */
+    onChange?: (value: string) => void;
+    /** Whether the editor is disabled. */
+    isDisabled?: boolean;
+    /**
+     * Indicates whether rich text is enabled or not.
+     *
+     * @default true
+     */
+    enableRichText?: boolean;
+    /** The placeholder text to be displayed when the editor is empty. */
+    placeholder?: string;
+    /**
+     * The variant of the editor.
+     *
+     * @default default
+     */
+    variant?: "default" | "minimal";
+    /** Whether the editor is inline or not. */
+    isInline?: boolean;
+    /** Specifies whether spell checking is enabled or disabled. */
+    spellCheck?: boolean;
+    /**
+     * Optional property that represents the ARIA label for the submit button.
+     * This property is used to provide an accessible label for the button, which
+     * is read by screen readers to assist visually impaired users.
+     *
+     * @default Save
+     */
+    submitButtonAriaLabel?: string;
+    /**
+     * The React node representing the icon to be displayed on the submit button.
+     *
+     * @default ArrowUpCircleFilledIcon
+     */
+    submitButtonIcon?: React.FC<IconProps>;
+    /**
+     * The name of the avatar. The avatar is visible when `variant` is set to
+     * `minimal` and `enableRichText` is set to `false`.
+     */
+    avatarName?: string;
+    /**
+     * The ARIA label for the editable content. In case of rich text, this label
+     * is used to provide an accessible label for the contenteditable element,
+     * which is read by screen readers to assist visually impaired users. In case
+     * of plain text, this label is used to provide an accessible label for the
+     * textarea element.
+     *
+     * @default Editing Area
+     */
+    editableContentAriaLabel?: string;
+    /**
+     * An optional array of mentionable users. Mention feature is only available
+     * when `enableRichText` is set to `true` and this prop is provided.
+     *
+     * ```tsx
+     * type MentionableUser = {
+     *   id: string;
+     *   name: string;
+     *   displayName: string;
+     *   avatar?: AvatarProps;
+     *   description?: string;
+     * };
+     * ```
+     */
+    mentionableUsers?: MentionableUser[];
+    /** Footer button represents an array of ActionIconButtonProps. */
+    footerButtons?: ActionIconButtonProps[];
+    /** The imperative handle for manipulating editor. */
+    editorHandle?: React.RefObject<EditorHandle>;
+}
+
+declare const Editor: React.ForwardRefExoticComponent<EditorProps & React.RefAttributes<HTMLDivElement>>;
+
+interface ScrollControlButtonProps extends StylingProps, Pick<ActionButtonProps, "label"> {
+    /**
+     * The ref to the scrollable element.
+     *
+     * @default document.body
+     */
+    scrollRef?: React.RefObject<HTMLElement>;
+    /**
+     * Indicates whether the button should be hidden when the keyboard is being
+     * used.
+     *
+     * @default false
+     */
+    hideForKeyboard?: boolean;
+    /**
+     * The delay in milliseconds before the button is hidden when the scrolling
+     * stops.
+     *
+     * @default 1500
+     */
+    delay?: number;
+    /**
+     * Indicates whether the scroll should be smooth.
+     *
+     * @default true
+     */
+    smoothScroll?: boolean;
+}
+
+declare const ScrollControlButton: React.ForwardRefExoticComponent<ScrollControlButtonProps & React.RefAttributes<HTMLButtonElement>>;
+
 /**
  * A hook that creates an IntersectionObserver and observes a target element.
  *
@@ -1898,4 +2065,4 @@ interface TextSelectionProps {
  */
 declare function useDevice(element?: HTMLElement | null): "mobile" | "tablet" | "desktop";
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Menu, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionIconButton, type ActionIconButtonProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorPresetInlineInput, type ColorPresetInlineInputProps, ColorSwatch, type ColorSwatchProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Editor, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInputButton, ImageDropZone, type ImageDropZoneProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Menu, type MenuProps, type MessageDescriptor, MessageFormat, type MessageFormatProps, Modal, ModalClose, ModalContent, type ModalContentProps, type ModalProps, ModalTrigger, NumberFormat, type NumberFormatProps, NumberInput, type NumberInputProps, Pagination, type PaginationProps, Popover, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, ScrollControlButton, type ScrollControlButtonProps, SearchInput, type SearchInputProps, Select, type SelectProps, Separator, type SeparatorProps, Slider, type SliderProps, type StylingProps, Switch, type SwitchProps, TabItem, type TabItemProps, Tabs, type TabsProps, TagGroup, type TagGroupProps, Text, TextInput, type TextInputProps, type TextProps, ThemeProvider, type ThemeProviderProps, ToggleButton, type ToggleButtonProps, ToggleIconButton, type ToggleIconButtonProps, Toolbar, type ToolbarProps, Tooltip, type TooltipProps, Transform, type TransformProps, defineMessages, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };