@baseline-ui/core 0.26.0 → 0.28.0

package/dist/index.d.ts

@@ -1,15 +1,16 @@
 import React, { Key, Dispatch, SetStateAction } from 'react';
 import { IconProps, SVGRProps } from '@baseline-ui/icons';
 import * as react_stately from 'react-stately';
-import { DraggableCollectionStateOptions, DroppableCollectionStateOptions, Orientation, ListState, TooltipTriggerProps, SliderStateOptions, ToggleProps, OverlayTriggerProps, OverlayTriggerState, MenuTriggerProps, NumberFieldStateOptions, ListProps, SelectStateOptions, Item as Item$2, Selection as Selection$1, ComboBoxStateOptions, Node as Node$2 } from 'react-stately';
+import { DraggableCollectionStateOptions, DroppableCollectionStateOptions, Orientation, ListState, OverlayTriggerProps, OverlayTriggerState, TooltipTriggerProps, SliderStateOptions, ToggleProps, MenuTriggerProps, NumberFieldStateOptions, ListProps, SelectStateOptions, Item as Item$2, Selection as Selection$1, ComboBoxStateOptions, Node as Node$2 } from 'react-stately';
 import * as react_aria from 'react-aria';
-import { DraggableCollectionOptions, DroppableCollectionOptions, AriaListBoxProps, AriaListBoxOptions, OptionAria, AriaButtonProps, AriaTooltipProps, AriaPositionProps, AriaSliderProps, AriaSwitchProps, AriaSearchFieldProps, AriaPopoverProps, useOverlayTrigger, AriaMenuProps, AriaMenuTriggerProps, AriaLinkOptions, SeparatorProps as SeparatorProps$1, AriaProgressBarProps, AriaTextFieldProps, OverlayProps, AriaToggleButtonProps, AriaCheckboxProps, AriaNumberFieldProps, I18nProviderProps as I18nProviderProps$1, LocalizedStrings, useNumberFormatter, useDateFormatter, AriaTagGroupProps, AriaSelectOptions, Key as Key$1, AriaDialogProps, DropOptions, ClipboardProps, PressProps, AriaRadioGroupProps, AriaModalOverlayProps, AriaComboBoxOptions, AriaComboBoxProps, AriaGridListOptions, GridListItemAria, Locale } from 'react-aria';
+import { DraggableCollectionOptions, DroppableCollectionOptions, AriaListBoxProps, AriaListBoxOptions, OptionAria, AriaButtonProps, AriaPopoverProps, useOverlayTrigger, AriaTooltipProps, AriaPositionProps, AriaSliderProps, AriaSwitchProps, AriaSearchFieldProps, AriaMenuProps, AriaMenuTriggerProps, AriaLinkOptions, SeparatorProps as SeparatorProps$1, AriaProgressBarProps, AriaTextFieldProps, OverlayProps, AriaToggleButtonProps, AriaCheckboxProps, AriaNumberFieldProps, I18nProviderProps as I18nProviderProps$1, LocalizedStrings, useNumberFormatter, useDateFormatter, AriaTagGroupProps, AriaSelectOptions, Key as Key$1, AriaDialogProps, DropOptions, ClipboardProps, PressProps, AriaRadioGroupProps, AriaModalOverlayProps, AriaComboBoxOptions, AriaComboBoxProps, AriaGridListOptions, GridListItemAria, Locale } from 'react-aria';
 export { I18nProviderProps, useCollator, useDateFormatter, useNumberFormatter } from 'react-aria';
 import { Node as Node$1, DragItem, DOMAttributes, AriaLabelingProps, AriaValidationProps, DOMProps } from '@react-types/shared';
 import { Theme, Sprinkles } from '@baseline-ui/tokens';
 import { AriaTabListProps } from '@react-types/tabs';
 import { ColorFieldProps, Color } from '@react-stately/color';
 import { OnRender, OnRenderStart, OnDragStart, OnDrag, OnDragEnd, OnResizeStart, OnResize, OnResizeEnd, OnRotateStart, OnRotate, OnRotateEnd, OnSnap, RotationPosition } from 'react-moveable';
+import { KeyboardProps } from '@react-aria/interactions';
 import { AriaToolbarProps } from '@react-aria/toolbar';
 import { UseTransitionProps } from '@react-spring/core';
 import { AriaColorSwatchProps } from '@react-aria/color';
