@vibe/core 3.68.0-alpha-cd9cf.0 → 3.68.1

package/dist/components/ButtonGroup/ButtonGroup.d.ts

@@ -0,0 +1,94 @@
+import React from "react";
+import { type ButtonValue } from "./ButtonGroupConstants";
+import { type ButtonType as ButtonTypeEnum } from "../Button/ButtonConstants";
+import { type ButtonType, type ButtonSize } from "../Button";
+import { type SubIcon, type VibeComponentProps } from "../../types";
+import { type MoveBy } from "../../types/MoveBy";
+import { type TooltipPositions } from "../Tooltip";
+type ButtonGroupOption = {
+    icon?: SubIcon;
+    leftIcon?: SubIcon;
+    ariaLabel?: string;
+    subText?: string;
+    value: ButtonValue;
+    text: string;
+    disabled?: boolean;
+    tooltipContent?: string;
+};
+export interface ButtonGroupProps extends VibeComponentProps {
+    /**
+     * The list of button options.
+     */
+    options: Array<ButtonGroupOption>;
+    /**
+     * The currently selected button value.
+     */
+    value?: ButtonValue;
+    /**
+     * Callback fired when a button is selected.
+     */
+    onSelect?: (value: ButtonValue, name: string) => void;
+    /**
+     * The size of the buttons.
+     */
+    size?: ButtonSize;
+    /**
+     * The style variant of the buttons.
+     */
+    kind?: Extract<ButtonType, "secondary" | "tertiary">;
+    /**
+     * The name of the button group.
+     */
+    name?: string;
+    /**
+     * If true, disables all buttons in the group.
+     */
+    disabled?: boolean;
+    /**
+     * The label of the button group for accessibility.
+     */
+    groupAriaLabel?: string;
+    /**
+     * The position of the tooltip relative to the button.
+     */
+    tooltipPosition?: TooltipPositions;
+    /**
+     * The delay in milliseconds before the tooltip hides.
+     */
+    tooltipHideDelay?: number;
+    /**
+     * The delay in milliseconds before the tooltip shows.
+     */
+    tooltipShowDelay?: number;
+    /**
+     * CSS selector for the tooltip container.
+     */
+    tooltipContainerSelector?: string;
+    /**
+     * Adjusts the tooltip position.
+     */
+    tooltipMoveBy?: MoveBy;
+    /**
+     * The content inside the button group.
+     */
+    children?: React.ReactNode;
+    /**
+     * If true, makes the button group take the full width of its container.
+     */
+    fullWidth?: boolean;
+    /**
+     * If true, removes focus from the button after clicking.
+     */
+    blurOnMouseUp?: boolean;
+}
+declare const _default: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLElement>> & {
+    sizes: {
+        readonly SMALL: "small";
+        readonly MEDIUM: "medium";
+        readonly LARGE: "large";
+        readonly XXS: "xxs";
+        readonly XS: "xs";
+    };
+    kinds: typeof ButtonTypeEnum;
+};
+export default _default;

package/dist/components/ButtonGroup/ButtonGroupConstants.d.ts

@@ -0,0 +1 @@
+export type ButtonValue = string | number;

package/dist/components/ButtonGroup/ButtonWrapper.d.ts

@@ -0,0 +1,35 @@
+import React from "react";
+import { type ButtonProps } from "../Button/Button";
+import { type MoveBy } from "../../types/MoveBy";
+import { type TooltipPositions } from "../Tooltip/Tooltip.types";
+export interface ButtonWrapperProps extends ButtonProps {
+    /**
+     * The content of the tooltip.
+     */
+    tooltipContent?: string;
+    /**
+     * The position of the tooltip relative to the button.
+     */
+    tooltipPosition?: TooltipPositions;
+    /**
+     * The delay in milliseconds before the tooltip hides.
+     */
+    tooltipHideDelay?: number;
+    /**
+     * The delay in milliseconds before the tooltip shows.
+     */
+    tooltipShowDelay?: number;
+    /**
+     * CSS selector for the tooltip container.
+     */
+    tooltipContainerSelector?: string;
+    /**
+     * Adjusts the tooltip position.
+     */
+    tooltipMoveBy?: MoveBy;
+    /**
+     * If true, makes the button take the full width of its container.
+     */
+    fullWidth?: boolean;
+}
+export declare const ButtonWrapper: ({ tooltipContent, tooltipPosition, tooltipHideDelay, tooltipShowDelay, tooltipContainerSelector, tooltipMoveBy, fullWidth, className, ...otherProps }: ButtonWrapperProps) => React.JSX.Element;

