@box/blueprint-web 8.5.3 → 8.6.0

package/lib-esm/accordion/accordion.d.ts

@@ -1,19 +1,19 @@
-import { type AccordionItemProps, type AccordionProps } from './types';
-/**
- * The root component that contains all the parts of a accordion.
- *
- * @example
- * <Accordion>
- *  <Accordion.Item value="item-1" title="Item 1"><div>1st item</div></Accordion.Item>
- *  <Accordion.Item value="item-2" title="Item 2"><div>2nd item</div></Accordion.Item>
- *  <Accordion.Item value="item-3" title="Item 3"><div>3rd item </div></Accordion.Item>
- * </Accordion>
- */
-export declare const Root: (props: AccordionProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Item: (props: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Accordion: ((props: AccordionProps) => import("react/jsx-runtime").JSX.Element) & {
-    /**
-     * The component that displays a Accordion item.
-     */
-    Item: (props: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
-};
+import { type AccordionItemProps, type AccordionProps } from './types';
+/**
+ * The root component that contains all the parts of a accordion.
+ *
+ * @example
+ * <Accordion>
+ *  <Accordion.Item value="item-1" title="Item 1"><div>1st item</div></Accordion.Item>
+ *  <Accordion.Item value="item-2" title="Item 2"><div>2nd item</div></Accordion.Item>
+ *  <Accordion.Item value="item-3" title="Item 3"><div>3rd item </div></Accordion.Item>
+ * </Accordion>
+ */
+export declare const Root: (props: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Item: (props: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Accordion: ((props: AccordionProps) => import("react/jsx-runtime").JSX.Element) & {
+    /**
+     * The component that displays a Accordion item.
+     */
+    Item: (props: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
+};

package/lib-esm/accordion/accordion.js

@@ -9,15 +9,15 @@ import { Status } from '../status/status.js';
 import { isDefined } from '../utils/isDefined.js';
 import styles from './accordion.module.js';
 
-/**
- * The root component that contains all the parts of a accordion.
- *
- * @example
- * <Accordion>
- *  <Accordion.Item value="item-1" title="Item 1"><div>1st item</div></Accordion.Item>
- *  <Accordion.Item value="item-2" title="Item 2"><div>2nd item</div></Accordion.Item>
- *  <Accordion.Item value="item-3" title="Item 3"><div>3rd item </div></Accordion.Item>
- * </Accordion>
+/**
+ * The root component that contains all the parts of a accordion.
+ *
+ * @example
+ * <Accordion>
+ *  <Accordion.Item value="item-1" title="Item 1"><div>1st item</div></Accordion.Item>
+ *  <Accordion.Item value="item-2" title="Item 2"><div>2nd item</div></Accordion.Item>
+ *  <Accordion.Item value="item-3" title="Item 3"><div>3rd item </div></Accordion.Item>
+ * </Accordion>
  */
 const Root = props => {
   return jsx(RadixAccordion.Root, {
@@ -115,8 +115,8 @@ const Item = props => {
   });
 };
 const Accordion = Object.assign(Root, {
-  /**
-   * The component that displays a Accordion item.
+  /**
+   * The component that displays a Accordion item.
    */
   Item
 });

package/lib-esm/accordion/index.d.ts

@@ -1,2 +1,2 @@
-export { Accordion } from './accordion';
-export type { AccordionFixedItem, AccordionItem, AccordionProps, AccordionSectionItem } from './types';
+export { Accordion } from './accordion';
+export type { AccordionFixedItem, AccordionItem, AccordionProps, AccordionSectionItem } from './types';

package/lib-esm/accordion/types.d.ts

@@ -1,49 +1,48 @@
-/// <reference types="react" />
-import { type AccordionMultipleProps, type AccordionSingleProps, type AccordionItemProps as RadixAccordionItemProps } from '@radix-ui/react-accordion';
-import { type RequireAllOrNone } from 'type-fest';
-interface Loading {
-    /** Loading state of the section. Loading sections are displaying a placeholder. When this is true `loadingAriaLabel` must also be provided. */
-    loading: boolean;
-    /** The aria-label for the ghost state. */
-    loadingAriaLabel: string;
-}
-interface Errorable {
-    /**
-     * Error message displayed in an InlineNotice
-     */
-    error?: string;
-    /**
-     * ARIA label for the icon inside the InlineNotice
-     */
-    errorIconAriaLabel?: string;
-}
-export type AccordionBaseItem = {
-    /**
-     * Content of the accordion item that is displayed when the section is expanded
-     */
-    children?: React.ReactNode;
-} & RequireAllOrNone<Loading, keyof Loading> & RequireAllOrNone<Errorable, keyof Errorable>;
-/**
- * Fixed sections are non-collapsible, have no title, only content, can't be disabled
- */
-export type AccordionFixedItem = AccordionBaseItem & {
-    fixed: true;
-};
-export type AccordionSectionItem = AccordionBaseItem & Omit<RadixAccordionItemProps, 'id'> & {
-    /**
-     * Header text displayed
-     */
-    title: string;
-    /**
-     * Number displayed in a status pill next to the title
-     * */
-    status?: number;
-    /**
-     * Disabled state of the section.
-     */
-    disabled?: boolean;
-};
-export type AccordionItem = AccordionSectionItem | AccordionFixedItem;
-export type AccordionItemProps = AccordionItem & React.ComponentPropsWithRef<'div'>;
-export type AccordionProps = (AccordionSingleProps | AccordionMultipleProps) & React.ComponentPropsWithRef<'div'>;
-export {};
+import { type AccordionMultipleProps, type AccordionSingleProps, type AccordionItemProps as RadixAccordionItemProps } from '@radix-ui/react-accordion';
+import { type RequireAllOrNone } from 'type-fest';
+interface Loading {
+    /** Loading state of the section. Loading sections are displaying a placeholder. When this is true `loadingAriaLabel` must also be provided. */
+    loading: boolean;
+    /** The aria-label for the ghost state. */
+    loadingAriaLabel: string;
+}
+interface Errorable {
+    /**
+     * Error message displayed in an InlineNotice
+     */
+    error?: string;
+    /**
+     * ARIA label for the icon inside the InlineNotice
+     */
+    errorIconAriaLabel?: string;
+}
+export type AccordionBaseItem = {
+    /**
+     * Content of the accordion item that is displayed when the section is expanded
+     */
+    children?: React.ReactNode;
+} & RequireAllOrNone<Loading, keyof Loading> & RequireAllOrNone<Errorable, keyof Errorable>;
+/**
+ * Fixed sections are non-collapsible, have no title, only content, can't be disabled
+ */
+export type AccordionFixedItem = AccordionBaseItem & {
+    fixed: true;
+};
+export type AccordionSectionItem = AccordionBaseItem & Omit<RadixAccordionItemProps, 'id'> & {
+    /**
+     * Header text displayed
+     */
+    title: string;
+    /**
+     * Number displayed in a status pill next to the title
+     * */
+    status?: number;
+    /**
+     * Disabled state of the section.
+     */
+    disabled?: boolean;
+};
+export type AccordionItem = AccordionSectionItem | AccordionFixedItem;
+export type AccordionItemProps = AccordionItem & React.ComponentPropsWithRef<'div'>;
+export type AccordionProps = (AccordionSingleProps | AccordionMultipleProps) & React.ComponentPropsWithRef<'div'>;
+export {};

package/lib-esm/actionable-inline-notice/actionable-inline-notice.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
-import { type ActionableInlineNoticeProps } from './types';
-export declare const ActionableInlineNotice: import("react").ForwardRefExoticComponent<ActionableInlineNoticeProps & import("react").RefAttributes<HTMLDivElement>>;
+import { type ActionableInlineNoticeProps } from './types';
+export declare const ActionableInlineNotice: import("react").ForwardRefExoticComponent<ActionableInlineNoticeProps & import("react").RefAttributes<HTMLDivElement>>;

package/lib-esm/actionable-inline-notice/index.d.ts

@@ -1,18 +1,17 @@
-/// <reference types="react" />
-export declare const ActionableInlineNotice: import("react").ForwardRefExoticComponent<import("./types").ActionableInlineNoticeProps & import("react").RefAttributes<HTMLDivElement>> & {
-    PrimaryAction: import("react").ForwardRefExoticComponent<(Omit<import("../primitives/base-button").BaseButtonInterface & Required<Pick<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
-        children: string;
-        className?: string | undefined;
-    }, "ref"> | Omit<import("../primitives/base-button").BaseButtonInterface & Partial<Record<keyof import("../primitives/base-button").Loading, never>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
-        children: string;
-        className?: string | undefined;
-    }, "ref">) & import("react").RefAttributes<HTMLButtonElement>>;
-    TertiaryAction: import("react").ForwardRefExoticComponent<(Omit<import("../primitives/base-button").BaseButtonInterface & Required<Pick<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
-        children: string;
-        className?: string | undefined;
-    }, "ref"> | Omit<import("../primitives/base-button").BaseButtonInterface & Partial<Record<keyof import("../primitives/base-button").Loading, never>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
-        children: string;
-        className?: string | undefined;
-    }, "ref">) & import("react").RefAttributes<HTMLButtonElement>>;
-};
-export * from './types';
+export declare const ActionableInlineNotice: import("react").ForwardRefExoticComponent<import("./types").ActionableInlineNoticeProps & import("react").RefAttributes<HTMLDivElement>> & {
+    PrimaryAction: import("react").ForwardRefExoticComponent<(Omit<import("../primitives/base-button").BaseButtonInterface & Required<Pick<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
+        children: string;
+        className?: string;
+    }, "ref"> | Omit<import("../primitives/base-button").BaseButtonInterface & Partial<Record<keyof import("../primitives/base-button").Loading, never>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
+        children: string;
+        className?: string;
+    }, "ref">) & import("react").RefAttributes<HTMLButtonElement>>;
+    TertiaryAction: import("react").ForwardRefExoticComponent<(Omit<import("../primitives/base-button").BaseButtonInterface & Required<Pick<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
+        children: string;
+        className?: string;
+    }, "ref"> | Omit<import("../primitives/base-button").BaseButtonInterface & Partial<Record<keyof import("../primitives/base-button").Loading, never>> & Omit<import("../primitives/base-button").Loading, keyof import("../primitives/base-button").Loading> & {
+        children: string;
+        className?: string;
+    }, "ref">) & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export * from './types';

package/lib-esm/actionable-inline-notice/types.d.ts

@@ -1,21 +1,21 @@
-import { type ReactElement } from 'react';
-import { type RequireAllOrNone } from 'type-fest';
-import { type BaseInlineNoticeProps, type ButtonProps } from '../primitives/base-inline-notice';
-export type ActionableInlineNoticeProps = {
-    /** Governs background color for inline notice
-     * @default backgroundBlue
-     */
-    backgroundColor?: Extract<BaseInlineNoticeProps['backgroundColor'], 'backgroundBlue' | 'backgroundPurple'>;
-    /** Text for the body of the inline notice */
-    text: string;
-    /** Optional children buttons for the inline notice CTA. Specify either PrimaryAction OR both TertiaryAction and PrimaryAction. */
-    children?: ReactElement<ButtonProps>;
-    /** Optional title for the inner text of the notice */
-    title?: string;
-} & RequireAllOrNone<Icon, keyof Icon>;
-export interface Icon {
-    /** Icon for notice */
-    icon: React.FunctionComponent<React.PropsWithChildren<React.SVGProps<SVGSVGElement>>>;
-    /** Icon aria label for notice when icon is provided */
-    iconAriaLabel: string;
-}
+import { type ReactElement } from 'react';
+import { type RequireAllOrNone } from 'type-fest';
+import { type BaseInlineNoticeProps, type ButtonProps } from '../primitives/base-inline-notice';
+export type ActionableInlineNoticeProps = {
+    /** Governs background color for inline notice
+     * @default backgroundBlue
+     */
+    backgroundColor?: Extract<BaseInlineNoticeProps['backgroundColor'], 'backgroundBlue' | 'backgroundPurple'>;
+    /** Text for the body of the inline notice */
+    text: string;
+    /** Optional children buttons for the inline notice CTA. Specify either PrimaryAction OR both TertiaryAction and PrimaryAction. */
+    children?: ReactElement<ButtonProps>;
+    /** Optional title for the inner text of the notice */
+    title?: string;
+} & RequireAllOrNone<Icon, keyof Icon>;
+export interface Icon {
+    /** Icon for notice */
+    icon: React.FunctionComponent<React.PropsWithChildren<React.SVGProps<SVGSVGElement>>>;
+    /** Icon aria label for notice when icon is provided */
+    iconAriaLabel: string;
+}

package/lib-esm/avatar/avatar.d.ts

@@ -1,30 +1,29 @@
-/// <reference types="react" />
-export declare const Avatar: import("react").ForwardRefExoticComponent<(Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
-    ref?: ((instance: HTMLImageElement | null) => void) | import("react").RefObject<HTMLImageElement> | null | undefined;
-} & {
-    anonymous?: boolean | undefined;
-    children?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    size?: "small" | "medium" | "large" | "xlarge" | "xxlarge" | undefined;
-    text?: string | undefined;
-} & Required<Pick<import("./types").Image, keyof import("./types").Image>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "color">> & Partial<Record<"colorIndex", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref"> | Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
-    ref?: ((instance: HTMLImageElement | null) => void) | import("react").RefObject<HTMLImageElement> | null | undefined;
-} & {
-    anonymous?: boolean | undefined;
-    children?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    size?: "small" | "medium" | "large" | "xlarge" | "xxlarge" | undefined;
-    text?: string | undefined;
-} & Required<Pick<import("./types").Image, keyof import("./types").Image>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "colorIndex">> & Partial<Record<"color", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref"> | Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
-    ref?: ((instance: HTMLImageElement | null) => void) | import("react").RefObject<HTMLImageElement> | null | undefined;
-} & {
-    anonymous?: boolean | undefined;
-    children?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    size?: "small" | "medium" | "large" | "xlarge" | "xxlarge" | undefined;
-    text?: string | undefined;
-} & Partial<Record<keyof import("./types").Image, never>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "color">> & Partial<Record<"colorIndex", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref"> | Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
-    ref?: ((instance: HTMLImageElement | null) => void) | import("react").RefObject<HTMLImageElement> | null | undefined;
-} & {
-    anonymous?: boolean | undefined;
-    children?: import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
-    size?: "small" | "medium" | "large" | "xlarge" | "xxlarge" | undefined;
-    text?: string | undefined;
-} & Partial<Record<keyof import("./types").Image, never>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "colorIndex">> & Partial<Record<"color", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref">) & import("react").RefAttributes<HTMLImageElement>>;
+export declare const Avatar: import("react").ForwardRefExoticComponent<(Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+    ref?: ((instance: HTMLImageElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLImageElement> | null | undefined;
+} & {
+    anonymous?: boolean;
+    children?: import("react").ReactElement;
+    size?: import("./types").AvatarSize;
+    text?: string;
+} & Required<Pick<import("./types").Image, keyof import("./types").Image>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "color">> & Partial<Record<"colorIndex", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref"> | Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+    ref?: ((instance: HTMLImageElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLImageElement> | null | undefined;
+} & {
+    anonymous?: boolean;
+    children?: import("react").ReactElement;
+    size?: import("./types").AvatarSize;
+    text?: string;
+} & Required<Pick<import("./types").Image, keyof import("./types").Image>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "colorIndex">> & Partial<Record<"color", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref"> | Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+    ref?: ((instance: HTMLImageElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLImageElement> | null | undefined;
+} & {
+    anonymous?: boolean;
+    children?: import("react").ReactElement;
+    size?: import("./types").AvatarSize;
+    text?: string;
+} & Partial<Record<keyof import("./types").Image, never>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "color">> & Partial<Record<"colorIndex", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref"> | Omit<Omit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, "ref"> & {
+    ref?: ((instance: HTMLImageElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLImageElement> | null | undefined;
+} & {
+    anonymous?: boolean;
+    children?: import("react").ReactElement;
+    size?: import("./types").AvatarSize;
+    text?: string;
+} & Partial<Record<keyof import("./types").Image, never>> & Omit<import("./types").Image, keyof import("./types").Image> & Required<Pick<import("./types").WithColor, "colorIndex">> & Partial<Record<"color", never>> & Omit<import("./types").WithColor, keyof import("./types").WithColor>, "ref">) & import("react").RefAttributes<HTMLImageElement>>;