@@ -190,6 +191,15 @@ interface ListBoxProps extends StylingProps, Omit<AriaListBoxProps<ListItem> & A
 declare const ListBox: React.ForwardRefExoticComponent<ListBoxProps & React.RefAttributes<HTMLUListElement>>;
 
 interface ActionButtonSharedProps extends Omit<AriaButtonProps<"button" | "div">, "rel" | "href" | "target" | "children">, StylingProps {
+    /**
+     * There are some cases where we need to use a button that is not interactive.
+     * For example, when we need to use a button inside a TabItem component that
+     * should remove the tab when clicked. Since this button never needs to be
+     * focused directly, we can set this prop to true to avoid the button being
+     * focusable. At the same time we also avoid the [nested element
+     * rule](https://dequeuniversity.com/rules/axe/html/4.6/nested-interactive)
+     */
+    UNSAFE_NON_INTERACTIVE?: boolean;
 }
 interface ActionButtonProps extends ActionButtonSharedProps {
     /**
@@ -230,6 +240,59 @@ interface DomNodeRendererProps extends StylingProps {
 
 declare const DomNodeRenderer: React.ForwardRefExoticComponent<DomNodeRendererProps & React.RefAttributes<HTMLDivElement>>;
 
+declare type OverlayTriggerProps_ = Parameters<typeof useOverlayTrigger>[0];
+interface PopoverProps extends OverlayTriggerProps, OverlayTriggerProps_ {
+    /** The children of the popover. */
+    children: React.ReactNode;
+}
+interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "triggerRef" | "arrowSize" | "arrowBoundaryOffset">, StylingProps {
+    /**
+     * The reference element for the popover position. By default, the popover is
+     * positioned relative to the trigger element.
+     */
+    triggerRef?: React.RefObject<HTMLElement>;
+    /** The class name for the underlay element. */
+    underlayClassName?: string;
+    /** The contents of the popover. */
+    children: React.ReactNode | ((state: OverlayTriggerState) => React.ReactNode);
+    /**
+     * The container element for the popover. By default, the modal is rendered as
+     * a child of the body element.
+     *
+     * @default document.body
+     */
+    portalContainer?: HTMLElement;
+    /**
+     * Whether to include an arrow on the popover.
+     *
+     * @default false
+     */
+    includeArrow?: boolean;
+    /** The class name for the content container element. */
+    contentContainerClassName?: string;
+    /** The style for the content container element. */
+    contentContainerStyle?: React.CSSProperties;
+}
+interface PopoverTriggerProps {
+    /** The contents of the popover trigger. */
+    children?: React.ReactNode | (({ isOpen, triggerProps, triggerRef, }: {
+        isOpen: boolean;
+        triggerProps: AriaButtonProps<"button">;
+        triggerRef: React.RefObject<HTMLElement>;
+    }) => React.ReactNode);
+    /**
+     * Client rect to be used as anchor for the popover content when no child
+     * element is provided.
+     */
+    anchorRect?: Rect;
+}
+
+declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
+
+declare const PopoverTrigger: React.FC<PopoverTriggerProps>;
+
+declare const Popover: React.FC<PopoverProps>;
+
 interface TooltipProps extends StylingProps, TooltipTriggerProps, AriaTooltipProps, Omit<AriaPositionProps, "overlayRef" | "targetRef" | "maxHeight" | "isOpen" | "arrowSize"> {
     /** The content of the tooltip. */
     text?: string;
@@ -305,13 +368,15 @@ interface SliderProps extends Omit<AriaSliderProps<number> & SliderStateOptions<
      */
     includeNumberInput?: boolean;
 }