package/dist/components/ButtonGroup/index.d.ts

@@ -0,0 +1 @@
+export { default as ButtonGroup, type ButtonGroupProps } from "./ButtonGroup";

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,67 @@
+import React from "react";
+import { type VibeComponentProps } from "../../types";
+export interface CheckBoxProps extends VibeComponentProps {
+    /**
+     * Class name applied to the checkbox element.
+     */
+    checkboxClassName?: string;
+    /**
+     * Class name applied to the label element.
+     */
+    labelClassName?: string;
+    /**
+     * The label of the checkbox for accessibility.
+     */
+    ariaLabel?: string;
+    /**
+     * The content displayed next to the checkbox.
+     */
+    label?: React.ReactNode | Array<React.ReactNode>;
+    /**
+     * The ID of an element describing the checkbox.
+     */
+    ariaLabelledBy?: string;
+    /**
+     * Callback fired when the checkbox value changes.
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * If true, controls the checked state of the checkbox.
+     */
+    checked?: boolean;
+    /**
+     * If true, displays an indeterminate state.
+     */
+    indeterminate?: boolean;
+    /**
+     * If true, the checkbox automatically receives focus.
+     */
+    autoFocus?: boolean;
+    /**
+     * If true, the checkbox is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * The initial checked state of the checkbox.
+     */
+    defaultChecked?: boolean;
+    /**
+     * The value submitted with the form when checked.
+     */
+    value?: string;
+    /**
+     * The name of the checkbox, used for form submission.
+     */
+    name?: string;
+    /**
+     * The tab order of the checkbox.
+     */
+    tabIndex?: number;
+    /**
+     * If true, uses separate labels with htmlFor/id association instead of wrapping the input.
+     * If using this the id prop is required for it to function correctly.
+     */
+    separateLabel?: boolean;
+}
+declare const Checkbox: React.ForwardRefExoticComponent<CheckBoxProps & React.RefAttributes<HTMLInputElement>>;
+export default Checkbox;

package/dist/components/Checkbox/index.d.ts

@@ -0,0 +1 @@
+export { default as Checkbox, type CheckBoxProps as CheckboxProps } from "./Checkbox";

package/dist/components/Chips/Chips.d.ts

