@nurix/ui-component-library 1.1.4-stage.128 → 1.1.5-stage.129

package/dist/index.d.mts

@@ -2897,11 +2897,28 @@ interface SpinnerProps extends React$1.HTMLAttributes<HTMLDivElement> {
      * Custom className for the spinner container
      */
     className?: string;
+    /**
+     * Optional title shown beneath the spinner (Typography `label-md`,
+     * foreground black). Passing `title` or `texts` switches the spinner
+     * into composed loader mode (centered vertical stack, gap-3).
+     */
+    title?: string;
+    /**
+     * Optional list of sub-texts rotated every 2000ms beneath the title
+     * (Typography `subtext-xs`, muted tone). The rotation stops on the
+     * last item. Resets to index 0 when the array reference changes.
+     */
+    texts?: string[];
 }
 
 /**
  * Spinner component - Displays a loading spinner with size variations
  * Based on Figma design node: 3357:4429
+ *
+ * When `title` or `texts` is supplied, renders a composed loader layout:
+ * spinner + title (`label-md`) + rotating sub-text (`subtext-xs`, muted).
+ * Sub-texts advance every 2000ms and stop on the last item. With neither
+ * prop set, output is byte-identical to the legacy bare spinner.
  */
 declare const Spinner: React$1.ForwardRefExoticComponent<SpinnerProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -3418,6 +3435,55 @@ interface MultiSelectProps<T extends string = string> {
  */
 declare function MultiSelect<T extends string = string>({ value, onValueChange, items, placeholder, label, showSearch, searchPlaceholder, showSelectAll, size, bg, disabled, maxHeight, id, className, "data-testid": dataTestId, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
 
+interface ChipProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onClick"> {
+    /**
+     * Whether the chip is in the selected state. Selected chips use the
+     * brand-secondary background and brand text color.
+     * @default false
+     */
+    selected?: boolean;
+    /**
+     * Click handler. When omitted, the chip renders as a non-interactive
+     * `<div>` (no hover, no press scale) — useful for read-only displays.
+     */
+    onClick?: () => void;
+    /**
+     * Optional icon shown before the label. Sized to 16px by the chip's
+     * own `[&>svg]:size-4` rule, so consumers can pass a raw lucide icon
+     * without wrapping.
+     */
+    leadingIcon?: React$1.ReactNode;
+    /**
+     * Optional icon shown after the label — typically a remove `<X />`
+     * for filter-style chips.
+     */
+    trailingIcon?: React$1.ReactNode;
+    /**
+     * Disable interactions. Renders dim and ignores pointer events.
+     */
+    disabled?: boolean;
+    /**
+     * Optional `data-testid` for Playwright. Defaults to `"chip"`.
+     */
+    "data-testid"?: string;
+}
+
+/**
+ * Chip — small selectable pill with optional leading/trailing icons.
+ *
+ * Figma reference: 6332:23079.
+ *
+ * @example
+ *   <Chip selected={isOn} onClick={() => setIsOn((v) => !v)} leadingIcon={<GitCompare />}>
+ *     Uncle Chips
+ *   </Chip>
+ *
+ * When `onClick` is omitted, the chip renders as a non-interactive
+ * `<div>` (no hover tint, no press scale) so it doesn't read as
+ * clickable in read-only contexts.
+ */
+declare const Chip: React$1.ForwardRefExoticComponent<ChipProps & React$1.RefAttributes<HTMLButtonElement>>;
+
 interface RuleBuilderProps {
     /**
      * Badge label shown in the header (e.g. "Rule 1").
@@ -3563,4 +3629,4 @@ declare const RuleBuilderConnector: React$1.ForwardRefExoticComponent<RuleBuilde
  */
 declare const RuleBuilderAddCondition: React$1.ForwardRefExoticComponent<RuleBuilderAddConditionProps & React$1.RefAttributes<HTMLButtonElement>>;
 
-export { Accordion, AccordionContent, AccordionContentPlaceholder, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionSectionTrigger, type AccordionSectionTriggerProps, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionValue, AudioPlayer, type AudioPlayerProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarShape, type AvatarSize, type BackButtonPosition, Badge, type BadgeProps, type BadgeVariant, Button, type ButtonBorderRadius, ButtonList, type ButtonListItem, type ButtonListProps, type ButtonProps, type ButtonSize, type ButtonVariant, type CellContent, type CellTextContent, ChatBubbleAgent, type ChatBubbleAgentProps, ChatBubbleUser, type ChatBubbleUserProps, Checkbox, type CheckboxProps, type ColumnDef, ColumnWidth, CompoundFilterSelect, type CompoundFilterSelectProps, type CompoundFilterToggleOption, DEFAULT_THEME, DataTable, type DataTableProps, type DatePreset, Dialog, DialogBody, type DialogBodyProps, DialogFooter, type DialogFooterProps, DialogHeader, DialogHeaderNavigation, type DialogHeaderNavigationProps, type DialogHeaderNavigationVariant, type DialogHeaderProps, DialogIcon, type DialogIconProps, type DialogProps, type DialogSize, type DialogType, EmptyState, type EmptyStateIllustrationPosition, type EmptyStateIllustrationSize, type EmptyStateProps, FileInput, type FileInputProps, type FilterItem, type FilterItemWithSection, FilterListItem, type FilterListItemProps, FilterSelect, type FilterSelectProps, type IconColor, IconPicker, type IconPickerProps, type IconSize, IconWrapper, type IconWrapperProps, Input, type InputBorderRadius, type InputForceState, InputGroup, type InputGroupBorderRadius, type InputGroupForceState, type InputGroupProps, type InputProps, type InputVariant, JSON_EDITOR_LANGUAGE_OPTIONS, JsonEditor, type JsonEditorLanguage, type JsonEditorProps, KeyValueEditor, type KeyValueEditorProps, type KeyValuePair, LegoLandWrapper, type LegoLandWrapperProps, List, type ListBorderRadius, type ListNavItemProps, ListNavigation, type ListNavigationProps, type ListProps, type ListType, type ListVariant, MONACO_OPTIONS, MONACO_OPTIONS_DIALOG, MultiSelect, type MultiSelectItem, type MultiSelectProps, NestedButtonGroup, type NestedButtonGroupProps, NumberBadge, type NumberBadgeProps, type NumberBadgeVariant, NurixThemeProvider, Pagination, type PaginationProps, PlaySelect, type PlaySelectAudioItem, type PlaySelectProps, PlaybackControl, type PlaybackControlProps, type PlaybackState, Popover, type PopoverAlign, type PopoverProps, type PopoverShadow, type PopoverSide, ProgressBar, type ProgressBarProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RuleBuilder, RuleBuilderAddCondition, type RuleBuilderAddConditionProps, RuleBuilderClause, type RuleBuilderClauseProps, RuleBuilderCondition, type RuleBuilderConditionProps, RuleBuilderConnector, type RuleBuilderConnectorProps, type RuleBuilderProps, Select, SelectContent, type SelectContentItem, SelectFormLabel, SelectGroup, type SelectGroupProps, SelectItem, SelectLabel, type SelectLabelProps, type SelectMenuItemProps, type SelectProps, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, ShadowDOMWrapper, type ShowToastOptions, SidePanel, type SidePanelProps, type SidePanelSize, Slider, type SliderProps, type SortDirection, type SortState, Spinner, type SpinnerProps, type SpinnerSize, type StepItem, type StepState, Stepper, StepperBar, type StepperBarProps, type StepperProps, type SupportingTextType, Surface, type SurfaceBackground, SurfaceBody, type SurfaceBodyProps, SurfaceFooter, type SurfaceFooterProps, SurfaceHeader, type SurfaceHeaderProps, type SurfaceProps, Switch, type SwitchProps, type SwitchSize, type TabVariant, type TableAction, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, TagBadge, type TagBadgeProps, type TagOption, Textarea, type TextareaBorderRadius, type TextareaForceState, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Toggle, ToggleItem, type ToggleItemProps, type ToggleProps, type ToggleType, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyProps, type TypographySize, type TypographyTone, type TypographyVariant, type TypographyWeight, type UsePlaySelectProps, type UseSelectProps, enhanceJsonError, showToast, useJsonEditor, usePlaySelect, useSelect, useTheme };
+export { Accordion, AccordionContent, AccordionContentPlaceholder, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionSectionTrigger, type AccordionSectionTriggerProps, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionValue, AudioPlayer, type AudioPlayerProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarShape, type AvatarSize, type BackButtonPosition, Badge, type BadgeProps, type BadgeVariant, Button, type ButtonBorderRadius, ButtonList, type ButtonListItem, type ButtonListProps, type ButtonProps, type ButtonSize, type ButtonVariant, type CellContent, type CellTextContent, ChatBubbleAgent, type ChatBubbleAgentProps, ChatBubbleUser, type ChatBubbleUserProps, Checkbox, type CheckboxProps, Chip, type ChipProps, type ColumnDef, ColumnWidth, CompoundFilterSelect, type CompoundFilterSelectProps, type CompoundFilterToggleOption, DEFAULT_THEME, DataTable, type DataTableProps, type DatePreset, Dialog, DialogBody, type DialogBodyProps, DialogFooter, type DialogFooterProps, DialogHeader, DialogHeaderNavigation, type DialogHeaderNavigationProps, type DialogHeaderNavigationVariant, type DialogHeaderProps, DialogIcon, type DialogIconProps, type DialogProps, type DialogSize, type DialogType, EmptyState, type EmptyStateIllustrationPosition, type EmptyStateIllustrationSize, type EmptyStateProps, FileInput, type FileInputProps, type FilterItem, type FilterItemWithSection, FilterListItem, type FilterListItemProps, FilterSelect, type FilterSelectProps, type IconColor, IconPicker, type IconPickerProps, type IconSize, IconWrapper, type IconWrapperProps, Input, type InputBorderRadius, type InputForceState, InputGroup, type InputGroupBorderRadius, type InputGroupForceState, type InputGroupProps, type InputProps, type InputVariant, JSON_EDITOR_LANGUAGE_OPTIONS, JsonEditor, type JsonEditorLanguage, type JsonEditorProps, KeyValueEditor, type KeyValueEditorProps, type KeyValuePair, LegoLandWrapper, type LegoLandWrapperProps, List, type ListBorderRadius, type ListNavItemProps, ListNavigation, type ListNavigationProps, type ListProps, type ListType, type ListVariant, MONACO_OPTIONS, MONACO_OPTIONS_DIALOG, MultiSelect, type MultiSelectItem, type MultiSelectProps, NestedButtonGroup, type NestedButtonGroupProps, NumberBadge, type NumberBadgeProps, type NumberBadgeVariant, NurixThemeProvider, Pagination, type PaginationProps, PlaySelect, type PlaySelectAudioItem, type PlaySelectProps, PlaybackControl, type PlaybackControlProps, type PlaybackState, Popover, type PopoverAlign, type PopoverProps, type PopoverShadow, type PopoverSide, ProgressBar, type ProgressBarProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RuleBuilder, RuleBuilderAddCondition, type RuleBuilderAddConditionProps, RuleBuilderClause, type RuleBuilderClauseProps, RuleBuilderCondition, type RuleBuilderConditionProps, RuleBuilderConnector, type RuleBuilderConnectorProps, type RuleBuilderProps, Select, SelectContent, type SelectContentItem, SelectFormLabel, SelectGroup, type SelectGroupProps, SelectItem, SelectLabel, type SelectLabelProps, type SelectMenuItemProps, type SelectProps, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, ShadowDOMWrapper, type ShowToastOptions, SidePanel, type SidePanelProps, type SidePanelSize, Slider, type SliderProps, type SortDirection, type SortState, Spinner, type SpinnerProps, type SpinnerSize, type StepItem, type StepState, Stepper, StepperBar, type StepperBarProps, type StepperProps, type SupportingTextType, Surface, type SurfaceBackground, SurfaceBody, type SurfaceBodyProps, SurfaceFooter, type SurfaceFooterProps, SurfaceHeader, type SurfaceHeaderProps, type SurfaceProps, Switch, type SwitchProps, type SwitchSize, type TabVariant, type TableAction, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, TagBadge, type TagBadgeProps, type TagOption, Textarea, type TextareaBorderRadius, type TextareaForceState, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Toggle, ToggleItem, type ToggleItemProps, type ToggleProps, type ToggleType, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyProps, type TypographySize, type TypographyTone, type TypographyVariant, type TypographyWeight, type UsePlaySelectProps, type UseSelectProps, enhanceJsonError, showToast, useJsonEditor, usePlaySelect, useSelect, useTheme };

package/dist/index.d.ts

@@ -2897,11 +2897,28 @@ interface SpinnerProps extends React$1.HTMLAttributes<HTMLDivElement> {
      * Custom className for the spinner container
      */
     className?: string;
+    /**
+     * Optional title shown beneath the spinner (Typography `label-md`,
+     * foreground black). Passing `title` or `texts` switches the spinner
+     * into composed loader mode (centered vertical stack, gap-3).
+     */
+    title?: string;
+    /**
+     * Optional list of sub-texts rotated every 2000ms beneath the title
+     * (Typography `subtext-xs`, muted tone). The rotation stops on the
+     * last item. Resets to index 0 when the array reference changes.
+     */
+    texts?: string[];
 }
 
 /**
  * Spinner component - Displays a loading spinner with size variations
  * Based on Figma design node: 3357:4429
+ *
+ * When `title` or `texts` is supplied, renders a composed loader layout:
+ * spinner + title (`label-md`) + rotating sub-text (`subtext-xs`, muted).
+ * Sub-texts advance every 2000ms and stop on the last item. With neither
+ * prop set, output is byte-identical to the legacy bare spinner.
  */
 declare const Spinner: React$1.ForwardRefExoticComponent<SpinnerProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -3418,6 +3435,55 @@ interface MultiSelectProps<T extends string = string> {
  */
 declare function MultiSelect<T extends string = string>({ value, onValueChange, items, placeholder, label, showSearch, searchPlaceholder, showSelectAll, size, bg, disabled, maxHeight, id, className, "data-testid": dataTestId, }: MultiSelectProps<T>): react_jsx_runtime.JSX.Element;
 
+interface ChipProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "onClick"> {
+    /**
+     * Whether the chip is in the selected state. Selected chips use the
+     * brand-secondary background and brand text color.
+     * @default false
+     */
+    selected?: boolean;
+    /**
+     * Click handler. When omitted, the chip renders as a non-interactive
+     * `<div>` (no hover, no press scale) — useful for read-only displays.
+     */
+    onClick?: () => void;
+    /**
+     * Optional icon shown before the label. Sized to 16px by the chip's
+     * own `[&>svg]:size-4` rule, so consumers can pass a raw lucide icon
+     * without wrapping.
+     */
+    leadingIcon?: React$1.ReactNode;
+    /**
+     * Optional icon shown after the label — typically a remove `<X />`
+     * for filter-style chips.
+     */
+    trailingIcon?: React$1.ReactNode;
+    /**
+     * Disable interactions. Renders dim and ignores pointer events.
+     */
+    disabled?: boolean;
+    /**
+     * Optional `data-testid` for Playwright. Defaults to `"chip"`.
+     */
+    "data-testid"?: string;
+}
+
+/**
+ * Chip — small selectable pill with optional leading/trailing icons.
+ *
+ * Figma reference: 6332:23079.
+ *
+ * @example
+ *   <Chip selected={isOn} onClick={() => setIsOn((v) => !v)} leadingIcon={<GitCompare />}>
+ *     Uncle Chips
+ *   </Chip>
+ *
+ * When `onClick` is omitted, the chip renders as a non-interactive
+ * `<div>` (no hover tint, no press scale) so it doesn't read as
+ * clickable in read-only contexts.
+ */
+declare const Chip: React$1.ForwardRefExoticComponent<ChipProps & React$1.RefAttributes<HTMLButtonElement>>;
+
 interface RuleBuilderProps {
     /**
      * Badge label shown in the header (e.g. "Rule 1").
@@ -3563,4 +3629,4 @@ declare const RuleBuilderConnector: React$1.ForwardRefExoticComponent<RuleBuilde
  */
 declare const RuleBuilderAddCondition: React$1.ForwardRefExoticComponent<RuleBuilderAddConditionProps & React$1.RefAttributes<HTMLButtonElement>>;
 
-export { Accordion, AccordionContent, AccordionContentPlaceholder, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionSectionTrigger, type AccordionSectionTriggerProps, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionValue, AudioPlayer, type AudioPlayerProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarShape, type AvatarSize, type BackButtonPosition, Badge, type BadgeProps, type BadgeVariant, Button, type ButtonBorderRadius, ButtonList, type ButtonListItem, type ButtonListProps, type ButtonProps, type ButtonSize, type ButtonVariant, type CellContent, type CellTextContent, ChatBubbleAgent, type ChatBubbleAgentProps, ChatBubbleUser, type ChatBubbleUserProps, Checkbox, type CheckboxProps, type ColumnDef, ColumnWidth, CompoundFilterSelect, type CompoundFilterSelectProps, type CompoundFilterToggleOption, DEFAULT_THEME, DataTable, type DataTableProps, type DatePreset, Dialog, DialogBody, type DialogBodyProps, DialogFooter, type DialogFooterProps, DialogHeader, DialogHeaderNavigation, type DialogHeaderNavigationProps, type DialogHeaderNavigationVariant, type DialogHeaderProps, DialogIcon, type DialogIconProps, type DialogProps, type DialogSize, type DialogType, EmptyState, type EmptyStateIllustrationPosition, type EmptyStateIllustrationSize, type EmptyStateProps, FileInput, type FileInputProps, type FilterItem, type FilterItemWithSection, FilterListItem, type FilterListItemProps, FilterSelect, type FilterSelectProps, type IconColor, IconPicker, type IconPickerProps, type IconSize, IconWrapper, type IconWrapperProps, Input, type InputBorderRadius, type InputForceState, InputGroup, type InputGroupBorderRadius, type InputGroupForceState, type InputGroupProps, type InputProps, type InputVariant, JSON_EDITOR_LANGUAGE_OPTIONS, JsonEditor, type JsonEditorLanguage, type JsonEditorProps, KeyValueEditor, type KeyValueEditorProps, type KeyValuePair, LegoLandWrapper, type LegoLandWrapperProps, List, type ListBorderRadius, type ListNavItemProps, ListNavigation, type ListNavigationProps, type ListProps, type ListType, type ListVariant, MONACO_OPTIONS, MONACO_OPTIONS_DIALOG, MultiSelect, type MultiSelectItem, type MultiSelectProps, NestedButtonGroup, type NestedButtonGroupProps, NumberBadge, type NumberBadgeProps, type NumberBadgeVariant, NurixThemeProvider, Pagination, type PaginationProps, PlaySelect, type PlaySelectAudioItem, type PlaySelectProps, PlaybackControl, type PlaybackControlProps, type PlaybackState, Popover, type PopoverAlign, type PopoverProps, type PopoverShadow, type PopoverSide, ProgressBar, type ProgressBarProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RuleBuilder, RuleBuilderAddCondition, type RuleBuilderAddConditionProps, RuleBuilderClause, type RuleBuilderClauseProps, RuleBuilderCondition, type RuleBuilderConditionProps, RuleBuilderConnector, type RuleBuilderConnectorProps, type RuleBuilderProps, Select, SelectContent, type SelectContentItem, SelectFormLabel, SelectGroup, type SelectGroupProps, SelectItem, SelectLabel, type SelectLabelProps, type SelectMenuItemProps, type SelectProps, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, ShadowDOMWrapper, type ShowToastOptions, SidePanel, type SidePanelProps, type SidePanelSize, Slider, type SliderProps, type SortDirection, type SortState, Spinner, type SpinnerProps, type SpinnerSize, type StepItem, type StepState, Stepper, StepperBar, type StepperBarProps, type StepperProps, type SupportingTextType, Surface, type SurfaceBackground, SurfaceBody, type SurfaceBodyProps, SurfaceFooter, type SurfaceFooterProps, SurfaceHeader, type SurfaceHeaderProps, type SurfaceProps, Switch, type SwitchProps, type SwitchSize, type TabVariant, type TableAction, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, TagBadge, type TagBadgeProps, type TagOption, Textarea, type TextareaBorderRadius, type TextareaForceState, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Toggle, ToggleItem, type ToggleItemProps, type ToggleProps, type ToggleType, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyProps, type TypographySize, type TypographyTone, type TypographyVariant, type TypographyWeight, type UsePlaySelectProps, type UseSelectProps, enhanceJsonError, showToast, useJsonEditor, usePlaySelect, useSelect, useTheme };
+export { Accordion, AccordionContent, AccordionContentPlaceholder, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionSectionTrigger, type AccordionSectionTriggerProps, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionValue, AudioPlayer, type AudioPlayerProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarShape, type AvatarSize, type BackButtonPosition, Badge, type BadgeProps, type BadgeVariant, Button, type ButtonBorderRadius, ButtonList, type ButtonListItem, type ButtonListProps, type ButtonProps, type ButtonSize, type ButtonVariant, type CellContent, type CellTextContent, ChatBubbleAgent, type ChatBubbleAgentProps, ChatBubbleUser, type ChatBubbleUserProps, Checkbox, type CheckboxProps, Chip, type ChipProps, type ColumnDef, ColumnWidth, CompoundFilterSelect, type CompoundFilterSelectProps, type CompoundFilterToggleOption, DEFAULT_THEME, DataTable, type DataTableProps, type DatePreset, Dialog, DialogBody, type DialogBodyProps, DialogFooter, type DialogFooterProps, DialogHeader, DialogHeaderNavigation, type DialogHeaderNavigationProps, type DialogHeaderNavigationVariant, type DialogHeaderProps, DialogIcon, type DialogIconProps, type DialogProps, type DialogSize, type DialogType, EmptyState, type EmptyStateIllustrationPosition, type EmptyStateIllustrationSize, type EmptyStateProps, FileInput, type FileInputProps, type FilterItem, type FilterItemWithSection, FilterListItem, type FilterListItemProps, FilterSelect, type FilterSelectProps, type IconColor, IconPicker, type IconPickerProps, type IconSize, IconWrapper, type IconWrapperProps, Input, type InputBorderRadius, type InputForceState, InputGroup, type InputGroupBorderRadius, type InputGroupForceState, type InputGroupProps, type InputProps, type InputVariant, JSON_EDITOR_LANGUAGE_OPTIONS, JsonEditor, type JsonEditorLanguage, type JsonEditorProps, KeyValueEditor, type KeyValueEditorProps, type KeyValuePair, LegoLandWrapper, type LegoLandWrapperProps, List, type ListBorderRadius, type ListNavItemProps, ListNavigation, type ListNavigationProps, type ListProps, type ListType, type ListVariant, MONACO_OPTIONS, MONACO_OPTIONS_DIALOG, MultiSelect, type MultiSelectItem, type MultiSelectProps, NestedButtonGroup, type NestedButtonGroupProps, NumberBadge, type NumberBadgeProps, type NumberBadgeVariant, NurixThemeProvider, Pagination, type PaginationProps, PlaySelect, type PlaySelectAudioItem, type PlaySelectProps, PlaybackControl, type PlaybackControlProps, type PlaybackState, Popover, type PopoverAlign, type PopoverProps, type PopoverShadow, type PopoverSide, ProgressBar, type ProgressBarProps, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, RuleBuilder, RuleBuilderAddCondition, type RuleBuilderAddConditionProps, RuleBuilderClause, type RuleBuilderClauseProps, RuleBuilderCondition, type RuleBuilderConditionProps, RuleBuilderConnector, type RuleBuilderConnectorProps, type RuleBuilderProps, Select, SelectContent, type SelectContentItem, SelectFormLabel, SelectGroup, type SelectGroupProps, SelectItem, SelectLabel, type SelectLabelProps, type SelectMenuItemProps, type SelectProps, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, ShadowDOMWrapper, type ShowToastOptions, SidePanel, type SidePanelProps, type SidePanelSize, Slider, type SliderProps, type SortDirection, type SortState, Spinner, type SpinnerProps, type SpinnerSize, type StepItem, type StepState, Stepper, StepperBar, type StepperBarProps, type StepperProps, type SupportingTextType, Surface, type SurfaceBackground, SurfaceBody, type SurfaceBodyProps, SurfaceFooter, type SurfaceFooterProps, SurfaceHeader, type SurfaceHeaderProps, type SurfaceProps, Switch, type SwitchProps, type SwitchSize, type TabVariant, type TableAction, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, TagBadge, type TagBadgeProps, type TagOption, Textarea, type TextareaBorderRadius, type TextareaForceState, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Toggle, ToggleItem, type ToggleItemProps, type ToggleProps, type ToggleType, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyProps, type TypographySize, type TypographyTone, type TypographyVariant, type TypographyWeight, type UsePlaySelectProps, type UseSelectProps, enhanceJsonError, showToast, useJsonEditor, usePlaySelect, useSelect, useTheme };

package/dist/index.js

@@ -6500,6 +6500,7 @@ __export(index_exports, {
   ChatBubbleAgent: () => ChatBubbleAgent,
   ChatBubbleUser: () => ChatBubbleUser,
   Checkbox: () => Checkbox,
+  Chip: () => Chip,
   ColumnWidth: () => ColumnWidth,
   CompoundFilterSelect: () => CompoundFilterSelect,
   DEFAULT_THEME: () => DEFAULT_THEME,
@@ -8006,11 +8007,19 @@ var SliderPrimitive = __toESM(require("@radix-ui/react-slider"));
 
 // src/slider/variables.ts
 var SLIDER_TOKENS = {
-  root: "relative flex w-full touch-none select-none items-center py-2",
-  rootDisabled: "opacity-50 cursor-not-allowed",
-  track: "relative h-2 w-full grow overflow-hidden rounded-full bg-token-grey",
+  root: "group relative flex w-full touch-none select-none items-center py-2",
+  // `pointer-events-none` suppresses the hover/pressed visuals when the
+  // slider is disabled — otherwise hovering a 50%-opacity slider would
+  // still tint the track and a stuck "pressed" thumb width would persist.
+  rootDisabled: "opacity-50 cursor-not-allowed pointer-events-none",
+  // `before` element hosts the hover overlay so we can transition the
+  // overlay opacity independently of the pressed-state background swap.
+  track: "relative h-2 w-full grow overflow-hidden rounded-full bg-token-grey transition-colors before:content-[''] before:absolute before:inset-0 before:rounded-full before:bg-black/5 before:opacity-0 before:pointer-events-none before:transition-opacity group-hover:before:opacity-100 group-active:bg-token-dark-grey group-active:before:opacity-0",
   range: "absolute h-full rounded-full bg-token-brand-primary",
-  thumb: "block h-5 w-5 rounded-full bg-token-white border border-token-xlight shadow-[0px_1px_3px_0px_rgba(0,0,0,0.1)] transition-shadow focus-visible:outline focus-visible:outline-2 focus-visible:outline-token-brand focus-visible:outline-offset-2 disabled:pointer-events-none",
+  // Width transitions on press so the 20→28px swap doesn't snap. Radix
+  // applies `translateX(-50%)` to the thumb, so it stays centered on the
+  // current value as it widens.
+  thumb: "block h-5 w-5 rounded-full bg-token-white border border-token-xlight shadow-[0px_1px_3px_0px_rgba(0,0,0,0.1)] transition-[width,box-shadow] group-active:w-7 focus-visible:outline focus-visible:outline-2 focus-visible:outline-token-brand focus-visible:outline-offset-2 disabled:pointer-events-none",
   labelRow: "mt-2 flex w-full items-center justify-between text-xs leading-4 font-medium text-fg-grey-secondary whitespace-nowrap",
   wrapper: "flex w-full flex-col py-2"
 };
@@ -8693,14 +8702,21 @@ var ACCORDION_TOKENS = {
   item: "border-b border-token-light",
   // Card variant (Figma 707:17455 / 6441:22282) — bordered, rounded,
   // drop-shadowed surface. No bottom divider; sits as its own visual block.
-  itemCard: "border border-token-xlight rounded-2xl shadow-[0px_1px_2px_0px_rgba(0,0,0,0.1)] bg-token-white overflow-hidden",
+  //
+  // Open-state divider (Figma Agent Builder 690:15041): when the item is
+  // open, its trigger gets a 1px bottom border separating header from
+  // content. Scoped to `itemCard` via a child selector so the default
+  // variant (which already has its own `border-b` per row) is unaffected
+  // and we avoid double borders.
+  itemCard: "border border-token-xlight rounded-2xl shadow-[0px_1px_2px_0px_rgba(0,0,0,0.1)] bg-token-white overflow-hidden [&_button[data-state=open]]:border-b [&_button[data-state=open]]:border-token-xlight",
   trigger: "w-full flex items-center text-left transition-colors hover:bg-token-dark-grey active:bg-token-dark-grey focus-visible:outline focus-visible:outline-2 focus-visible:outline-token-brand focus-visible:outline-offset-2 disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>div>svg]:rotate-180",
   // Size-specific paddings on the trigger row itself.
   triggerSize: {
     default: "py-4",
-    // Card-sized trigger — 12px gutter all around, hover stays inside the
-    // rounded card (no external `bg-token-dark-grey` bleed).
-    sm: "p-3 hover:bg-transparent active:bg-transparent"
+    // Card-sized trigger — 12px gutter all around. Hover/pressed states use
+    // the same interaction tokens as `sectionTrigger` for consistency
+    // (Figma Nurix Design System 2026 nodes 6441:22355 / 22356).
+    sm: "p-3 hover:bg-interaction-hov-solid-primary active:bg-interaction-pressed-opacity-secondary"
   },
   textWrap: "flex-1 min-w-0 pr-2.5 flex flex-col gap-0.5",
   // Default trigger title — long-list look.
@@ -13096,14 +13112,62 @@ var SPINNER_TOKENS = {
 // src/spinner/spinner.tsx
 var import_jsx_runtime33 = require("react/jsx-runtime");
 var Spinner = React37.forwardRef(
-  ({ size = "md", className, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { ref, className: cn(SPINNER_TOKENS.base, className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
-      import_lucide_react14.Loader2,
+  ({ size = "md", className, title, texts, ...props }, ref) => {
+    const hasLoaderText = title !== void 0 || texts !== void 0 && texts.length > 0;
+    const [currentTextIndex, setCurrentTextIndex] = React37.useState(0);
+    React37.useEffect(() => {
+      if (!texts || texts.length === 0) return;
+      setCurrentTextIndex(0);
+      const intervalId = setInterval(() => {
+        setCurrentTextIndex((prevIndex) => {
+          if (prevIndex < texts.length - 1) {
+            return prevIndex + 1;
+          }
+          clearInterval(intervalId);
+          return prevIndex;
+        });
+      }, 2e3);
+      return () => clearInterval(intervalId);
+    }, [texts]);
+    if (!hasLoaderText) {
+      return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+        "div",
+        {
+          ref,
+          className: cn(SPINNER_TOKENS.base, className),
+          ...props,
+          children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+            import_lucide_react14.Loader2,
+            {
+              className: cn(SPINNER_TOKENS.size[size], SPINNER_TOKENS.icon),
+              strokeWidth: 1.5
+            }
+          )
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
+      "div",
       {
-        className: cn(SPINNER_TOKENS.size[size], SPINNER_TOKENS.icon),
-        strokeWidth: 1.5
+        ref,
+        className: cn(
+          "flex flex-col items-center justify-center gap-3 text-center",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: SPINNER_TOKENS.base, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+            import_lucide_react14.Loader2,
+            {
+              className: cn(SPINNER_TOKENS.size[size], SPINNER_TOKENS.icon),
+              strokeWidth: 1.5
+            }
+          ) }),
+          title ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Typography, { variant: "label-md", tone: "default", children: title }) : null,
+          texts && texts.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Typography, { variant: "subtext-xs", tone: "muted", children: texts[currentTextIndex] }) : null
+        ]
       }
-    ) });
+    );
   }
 );
 Spinner.displayName = "Spinner";
@@ -17359,8 +17423,85 @@ function MultiSelectRow({
   );
 }
 
-// src/rule-builder/rule-builder.tsx
+// src/chip/chip.tsx
 var React48 = __toESM(require("react"));
+
+// src/chip/variables.ts
+var CHIP_TOKENS = {
+  base: (
+    // Layout
+    "relative inline-flex items-center justify-center gap-2.5 px-2.5 py-1.5 rounded-full text-xs leading-4 font-semibold tracking-normal whitespace-nowrap border border-transparent transition-[background-color,color,border-color,transform] duration-150 [&>svg]:size-4 [&>svg]:shrink-0 focus-visible:outline focus-visible:outline-2 focus-visible:outline-token-brand focus-visible:outline-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer active:scale-[0.96]"
+  ),
+  // Active (unselected)
+  active: "bg-transparent border-token-light text-fg-grey-secondary hover:bg-interaction-hov-solid-primary hover:text-fg-black active:bg-interaction-hov-solid-primary active:text-fg-black",
+  // Selected — uses ::after for the hover/pressed overlay so the brand
+  // bg color stays consistent and the overlay strength is independent.
+  selected: "bg-token-brand-secondary text-fg-brand overflow-hidden after:content-[''] after:absolute after:inset-0 after:rounded-[inherit] after:pointer-events-none after:bg-black/5 after:opacity-0 after:transition-opacity hover:after:opacity-100 active:after:opacity-100",
+  // Non-interactive — used when the chip is rendered as a static <div>
+  // (e.g. for display-only contexts). Skips the cursor / focus / press
+  // affordances so it doesn't read as clickable.
+  staticOverrides: "cursor-default active:scale-100"
+};
+
+// src/chip/chip.tsx
+var import_jsx_runtime44 = require("react/jsx-runtime");
+var Chip = React48.forwardRef(
+  ({
+    className,
+    selected = false,
+    onClick,
+    leadingIcon,
+    trailingIcon,
+    disabled = false,
+    children,
+    "data-testid": dataTestId,
+    ...rest
+  }, ref) => {
+    const classes = cn(
+      CHIP_TOKENS.base,
+      selected ? CHIP_TOKENS.selected : CHIP_TOKENS.active,
+      !onClick && CHIP_TOKENS.staticOverrides,
+      className
+    );
+    const content = /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_jsx_runtime44.Fragment, { children: [
+      leadingIcon,
+      children !== void 0 && children !== null && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-left", children }),
+      trailingIcon
+    ] });
+    if (!onClick) {
+      return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+        "div",
+        {
+          ref,
+          className: classes,
+          "data-testid": dataTestId != null ? dataTestId : "chip",
+          "data-state": selected ? "selected" : "active",
+          "aria-disabled": disabled || void 0,
+          children: content
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: classes,
+        onClick,
+        disabled,
+        "aria-pressed": selected,
+        "data-state": selected ? "selected" : "active",
+        "data-testid": dataTestId != null ? dataTestId : "chip",
+        ...rest,
+        children: content
+      }
+    );
+  }
+);
+Chip.displayName = "Chip";
+
+// src/rule-builder/rule-builder.tsx
+var React49 = __toESM(require("react"));
 var import_lucide_react25 = require("lucide-react");
 
 // src/rule-builder/variables.ts
@@ -17400,8 +17541,8 @@ var RULE_BUILDER_TOKENS = {
 };
 
 // src/rule-builder/rule-builder.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
-var RuleBuilder = React48.forwardRef(
+var import_jsx_runtime45 = require("react/jsx-runtime");
+var RuleBuilder = React49.forwardRef(
   ({
     title,
     open: openProp,
@@ -17417,17 +17558,17 @@ var RuleBuilder = React48.forwardRef(
     style,
     "data-testid": dataTestId
   }, ref) => {
-    const [openState, setOpenState] = React48.useState(defaultOpen);
+    const [openState, setOpenState] = React49.useState(defaultOpen);
     const isControlled = openProp !== void 0;
     const open = isControlled ? openProp : openState;
-    const handleToggle = React48.useCallback(() => {
+    const handleToggle = React49.useCallback(() => {
       const next = !open;
       if (!isControlled) setOpenState(next);
       onOpenChange == null ? void 0 : onOpenChange(next);
     }, [open, isControlled, onOpenChange]);
-    const titleIconNode = titleIcon != null ? titleIcon : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.Workflow, {});
-    const thenIconNode = thenIcon != null ? thenIcon : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.FileOutput, {});
-    return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+    const titleIconNode = titleIcon != null ? titleIcon : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.Workflow, {});
+    const thenIconNode = thenIcon != null ? thenIcon : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.FileOutput, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
       "div",
       {
         ref,
@@ -17436,31 +17577,31 @@ var RuleBuilder = React48.forwardRef(
         "data-testid": dataTestId != null ? dataTestId : "rule-builder",
         "data-state": open ? "open" : "closed",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
             "div",
             {
               className: open ? RULE_BUILDER_TOKENS.card : RULE_BUILDER_TOKENS.cardCollapsed,
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: RULE_BUILDER_TOKENS.header, children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Badge, { variant: "default", interactive: false, leadingIcon: titleIconNode, children: title }),
-                  /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: RULE_BUILDER_TOKENS.headerActions, children: [
-                    onDelete ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: RULE_BUILDER_TOKENS.header, children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(Badge, { variant: "default", interactive: false, leadingIcon: titleIconNode, children: title }),
+                  /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: RULE_BUILDER_TOKENS.headerActions, children: [
+                    onDelete ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
                       Button,
                       {
                         variant: "iconLink",
                         size: "iconXs",
-                        leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.Trash2, {}),
+                        leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.Trash2, {}),
                         onClick: onDelete,
                         "aria-label": "Delete rule",
                         "data-testid": "rule-builder-delete"
                       }
                     ) : null,
-                    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
                       Button,
                       {
                         variant: "iconLink",
                         size: "iconXs",
-                        leadingIcon: open ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.ChevronUp, {}) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.ChevronDown, {}),
+                        leadingIcon: open ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.ChevronUp, {}) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.ChevronDown, {}),
                         onClick: handleToggle,
                         "aria-expanded": open,
                         "aria-label": open ? "Collapse rule" : "Expand rule",
@@ -17469,16 +17610,16 @@ var RuleBuilder = React48.forwardRef(
                     )
                   ] })
                 ] }),