package/lib-esm/avatar/consts.d.ts

@@ -1,6 +1,6 @@
-import { type AvatarSize, type Color } from './types';
-export declare const anonymousAvatarIconSizes: Record<AvatarSize, string>;
-export declare const AvatarSizes: readonly ["small", "medium", "large", "xlarge", "xxlarge"];
-export declare const badgeSizes: Record<AvatarSize, string>;
-export declare const colorsMap: Record<string, Color>;
-export declare const colors: string[];
+import { type AvatarSize, type Color } from './types';
+export declare const anonymousAvatarIconSizes: Record<AvatarSize, string>;
+export declare const AvatarSizes: readonly ["small", "medium", "large", "xlarge", "xxlarge"];
+export declare const badgeSizes: Record<AvatarSize, string>;
+export declare const colorsMap: Record<string, Color>;
+export declare const colors: string[];

package/lib-esm/avatar/index.d.ts

@@ -1,2 +1,2 @@
-export { Avatar } from './avatar';
-export { type AvatarProps } from './types';
+export { Avatar } from './avatar';
+export { type AvatarProps } from './types';

package/lib-esm/avatar/types.d.ts

@@ -1,36 +1,36 @@
-import { type BoxBlue50, type DarkBlue50, type GreenLight50, type Grimace50, type LightBlue50, type Orange50, type PurpleRain50, type WatermelonRed50, type Yellorange50, type Yellow50 } from '@box/blueprint-web-assets/tokens/tokens';
-import { type ReactElement } from 'react';
-import { type RequireAllOrNone, type RequireExactlyOne } from 'type-fest';
-import { type AvatarSizes } from './consts';
-export type AvatarSize = (typeof AvatarSizes)[number];
-export type Color = typeof BoxBlue50 | typeof DarkBlue50 | typeof Yellow50 | typeof GreenLight50 | typeof Yellorange50 | typeof LightBlue50 | typeof WatermelonRed50 | typeof PurpleRain50 | typeof Orange50 | typeof Grimace50;
-export interface Image {
-    /** The image to display. When the image is loading or if it fails to load, the fallback is displayed.
-     * The fallback is the text. If the text is not provided, the fallback is the anonymous user image.
-     */
-    src?: string;
-    /** The alt text for the image */
-    alt?: string;
-}
-export interface WithColor {
-    /** The color of the avatar background when displaying the letter or the number */
-    color?: Color;
-    /** The index of the color  of the avatar background when displaying the letter or the number.
-     * A convenience replacement for the color prop to facilitate providing a hash of the user data.
-     * It is ignored when the color prop is provided. */
-    colorIndex?: number;
-}
-export type AvatarProps = React.ComponentPropsWithRef<'img'> & {
-    /** Whether to display the anonymous user image */
-    anonymous?: boolean;
-    /** The badge element. This prop will be removed in a future major release. Please use IconBadge or StatusBadge components instead.
-     * @deprecated
-     */
-    children?: ReactElement;
-    /** The size of the avatar */
-    size?: AvatarSize;
-    /** The text to display, e.g. the user initial or the number of users editing the document.
-     *  Numbers can be formatted with formatNumber() that is exposed along with the Avatar component.
-     */
-    text?: string;
-} & RequireAllOrNone<Image, keyof Image> & RequireExactlyOne<WithColor, keyof WithColor>;
+import { type BoxBlue50, type DarkBlue50, type GreenLight50, type Grimace50, type LightBlue50, type Orange50, type PurpleRain50, type WatermelonRed50, type Yellorange50, type Yellow50 } from '@box/blueprint-web-assets/tokens/tokens';
+import { type ReactElement } from 'react';
+import { type RequireAllOrNone, type RequireExactlyOne } from 'type-fest';
+import { type AvatarSizes } from './consts';
+export type AvatarSize = (typeof AvatarSizes)[number];
+export type Color = typeof BoxBlue50 | typeof DarkBlue50 | typeof Yellow50 | typeof GreenLight50 | typeof Yellorange50 | typeof LightBlue50 | typeof WatermelonRed50 | typeof PurpleRain50 | typeof Orange50 | typeof Grimace50;
+export interface Image {
+    /** The image to display. When the image is loading or if it fails to load, the fallback is displayed.
+     * The fallback is the text. If the text is not provided, the fallback is the anonymous user image.
+     */
+    src?: string;
+    /** The alt text for the image */
+    alt?: string;
+}
+export interface WithColor {
+    /** The color of the avatar background when displaying the letter or the number */
+    color?: Color;
+    /** The index of the color  of the avatar background when displaying the letter or the number.
+     * A convenience replacement for the color prop to facilitate providing a hash of the user data.
+     * It is ignored when the color prop is provided. */
+    colorIndex?: number;
+}
+export type AvatarProps = React.ComponentPropsWithRef<'img'> & {
+    /** Whether to display the anonymous user image */
+    anonymous?: boolean;
+    /** The badge element. This prop will be removed in a future major release. Please use IconBadge or StatusBadge components instead.
+     * @deprecated
+     */
+    children?: ReactElement;
+    /** The size of the avatar */
+    size?: AvatarSize;
+    /** The text to display, e.g. the user initial or the number of users editing the document.
+     *  Numbers can be formatted with formatNumber() that is exposed along with the Avatar component.
+     */
+    text?: string;
+} & RequireAllOrNone<Image, keyof Image> & RequireExactlyOne<WithColor, keyof WithColor>;