@@ -0,0 +1,161 @@
+import React from "react";
+import { type ElementAllowedColor } from "../../types/Colors";
+import { AvatarType as AvatarTypeEnum } from "../Avatar/AvatarConstants";
+import { type AvatarType } from "../Avatar";
+import { type ElementContent, type SubIcon, type VibeComponentProps } from "../../types";
+export interface ChipsProps extends VibeComponentProps {
+    /**
+     * The text or content displayed inside the chip.
+     */
+    label?: ElementContent;
+    /**
+     * If true, the chip is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * If true, the chip is read-only and cannot be deleted.
+     */
+    readOnly?: boolean;
+    /**
+     * A React element displayed on the right side.
+     */
+    rightRenderer?: ElementContent;
+    /**
+     * A React element displayed on the left side.
+     */
+    leftRenderer?: ElementContent;
+    /**
+     * Icon displayed on the right side.
+     */
+    rightIcon?: SubIcon;
+    /**
+     * Icon displayed on the left side.
+     */
+    leftIcon?: SubIcon;
+    /**
+     * Image URL or text for an avatar displayed on the right.
+     */
+    rightAvatar?: string;
+    /**
+     * The type of avatar displayed on the right.
+     */
+    rightAvatarType?: AvatarType;
+    /**
+     * Image URL or text for an avatar displayed on the left.
+     */
+    leftAvatar?: string;
+    /**
+     * The type of avatar displayed on the left.
+     */
+    leftAvatarType?: AvatarType;
+    /**
+     * Class name applied to left or right icons.
+     */
+    iconClassName?: string;
+    /**
+     * Class name applied to left or right avatars.
+     */
+    avatarClassName?: string;
+    /**
+     * The background color of the chip.
+     */
+    color?: Exclude<ElementAllowedColor, "dark_indigo" | "blackish">;
+    /**
+     * The size of the icons inside the chip.
+     */
+    iconSize?: number | string;
+    /**
+     * Callback fired when the chip is deleted.
+     */
+    onDelete?: (id: string, event: React.MouseEvent<HTMLSpanElement>) => void;
+    /**
+     * If true, disables the chip's entry animation.
+     */
+    noAnimation?: boolean;
+    /**
+     * If true, allows the user to select text inside the chip.
+     */
+    allowTextSelection?: boolean;
+    /**
+     * Callback fired when the mouse button is pressed on the chip.
+     */
+    onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    /**
+     * Callback fired when the chip is clicked.
+     */
+    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    /**
+     * The label of the chip for accessibility.
+     */
+    ariaLabel?: string;
+    /**
+     * If true, indicates that the chip has a popup.
+     */
+    ariaHasPopup?: boolean;
+    /**
+     * If true, disables all click behaviors.
+     */
+    disableClickableBehavior?: boolean;
+    /**
+     * If true, displays a border around the chip.
+     */
+    showBorder?: boolean;
+    /**
+     * The label for the close button.
+     */
+    closeButtonAriaLabel?: string;
+    /**
+     * If true, removes the default margin from the chip.
+     */
+    noMargin?: boolean;
+}
+declare const _default: React.ForwardRefExoticComponent<ChipsProps & React.RefAttributes<HTMLElement>> & {
+    colors: {
+        POSITIVE: import("../../utils/colors-vars-map").StateSelectedHoverColor.POSITIVE;
+        NEGATIVE: import("../../utils/colors-vars-map").StateSelectedHoverColor.NEGATIVE;
+        PRIMARY: import("../../utils/colors-vars-map").StateSelectedHoverColor.PRIMARY;
+        WARNING: import("../../utils/colors-vars-map").StateSelectedColor.WARNING;
+        GRASS_GREEN: import("../../utils/colors-vars-map").ContentColorByName.GRASS_GREEN;
+        DONE_GREEN: import("../../utils/colors-vars-map").ContentColorByName.DONE_GREEN;
+        BRIGHT_GREEN: import("../../utils/colors-vars-map").ContentColorByName.BRIGHT_GREEN;
+        SALADISH: import("../../utils/colors-vars-map").ContentColorByName.SALADISH;
+        EGG_YOLK: import("../../utils/colors-vars-map").ContentColorByName.EGG_YOLK;
+        WORKING_ORANGE: import("../../utils/colors-vars-map").ContentColorByName.WORKING_ORANGE;
+        DARK_ORANGE: import("../../utils/colors-vars-map").ContentColorByName.DARK_ORANGE;
+        PEACH: import("../../utils/colors-vars-map").ContentColorByName.PEACH;
+        SUNSET: import("../../utils/colors-vars-map").ContentColorByName.SUNSET;
+        STUCK_RED: import("../../utils/colors-vars-map").ContentColorByName.STUCK_RED;
+        DARK_RED: import("../../utils/colors-vars-map").ContentColorByName.DARK_RED;
+        SOFIA_PINK: import("../../utils/colors-vars-map").ContentColorByName.SOFIA_PINK;
+        LIPSTICK: import("../../utils/colors-vars-map").ContentColorByName.LIPSTICK;
+        BUBBLE: import("../../utils/colors-vars-map").ContentColorByName.BUBBLE;
+        PURPLE: import("../../utils/colors-vars-map").ContentColorByName.PURPLE;
+        DARK_PURPLE: import("../../utils/colors-vars-map").ContentColorByName.DARK_PURPLE;
+        BERRY: import("../../utils/colors-vars-map").ContentColorByName.BERRY;
+        DARK_INDIGO: import("../../utils/colors-vars-map").ContentColorByName.DARK_INDIGO;
+        INDIGO: import("../../utils/colors-vars-map").ContentColorByName.INDIGO;
+        NAVY: import("../../utils/colors-vars-map").ContentColorByName.NAVY;
+        BRIGHT_BLUE: import("../../utils/colors-vars-map").ContentColorByName.BRIGHT_BLUE;
+        DARK_BLUE: import("../../utils/colors-vars-map").ContentColorByName.DARK_BLUE;
+        AQUAMARINE: import("../../utils/colors-vars-map").ContentColorByName.AQUAMARINE;
+        CHILI_BLUE: import("../../utils/colors-vars-map").ContentColorByName.CHILI_BLUE;
+        RIVER: import("../../utils/colors-vars-map").ContentColorByName.RIVER;
+        WINTER: import("../../utils/colors-vars-map").ContentColorByName.WINTER;
+        EXPLOSIVE: import("../../utils/colors-vars-map").ContentColorByName.EXPLOSIVE;
+        AMERICAN_GRAY: import("../../utils/colors-vars-map").ContentColorByName.AMERICAN_GRAY;
+        BLACKISH: import("../../utils/colors-vars-map").ContentColorByName.BLACKISH;
+        BROWN: import("../../utils/colors-vars-map").ContentColorByName.BROWN;
+        ORCHID: import("../../utils/colors-vars-map").ContentColorByName.ORCHID;
+        TAN: import("../../utils/colors-vars-map").ContentColorByName.TAN;
+        SKY: import("../../utils/colors-vars-map").ContentColorByName.SKY;
+        COFFEE: import("../../utils/colors-vars-map").ContentColorByName.COFFEE;
+        ROYAL: import("../../utils/colors-vars-map").ContentColorByName.ROYAL;
+        TEAL: import("../../utils/colors-vars-map").ContentColorByName.TEAL;
+        LAVENDER: import("../../utils/colors-vars-map").ContentColorByName.LAVENDER;
+        STEEL: import("../../utils/colors-vars-map").ContentColorByName.STEEL;
+        LILAC: import("../../utils/colors-vars-map").ContentColorByName.LILAC;
+        PECAN: import("../../utils/colors-vars-map").ContentColorByName.PECAN;
+    };
+    avatarTypes: typeof AvatarTypeEnum;
+};
+export default _default;

