@servicetitan/anvil2 3.14.0 → 3.15.0

package/dist/src/components/AiMark/AiMark.d.ts

@@ -1,87 +1,27 @@
 import { IconProps } from '../Icon';
 import { AiMarkCollapsePadding, AiMarkWithTooltipOrPopoverConfig } from '../../types/ai-marks';
 /**
- * Props for the AiMark component
- * @property {"default" | "gradient"} [type] - The visual style of the AI mark
- * @property {AiMarkWithTooltipOrPopoverConfig} [popoverOrTooltipConfig] - Configuration for popover or tooltip display with content and props
- * @property {boolean} [forceAnimate] - Forces the pulsing animation to play, intended for use within interactive parent components (e.g. on hover or focus of the parent)
- * @property {AiMarkCollapsePadding} [collapsePadding] - Collapses the component's layout footprint to match a plain icon on the chosen axes.
  * @extends Omit<IconProps, "svg">
  */
 export type AiMarkProps = Omit<IconProps, "svg"> & {
-    /**
-     * The visual style of the AI mark.
-     * @default default
-     */
+    /** Fill. Defaults to `default` (currentColor); `gradient` uses the mark gradient. */
     type?: "default" | "gradient";
     /**
-     * Configuration for popover or tooltip display.
-     * Includes content, trigger label, and optional props for customization.
-     * Popover config takes precedence over tooltip config.
+     * Tooltip or popover trigger. Omit for sparkle-only.
+     * See {@link AiMarkWithTooltipOrPopoverConfig}.
      */
     popoverOrTooltipConfig?: AiMarkWithTooltipOrPopoverConfig;
     /**
-     * When true, forces the pulsing morph animation to play regardless of
-     * hover/focus state. Useful when AiMark is embedded inside an interactive
-     * parent component (e.g. a Chip or Button) and the parent controls when
-     * the animation should be active via its own hover or focus state.
-     * @default false
+     * Plays the morph even when this mark is not hovered or focused. Defaults to
+     * `false`. Use when a parent owns hover/focus.
      */
     forceAnimate?: boolean;
-    /**
-     * Collapses padding on the chosen axes so the component's layout footprint
-     * matches a plain inline icon on those axes.
-     *
-     * For interactive variants (tooltip/popover), the ghost button's hit area is
-     * unchanged — only the container's layout box shrinks.
-     *
-     * For non-interactive variants, padding equal to the ghost button's padding is
-     * added to the non-collapsed axes, and omitted on the collapsed axes.
-     *
-     * - `"inline"` — collapse the inline axis (left/right)
-     * - `"block"` — collapse the block axis (top/bottom)
-     * - `"all"` — collapse both axes
-     */
+    /** Layout axes to collapse. See {@link AiMarkCollapsePadding}. */
     collapsePadding?: AiMarkCollapsePadding;
 };
 /**
- * Component for displaying the ServiceTitan AI mark with optional tooltip or popover.
- *
- * Features:
- * - Two visual styles: default and gradient variants
- * - Optional tooltip on hover for contextual information
- * - Optional popover on click for more detailed content
- * - Forced animation mode for use within interactive parent components
- * - Uses ghost button appearance for subtle interaction
- * - Inherits all icon properties for size and styling customization
- * - Accessible with proper ARIA attributes from Button component
- * - Prevents event propagation when used with popover
- * - Configurable via popoverOrTooltipConfig for advanced customization
- * - Optional `collapsePadding` to reduce layout footprint to match a plain icon
- * - Animates on hover and focus when used with tooltip or popover
- * - Automatically respects the user's reduced motion preference
- *
- * @example
- * <AiMark
- *   type="default"
- *   popoverOrTooltipConfig={{
- *     type: "tooltip",
- *     content: "Powered by AI",
- *     triggerLabel: "AI feature information"
- *   }}
- * />
- *
- * @example
- * <AiMark
- *   type="gradient"
- *   popoverOrTooltipConfig={{
- *     type: "popover",
- *     content: <Text>AI feature details</Text>,
- *     triggerLabel: "Learn about AI features"
- *   }}
- * />
- *
- * @example
- * <AiMark type="default" forceAnimate={isHovered} />
+ * ServiceTitan AI mark. With `popoverOrTooltipConfig` it is a ghost trigger;
+ * otherwise a non-interactive icon. Morph animation is skipped when the user
+ * prefers reduced motion.
  */
 export declare const AiMark: (props: AiMarkProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/AiMark/internal/AiMarkIconAnimated.d.ts

@@ -1,10 +1,3 @@
-/**
- * Props for the AiMarkIconAnimated component
- * @property {boolean} [animate] - Whether to trigger animations (on hover or focus)
- * @property {number} [size] - Size of the icon in pixels
- * @property {boolean} [inheritColor] - Whether to inherit color from parent instead of using gradient
- * @property {boolean} [spin] - Whether to enable the rotation animation in addition to the morph pulse
- */
 interface AiMarkIconAnimatedProps {
     animate?: boolean;
     size?: number;
@@ -12,19 +5,8 @@ interface AiMarkIconAnimatedProps {
     spin?: boolean;
 }
 /**
- * AiMarkIconAnimated renders two animated Atlas AI star icons with rotation and morph effects.
- *
- * Features:
- * - Displays two stars in different sizes positioned in a composition
- * - Animates morphing on hover
- * - Supports rotation animation via spin prop
- * - Supports gradient or inherited color
- * - Automatically respects reduced motion preferences
- * - Configurable size
- * - Unique gradient IDs prevent conflicts when multiple icons render
- *
- * @example
- * <AiMarkIconAnimated animate={isActive} size={24} />
+ * Two-star AI mark morph. Animation is skipped when the user prefers reduced
+ * motion.
  */
 export declare const AiMarkIconAnimated: ({ animate, size, inheritColor, spin, }: AiMarkIconAnimatedProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/components/AiMark/internal/AiMarkInteractive.d.ts

@@ -7,4 +7,8 @@ export type AiMarkInteractiveProps = {
     containerClassName: string;
     forceAnimate?: boolean;
 };
+/**
+ * Ghost-button trigger for tooltip or popover. Defaults the tooltip and
+ * popover copy when `content` is omitted.
+ */
 export declare const AiMarkInteractive: ({ config, size, inheritColor, containerClassName, forceAnimate, }: AiMarkInteractiveProps) => import("react/jsx-runtime").JSX.Element;

package/dist/src/components/Alert/Alert.d.ts

@@ -1,72 +1,28 @@
 import { ComponentPropsWithoutRef } from 'react';
 import { DataTrackingId, LayoutUtilProps, OnCloseProps, Status } from '../../types';
 import { AiMarkWithTooltipOrPopoverConfig } from '../../types/ai-marks';
-/**
- * Props for the Alert component
- * @extends ComponentPropsWithoutRef<"div">
- * @extends LayoutUtilProps
- * @extends OnCloseProps
- */
 export type AlertProps = ComponentPropsWithoutRef<"div"> & LayoutUtilProps & OnCloseProps & {
-    /**
-     * The visual style of an alert.
-     * @default info
-     */
+    /** Visual style. Defaults to `info`. */
     status?: Status;
-    /**
-     * The title text displayed in the alert.
-     */
+    /** Rendered as a small headline. Children go below as body copy. */
     title: string;
     /**
-     * When set, displays the AI mark inline after the title.
-     * Use `true` for the sparkle only, or pass tooltip/popover configuration.
+     * When set, shows the AI mark after the title.
+     * `true` is sparkle-only; pass tooltip/popover config for the richer mark.
      */
     aiMark?: boolean | AiMarkWithTooltipOrPopoverConfig;
-} /**
- * Data tracking id
- */ & DataTrackingId;
+} & DataTrackingId;
 /**
- * Alert component for displaying an inline banner message that communicates status to users — errors, warnings, success, or important information within page content.
- *
- * Features:
- * - Supports different visual styles (info, success, warning, danger)
- * - Optional close button for dismissible alerts
- * - Optional AI mark inline after the title
- * - Customizable title and content
- * - Accessible with proper ARIA roles
- * - Includes status-specific icons
- * - Supports layout utilities for positioning and spacing
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Alert
- *   title="System Update"
- *   onClose={() => console.log('Alert closed')}
- * >
- *   The system will be updated tonight.
- * </Alert>
- *
- * @example
- * <Alert
- *   status="success"
- *   title="Operation Complete"
- * >
- *   Your changes have been saved successfully.
- * </Alert>
+ * Inline status banner. Optional `onClose` makes it dismissible.
  */
 export declare const Alert: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & LayoutUtilProps & OnCloseProps & {
-    /**
-     * The visual style of an alert.
-     * @default info
-     */
+    /** Visual style. Defaults to `info`. */
     status?: Status;
-    /**
-     * The title text displayed in the alert.
-     */
+    /** Rendered as a small headline. Children go below as body copy. */
     title: string;
     /**
-     * When set, displays the AI mark inline after the title.
-     * Use `true` for the sparkle only, or pass tooltip/popover configuration.
+     * When set, shows the AI mark after the title.
+     * `true` is sparkle-only; pass tooltip/popover config for the richer mark.
      */
     aiMark?: boolean | AiMarkWithTooltipOrPopoverConfig;
 } & DataTrackingId & import('react').RefAttributes<HTMLDivElement>>;

package/dist/src/components/Announcement/Announcement.d.ts

@@ -1,60 +1,18 @@
 import { ComponentPropsWithoutRef } from 'react';
 import { DataTrackingId, LayoutUtilProps, OnCloseProps, Status } from '../../types';
-/**
- * Props for the Announcement component
- * @extends ComponentPropsWithoutRef<"div">
- * @extends Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">
- * @extends OnCloseProps
- */
 export type AnnouncementProps = ComponentPropsWithoutRef<"div"> & Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink"> & OnCloseProps & {
-    /**
-     * The visual style of the announcement.
-     * @default info
-     */
+    /** Visual style. Defaults to `info`. */
     status?: Status;
-    /**
-     * The title text displayed in the announcement.
-     */
+    /** Prominent heading next to the status icon. Children render after it. */
     title: string;
-} /**
- * Data tracking id
- */ & DataTrackingId;
+} & DataTrackingId;
 /**
- * Announcement component for displaying important messages to users.
- *
- * Features:
- * - Supports different visual styles (info, success, warning, danger)
- * - Optional close button for dismissible announcements
- * - Customizable title and content
- * - Accessible with proper ARIA roles
- * - Includes status-specific icons
- * - Supports layout utilities for positioning and spacing
- * - Includes data tracking capabilities
- *
- * @example
- * <Announcement
- *   title="New Feature"
- *   onClose={() => console.log('Announcement closed')}
- * >
- *   Check out our latest feature!
- * </Announcement>
- *
- * @example
- * <Announcement
- *   status="warning"
- *   title="Maintenance Notice"
- * >
- *   Scheduled maintenance will begin in 30 minutes.
- * </Announcement>
+ * Full-width status message with a large status icon. Optional `onClose` makes
+ * it dismissible.
  */
 export declare const Announcement: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Omit<LayoutUtilProps, "flex" | "flexGrow" | "flexShrink" | "flexBasis"> & OnCloseProps & {
-    /**
-     * The visual style of the announcement.
-     * @default info
-     */
+    /** Visual style. Defaults to `info`. */
     status?: Status;
-    /**
-     * The title text displayed in the announcement.
-     */
+    /** Prominent heading next to the status icon. Children render after it. */
     title: string;
 } & DataTrackingId & import('react').RefAttributes<HTMLDivElement>>;