-                open ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.body, children }) : null
+                open ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.body, children }) : null
               ]
             }
           ),
-          open && thenContent ? /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: RULE_BUILDER_TOKENS.thenStrip, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: RULE_BUILDER_TOKENS.thenLabel, children: [
+          open && thenContent ? /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: RULE_BUILDER_TOKENS.thenStrip, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: RULE_BUILDER_TOKENS.thenLabel, children: [
               thenIconNode,
-              /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { children: thenLabel })
+              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { children: thenLabel })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.thenContent, children: thenContent })
+            /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.thenContent, children: thenContent })
           ] }) : null
         ]
       }
@@ -17486,19 +17627,19 @@ var RuleBuilder = React48.forwardRef(
   }
 );
 RuleBuilder.displayName = "RuleBuilder";
-var RuleBuilderClause = React48.forwardRef(({ label = "IF", children, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { ref, className: cn("flex flex-col gap-2 w-full", className), children: [
-  label !== null && label !== void 0 && label !== "" ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.clauseLabel, children: label }) : null,
-  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.conditionsGroup, children })
+var RuleBuilderClause = React49.forwardRef(({ label = "IF", children, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { ref, className: cn("flex flex-col gap-2 w-full", className), children: [
+  label !== null && label !== void 0 && label !== "" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.clauseLabel, children: label }) : null,
+  /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.conditionsGroup, children })
 ] }));
 RuleBuilderClause.displayName = "RuleBuilderClause";