package/dist/components/Chips/index.d.ts

@@ -0,0 +1 @@
+export { default as Chips, type ChipsProps } from "./Chips";

package/dist/components/Clickable/Clickable.d.ts

@@ -0,0 +1,66 @@
+import React, { type AriaRole } from "react";
+import { type VibeComponentProps } from "../../types";
+export interface ClickableProps extends VibeComponentProps {
+    /**
+     * The HTML element or custom component used as the root.
+     */
+    elementType?: keyof JSX.IntrinsicElements | string;
+    /**
+     * The content inside the clickable element.
+     */
+    children?: React.ReactNode;
+    /**
+     * The ARIA role of the element.
+     */
+    role?: AriaRole;
+    /**
+     * Callback fired when the element is clicked.
+     */
+    onClick?: (event: React.MouseEvent | React.KeyboardEvent) => void;
+    /**
+     * If true, allows text selection inside the element.
+     */
+    enableTextSelection?: boolean;
+    /**
+     * Callback fired when the mouse button is pressed down on the element.
+     */
+    onMouseDown?: (event: React.MouseEvent) => void;
+    /**
+     * Callback fired when the mouse enters the element.
+     */
+    onMouseEnter?: (event: React.MouseEvent) => void;
+    /**
+     * Callback fired when the mouse leaves the element.
+     */
+    onMouseLeave?: (event: React.MouseEvent) => void;
+    /**
+     * The label of the element for accessibility.
+     */
+    ariaLabel?: string;
+    /**
+     * If true, hides the element from assistive technologies.
+     */
+    ariaHidden?: boolean;
+    /**
+     * Indicates the presence of a popup associated with the element.
+     */
+    ariaHasPopup?: boolean | string;
+    /**
+     * If true, indicates that the associated popup is open.
+     */
+    ariaExpanded?: boolean;
+    /**
+     * The tab order of the element.
+     */
+    tabIndex?: string | number;
+    /**
+     * If true, the element is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Inline styles applied to the element.
+     */
+    style?: React.CSSProperties;
+}
+declare const Clickable: React.ForwardRefExoticComponent<ClickableProps & React.RefAttributes<HTMLElement>>;
+export default Clickable;