package/dist/src/components/Avatar/Avatar.d.ts

@@ -1,56 +1,20 @@
 import { AvatarProps as CoreAvatarProps } from './internal/Avatar';
 import { DistributiveOmit } from '../../types';
 /**
- * Props for the Avatar component
- * @property {string} name - Full name used for alt text and screen reader
- * @property {string} [color] - Custom color of the Avatar
- * @property {string} [image] - Image source to be used for Avatar
- * @property {"small" | "medium" | "large"} [size] - Size of the Avatar
- * @property {"online" | "offline"} [status] - Online status of the Avatar
- * @extends ComponentPropsWithoutRef<"span">
- * @extends Omit<AvatarBaseProps, "initials">
- * @extends Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">
- * @extends DataTrackingId
+ * @extends DistributiveOmit<CoreAvatarProps, "size">
  */
 export type AvatarProps = DistributiveOmit<CoreAvatarProps, "size"> & {
+    /** Face size. Omits `xsmall`. Defaults to `medium`. `small` shows the first initial only. */
     size?: Extract<CoreAvatarProps["size"], "small" | "medium" | "large">;
 };
 /**
- * Avatar component for displaying user avatars with initials or images.
- *
- * Features:
- * - Displays user initials when no image is provided
- * - Supports custom colors and sizes
- * - Shows online/offline status
- * - Fully accessible with screen reader support
- * - Automatic image fallback handling
- * - Automatic tracking ID generation for analytics
- *
- * @example
- * <Avatar name="John Doe" size="medium" status="online" />
+ * Face with initials from `name`, or `image` when it loads.
  */
 export declare const Avatar: import('react').ForwardRefExoticComponent<Omit<CoreAvatarProps, "size"> & {
+    /** Face size. Omits `xsmall`. Defaults to `medium`. `small` shows the first initial only. */
     size?: Extract<CoreAvatarProps["size"], "small" | "medium" | "large">;
 } & import('react').RefAttributes<HTMLSpanElement>> & {
-    /**
-     * AvatarGroup component for displaying multiple avatars in a group.
-     *
-     * Features:
-     * - Displays multiple avatars in a stacked layout
-     * - Handles overflow with a count indicator
-     * - Maintains consistent sizing across all avatars
-     * - Supports custom styling and layout
-     * - Automatically adjusts z-index for proper stacking
-     * - Fully accessible with screen reader support
-     *
-     * @example
-     * <Avatar.Group max={3}>
-     *   <Avatar name="John Doe" />
-     *   <Avatar name="Jane Smith" />
-     *   <Avatar name="Bob Johnson" />
-     *   <Avatar name="Alice Brown" />
-     * </Avatar.Group>
-     */
+    /** Stacked avatars with an optional overflow count. */
     Group: import('react').ForwardRefExoticComponent<import('..').LayoutUtilProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
         max?: number;
     } & import('react').RefAttributes<HTMLSpanElement>>;