package/lib-esm/badge/base-badge.d.ts

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { type BadgeProps } from './types';
-export type BaseBadgeProps = Omit<BadgeProps, 'children'> & {
-    /** The color of the badge background. */
-    backgroundColor: string;
-    className?: string;
-    /** The child element to display in the badge: string for NumericBadge and svg for IconBadge). */
-    children?: React.ReactElement;
-};
-export declare const BaseBadge: ({ backgroundColor, className, children, size, offset }: BaseBadgeProps) => import("react/jsx-runtime").JSX.Element;
+import { type BadgeProps } from './types';
+export type BaseBadgeProps = Omit<BadgeProps, 'children'> & {
+    /** The color of the badge background. */
+    backgroundColor: string;
+    className?: string;
+    /** The child element to display in the badge: string for NumericBadge and svg for IconBadge). */
+    children?: React.ReactElement;
+};
+export declare const BaseBadge: ({ backgroundColor, className, children, size, offset }: BaseBadgeProps) => import("react/jsx-runtime").JSX.Element;

package/lib-esm/badge/icon-badge.d.ts

@@ -1,7 +1,7 @@
-import { type BadgeProps } from './types';
-export interface IconBadgeProps extends BadgeProps {
-    /** The variant of the icon badge. */
-    variant: 'file-pdf' | 'file-docs' | 'file-sheets' | 'file-image' | 'file-canvas' | 'file-pages' | 'file-keynote' | 'file-boxnote' | 'file-video' | 'folder-external' | 'folder-shared' | 'action-relay' | 'action-mention' | 'action-task' | 'action-taskapproval' | 'action-annotation' | 'action-performed-completed' | 'action-performed-rejected' | 'collaborator-external' | 'collaborator-admin' | 'collaborator-coadmin' | 'content-pin' | 'content-collection' | 'content-offline' | 'content-progress' | 'alert-error';
-}
-export declare const IconBadgeVariants: ("file-pdf" | "file-docs" | "file-sheets" | "file-image" | "file-canvas" | "file-pages" | "file-keynote" | "file-boxnote" | "file-video" | "folder-external" | "folder-shared" | "action-relay" | "action-mention" | "action-task" | "action-taskapproval" | "action-annotation" | "action-performed-completed" | "action-performed-rejected" | "collaborator-external" | "collaborator-admin" | "collaborator-coadmin" | "content-pin" | "content-collection" | "content-offline" | "content-progress" | "alert-error")[];
-export declare const IconBadge: (props: IconBadgeProps) => import("react/jsx-runtime").JSX.Element;
+import { type BadgeProps } from './types';
+export interface IconBadgeProps extends BadgeProps {
+    /** The variant of the icon badge. */
+    variant: 'file-pdf' | 'file-docs' | 'file-sheets' | 'file-image' | 'file-canvas' | 'file-pages' | 'file-keynote' | 'file-boxnote' | 'file-video' | 'folder-external' | 'folder-shared' | 'action-relay' | 'action-mention' | 'action-task' | 'action-taskapproval' | 'action-annotation' | 'action-performed-completed' | 'action-performed-rejected' | 'collaborator-external' | 'collaborator-admin' | 'collaborator-coadmin' | 'content-pin' | 'content-collection' | 'content-offline' | 'content-progress' | 'alert-error';
+}
+export declare const IconBadgeVariants: Array<IconBadgeProps["variant"]>;
+export declare const IconBadge: (props: IconBadgeProps) => import("react/jsx-runtime").JSX.Element;