package/dist/components/Clickable/ClickableWrapper.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import { type VibeComponentProps } from "../../types";
+import { type ClickableProps } from "./Clickable";
+export interface ClickableWrapperProps extends VibeComponentProps {
+    /**
+     * The content inside the wrapper.
+     */
+    children: React.ReactNode;
+    /**
+     * If true, wraps the content in a `Clickable` component.
+     */
+    isClickable: boolean;
+    /**
+     * Props passed to the `Clickable` component.
+     */
+    clickableProps: ClickableProps;
+}
+declare const ClickableWrapper: React.ForwardRefExoticComponent<ClickableWrapperProps & React.RefAttributes<HTMLElement>>;
+export default ClickableWrapper;

package/dist/components/Clickable/index.d.ts

@@ -0,0 +1 @@
+export { default as Clickable, type ClickableProps } from "./Clickable";

package/dist/components/ColorPicker/ColorPicker.d.ts

@@ -0,0 +1,87 @@
+import React from "react";
+import { BaseSizes } from "../../constants";
+import { ColorStyle as ColorStyleEnum } from "../../utils/colors-vars-map";
+import { ColorShapes as ColorShapesEnum } from "./ColorPickerConstants";
+import { type ColorShapes, type ColorPickerSizes, type ColorPickerValue, type ColorPickerArrayValueOnly } from "./ColorPicker.types";
+import { type VibeComponentProps, type SubIcon } from "../../types";
+import { type ColorStyle } from "../../types/Colors";
+export interface ColorPickerProps extends VibeComponentProps {
+    /**
+     * The selected color(s).
+     */
+    value?: ColorPickerValue;
+    /**
+     * Callback fired when the selected color(s) change.
+     */
+    onSave?: (value: ColorPickerArrayValueOnly) => void;
+    /**
+     * Icon displayed as an indicator inside the color.
+     */
+    ColorIndicatorIcon?: SubIcon;
+    /**
+     * Icon displayed when a color is selected.
+     */
+    SelectedIndicatorIcon?: SubIcon;
+    /**
+     * Icon used for clearing the color selection.
+     */
+    NoColorIcon?: SubIcon;
+    /**
+     * The style applied to the colors.
+     */
+    colorStyle?: ColorStyle;
+    /**
+     * Text displayed for the "no color" option.
+     */
+    noColorText?: string;
+    /**
+     * If true, renders the color indicator without a background.
+     */
+    shouldRenderIndicatorWithoutBackground?: boolean;
+    /**
+     * If true, treats the color list as a blacklist rather than a whitelist.
+     */
+    isBlackListMode?: boolean;
+    /**
+     * The list of colors available for selection.
+     */
+    colorsList?: ColorPickerArrayValueOnly;
+    /**
+     * If true, allows selecting multiple colors.
+     */
+    isMultiselect?: boolean;
+    /**
+     * The size of the color items.
+     */
+    colorSize?: ColorPickerSizes;
+    /**
+     * The number of colors displayed per row.
+     */
+    numberOfColorsInLine?: number;
+    /**
+     * If true, the first color is focused when the component mounts.
+     */
+    focusOnMount?: boolean;
+    /**
+     * The shape of the color items.
+     */
+    colorShape?: ColorShapes;
+    /**
+     * Used to force the component render the colorList prop as is. Usually, this flag should not be used. It's intended only for edge cases.
+     * Usually, only "monday colors" will be rendered (unless blacklist mode is used). This flag will override this behavior.
+     */
+    forceUseRawColorList?: boolean;
+    /**
+     * Used to enable color name tooltip on each color in the component.
+     * When "tooltipContentByColor" is supplied, it will override the color name tooltip.
+     *
+     */
+    showColorNameTooltip?: boolean;
+}
+declare const _default: React.ForwardRefExoticComponent<ColorPickerProps & React.RefAttributes<HTMLElement>> & {
+    sizes: typeof BaseSizes;
+    colorStyles: typeof ColorStyleEnum;
+    colorSizes: typeof BaseSizes;
+    colorShapes: typeof ColorShapesEnum;
+};
+export default _default;