package/dist/src/components/Avatar/AvatarGroup.d.ts

@@ -1,39 +1,18 @@
 import { ComponentPropsWithoutRef } from 'react';
 import { LayoutUtilProps } from '../../types';
 /**
- * Props for the AvatarGroup component
- * @property {number} [max] - Maximum number of avatars to display before truncating
  * @extends LayoutUtilProps
  * @extends ComponentPropsWithoutRef<"span">
  */
 export type AvatarGroupProps = LayoutUtilProps & ComponentPropsWithoutRef<"span"> & {
-    /**
-     * Max child to show before truncating
-     */
+    /** Caps how many child avatars render. Omit to show all. Overflow uses a +N face. */
     max?: number;
 };
 /**
- * AvatarGroup component for displaying multiple avatars in a group.
- *
- * Features:
- * - Displays multiple avatars in a stacked layout
- * - Handles overflow with a count indicator
- * - Maintains consistent sizing across all avatars
- * - Supports custom styling and layout
- * - Automatically adjusts z-index for proper stacking
- * - Fully accessible with screen reader support
- *
- * @example
- * <Avatar.Group max={3}>
- *   <Avatar name="John Doe" />
- *   <Avatar name="Jane Smith" />
- *   <Avatar name="Bob Johnson" />
- *   <Avatar name="Alice Brown" />
- * </Avatar.Group>
+ * Stacked avatars with an optional overflow count. Size is taken from the first
+ * child, otherwise `medium`.
  */
 export declare const AvatarGroup: import('react').ForwardRefExoticComponent<LayoutUtilProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-    /**
-     * Max child to show before truncating
-     */
+    /** Caps how many child avatars render. Omit to show all. Overflow uses a +N face. */
     max?: number;
 } & import('react').RefAttributes<HTMLSpanElement>>;