-var RuleBuilderCondition = React48.forwardRef(({ children, onDelete, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { ref, className: cn(RULE_BUILDER_TOKENS.conditionRow, className), children: [
+var RuleBuilderCondition = React49.forwardRef(({ children, onDelete, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { ref, className: cn(RULE_BUILDER_TOKENS.conditionRow, className), children: [
   children,
-  onDelete ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  onDelete ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     Button,
     {
       variant: "iconLink",
       size: "iconXs",
-      leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.Trash2, {}),
+      leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.Trash2, {}),
       onClick: onDelete,
       "aria-label": "Delete condition",
       "data-testid": "rule-builder-condition-delete"
@@ -17506,26 +17647,26 @@ var RuleBuilderCondition = React48.forwardRef(({ children, onDelete, className }
   ) : null
 ] }));
 RuleBuilderCondition.displayName = "RuleBuilderCondition";
-var RuleBuilderConnector = React48.forwardRef(({ children, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { ref, className: cn("flex flex-col w-full", className), children: [
-  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLine, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLineInner }) }),
-  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorRow, children }),
-  /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLine, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLineInner }) })
+var RuleBuilderConnector = React49.forwardRef(({ children, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { ref, className: cn("flex flex-col w-full", className), children: [
+  /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLine, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLineInner }) }),
+  /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorRow, children }),
+  /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLine, "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.connectorLineInner }) })
 ] }));
 RuleBuilderConnector.displayName = "RuleBuilderConnector";
-var RuleBuilderAddCondition = React48.forwardRef(
+var RuleBuilderAddCondition = React49.forwardRef(
   ({
     label = "Add Condition",
     onClick,
     disabled,
     className,
     "data-testid": dataTestId
-  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: RULE_BUILDER_TOKENS.addConditionRow, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: RULE_BUILDER_TOKENS.addConditionRow, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
     Button,
     {
       ref,
       variant: "outline",
       size: "xs",
-      leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.Plus, {}),
+      leadingIcon: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react25.Plus, {}),
       onClick,
       disabled,
       className,
@@ -17552,6 +17693,7 @@ RuleBuilderAddCondition.displayName = "RuleBuilderAddCondition";
   ChatBubbleAgent,
   ChatBubbleUser,
   Checkbox,
+  Chip,
   ColumnWidth,
   CompoundFilterSelect,
   DEFAULT_THEME,