-interface IconSliderProps extends Pick<SliderProps, "value" | "minValue" | "maxValue" | "onChange" | "defaultValue">, StylingProps, IconComponentProps {
+interface IconSliderProps extends Pick<SliderProps, "value" | "minValue" | "maxValue" | "onChange" | "defaultValue" | "includeNumberInput">, StylingProps, IconComponentProps {
     /**
      * A function to format the value of the slider.
      *
      * @default value => value
      */
     formatValue?: (value: number) => string | number;
+    /** The props passed to the `PopoverContent` component. */
+    popoverContentProps?: Omit<PopoverContentProps, "children">;
 }
 
 declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLDivElement>>;
@@ -405,59 +470,6 @@ interface PortalContainerProviderProps {
 
 declare const PortalContainerProvider: React.FC<PortalContainerProviderProps>;
 
-declare type OverlayTriggerProps_ = Parameters<typeof useOverlayTrigger>[0];
-interface PopoverProps extends OverlayTriggerProps, OverlayTriggerProps_ {
-    /** The children of the popover. */
-    children: React.ReactNode;
-}
-interface PopoverContentProps extends Omit<AriaPopoverProps, "popoverRef" | "triggerRef" | "arrowSize" | "arrowBoundaryOffset">, StylingProps {
-    /**
-     * The reference element for the popover position. By default, the popover is
-     * positioned relative to the trigger element.
-     */
-    triggerRef?: React.RefObject<HTMLElement>;
-    /** The class name for the underlay element. */
-    underlayClassName?: string;
-    /** The contents of the popover. */
-    children: React.ReactNode | ((state: OverlayTriggerState) => React.ReactNode);
-    /**
-     * The container element for the popover. By default, the modal is rendered as
-     * a child of the body element.
-     *
-     * @default document.body
-     */
-    portalContainer?: HTMLElement;
-    /**
-     * Whether to include an arrow on the popover.
-     *
-     * @default false
-     */
-    includeArrow?: boolean;
-    /** The class name for the content container element. */
-    contentContainerClassName?: string;
-    /** The style for the content container element. */
-    contentContainerStyle?: React.CSSProperties;
-}
-interface PopoverTriggerProps {
-    /** The contents of the popover trigger. */
-    children?: React.ReactNode | (({ isOpen, triggerProps, triggerRef, }: {
-        isOpen: boolean;
-        triggerProps: AriaButtonProps<"button">;
-        triggerRef: React.RefObject<HTMLElement>;
-    }) => React.ReactNode);
-    /**
-     * Client rect to be used as anchor for the popover content when no child
-     * element is provided.
-     */
-    anchorRect?: Rect;
-}
-
-declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLDivElement>>;
-
-declare const PopoverTrigger: React.FC<PopoverTriggerProps>;
-
-declare const Popover: React.FC<PopoverProps>;
-
 declare type MenuOption = Omit<ListOption, "description"> & {
     keyboardShortcut?: string;
 };
@@ -722,7 +734,7 @@ interface CheckboxProps extends Omit<AriaCheckboxProps, "children" | "validation
 
 declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLLabelElement>>;
 
-declare type Excluded = "isDisabled" | "isReadOnly" | "isRequired" | "locale" | "validationState" | "label" | "formatOptions" | "isInvalid" | "validationBehaviour" | "validate" | "description" | "errorMessage";
+declare type Excluded = "isRequired" | "locale" | "validationState" | "label" | "formatOptions" | "isInvalid" | "validationBehaviour" | "validate" | "description" | "errorMessage";
 interface PaginationProps extends Omit<AriaNumberFieldProps, Excluded>, Omit<NumberFieldStateOptions, Excluded>, StylingProps {
     /** The largest value allowed for the input. */
     maxValue: number;
@@ -740,6 +752,8 @@ interface PaginationProps extends Omit<AriaNumberFieldProps, Excluded>, Omit<Num
      * @default md
      */
     size?: "xs" | "sm" | "md" | "lg";
+    /** Whether to hide the increment and decrement actions. */
+    hideActions?: boolean;
 }
 
 declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLDivElement>>;
@@ -1241,7 +1255,7 @@ interface IconColorInputProps extends StylingProps, Omit<ColorInputProps, "rende
      *
      * @default standard
      */
-    variant: "compact" | "standard";
+    variant?: "compact" | "standard";
 }
 
 declare const ColorInput: React.ForwardRefExoticComponent<ColorInputProps & React.RefAttributes<HTMLDivElement>>;
@@ -1322,26 +1336,26 @@ interface FreehandCanvasProps extends StylingProps, AriaLabelingProps {
      */
     isBound?: boolean;
     /**
-     * Callback for when the points change. This is called on every point change.
+     * Callback for when the lines change. This is called on every point change.
      *
-     * @param points
+     * @param lines
      */
-    onChange?: (points: number[][][]) => void;
+    onChange?: (lines: FreehandCanvasLine[]) => void;
     /**
-     * Callback for when the points change has ended. This is called once after
-     * the pointerup event. It is recommended to use this callback for performance
+     * Callback for when the lines change has ended. This is called once after the
+     * pointerup event. It is recommended to use this callback for performance
      * reasons.
      *
-     * @param points
+     * @param lines
      */
-    onChangeEnd?: (points: number[][][]) => void;
-    /** The default points to render. */
-    defaultValue?: number[][][];
+    onChangeEnd?: (lines: FreehandCanvasLine[]) => void;
+    /** The default lines to render. */
+    defaultValue?: FreehandCanvasLine[];
     /**
      * The value of the canvas. This can be used to make the canvas a controlled
      * component.
      */
-    value?: number[][][];
+    value?: FreehandCanvasLine[];
     /** The label for the canvas. */
     label?: string;
     /**
@@ -1369,6 +1383,10 @@ interface FreehandCanvasProps extends StylingProps, AriaLabelingProps {
     /** Description for the canvas. */
     description?: string;
 }
+/** A line in the freehand canvas. */
+declare type FreehandCanvasLine = FreehandCanvasPoint[];
+/** A point in the freehand canvas. The pressure is optional. */
+declare type FreehandCanvasPoint = [x: number, y: number, pressure?: number];
 
 declare const FreehandCanvas: React.ForwardRefExoticComponent<FreehandCanvasProps & React.RefAttributes<HTMLDivElement>>;
 
@@ -1802,6 +1820,8 @@ interface ToolbarProps extends StylingProps, AriaToolbarProps {
      * `isCollapsible` is true.
      */
     renderSpacer?: boolean;
+    /** The callback to call when any key is pressed. */
+    onKeyDown?: KeyboardProps["onKeyDown"];
 }
 
 declare const Toolbar: React.ForwardRefExoticComponent<ToolbarProps & React.RefAttributes<HTMLDivElement>>;
@@ -2205,7 +2225,7 @@ interface ImageGalleryProps extends StylingProps, Omit<ListBoxProps, "items" | "
 
 declare const ImageGallery: React.ForwardRefExoticComponent<ImageGalleryProps & React.RefAttributes<HTMLDivElement>>;
 
-interface ButtonSelectProps extends StylingProps, Pick<SelectProps, "isDisabled" | "validationState" | "onSelectionChange" | "selectedKey" | "defaultSelectedKey" | "items" | "showSelectedIcon" | "isOpen" | "defaultOpen">, Pick<ToggleButtonProps, "onPress" | "isSelected" | "defaultSelected" | "excludeFromTabOrder">, AriaLabelingProps {
+interface ButtonSelectProps extends StylingProps, Pick<SelectProps, "isDisabled" | "validationState" | "onSelectionChange" | "selectedKey" | "defaultSelectedKey" | "items" | "showSelectedIcon" | "isOpen" | "defaultOpen" | "optionClassName" | "optionStyle">, Pick<ToggleButtonProps, "onPress" | "isSelected" | "defaultSelected" | "excludeFromTabOrder">, AriaLabelingProps {
     /**
      * The size of the button.
      *
@@ -2223,6 +2243,8 @@ interface ButtonSelectProps extends StylingProps, Pick<SelectProps, "isDisabled"
         isSelected: boolean;
         selectedKey: string;
     }) => void;
+    /** The aria-label for the select button. */
+    moreAriaLabel?: string;
 }
 
 declare const ButtonSelect: React.ForwardRefExoticComponent<ButtonSelectProps & React.RefAttributes<HTMLDivElement>>;
@@ -2392,6 +2414,14 @@ declare type GridListProps = Omit<StylingProps & ListProps<ListOption> & AriaGri
     renderGridItem: (item: Node$1<ListOption>, options: GridListItemAria & {
         checkBoxProps?: CheckboxProps;
     }, ref: React.Ref<HTMLLIElement>) => React.ReactElement;
+    /**
+     * Enables editing mode which disables keydown event capturing, useful
+     * when you may want the internal `GridList` from taking away focus from
+     * child input due to type-ahead
+     *
+     * @default false
+     */
+    isEditing?: boolean;
 }, "children" | "suppressTextValueWarning" | "allowDuplicateSelectionEvents" | "linkBehavior" | "keyboardDelegate" | "isVirtualized" | "filter">;
 
 declare const GridList: React.ForwardRefExoticComponent<GridListProps & React.RefAttributes<HTMLUListElement>>;
@@ -2402,8 +2432,6 @@ interface ActionGroupProps extends StylingProps, Omit<AriaActionGroupProps<ListI
     /**
      * Represents the mode of selection for a component. This variable should be
      * assigned one of the following string values: "single" or "multiple".
-     *
-     * @default "single"
      */
     selectionMode?: "single" | "multiple";
     /** The props to be passed to the tooltip component. */
@@ -2788,6 +2816,7 @@ interface TextSelectionProps {
  *   `document.body`.
  */
 declare function useDevice(element?: Element | null | undefined): "mobile" | "tablet" | "desktop";
+declare type Device = ReturnType<typeof useDevice>;
 
 /**
  * Custom hook for accessing PortalContainerProviderContext. This hook allows
@@ -2801,4 +2830,4 @@ declare function useDevice(element?: Element | null | undefined): "mobile" | "ta
  */
 declare function usePortalContainer(_portalContainer?: HTMLElement): HTMLElement | undefined;
 
-export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionGroup, ActionGroupItem, type ActionGroupProps, ActionIconButton, type ActionIconButtonProps, AlertDialog, type AlertDialogProps, AudioPlayer, type AudioPlayerProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, ButtonSelect, type ButtonSelectProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorSwatch, ColorSwatchPicker, type ColorSwatchPickerProps, type ColorSwatchProps, ComboBox, type ComboBoxProps, DateFormat, type DateFormatProps, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Drawer, type DrawerProps, Editor, type EditorHandle, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, GridList, type GridListProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInput, IconColorInputButton, type IconColorInputProps, IconSelect, type IconSelectProps, IconSlider, type IconSliderProps, ImageDropZone, type ImageDropZoneProps, ImageGallery, type ImageGalleryProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Markdown, type MarkdownProps, Menu, type MenuItem, 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, PortalContainerProvider, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, type Rect, 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, Transition, type TransitionProps, defineMessages, isInsideOverlayContent, isRect, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, usePortalContainer, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };
+export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, ActionButton, type ActionButtonProps, ActionGroup, ActionGroupItem, type ActionGroupProps, ActionIconButton, type ActionIconButtonProps, AlertDialog, type AlertDialogProps, AudioPlayer, type AudioPlayerProps, Avatar, type AvatarProps, type BlockProps, Box, type BoxProps, ButtonSelect, type ButtonSelectProps, Checkbox, type CheckboxProps, ColorInput, type ColorInputProps, type ColorPreset, ColorSwatch, ColorSwatchPicker, type ColorSwatchPickerProps, type ColorSwatchProps, ComboBox, type ComboBoxProps, DateFormat, type DateFormatProps, type Device, Dialog, type DialogProps, DialogTitle, type DialogTitleProps, DomNodeRenderer, type DomNodeRendererProps, Drawer, type DrawerProps, Editor, type EditorHandle, type EditorProps, FileUpload, type FileUploadProps, FreehandCanvas, type FreehandCanvasProps, GridList, type GridListProps, Group, type GroupProps, I18nProvider, type I18nResult, IconColorInput, IconColorInputButton, type IconColorInputProps, IconSelect, type IconSelectProps, IconSlider, type IconSliderProps, ImageDropZone, type ImageDropZoneProps, ImageGallery, type ImageGalleryProps, InlineAlert, type InlineAlertProps, Link, type LinkProps, ListBox, type ListBoxProps, type ListOption, Markdown, type MarkdownProps, Menu, type MenuItem, 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, PortalContainerProvider, type PortalProps, Preview, type PreviewProps, ProgressBar, type ProgressBarProps, ProgressSpinner, type ProgressSpinnerProps, RadioGroup, type RadioGroupProps, Reaction, type ReactionProps, type Rect, 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, Transition, type TransitionProps, defineMessages, isInsideOverlayContent, isRect, useDevice, useI18n, useImage, useIntersectionObserver, useIsFirstRender, useLocalStorage, useMutationObserver, usePortalContainer, useResizeObserver, useTextSelection, useUndoRedo, useUserPreferences };