package/dist/components/ColorPicker/ColorPicker.types.d.ts

@@ -0,0 +1,6 @@
+import { type CONTENT_COLORS_VALUES } from "../../utils/colors-vars-map";
+export type ColorShapes = "square" | "circle";
+export type ColorPickerSizes = "small" | "medium" | "large";
+export type ColorPickerValueOnly = CONTENT_COLORS_VALUES | string;
+export type ColorPickerArrayValueOnly = CONTENT_COLORS_VALUES[] | string[];
+export type ColorPickerValue = ColorPickerValueOnly | ColorPickerArrayValueOnly;

package/dist/components/ColorPicker/ColorPickerConstants.d.ts

@@ -0,0 +1,12 @@
+import { type BaseSizes } from "../../constants/sizes";
+export declare const DEFAULT_NUMBER_OF_COLORS_IN_LINE = 5;
+export declare const COLOR_SIZES: Record<BaseSizes, number>;
+export declare const COLOR_PADDING = 8;
+export declare const DIALOG_WIDTH_PADDING = 24;
+/**
+ * @deprecated
+ */
+export declare enum ColorShapes {
+    SQUARE = "square",
+    CIRCLE = "circle"
+}

package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { type VibeComponentProps, type SubIcon } from "../../../../types";
+export interface ColorPickerClearButtonProps extends VibeComponentProps {
+    /**
+     * Callback fired when the clear button is clicked.
+     */
+    onClick: () => void;
+    /**
+     * The text displayed inside the button.
+     */
+    text?: string;
+    /**
+     * The icon displayed inside the button.
+     */
+    Icon: SubIcon;
+}
+declare const ColorPickerClearButton: React.ForwardRefExoticComponent<ColorPickerClearButtonProps & React.RefAttributes<HTMLElement>>;
+export default ColorPickerClearButton;

package/dist/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.d.ts

@@ -0,0 +1,62 @@
+import React from "react";
+import { type CONTENT_COLORS_VALUES } from "../../../../utils/colors-vars-map";
+import { type ColorPickerArrayValueOnly, type ColorPickerValueOnly } from "../../ColorPicker.types";
+import { type ColorShapes, type ColorPickerSizes } from "../../ColorPicker.types";
+import { type SubIcon, type VibeComponentProps } from "../../../../types";
+import { type ColorStyle } from "../../../../types";
+export interface ColorPickerColorsGridProps extends VibeComponentProps {
+    /**
+     * Callback fired when a color is clicked.
+     */
+    onColorClicked?: (color: ColorPickerValueOnly) => void;
+    /**
+     * The list of colors to be displayed.
+     */
+    colorsToRender?: ColorPickerArrayValueOnly;
+    /**
+     * Icon displayed as an indicator inside the color.
+     */
+    ColorIndicatorIcon?: SubIcon;
+    /**
+     * Icon displayed when a color is selected.
+     */
+    SelectedIndicatorIcon?: SubIcon;
+    /**
+     * The style applied to the colors.
+     */
+    colorStyle?: ColorStyle;
+    /**
+     * The currently selected color or colors.
+     */
+    value?: string | string[];
+    /**
+     * If true, renders the color indicator without a background.
+     */
+    shouldRenderIndicatorWithoutBackground?: boolean;
+    /**
+     * The size of the color items.
+     */
+    colorSize?: ColorPickerSizes;
+    /**
+     * The number of colors per row.
+     */
+    numberOfColorsInLine?: number;
+    /**
+     * Custom tooltip content for specific colors.
+     */
+    tooltipContentByColor?: Partial<Record<CONTENT_COLORS_VALUES, string> & Record<string, string>>;
+    /**
+     * If true, the first color is focused when the component mounts.
+     */
+    focusOnMount?: boolean;
+    /**
+     * The shape of the color items.
+     */
+    colorShape?: ColorShapes;
+    /**
+     * If true, displays a tooltip with the color name.
+     */
+    showColorNameTooltip?: boolean;
+}
+declare const ColorPickerColorsGrid: React.ForwardRefExoticComponent<ColorPickerColorsGridProps & React.RefAttributes<HTMLUListElement>>;
+export default ColorPickerColorsGrid;