package/dist/src/components/Avatar/internal/Avatar.d.ts

@@ -2,56 +2,13 @@ import { ComponentPropsWithoutRef } from 'react';
 import { LayoutUtilProps } from '../../../types';
 import { AvatarBaseProps } from './AvatarBase';
 /**
- * Props for the Avatar component
- * @property {string} name - Full name of the user. Used for alt text and screen reader announcements
- * @property {string} [color] - Custom color of the avatar. Should maintain sufficient contrast ratio for accessibility
- * @property {string} [image] - Image source to be used for avatar. Falls back to initials if image fails to load
- * @property {Extract<Size, "small" | "medium" | "large">} [size] - Size of the Avatar
- * @property {"online" | "offline"} [status] - Online status of the Avatar
  * @extends ComponentPropsWithoutRef<"span">
  * @extends Omit<AvatarBaseProps, "initials">
  * @extends Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">
  */
 export type AvatarProps = ComponentPropsWithoutRef<"span"> & Omit<AvatarBaseProps, "initials"> & Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">;
-/**
- * Avatar component for displaying user avatars with initials or images.
- *
- * Features:
- * - Displays user initials when no image is provided
- * - Supports custom colors and sizes
- * - Shows online/offline status
- * - Fully accessible with screen reader support
- * - Automatic image fallback handling
- * - Supports layout utilities for positioning and spacing
- *
- * @example
- * <Avatar
- *   name="John Doe"
- *   image="https://example.com/avatar.jpg"
- *   size="medium"
- *   status="online"
- * />
- */
+/** Internal face used by the public Avatar export. */
 export declare const Avatar: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & Omit<AvatarBaseProps, "initials"> & Omit<LayoutUtilProps, "flex" | "flexGrow" | "flexShrink" | "flexBasis"> & import('react').RefAttributes<HTMLSpanElement>> & {
-    /**
-     * AvatarGroup component for displaying multiple avatars in a group.
-     *
-     * Features:
-     * - Displays multiple avatars in a stacked layout
-     * - Handles overflow with a count indicator
-     * - Maintains consistent sizing across all avatars
-     * - Supports custom styling and layout
-     * - Automatically adjusts z-index for proper stacking
-     * - Fully accessible with screen reader support
-     *
-     * @example
-     * <Avatar.Group max={3}>
-     *   <Avatar name="John Doe" />
-     *   <Avatar name="Jane Smith" />
-     *   <Avatar name="Bob Johnson" />
-     *   <Avatar name="Alice Brown" />
-     * </Avatar.Group>
-     */
     Group: import('react').ForwardRefExoticComponent<LayoutUtilProps & Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
         max?: number;
     } & import('react').RefAttributes<HTMLSpanElement>>;