package/lib-esm/badge/index.d.ts

@@ -1,3 +1,3 @@
-export { IconBadge, type IconBadgeProps } from './icon-badge';
-export { NumericBadge, type NumericBadgeProps } from './numeric-badge';
-export { StatusBadge, type StatusBadgeProps } from './status-badge';
+export { IconBadge, type IconBadgeProps } from './icon-badge';
+export { NumericBadge, type NumericBadgeProps } from './numeric-badge';
+export { StatusBadge, type StatusBadgeProps } from './status-badge';

package/lib-esm/badge/numeric-badge.d.ts

@@ -1,11 +1,11 @@
-import React from 'react';
-import { type BadgeProps } from './types';
-export interface NumericBadgeProps extends Omit<BadgeProps, 'size' | 'children'> {
-    /** The numeric value to inform users of the total count. */
-    value: string;
-    /** Accepts exactly a single child component. Badge will be displayed over the child. */
-    children?: React.ReactElement;
-    /** The render prop must be passed in the case of a deeply nested child (e.g., the child is wrapped by a tooltip). */
-    render?(ariaDescribedBy: string, ref?: React.Ref<unknown>): React.ReactElement;
-}
-export declare const NumericBadge: React.ForwardRefExoticComponent<NumericBadgeProps & React.RefAttributes<unknown>>;
+import React from 'react';
+import { type BadgeProps } from './types';
+export interface NumericBadgeProps extends Omit<BadgeProps, 'size' | 'children'> {
+    /** The numeric value to inform users of the total count. */
+    value: string;
+    /** Accepts exactly a single child component. Badge will be displayed over the child. */
+    children?: React.ReactElement;
+    /** The render prop must be passed in the case of a deeply nested child (e.g., the child is wrapped by a tooltip). */
+    render?(ariaDescribedBy: string, ref?: React.Ref<unknown>): React.ReactElement;
+}
+export declare const NumericBadge: React.ForwardRefExoticComponent<NumericBadgeProps & React.RefAttributes<unknown>>;

