@nurix/ui-component-library 1.1.3-stage.94 → 1.1.3-stage.96

package/dist/index.d.mts

@@ -6,10 +6,12 @@ import * as SelectPrimitive from '@radix-ui/react-select';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { Toaster as Toaster$1 } from 'sonner';
 import { LucideIcon } from 'lucide-react';
+import { Schema } from 'ajv';
+import { OnMount } from '@monaco-editor/react';
 
 type ButtonBorderRadius = "none" | "soft" | "rounded";
 type ButtonVariant = "primary" | "secondary" | "destructive" | "outline" | "link" | "iconPrimary" | "iconSecondary" | "iconOutline";
-type ButtonSize = "default" | "sm" | "lg" | "link" | "icon" | "iconSm";
+type ButtonSize = "default" | "sm" | "lg" | "link" | "icon" | "iconSm" | "iconXs";
 interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: ButtonVariant;
     size?: ButtonSize;
@@ -483,7 +485,7 @@ declare const SelectItem: React$1.ForwardRefExoticComponent<Omit<SelectPrimitive
     leadIconSize?: "xs" | "sm" | "md";
 } & React$1.RefAttributes<HTMLDivElement>>;
 declare const SelectSeparator: React$1.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
-declare function SelectFormLabel({ className, label, mandatory }: SelectLabelProps): react_jsx_runtime.JSX.Element;
+declare function SelectFormLabel({ className, label, mandatory, }: SelectLabelProps): react_jsx_runtime.JSX.Element;
 
 interface PlaySelectAudioItem {
     value: string;
@@ -574,20 +576,32 @@ declare function usePlaySelect({ value, defaultValue, onValueChange, onPlayClick
     pauseAudio: () => void;
 };
 
+/** Illustration position relative to text and CTAs. */
+type EmptyStateIllustrationPosition = "top" | "bottom";
+/** Illustration size variant. */
+type EmptyStateIllustrationSize = "small" | "banner";
 interface EmptyStateProps extends React$1.HTMLAttributes<HTMLDivElement> {
-    /** Illustration element (e.g. image, icon, or SVG) displayed above the text. */
+    /** Illustration element (e.g. image, icon, or SVG). */
     illustration?: React$1.ReactNode;
+    /** Where to place the illustration: above or below the text/CTAs. */
+    illustrationPosition?: EmptyStateIllustrationPosition;
+    /** Size of the illustration area. Small: 120×120px, Banner: 220×500px (overridden by width/height). */
+    illustrationSize?: EmptyStateIllustrationSize;
+    /** Custom illustration width (e.g. "500px", 300). Overrides illustrationSize for width. */
+    illustrationWidth?: string | number;
+    /** Custom illustration height (e.g. "220px", 200). Overrides illustrationSize for height. */
+    illustrationHeight?: string | number;
     /** Primary title text. */
     title: string;
     /** Secondary description text. */
     description?: string;
-    /** Action element (e.g. a Button) displayed below the text. */
-    action?: React$1.ReactNode;
+    /** Action element(s) displayed below the text. Single button or array of buttons. */
+    action?: React$1.ReactNode | React$1.ReactNode[];
 }
 
 /**
  * Empty state placeholder.
- * Figma reference node: 3696:2825
+ * Figma reference: 3619:3067 (Nurix Design System 2026)
  */
 declare const EmptyState: React$1.ForwardRefExoticComponent<EmptyStateProps & React$1.RefAttributes<HTMLDivElement>>;
 
@@ -1100,6 +1114,17 @@ declare const DEFAULT_THEME: {
             readonly warningForeground: "#78350f";
             readonly switchTrack: "#e5e5e5";
             readonly hover: "#0a0a0a1a";
+            readonly filterInput: "#fff";
+            readonly badgeDefaultBg: "#f0f9ff";
+            readonly badgeDefaultFg: "#0369a1";
+            readonly badgeSuccessBg: "#ecfdf5";
+            readonly badgeSuccessFg: "#047857";
+            readonly badgeWarningBg: "#fef3c7";
+            readonly badgeWarningFg: "#92400e";
+            readonly badgeNeutralBg: "#e5e5e5";
+            readonly badgeNeutralFg: "#525252";
+            readonly badgeDestructiveBg: "#fef2f2";
+            readonly badgeDestructiveFg: "#b91c1c";
         };
         readonly darkMode: {
             readonly background: "#1e1e1e";
@@ -1143,6 +1168,17 @@ declare const DEFAULT_THEME: {
             readonly success: "#a7f3d0";
             readonly warning: "#fde68a";
             readonly warningForeground: "#78350f";
+            readonly filterInput: "#171717";
+            readonly badgeDefaultBg: "#0c4a6e";
+            readonly badgeDefaultFg: "#7dd3fc";
+            readonly badgeSuccessBg: "#064e3b";
+            readonly badgeSuccessFg: "#6ee7b7";
+            readonly badgeWarningBg: "#78350f";
+            readonly badgeWarningFg: "#fcd34d";
+            readonly badgeNeutralBg: "#404040";
+            readonly badgeNeutralFg: "#d4d4d4";
+            readonly badgeDestructiveBg: "#7f1d1d";
+            readonly badgeDestructiveFg: "#fecaca";
             readonly switchTrack: "#ffffff";
             readonly hover: "#ffffff1a";
         };
@@ -1150,8 +1186,8 @@ declare const DEFAULT_THEME: {
     readonly components: {
         readonly mode1: {
             readonly inputRadius: 16;
-            readonly inputHeight: 48;
-            readonly inputHeightLarge: 64;
+            readonly inputHeight: 42;
+            readonly inputHeightLarge: 56;
             readonly inputPaddingHorizontal: 16;
             readonly inputPaddingVertical: 8;
             readonly buttonHeight: 40;
@@ -1579,7 +1615,7 @@ interface FilterItem<T = string> {
 /**
  * Props for FilterSelect component
  */
-interface FilterSelectProps<T = string> extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "onChange"> {
+interface FilterSelectProps<T = string> extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "onChange" | "className"> {
     /** Filter label displayed in the trigger button */
     label?: string;
     /** Icon displayed on the left side of the trigger */
@@ -1640,6 +1676,12 @@ interface FilterSelectProps<T = string> extends Omit<React$1.HTMLAttributes<HTML
     }) => void;
     /** Date presets to show (default: true = built-in presets). Set false to hide, or pass custom array */
     datePresets?: boolean | DatePreset[];
+    /** Show time picker in date filter (default: true) */
+    showTime?: boolean;
+    /** Additional className for the trigger button */
+    triggerClassName?: string;
+    /** Additional className for the dropdown content */
+    dropdownClassName?: string;
 }
 /** Date preset: label and function to compute the range */
 interface DatePreset {
@@ -1701,4 +1743,215 @@ interface SpinnerProps extends React$1.HTMLAttributes<HTMLDivElement> {
  */
 declare const Spinner: React$1.ForwardRefExoticComponent<SpinnerProps & React$1.RefAttributes<HTMLDivElement>>;
 
-export { Accordion, AccordionContent, AccordionContentPlaceholder, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionValue, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarShape, type AvatarSize, type BackButtonPosition, Badge, type BadgeProps, type BadgeVariant, Button, type ButtonBorderRadius, type ButtonProps, type ButtonSize, type ButtonVariant, type CellContent, type CellTextContent, Checkbox, type CheckboxProps, type ColumnDef, ColumnWidth, 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 EmptyStateProps, FileInput, type FileInputProps, type FilterItem, FilterListItem, type FilterListItemProps, FilterSelect, type FilterSelectProps, Input, type InputBorderRadius, type InputForceState, InputGroup, type InputGroupBorderRadius, type InputGroupForceState, type InputGroupProps, type InputProps, LegoLandWrapper, type LegoLandWrapperProps, List, type ListBorderRadius, type ListProps, type ListType, type ListVariant, NumberBadge, type NumberBadgeProps, type NumberBadgeVariant, NurixThemeProvider, Pagination, type PaginationProps, PlaySelect, type PlaySelectAudioItem, type PlaySelectProps, PlaybackControl, type PlaybackControlProps, type PlaybackState, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, Select, SelectContent, type SelectContentItem, SelectFormLabel, SelectGroup, type SelectGroupProps, SelectItem, SelectLabel, type SelectLabelProps, type SelectMenuItemProps, type SelectProps, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, ShadowDOMWrapper, type ShowToastOptions, type SortDirection, type SortState, Spinner, type SpinnerProps, type SpinnerSize, type StepItem, type StepState, Stepper, StepperBar, type StepperBarProps, type StepperProps, type SupportingTextType, Switch, type SwitchProps, type SwitchSize, type TabVariant, type TableAction, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyProps, type TypographyTone, type TypographyVariant, type UsePlaySelectProps, type UseSelectProps, showToast, usePlaySelect, useSelect, useTheme };
+/**
+ * Supported Monaco editor languages.
+ */
+type JsonEditorLanguage = "json" | "javascript" | "typescript" | "yaml" | "xml" | "html" | "css" | "markdown" | "sql" | "plaintext";
+declare const JSON_EDITOR_LANGUAGE_OPTIONS: readonly JsonEditorLanguage[];
+interface JsonEditorProps {
+    value: string;
+    onChange: (val: string) => void;
+    onParsedObject?: (obj: unknown | null) => void;
+    height?: string;
+    label?: string;
+    schema?: Schema;
+    nodeId?: string;
+    language?: JsonEditorLanguage;
+    showExpandButton?: boolean;
+    /** When true, hide the header/toolbar (for embedding in KeyValueJsonEditor). */
+    hideHeader?: boolean;
+}
+
+declare function JsonEditor({ value, onChange, onParsedObject, height, label, schema, nodeId, language, showExpandButton, hideHeader, }: JsonEditorProps): react_jsx_runtime.JSX.Element;
+
+interface UseJsonEditorParams {
+    value: string;
+    onChange: (val: string) => void;
+    onParsedObject?: (obj: unknown | null) => void;
+    schema?: Schema;
+    nodeId?: string;
+    language?: JsonEditorLanguage;
+}
+declare function useJsonEditor({ value, onChange, onParsedObject, schema, nodeId, language, }: UseJsonEditorParams): {
+    handleMount: OnMount;
+    handleExpandedMount: OnMount;
+    handleChange: (val: string | undefined) => void;
+    formatJson: () => Promise<void> | undefined;
+    formatExpandedJson: () => Promise<void> | undefined;
+    copyToClipboard: () => void;
+    errors: string[];
+    copied: boolean;
+};
+
+declare const enhanceJsonError: (message: string) => string;
+declare const MONACO_OPTIONS: {
+    fontSize: number;
+    lineHeight: number;
+    padding: {
+        top: number;
+        bottom: number;
+    };
+    minimap: {
+        readonly enabled: false;
+    };
+    automaticLayout: true;
+    scrollBeyondLastLine: false;
+    folding: true;
+    lineNumbers: "on";
+    renderLineHighlight: "none";
+    fontFamily: "'Geist Mono', 'Cascadia Code', 'Fira Code', monospace";
+    fontLigatures: true;
+    bracketPairColorization: {
+        readonly enabled: true;
+    };
+    guides: {
+        readonly bracketPairs: false;
+        readonly indentation: false;
+    };
+    overviewRulerLanes: 0;
+    hideCursorInOverviewRuler: true;
+    overviewRulerBorder: false;
+    scrollbar: {
+        readonly vertical: "auto";
+        readonly horizontal: "auto";
+        readonly useShadows: false;
+        readonly verticalScrollbarSize: 6;
+        readonly horizontalScrollbarSize: 6;
+        readonly arrowSize: 0;
+    };
+};
+/** Dialog editor: tighter padding, slightly larger font for readability in expanded view */
+declare const MONACO_OPTIONS_DIALOG: {
+    fontSize: number;
+    lineHeight: number;
+    padding: {
+        top: number;
+        bottom: number;
+    };
+    minimap: {
+        readonly enabled: false;
+    };
+    automaticLayout: true;
+    scrollBeyondLastLine: false;
+    folding: true;
+    lineNumbers: "on";
+    renderLineHighlight: "none";
+    fontFamily: "'Geist Mono', 'Cascadia Code', 'Fira Code', monospace";
+    fontLigatures: true;
+    bracketPairColorization: {
+        readonly enabled: true;
+    };
+    guides: {
+        readonly bracketPairs: false;
+        readonly indentation: false;
+    };
+    overviewRulerLanes: 0;
+    hideCursorInOverviewRuler: true;
+    overviewRulerBorder: false;
+    scrollbar: {
+        readonly vertical: "auto";
+        readonly horizontal: "auto";
+        readonly useShadows: false;
+        readonly verticalScrollbarSize: 6;
+        readonly horizontalScrollbarSize: 6;
+        readonly arrowSize: 0;
+    };
+};
+
+interface KeyValuePair {
+    key: string;
+    value: string;
+}
+interface KeyValueEditorProps {
+    /**
+     * Key-value pairs.
+     */
+    pairs: KeyValuePair[];
+    /**
+     * Called when pairs change.
+     */
+    onPairsChange: (pairs: KeyValuePair[]) => void;
+    /**
+     * Placeholder for key inputs.
+     */
+    keyPlaceholder?: string;
+    /**
+     * Placeholder for value inputs.
+     */
+    valuePlaceholder?: string;
+    /**
+     * Optional toolbar content (e.g. Toggle button) rendered in the header.
+     */
+    toolbar?: React$1.ReactNode;
+    /**
+     * When true, omit the header row. For use inside KeyValueJsonEditor.
+     */
+    hideHeader?: boolean;
+    className?: string;
+    style?: React$1.CSSProperties;
+}
+
+/**
+ * KeyValueEditor - Table-style key-value pair editor.
+ * Renders header (Key, Value) and editable rows with delete on hover.
+ * Figma reference: 258:10275
+ */
+declare const KeyValueEditor: React$1.ForwardRefExoticComponent<KeyValueEditorProps & React$1.RefAttributes<HTMLDivElement>>;
+
+type KeyValueJsonEditorMode = "keyValue" | "json";
+interface KeyValueJsonEditorProps {
+    /**
+     * Current mode: key-value table or JSON editor.
+     */
+    mode?: KeyValueJsonEditorMode;
+    /**
+     * Initial mode when uncontrolled.
+     */
+    defaultMode?: KeyValueJsonEditorMode;
+    /**
+     * Called when mode changes (e.g. via toggle).
+     */
+    onModeChange?: (mode: KeyValueJsonEditorMode) => void;
+    /**
+     * Key-value pairs (controlled). Used when mode is "keyValue".
+     */
+    pairs?: KeyValuePair[];
+    /**
+     * JSON string (controlled). Used when mode is "json".
+     */
+    jsonValue?: string;
+    /**
+     * Called when pairs change (key-value mode).
+     */
+    onPairsChange?: (pairs: KeyValuePair[]) => void;
+    /**
+     * Called when JSON changes (json mode).
+     */
+    onJsonChange?: (json: string) => void;
+    /**
+     * Initial pairs when uncontrolled.
+     */
+    defaultPairs?: KeyValuePair[];
+    /**
+     * Initial JSON when uncontrolled.
+     */
+    defaultJson?: string;
+    keyPlaceholder?: string;
+    valuePlaceholder?: string;
+    jsonHeight?: string;
+    jsonLabel?: string;
+    /**
+     * JsonEditor language when in JSON mode.
+     */
+    jsonLanguage?: JsonEditorLanguage;
+    className?: string;
+    style?: React.CSSProperties;
+}
+
+/**
+ * KeyValueJsonEditor - Unified component with toggle between Key-Value and JSON modes.
+ * Figma reference: 258:10275, 298:6652
+ */
+declare const KeyValueJsonEditor: React$1.ForwardRefExoticComponent<KeyValueJsonEditorProps & React$1.RefAttributes<HTMLDivElement>>;
+
+export { Accordion, AccordionContent, AccordionContentPlaceholder, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type AccordionType, type AccordionValue, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarShape, type AvatarSize, type BackButtonPosition, Badge, type BadgeProps, type BadgeVariant, Button, type ButtonBorderRadius, type ButtonProps, type ButtonSize, type ButtonVariant, type CellContent, type CellTextContent, Checkbox, type CheckboxProps, type ColumnDef, ColumnWidth, 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, FilterListItem, type FilterListItemProps, FilterSelect, type FilterSelectProps, Input, type InputBorderRadius, type InputForceState, InputGroup, type InputGroupBorderRadius, type InputGroupForceState, type InputGroupProps, type InputProps, JSON_EDITOR_LANGUAGE_OPTIONS, JsonEditor, type JsonEditorLanguage, type JsonEditorProps, KeyValueEditor, type KeyValueEditorProps, KeyValueJsonEditor, type KeyValueJsonEditorMode, type KeyValueJsonEditorProps, type KeyValuePair, LegoLandWrapper, type LegoLandWrapperProps, List, type ListBorderRadius, type ListProps, type ListType, type ListVariant, MONACO_OPTIONS, MONACO_OPTIONS_DIALOG, NumberBadge, type NumberBadgeProps, type NumberBadgeVariant, NurixThemeProvider, Pagination, type PaginationProps, PlaySelect, type PlaySelectAudioItem, type PlaySelectProps, PlaybackControl, type PlaybackControlProps, type PlaybackState, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, Select, SelectContent, type SelectContentItem, SelectFormLabel, SelectGroup, type SelectGroupProps, SelectItem, SelectLabel, type SelectLabelProps, type SelectMenuItemProps, type SelectProps, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, ShadowDOMWrapper, type ShowToastOptions, type SortDirection, type SortState, Spinner, type SpinnerProps, type SpinnerSize, type StepItem, type StepState, Stepper, StepperBar, type StepperBarProps, type StepperProps, type SupportingTextType, Switch, type SwitchProps, type SwitchSize, type TabVariant, type TableAction, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyProps, type TypographyTone, type TypographyVariant, type UsePlaySelectProps, type UseSelectProps, enhanceJsonError, showToast, useJsonEditor, usePlaySelect, useSelect, useTheme };