package/dist/src/components/Avatar/internal/AvatarBase.d.ts

@@ -1,75 +1,35 @@
 import { ComponentPropsWithoutRef } from 'react';
 import { LayoutUtilProps, Size } from '../../../types';
 /**
- * Props for the AvatarBase component
  * @extends ComponentPropsWithoutRef<"span">
  * @extends Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">
  */
 export type AvatarBaseProps = ComponentPropsWithoutRef<"span"> & Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink"> & {
-    /**
-     * Full name
-     * @accessibility This is used for alt text and Screenreader
-     */
+    /** Accessible name and image alt. */
     name: string;
-    /**
-     * Custom color of the AvatarBase
-     */
+    /** Custom face colors. Contrast is derived for the current theme. */
     color?: string;
-    /**
-     * Image source to be used for AvatarBase
-     */
+    /** Photo URL. On load error, falls back to initials (or "?"). */
     image?: string;
-    /**
-     * Initials to display if no image is provided
-     */
+    /** Shown when there is no usable image. Public Avatar derives this from `name`. */
     initials?: string;
-    /**
-     * @default medium
-     */
+    /** Face size. Defaults to `medium`. Internal AvatarBase also allows `xsmall`. */
     size?: Extract<Size, "xsmall" | "small" | "medium" | "large">;
-    /**
-     * Online status of the AvatarBase
-     */
+    /** Presence dot. Omit to hide it. */
     status?: "online" | "offline";
 };