package/lib-esm/badge/status-badge.d.ts

@@ -1,7 +1,7 @@
-import { type BadgeProps } from './types';
-export declare const StatusBadgeVariants: readonly ["online"];
-export interface StatusBadgeProps extends BadgeProps {
-    /** The variant for the status. */
-    variant: (typeof StatusBadgeVariants)[number];
-}
-export declare const StatusBadge: (props: StatusBadgeProps) => import("react/jsx-runtime").JSX.Element;
+import { type BadgeProps } from './types';
+export declare const StatusBadgeVariants: readonly ["online"];
+export interface StatusBadgeProps extends BadgeProps {
+    /** The variant for the status. */
+    variant: (typeof StatusBadgeVariants)[number];
+}
+export declare const StatusBadge: (props: StatusBadgeProps) => import("react/jsx-runtime").JSX.Element;

package/lib-esm/badge/types.d.ts

@@ -1,15 +1,15 @@
-import type React from 'react';
-export declare const BadgeSizes: readonly ["small", "medium", "large", "xlarge", "xxlarge"];
-export interface BadgeProps {
-    /** Accepts exactly a single child component. Badge will be displayed over the child. */
-    children: React.ReactElement;
-    /** The size of the badge */
-    size: (typeof BadgeSizes)[number];
-    /** The offset in pixels from the default position of the badge. Accepts positive and negative integers. */
-    offset?: {
-        top?: number;
-        right?: number;
-        bottom?: number;
-        left?: number;
-    };
-}
+import type React from 'react';
+export declare const BadgeSizes: readonly ["small", "medium", "large", "xlarge", "xxlarge"];
+export interface BadgeProps {
+    /** Accepts exactly a single child component. Badge will be displayed over the child. */
+    children: React.ReactElement;
+    /** The size of the badge */
+    size: (typeof BadgeSizes)[number];
+    /** The offset in pixels from the default position of the badge. Accepts positive and negative integers. */
+    offset?: {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+}

package/lib-esm/badge/utils/useSingleChildCheck.d.ts

@@ -1,2 +1,2 @@
-import React from 'react';
-export declare const useSingleChildCheck: (children: React.ReactNode) => void;
+import React from 'react';
+export declare const useSingleChildCheck: (children: React.ReactNode) => void;

package/lib-esm/branding-styles/branding-styles.d.ts

@@ -1,2 +1,2 @@
-import { type BrandingStylesProps } from './types';
-export declare const BrandingStyles: ({ brandColor }: BrandingStylesProps) => null;
+import { type BrandingStylesProps } from './types';
+export declare const BrandingStyles: ({ brandColor }: BrandingStylesProps) => null;

package/lib-esm/branding-styles/index.d.ts

@@ -1,3 +1,3 @@
-export * from './branding-styles';
-export * from './types';
-export * from './useCustomBranding';
+export * from './branding-styles';
+export * from './types';
+export * from './useCustomBranding';

package/lib-esm/branding-styles/types.d.ts

@@ -1,4 +1,4 @@
-export interface BrandingStylesProps {
-    /** Color value used for generating theme color palette */
-    brandColor: string;
-}
+export interface BrandingStylesProps {
+    /** Color value used for generating theme color palette */
+    brandColor: string;
+}

package/lib-esm/branding-styles/useCustomBranding.d.ts

@@ -1 +1 @@
-export declare const useCustomBranding: (brandColor: string) => void;
+export declare const useCustomBranding: (brandColor: string) => void;