-/**
- * Base Avatar component that handles the core avatar functionality.
- *
- * Features:
- * - Renders user avatars with images or initials
- * - Supports custom colors with accessible contrast
- * - Shows online/offline status indicator
- * - Handles image loading errors gracefully
- * - Supports light and dark themes
- * - Fully accessible with screen reader support
- *
- * @example
- * <AvatarBase name="John Doe" size="medium" status="online" />
- */
+/** Face primitive: image, initials, optional presence. */
 export declare const AvatarBase: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & Omit<LayoutUtilProps, "flex" | "flexGrow" | "flexShrink" | "flexBasis"> & {
-    /**
-     * Full name
-     * @accessibility This is used for alt text and Screenreader
-     */
+    /** Accessible name and image alt. */
     name: string;
-    /**
-     * Custom color of the AvatarBase
-     */
+    /** Custom face colors. Contrast is derived for the current theme. */
     color?: string;
-    /**
-     * Image source to be used for AvatarBase
-     */
+    /** Photo URL. On load error, falls back to initials (or "?"). */
     image?: string;
-    /**
-     * Initials to display if no image is provided
-     */
+    /** Shown when there is no usable image. Public Avatar derives this from `name`. */
     initials?: string;
-    /**
-     * @default medium
-     */
+    /** Face size. Defaults to `medium`. Internal AvatarBase also allows `xsmall`. */
     size?: Extract<Size, "xsmall" | "small" | "medium" | "large">;
-    /**
-     * Online status of the AvatarBase
-     */
+    /** Presence dot. Omit to hide it. */
     status?: "online" | "offline";
 } & import('react').RefAttributes<HTMLSpanElement>>;

package/dist/src/components/Badge/Badge.d.ts

@@ -1,58 +1,25 @@
 import { ComponentPropsWithoutRef } from 'react';
 import { LayoutUtilProps } from '../../types';
-/**
- * Props for the Badge component
- * @extends ComponentPropsWithoutRef<"sup">
- * @extends Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink">
- */
 export type BadgeProps = ComponentPropsWithoutRef<"sup"> & Omit<LayoutUtilProps, "flex" | "flexBasis" | "flexGrow" | "flexShrink"> & {
-    /**
-     * Optional offset configuration for badge positioning
-     */
+    /** Shift from the default superscript position. CSS length strings. */
     offset?: {
-        /**
-         * Horizontal offset from the default position
-         * @default "0px"
-         */
+        /** Horizontal shift. Defaults to no extra offset. */
         x?: string;
-        /**
-         * Vertical offset from the default position
-         * @default "0px"
-         */
+        /** Vertical shift. Defaults to no extra offset. */
         y?: string;
     };
 };
 /**
- * Badge component: a small count or status indicator — a numeric bubble, dot, or pill shown on an icon or element to convey unread counts, notifications, or status.
- *
- * Features:
- * - Positioned as a superscript element
- * - Customizable offset positioning
- * - Screen reader support with aria-label
- * - Empty state styling when no content
- * - Supports layout utilities for positioning
- * - Accessible with proper ARIA roles
- *
- * @example
- * <Button>
- *   Notifications
- *   <Badge aria-label="3 new messages">3</Badge>
- * </Button>
+ * Superscript count or status marker. With no children it renders as a dot.
+ * Pass `aria-label` for the accessible name; it is announced from visually
+ * hidden text rather than the host attribute, so it is not spoken twice.
  */
 export declare const Badge: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & Omit<LayoutUtilProps, "flex" | "flexGrow" | "flexShrink" | "flexBasis"> & {
-    /**
-     * Optional offset configuration for badge positioning
-     */
+    /** Shift from the default superscript position. CSS length strings. */
     offset?: {
-        /**
-         * Horizontal offset from the default position
-         * @default "0px"
-         */
+        /** Horizontal shift. Defaults to no extra offset. */
         x?: string;
-        /**
-         * Vertical offset from the default position
-         * @default "0px"
-         */
+        /** Vertical shift. Defaults to no extra offset. */
         y?: string;
     };
 } & import('react').RefAttributes<HTMLScriptElement>>;