@nurix/ui-component-library 1.1.3-stage.103 → 1.1.3-stage.104

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/index.d.mts +29 -1
  2. package/dist/index.d.ts +29 -1
  3. package/dist/index.js +37 -11
  4. package/dist/index.mjs +59 -33
  5. package/dist/styles.css +9 -0
  6. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -35,6 +35,7 @@ interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
35
35
  declare const Button: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<HTMLButtonElement>>;
36
36
 
37
37
  type InputBorderRadius = "none" | "soft" | "rounded" | "pill";
38
+ type InputVariant = "grey" | "white";
38
39
  type SupportingTextType = "help" | "error";
39
40
  type InputForceState = "active" | "focussed" | "disabled";
40
41
  interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size"> {
@@ -58,6 +59,12 @@ interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>,
58
59
  * Hide the supporting text row (even if `supportingText` is provided).
59
60
  */
60
61
  hideSupportingText?: boolean;
62
+ /**
63
+ * Input field background variant in light mode.
64
+ * grey: light grey background (--input). white: white background (--card).
65
+ * @default "grey"
66
+ */
67
+ inputVariant?: InputVariant;
61
68
  /**
62
69
  * Design-system controlled border radius.
63
70
  */
@@ -82,6 +89,7 @@ interface FileInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputEleme
82
89
  placeholder?: string;
83
90
  fileName?: string;
84
91
  input_border_radius?: InputBorderRadius;
92
+ inputVariant?: InputVariant;
85
93
  onFileChange?: (file: File | null) => void;
86
94
  }
87
95
 
@@ -129,6 +137,12 @@ interface InputGroupProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElem
129
137
  */
130
138
  endSegment?: React$1.ReactNode;
131
139
  input_border_radius?: InputGroupBorderRadius;
140
+ /**
141
+ * Input field background variant in light mode.
142
+ * grey: light grey (--input). white: white (--card).
143
+ * @default "grey"
144
+ */
145
+ inputVariant?: InputVariant;
132
146
  }
133
147
 
134
148
  declare const InputGroup: React$1.ForwardRefExoticComponent<InputGroupProps & React$1.RefAttributes<HTMLInputElement>>;
@@ -156,6 +170,12 @@ interface TextareaProps extends Omit<React$1.TextareaHTMLAttributes<HTMLTextArea
156
170
  * Hide the supporting text row (even if `supportingText` is provided).
157
171
  */
158
172
  hideSupportingText?: boolean;
173
+ /**
174
+ * Input field background variant in light mode.
175
+ * grey: light grey (--input). white: white (--card).
176
+ * @default "grey"
177
+ */
178
+ inputVariant?: InputVariant;
159
179
  /**
160
180
  * Design-system controlled border radius.
161
181
  */
@@ -711,6 +731,8 @@ type TooltipContentProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitiv
711
731
 
712
732
  type TypographyVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p1" | "p2" | "p3";
713
733
  type TypographyTone = "default" | "muted" | "inherit";
734
+ /** Font family. sans = Nunito (Figma design system). inherit = use parent. */
735
+ type TypographyFontFamily = "sans" | "inherit";
714
736
  interface TypographyProps extends React$1.HTMLAttributes<HTMLElement> {
715
737
  /**
716
738
  * Typography variant (maps to Figma text styles).
@@ -732,6 +754,12 @@ interface TypographyProps extends React$1.HTMLAttributes<HTMLElement> {
732
754
  * Ignored when `asChild` is true.
733
755
  */
734
756
  as?: React$1.ElementType;
757
+ /**
758
+ * Font family. "sans" uses Nunito (Figma/Nurix design system).
759
+ * "inherit" uses the parent's font.
760
+ * @default "sans"
761
+ */
762
+ fontFamily?: TypographyFontFamily;
735
763
  }
736
764
 
737
765
  /**
@@ -2044,4 +2072,4 @@ interface KeyValueJsonEditorProps {
2044
2072
  */
2045
2073
  declare const KeyValueJsonEditor: React$1.ForwardRefExoticComponent<KeyValueJsonEditorProps & React$1.RefAttributes<HTMLDivElement>>;
2046
2074
 
2047
- 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, ButtonList, type ButtonListItem, type ButtonListProps, 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 TextareaBorderRadius, type TextareaForceState, 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 };
2075
+ 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, ButtonList, type ButtonListItem, type ButtonListProps, 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, type InputVariant, 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 TextareaBorderRadius, type TextareaForceState, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyFontFamily, type TypographyProps, type TypographyTone, type TypographyVariant, type UsePlaySelectProps, type UseSelectProps, enhanceJsonError, showToast, useJsonEditor, usePlaySelect, useSelect, useTheme };
package/dist/index.d.ts CHANGED
@@ -35,6 +35,7 @@ interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
35
35
  declare const Button: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<HTMLButtonElement>>;
36
36
 
37
37
  type InputBorderRadius = "none" | "soft" | "rounded" | "pill";
38
+ type InputVariant = "grey" | "white";
38
39
  type SupportingTextType = "help" | "error";
39
40
  type InputForceState = "active" | "focussed" | "disabled";
40
41
  interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size"> {
@@ -58,6 +59,12 @@ interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>,
58
59
  * Hide the supporting text row (even if `supportingText` is provided).
59
60
  */
60
61
  hideSupportingText?: boolean;
62
+ /**
63
+ * Input field background variant in light mode.
64
+ * grey: light grey background (--input). white: white background (--card).
65
+ * @default "grey"
66
+ */
67
+ inputVariant?: InputVariant;
61
68
  /**
62
69
  * Design-system controlled border radius.
63
70
  */
@@ -82,6 +89,7 @@ interface FileInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputEleme
82
89
  placeholder?: string;
83
90
  fileName?: string;
84
91
  input_border_radius?: InputBorderRadius;
92
+ inputVariant?: InputVariant;
85
93
  onFileChange?: (file: File | null) => void;
86
94
  }
87
95
 
@@ -129,6 +137,12 @@ interface InputGroupProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElem
129
137
  */
130
138
  endSegment?: React$1.ReactNode;
131
139
  input_border_radius?: InputGroupBorderRadius;
140
+ /**
141
+ * Input field background variant in light mode.
142
+ * grey: light grey (--input). white: white (--card).
143
+ * @default "grey"
144
+ */
145
+ inputVariant?: InputVariant;
132
146
  }
133
147
 
134
148
  declare const InputGroup: React$1.ForwardRefExoticComponent<InputGroupProps & React$1.RefAttributes<HTMLInputElement>>;
@@ -156,6 +170,12 @@ interface TextareaProps extends Omit<React$1.TextareaHTMLAttributes<HTMLTextArea
156
170
  * Hide the supporting text row (even if `supportingText` is provided).
157
171
  */
158
172
  hideSupportingText?: boolean;
173
+ /**
174
+ * Input field background variant in light mode.
175
+ * grey: light grey (--input). white: white (--card).
176
+ * @default "grey"
177
+ */
178
+ inputVariant?: InputVariant;
159
179
  /**
160
180
  * Design-system controlled border radius.
161
181
  */
@@ -711,6 +731,8 @@ type TooltipContentProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitiv
711
731
 
712
732
  type TypographyVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p1" | "p2" | "p3";
713
733
  type TypographyTone = "default" | "muted" | "inherit";
734
+ /** Font family. sans = Nunito (Figma design system). inherit = use parent. */
735
+ type TypographyFontFamily = "sans" | "inherit";
714
736
  interface TypographyProps extends React$1.HTMLAttributes<HTMLElement> {
715
737
  /**
716
738
  * Typography variant (maps to Figma text styles).
@@ -732,6 +754,12 @@ interface TypographyProps extends React$1.HTMLAttributes<HTMLElement> {
732
754
  * Ignored when `asChild` is true.
733
755
  */
734
756
  as?: React$1.ElementType;
757
+ /**
758
+ * Font family. "sans" uses Nunito (Figma/Nurix design system).
759
+ * "inherit" uses the parent's font.
760
+ * @default "sans"
761
+ */
762
+ fontFamily?: TypographyFontFamily;
735
763
  }
736
764
 
737
765
  /**
@@ -2044,4 +2072,4 @@ interface KeyValueJsonEditorProps {
2044
2072
  */
2045
2073
  declare const KeyValueJsonEditor: React$1.ForwardRefExoticComponent<KeyValueJsonEditorProps & React$1.RefAttributes<HTMLDivElement>>;
2046
2074
 
2047
- 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, ButtonList, type ButtonListItem, type ButtonListProps, 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 TextareaBorderRadius, type TextareaForceState, 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 };
2075
+ 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, ButtonList, type ButtonListItem, type ButtonListProps, 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, type InputVariant, 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 TextareaBorderRadius, type TextareaForceState, type TextareaProps, ThemeProvider, Toast, type ToastProps, type ToastVariant, Toaster, Tooltip, TooltipContent, type TooltipContentProps, TooltipProvider, TooltipTrigger, Typography, type TypographyFontFamily, type TypographyProps, type TypographyTone, type TypographyVariant, type UsePlaySelectProps, type UseSelectProps, enhanceJsonError, showToast, useJsonEditor, usePlaySelect, useSelect, useTheme };
package/dist/index.js CHANGED
@@ -7148,7 +7148,9 @@ var INPUT_TOKENS = {
7148
7148
  root: "flex w-full flex-col gap-1",
7149
7149
  labelRow: "flex items-center gap-1 text-xs font-medium leading-4 tracking-normal text-foreground",
7150
7150
  mandatory: "text-destructive",
7151
- field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden bg-input pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7151
+ field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7152
+ fieldBgGrey: "bg-input",
7153
+ fieldBgWhite: "bg-card",
7152
7154
  fieldBase: "border border-transparent focus-within:border-primary disabled:pointer-events-none",
7153
7155
  fieldDisabled: "opacity-50",
7154
7156
  fieldInvalid: "border-destructive focus-within:ring-destructive",
@@ -7174,6 +7176,7 @@ var Input = React2.forwardRef(
7174
7176
  supportingTextType = "help",
7175
7177
  hideSupportingText = false,
7176
7178
  input_border_radius = "rounded",
7179
+ inputVariant = "grey",
7177
7180
  forceState,
7178
7181
  invalid,
7179
7182
  disabled,
@@ -7197,6 +7200,7 @@ var Input = React2.forwardRef(
7197
7200
  {
7198
7201
  className: cn(
7199
7202
  INPUT_TOKENS.field,
7203
+ inputVariant === "white" ? INPUT_TOKENS.fieldBgWhite : INPUT_TOKENS.fieldBgGrey,
7200
7204
  INPUT_TOKENS.fieldBase,
7201
7205
  isFocussed && "border-ring",
7202
7206
  invalid && INPUT_TOKENS.fieldInvalid
@@ -7245,6 +7249,7 @@ var FileInput = React3.forwardRef(
7245
7249
  placeholder = "No file chosen",
7246
7250
  fileName,
7247
7251
  input_border_radius = "rounded",
7252
+ inputVariant = "grey",
7248
7253
  disabled,
7249
7254
  onFileChange,
7250
7255
  style,
@@ -7277,6 +7282,7 @@ var FileInput = React3.forwardRef(
7277
7282
  {
7278
7283
  className: cn(
7279
7284
  INPUT_TOKENS.field,
7285
+ inputVariant === "white" ? INPUT_TOKENS.fieldBgWhite : INPUT_TOKENS.fieldBgGrey,
7280
7286
  INPUT_TOKENS.fieldBase,
7281
7287
  "shadow-[0px_1px_2px_rgba(0,0,0,0.1)]",
7282
7288
  disabled && INPUT_TOKENS.fieldDisabled
@@ -7331,7 +7337,9 @@ var INPUT_GROUP_TOKENS = {
7331
7337
  mandatory: "text-destructive",
7332
7338
  supportingText: "text-xs font-normal leading-4 text-muted-foreground",
7333
7339
  supportingTextError: "text-destructive",
7334
- field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden bg-input pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7340
+ field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7341
+ fieldBgGrey: "bg-input",
7342
+ fieldBgWhite: "bg-card",
7335
7343
  fieldBase: "border border-transparent focus-within:border-primary disabled:pointer-events-none",
7336
7344
  fieldInvalid: "border-destructive focus-within:border-destructive",
7337
7345
  fieldDisabled: "opacity-50",
@@ -7384,6 +7392,7 @@ var InputGroup = React4.forwardRef(
7384
7392
  startSegment,
7385
7393
  endSegment,
7386
7394
  input_border_radius = "rounded",
7395
+ inputVariant = "grey",
7387
7396
  ...props
7388
7397
  }, ref) => {
7389
7398
  const isDisabled = forceState === "disabled" || disabled;
@@ -7405,6 +7414,7 @@ var InputGroup = React4.forwardRef(
7405
7414
  {
7406
7415
  className: cn(
7407
7416
  INPUT_GROUP_TOKENS.field,
7417
+ inputVariant === "white" ? INPUT_GROUP_TOKENS.fieldBgWhite : INPUT_GROUP_TOKENS.fieldBgGrey,
7408
7418
  INPUT_GROUP_TOKENS.fieldBase,
7409
7419
  isFocussed && "border-ring",
7410
7420
  isActive && "border-ring",
@@ -7500,7 +7510,9 @@ var TEXTAREA_TOKENS = {
7500
7510
  root: "flex w-full flex-col gap-1",
7501
7511
  labelRow: "flex items-center gap-1 text-xs font-medium leading-4 tracking-normal text-foreground",
7502
7512
  mandatory: "text-destructive",
7503
- field: "flex min-h-[80px] w-full flex-col overflow-hidden bg-input pl-[var(--input-padding-horizontal,16px)] pr-3 py-2 text-sm shadow-none",
7513
+ field: "flex min-h-[80px] w-full flex-col overflow-hidden pl-[var(--input-padding-horizontal,16px)] pr-3 py-2 text-sm shadow-none",
7514
+ fieldBgGrey: "bg-input",
7515
+ fieldBgWhite: "bg-card",
7504
7516
  fieldBase: "border border-transparent focus-within:border-primary disabled:pointer-events-none",
7505
7517
  fieldDisabled: "opacity-50",
7506
7518
  fieldInvalid: "border-destructive focus-within:ring-destructive",
@@ -7532,6 +7544,7 @@ var Textarea = React5.forwardRef(
7532
7544
  supportingTextType = "help",
7533
7545
  hideSupportingText = false,
7534
7546
  input_border_radius = "rounded",
7547
+ inputVariant = "grey",
7535
7548
  forceState,
7536
7549
  invalid,
7537
7550
  disabled,
@@ -7561,6 +7574,7 @@ var Textarea = React5.forwardRef(
7561
7574
  {
7562
7575
  className: cn(
7563
7576
  TEXTAREA_TOKENS.field,
7577
+ inputVariant === "white" ? TEXTAREA_TOKENS.fieldBgWhite : TEXTAREA_TOKENS.fieldBgGrey,
7564
7578
  TEXTAREA_TOKENS.fieldBase,
7565
7579
  isFocussed && "border-ring",
7566
7580
  isActive && "border-ring",
@@ -8805,6 +8819,10 @@ var import_react_slot2 = require("@radix-ui/react-slot");
8805
8819
  // src/typography/variables.ts
8806
8820
  var TYPOGRAPHY_TOKENS = {
8807
8821
  base: "tracking-normal",
8822
+ fontFamily: {
8823
+ sans: "font-nunito",
8824
+ inherit: "font-inherit"
8825
+ },
8808
8826
  tone: {
8809
8827
  default: "text-foreground",
8810
8828
  muted: "text-muted-foreground",
@@ -8840,6 +8858,7 @@ var Typography = React18.forwardRef(
8840
8858
  ({
8841
8859
  variant = "p2",
8842
8860
  tone = "default",
8861
+ fontFamily = "sans",
8843
8862
  asChild = false,
8844
8863
  as,
8845
8864
  className,
@@ -8853,6 +8872,7 @@ var Typography = React18.forwardRef(
8853
8872
  ref,
8854
8873
  className: cn(
8855
8874
  TYPOGRAPHY_TOKENS.base,
8875
+ TYPOGRAPHY_TOKENS.fontFamily[fontFamily],
8856
8876
  TYPOGRAPHY_TOKENS.variant[variant],
8857
8877
  TYPOGRAPHY_TOKENS.tone[tone],
8858
8878
  className
@@ -9656,20 +9676,23 @@ var TOOLTIP_TOKENS = {
9656
9676
 
9657
9677
  // src/tooltip/tooltip.tsx
9658
9678
  var import_jsx_runtime22 = require("react/jsx-runtime");
9659
- var useTooltipContainer = () => {
9679
+ var useTooltipContainer = (anchorRef) => {
9660
9680
  const [container, setContainer] = React26.useState(void 0);
9661
9681
  React26.useEffect(() => {
9682
+ var _a6;
9662
9683
  if (typeof document === "undefined") return;
9663
- const el = document.querySelector(".lego-land");
9684
+ const anchor = anchorRef.current;
9685
+ const el = (_a6 = anchor == null ? void 0 : anchor.closest(".lego-land")) != null ? _a6 : document.querySelector(".lego-land");
9664
9686
  setContainer(el != null ? el : void 0);
9665
- }, []);
9687
+ }, [anchorRef]);
9666
9688
  return container;
9667
9689
  };
9668
9690
  var TooltipProvider = TooltipPrimitive.Provider;
9669
9691
  var Tooltip = TooltipPrimitive.Root;
9670
9692
  var TooltipTrigger = TooltipPrimitive.Trigger;
9671
9693
  var TooltipContent = React26.forwardRef(({ className, sideOffset = 6, shortcut, children, ...props }, ref) => {
9672
- const container = useTooltipContainer();
9694
+ const anchorRef = React26.useRef(null);
9695
+ const container = useTooltipContainer(anchorRef);
9673
9696
  const content = /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
9674
9697
  TooltipPrimitive.Content,
9675
9698
  {
@@ -9702,7 +9725,10 @@ var TooltipContent = React26.forwardRef(({ className, sideOffset = 6, shortcut,
9702
9725
  ]
9703
9726
  }
9704
9727
  );
9705
- return container ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(TooltipPrimitive.Portal, { container, children: content }) : content;
9728
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
9729
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { ref: anchorRef, style: { display: "none" } }),
9730
+ container ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(TooltipPrimitive.Portal, { container, children: content }) : content
9731
+ ] });
9706
9732
  });
9707
9733
  TooltipContent.displayName = TooltipPrimitive.Content.displayName;
9708
9734
 
@@ -13118,7 +13144,7 @@ var KEY_VALUE_EDITOR_TOKENS = {
13118
13144
  rowCell: "flex h-12 items-center px-3 py-2 border-b border-border shrink-0",
13119
13145
  rowCellKey: "w-[216px]",
13120
13146
  rowCellValue: "flex gap-2 w-[180px] items-center px-3 py-2 border-b border-border shrink-0",
13121
- rowCellActions: "flex flex-1 justify-end px-3 py-2 border-b border-border min-h-12",
13147
+ rowCellActions: "flex flex-1 justify-center items-center px-3 py-2 border-b border-border min-h-12",
13122
13148
  cellInput: "w-full bg-transparent text-sm font-normal leading-5 text-foreground placeholder:text-muted-foreground outline-none",
13123
13149
  deleteButton: "flex items-center justify-center size-4 rounded text-muted-foreground hover:text-foreground transition-opacity"
13124
13150
  };
@@ -13166,7 +13192,7 @@ var KeyValueEditor = React38.forwardRef(
13166
13192
  ref,
13167
13193
  className: cn(
13168
13194
  KEY_VALUE_EDITOR_TOKENS.root,
13169
- hideHeader ? "rounded-b-2xl" : "rounded-2xl border border-border bg-card shadow-sm",
13195
+ hideHeader ? "rounded-b-2xl" : "rounded-2xl border border-border bg-card",
13170
13196
  className
13171
13197
  ),
13172
13198
  style,
@@ -13366,7 +13392,7 @@ var KeyValueJsonEditor = React39.forwardRef(
13366
13392
  "div",
13367
13393
  {
13368
13394
  ref,
13369
- className: `flex flex-col overflow-hidden rounded-2xl w-full border border-border bg-card shadow-sm ${className != null ? className : ""}`,
13395
+ className: `flex flex-col overflow-hidden rounded-2xl w-full border border-border bg-card ${className != null ? className : ""}`,
13370
13396
  style,
13371
13397
  children: [
13372
13398
  /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex items-center h-10 w-full border-b border-border bg-card shrink-0", children: [
package/dist/index.mjs CHANGED
@@ -7060,7 +7060,9 @@ var INPUT_TOKENS = {
7060
7060
  root: "flex w-full flex-col gap-1",
7061
7061
  labelRow: "flex items-center gap-1 text-xs font-medium leading-4 tracking-normal text-foreground",
7062
7062
  mandatory: "text-destructive",
7063
- field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden bg-input pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7063
+ field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7064
+ fieldBgGrey: "bg-input",
7065
+ fieldBgWhite: "bg-card",
7064
7066
  fieldBase: "border border-transparent focus-within:border-primary disabled:pointer-events-none",
7065
7067
  fieldDisabled: "opacity-50",
7066
7068
  fieldInvalid: "border-destructive focus-within:ring-destructive",
@@ -7086,6 +7088,7 @@ var Input = React2.forwardRef(
7086
7088
  supportingTextType = "help",
7087
7089
  hideSupportingText = false,
7088
7090
  input_border_radius = "rounded",
7091
+ inputVariant = "grey",
7089
7092
  forceState,
7090
7093
  invalid,
7091
7094
  disabled,
@@ -7109,6 +7112,7 @@ var Input = React2.forwardRef(
7109
7112
  {
7110
7113
  className: cn(
7111
7114
  INPUT_TOKENS.field,
7115
+ inputVariant === "white" ? INPUT_TOKENS.fieldBgWhite : INPUT_TOKENS.fieldBgGrey,
7112
7116
  INPUT_TOKENS.fieldBase,
7113
7117
  isFocussed && "border-ring",
7114
7118
  invalid && INPUT_TOKENS.fieldInvalid
@@ -7157,6 +7161,7 @@ var FileInput = React3.forwardRef(
7157
7161
  placeholder = "No file chosen",
7158
7162
  fileName,
7159
7163
  input_border_radius = "rounded",
7164
+ inputVariant = "grey",
7160
7165
  disabled,
7161
7166
  onFileChange,
7162
7167
  style,
@@ -7189,6 +7194,7 @@ var FileInput = React3.forwardRef(
7189
7194
  {
7190
7195
  className: cn(
7191
7196
  INPUT_TOKENS.field,
7197
+ inputVariant === "white" ? INPUT_TOKENS.fieldBgWhite : INPUT_TOKENS.fieldBgGrey,
7192
7198
  INPUT_TOKENS.fieldBase,
7193
7199
  "shadow-[0px_1px_2px_rgba(0,0,0,0.1)]",
7194
7200
  disabled && INPUT_TOKENS.fieldDisabled
@@ -7243,7 +7249,9 @@ var INPUT_GROUP_TOKENS = {
7243
7249
  mandatory: "text-destructive",
7244
7250
  supportingText: "text-xs font-normal leading-4 text-muted-foreground",
7245
7251
  supportingTextError: "text-destructive",
7246
- field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden bg-input pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7252
+ field: "flex h-[var(--input-height,48px)] w-full items-center gap-2 overflow-hidden pl-[var(--input-padding-horizontal,16px)] pr-3 py-1 text-sm shadow-none",
7253
+ fieldBgGrey: "bg-input",
7254
+ fieldBgWhite: "bg-card",
7247
7255
  fieldBase: "border border-transparent focus-within:border-primary disabled:pointer-events-none",
7248
7256
  fieldInvalid: "border-destructive focus-within:border-destructive",
7249
7257
  fieldDisabled: "opacity-50",
@@ -7296,6 +7304,7 @@ var InputGroup = React4.forwardRef(
7296
7304
  startSegment,
7297
7305
  endSegment,
7298
7306
  input_border_radius = "rounded",
7307
+ inputVariant = "grey",
7299
7308
  ...props
7300
7309
  }, ref) => {
7301
7310
  const isDisabled = forceState === "disabled" || disabled;
@@ -7317,6 +7326,7 @@ var InputGroup = React4.forwardRef(
7317
7326
  {
7318
7327
  className: cn(
7319
7328
  INPUT_GROUP_TOKENS.field,
7329
+ inputVariant === "white" ? INPUT_GROUP_TOKENS.fieldBgWhite : INPUT_GROUP_TOKENS.fieldBgGrey,
7320
7330
  INPUT_GROUP_TOKENS.fieldBase,
7321
7331
  isFocussed && "border-ring",
7322
7332
  isActive && "border-ring",
@@ -7412,7 +7422,9 @@ var TEXTAREA_TOKENS = {
7412
7422
  root: "flex w-full flex-col gap-1",
7413
7423
  labelRow: "flex items-center gap-1 text-xs font-medium leading-4 tracking-normal text-foreground",
7414
7424
  mandatory: "text-destructive",
7415
- field: "flex min-h-[80px] w-full flex-col overflow-hidden bg-input pl-[var(--input-padding-horizontal,16px)] pr-3 py-2 text-sm shadow-none",
7425
+ field: "flex min-h-[80px] w-full flex-col overflow-hidden pl-[var(--input-padding-horizontal,16px)] pr-3 py-2 text-sm shadow-none",
7426
+ fieldBgGrey: "bg-input",
7427
+ fieldBgWhite: "bg-card",
7416
7428
  fieldBase: "border border-transparent focus-within:border-primary disabled:pointer-events-none",
7417
7429
  fieldDisabled: "opacity-50",
7418
7430
  fieldInvalid: "border-destructive focus-within:ring-destructive",
@@ -7444,6 +7456,7 @@ var Textarea = React5.forwardRef(
7444
7456
  supportingTextType = "help",
7445
7457
  hideSupportingText = false,
7446
7458
  input_border_radius = "rounded",
7459
+ inputVariant = "grey",
7447
7460
  forceState,
7448
7461
  invalid,
7449
7462
  disabled,
@@ -7473,6 +7486,7 @@ var Textarea = React5.forwardRef(
7473
7486
  {
7474
7487
  className: cn(
7475
7488
  TEXTAREA_TOKENS.field,
7489
+ inputVariant === "white" ? TEXTAREA_TOKENS.fieldBgWhite : TEXTAREA_TOKENS.fieldBgGrey,
7476
7490
  TEXTAREA_TOKENS.fieldBase,
7477
7491
  isFocussed && "border-ring",
7478
7492
  isActive && "border-ring",
@@ -8717,6 +8731,10 @@ import { Slot as Slot2 } from "@radix-ui/react-slot";
8717
8731
  // src/typography/variables.ts
8718
8732
  var TYPOGRAPHY_TOKENS = {
8719
8733
  base: "tracking-normal",
8734
+ fontFamily: {
8735
+ sans: "font-nunito",
8736
+ inherit: "font-inherit"
8737
+ },
8720
8738
  tone: {
8721
8739
  default: "text-foreground",
8722
8740
  muted: "text-muted-foreground",
@@ -8752,6 +8770,7 @@ var Typography = React18.forwardRef(
8752
8770
  ({
8753
8771
  variant = "p2",
8754
8772
  tone = "default",
8773
+ fontFamily = "sans",
8755
8774
  asChild = false,
8756
8775
  as,
8757
8776
  className,
@@ -8765,6 +8784,7 @@ var Typography = React18.forwardRef(
8765
8784
  ref,
8766
8785
  className: cn(
8767
8786
  TYPOGRAPHY_TOKENS.base,
8787
+ TYPOGRAPHY_TOKENS.fontFamily[fontFamily],
8768
8788
  TYPOGRAPHY_TOKENS.variant[variant],
8769
8789
  TYPOGRAPHY_TOKENS.tone[tone],
8770
8790
  className
@@ -9567,21 +9587,24 @@ var TOOLTIP_TOKENS = {
9567
9587
  };
9568
9588
 
9569
9589
  // src/tooltip/tooltip.tsx
9570
- import { jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
9571
- var useTooltipContainer = () => {
9590
+ import { Fragment as Fragment6, jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
9591
+ var useTooltipContainer = (anchorRef) => {
9572
9592
  const [container, setContainer] = React26.useState(void 0);
9573
9593
  React26.useEffect(() => {
9594
+ var _a6;
9574
9595
  if (typeof document === "undefined") return;
9575
- const el = document.querySelector(".lego-land");
9596
+ const anchor = anchorRef.current;
9597
+ const el = (_a6 = anchor == null ? void 0 : anchor.closest(".lego-land")) != null ? _a6 : document.querySelector(".lego-land");
9576
9598
  setContainer(el != null ? el : void 0);
9577
- }, []);
9599
+ }, [anchorRef]);
9578
9600
  return container;
9579
9601
  };
9580
9602
  var TooltipProvider = TooltipPrimitive.Provider;
9581
9603
  var Tooltip = TooltipPrimitive.Root;
9582
9604
  var TooltipTrigger = TooltipPrimitive.Trigger;
9583
9605
  var TooltipContent = React26.forwardRef(({ className, sideOffset = 6, shortcut, children, ...props }, ref) => {
9584
- const container = useTooltipContainer();
9606
+ const anchorRef = React26.useRef(null);
9607
+ const container = useTooltipContainer(anchorRef);
9585
9608
  const content = /* @__PURE__ */ jsxs15(
9586
9609
  TooltipPrimitive.Content,
9587
9610
  {
@@ -9614,7 +9637,10 @@ var TooltipContent = React26.forwardRef(({ className, sideOffset = 6, shortcut,
9614
9637
  ]
9615
9638
  }
9616
9639
  );
9617
- return container ? /* @__PURE__ */ jsx22(TooltipPrimitive.Portal, { container, children: content }) : content;
9640
+ return /* @__PURE__ */ jsxs15(Fragment6, { children: [
9641
+ /* @__PURE__ */ jsx22("span", { ref: anchorRef, style: { display: "none" } }),
9642
+ container ? /* @__PURE__ */ jsx22(TooltipPrimitive.Portal, { container, children: content }) : content
9643
+ ] });
9618
9644
  });
9619
9645
  TooltipContent.displayName = TooltipPrimitive.Content.displayName;
9620
9646
 
@@ -10084,7 +10110,7 @@ Stepper.displayName = "Stepper";
10084
10110
  // src/shadow-dom-wrapper.tsx
10085
10111
  import * as React30 from "react";
10086
10112
  import { createPortal } from "react-dom";
10087
- import { Fragment as Fragment7, jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
10113
+ import { Fragment as Fragment8, jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
10088
10114
  var ShadowDOMWrapper = ({
10089
10115
  children,
10090
10116
  styles,
@@ -10184,7 +10210,7 @@ var ShadowDOMWrapper = ({
10184
10210
  return () => {
10185
10211
  };
10186
10212
  }, [styles, mode, additionalStyles, copyCSSVariables]);
10187
- return /* @__PURE__ */ jsxs19(Fragment7, { children: [
10213
+ return /* @__PURE__ */ jsxs19(Fragment8, { children: [
10188
10214
  /* @__PURE__ */ jsx26("div", { ref: containerRef }),
10189
10215
  shadowRoot && createPortal(children, shadowRoot)
10190
10216
  ] });
@@ -10266,7 +10292,7 @@ function getColumnWidthPx(width) {
10266
10292
  }
10267
10293
 
10268
10294
  // src/table/table.tsx
10269
- import { Fragment as Fragment8, jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
10295
+ import { Fragment as Fragment9, jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
10270
10296
  function formatNumber(n) {
10271
10297
  if (n == null) return "0";
10272
10298
  return n.toLocaleString();
@@ -10656,7 +10682,7 @@ function DataTable({
10656
10682
  ))
10657
10683
  ) : (
10658
10684
  // Actual data rows
10659
- /* @__PURE__ */ jsxs20(Fragment8, { children: [
10685
+ /* @__PURE__ */ jsxs20(Fragment9, { children: [
10660
10686
  data.map((row, rowIndex) => {
10661
10687
  const id = resolveId(row, rowIndex);
10662
10688
  const isSelected = selectedSet.has(id);
@@ -10985,7 +11011,7 @@ var Separator2 = React34.forwardRef(
10985
11011
  Separator2.displayName = SeparatorPrimitive.Root.displayName;
10986
11012
 
10987
11013
  // src/filter-select/filter-select.tsx
10988
- import { Fragment as Fragment9, jsx as jsx31, jsxs as jsxs22 } from "react/jsx-runtime";
11014
+ import { Fragment as Fragment10, jsx as jsx31, jsxs as jsxs22 } from "react/jsx-runtime";
10989
11015
  function startOfDay(d) {
10990
11016
  const x = new Date(d);
10991
11017
  x.setHours(0, 0, 0, 0);
@@ -11383,7 +11409,7 @@ var FilterSelect = React35.forwardRef(
11383
11409
  Icon2 && /* @__PURE__ */ jsx31(Icon2, { className: FILTER_SELECT_TOKENS.icon }),
11384
11410
  /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2", children: [
11385
11411
  /* @__PURE__ */ jsx31("span", { className: FILTER_SELECT_TOKENS.label, children: label }),
11386
- selectedItemsText && /* @__PURE__ */ jsxs22(Fragment9, { children: [
11412
+ selectedItemsText && /* @__PURE__ */ jsxs22(Fragment10, { children: [
11387
11413
  /* @__PURE__ */ jsx31(
11388
11414
  Separator2,
11389
11415
  {
@@ -11470,7 +11496,7 @@ var FilterSelect = React35.forwardRef(
11470
11496
  side: "bottom",
11471
11497
  align: "start",
11472
11498
  sideOffset: 4,
11473
- children: loading ? /* @__PURE__ */ jsx31(Spinner, { size: "md" }) : type === "text" ? /* @__PURE__ */ jsxs22(Fragment9, { children: [
11499
+ children: loading ? /* @__PURE__ */ jsx31(Spinner, { size: "md" }) : type === "text" ? /* @__PURE__ */ jsxs22(Fragment10, { children: [
11474
11500
  /* @__PURE__ */ jsx31(
11475
11501
  "textarea",
11476
11502
  {
@@ -11509,7 +11535,7 @@ var FilterSelect = React35.forwardRef(
11509
11535
  ]
11510
11536
  }
11511
11537
  ) })
11512
- ] }) : type === "text_with_operands" ? /* @__PURE__ */ jsxs22(Fragment9, { children: [
11538
+ ] }) : type === "text_with_operands" ? /* @__PURE__ */ jsxs22(Fragment10, { children: [
11513
11539
  /* @__PURE__ */ jsx31("div", { className: "mb-2", children: /* @__PURE__ */ jsxs22(
11514
11540
  Select,
11515
11541
  {
@@ -11568,7 +11594,7 @@ var FilterSelect = React35.forwardRef(
11568
11594
  ]
11569
11595
  }
11570
11596
  ) })
11571
- ] }) : type === "date" ? /* @__PURE__ */ jsx31(Fragment9, { children: /* @__PURE__ */ jsxs22(
11597
+ ] }) : type === "date" ? /* @__PURE__ */ jsx31(Fragment10, { children: /* @__PURE__ */ jsxs22(
11572
11598
  "div",
11573
11599
  {
11574
11600
  className: cn(
@@ -11726,7 +11752,7 @@ var FilterSelect = React35.forwardRef(
11726
11752
  ] })
11727
11753
  ]
11728
11754
  }
11729
- ) }) : /* @__PURE__ */ jsxs22(Fragment9, { children: [
11755
+ ) }) : /* @__PURE__ */ jsxs22(Fragment10, { children: [
11730
11756
  /* @__PURE__ */ jsx31(
11731
11757
  "div",
11732
11758
  {
@@ -12626,7 +12652,7 @@ var MONACO_OPTIONS_DIALOG = {
12626
12652
 
12627
12653
  // src/json-editor/useJsonEditor.tsx
12628
12654
  var import_ajv = __toESM(require_ajv());
12629
- import { useCallback as useCallback11, useEffect as useEffect10, useId, useRef as useRef6, useState as useState13 } from "react";
12655
+ import { useCallback as useCallback11, useEffect as useEffect10, useId, useRef as useRef7, useState as useState13 } from "react";
12630
12656
 
12631
12657
  // src/json-editor/useJsonEditorErrorStore.ts
12632
12658
  var state = {
@@ -12682,14 +12708,14 @@ function useJsonEditor({
12682
12708
  const editorKey = useId();
12683
12709
  const registerError = useJsonEditorErrorStore((s) => s.registerError);
12684
12710
  const clearError = useJsonEditorErrorStore((s) => s.clearError);
12685
- const editorRef = useRef6(null);
12686
- const monacoRef = useRef6(null);
12687
- const expandedEditorRef = useRef6(null);
12711
+ const editorRef = useRef7(null);
12712
+ const monacoRef = useRef7(null);
12713
+ const expandedEditorRef = useRef7(null);
12688
12714
  const [errors, setErrors] = useState13([]);
12689
12715
  const [copied, setCopied] = useState13(false);
12690
12716
  const [monacoReady, setMonacoReady] = useState13(false);
12691
12717
  const resolvedNodeId = nodeId != null ? nodeId : `_unbound_${editorKey}`;
12692
- const resolvedNodeIdRef = useRef6(resolvedNodeId);
12718
+ const resolvedNodeIdRef = useRef7(resolvedNodeId);
12693
12719
  resolvedNodeIdRef.current = resolvedNodeId;
12694
12720
  useEffect10(
12695
12721
  () => () => {
@@ -12852,7 +12878,7 @@ function useJsonEditor({
12852
12878
  }
12853
12879
 
12854
12880
  // src/json-editor/JsonEditor.tsx
12855
- import { Fragment as Fragment10, jsx as jsx33, jsxs as jsxs24 } from "react/jsx-runtime";
12881
+ import { Fragment as Fragment11, jsx as jsx33, jsxs as jsxs24 } from "react/jsx-runtime";
12856
12882
  function JsonEditor({
12857
12883
  value,
12858
12884
  onChange,
@@ -12884,7 +12910,7 @@ function JsonEditor({
12884
12910
  language
12885
12911
  });
12886
12912
  const hasErrors = errors.length > 0;
12887
- return /* @__PURE__ */ jsxs24(Fragment10, { children: [
12913
+ return /* @__PURE__ */ jsxs24(Fragment11, { children: [
12888
12914
  /* @__PURE__ */ jsxs24(
12889
12915
  "div",
12890
12916
  {
@@ -12896,7 +12922,7 @@ function JsonEditor({
12896
12922
  /* @__PURE__ */ jsx33(ToolbarButton, { onClick: formatJson, title: "Format JSON", children: /* @__PURE__ */ jsx33(WandSparkles, { className: "size-3" }) }),
12897
12923
  /* @__PURE__ */ jsx33(Divider, {}),
12898
12924
  /* @__PURE__ */ jsx33(ToolbarButton, { onClick: copyToClipboard, title: "Copy JSON", children: copied ? /* @__PURE__ */ jsx33(Check4, { className: "size-3 text-green-500" }) : /* @__PURE__ */ jsx33(Copy, { className: "size-3" }) }),
12899
- showExpandButton && /* @__PURE__ */ jsxs24(Fragment10, { children: [
12925
+ showExpandButton && /* @__PURE__ */ jsxs24(Fragment11, { children: [
12900
12926
  /* @__PURE__ */ jsx33(Divider, {}),
12901
12927
  /* @__PURE__ */ jsx33(
12902
12928
  ToolbarButton,
@@ -13038,7 +13064,7 @@ var KEY_VALUE_EDITOR_TOKENS = {
13038
13064
  rowCell: "flex h-12 items-center px-3 py-2 border-b border-border shrink-0",
13039
13065
  rowCellKey: "w-[216px]",
13040
13066
  rowCellValue: "flex gap-2 w-[180px] items-center px-3 py-2 border-b border-border shrink-0",
13041
- rowCellActions: "flex flex-1 justify-end px-3 py-2 border-b border-border min-h-12",
13067
+ rowCellActions: "flex flex-1 justify-center items-center px-3 py-2 border-b border-border min-h-12",
13042
13068
  cellInput: "w-full bg-transparent text-sm font-normal leading-5 text-foreground placeholder:text-muted-foreground outline-none",
13043
13069
  deleteButton: "flex items-center justify-center size-4 rounded text-muted-foreground hover:text-foreground transition-opacity"
13044
13070
  };
@@ -13086,7 +13112,7 @@ var KeyValueEditor = React38.forwardRef(
13086
13112
  ref,
13087
13113
  className: cn(
13088
13114
  KEY_VALUE_EDITOR_TOKENS.root,
13089
- hideHeader ? "rounded-b-2xl" : "rounded-2xl border border-border bg-card shadow-sm",
13115
+ hideHeader ? "rounded-b-2xl" : "rounded-2xl border border-border bg-card",
13090
13116
  className
13091
13117
  ),
13092
13118
  style,
@@ -13214,7 +13240,7 @@ function KeyValueRow({
13214
13240
  // src/key-value-json-editor/key-value-json-editor.tsx
13215
13241
  import * as React39 from "react";
13216
13242
  import { Code2, Copy as Copy2, List as List2, WandSparkles as WandSparkles2 } from "lucide-react";
13217
- import { Fragment as Fragment11, jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
13243
+ import { Fragment as Fragment12, jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
13218
13244
  var KeyValueJsonEditor = React39.forwardRef(
13219
13245
  ({
13220
13246
  mode: controlledMode,
@@ -13286,16 +13312,16 @@ var KeyValueJsonEditor = React39.forwardRef(
13286
13312
  "div",
13287
13313
  {
13288
13314
  ref,
13289
- className: `flex flex-col overflow-hidden rounded-2xl w-full border border-border bg-card shadow-sm ${className != null ? className : ""}`,
13315
+ className: `flex flex-col overflow-hidden rounded-2xl w-full border border-border bg-card ${className != null ? className : ""}`,
13290
13316
  style,
13291
13317
  children: [
13292
13318
  /* @__PURE__ */ jsxs26("div", { className: "flex items-center h-10 w-full border-b border-border bg-card shrink-0", children: [
13293
- /* @__PURE__ */ jsx35("div", { className: "flex items-center gap-2 px-3 py-2 shrink-0", children: mode === "keyValue" ? /* @__PURE__ */ jsxs26(Fragment11, { children: [
13319
+ /* @__PURE__ */ jsx35("div", { className: "flex items-center gap-2 px-3 py-2 shrink-0", children: mode === "keyValue" ? /* @__PURE__ */ jsxs26(Fragment12, { children: [
13294
13320
  /* @__PURE__ */ jsx35("span", { className: "text-sm font-semibold leading-5 text-muted-foreground", children: "Key" }),
13295
13321
  /* @__PURE__ */ jsx35("span", { className: "text-sm font-semibold leading-5 text-muted-foreground", children: "Value" })
13296
13322
  ] }) : /* @__PURE__ */ jsx35("span", { className: "text-sm font-semibold leading-5 text-muted-foreground", children: jsonLabel }) }),
13297
13323
  /* @__PURE__ */ jsx35("div", { className: "flex flex-1 justify-end px-3 py-2 min-w-[77px]", children: /* @__PURE__ */ jsxs26("div", { className: "flex gap-0.5 items-center justify-center p-0.5 rounded-lg bg-background", children: [
13298
- mode === "json" && /* @__PURE__ */ jsxs26(Fragment11, { children: [
13324
+ mode === "json" && /* @__PURE__ */ jsxs26(Fragment12, { children: [
13299
13325
  /* @__PURE__ */ jsx35(ToolbarButton2, { onClick: handleCopy, title: "Copy", children: /* @__PURE__ */ jsx35(Copy2, { className: "size-3.5" }) }),
13300
13326
  /* @__PURE__ */ jsx35("div", { className: "w-px h-3.5 bg-border mx-0.5" }),
13301
13327
  /* @__PURE__ */ jsx35(
package/dist/styles.css CHANGED
@@ -1288,9 +1288,15 @@
1288
1288
  .lego-land .align-middle {
1289
1289
  vertical-align: middle;
1290
1290
  }
1291
+ .lego-land .font-inherit {
1292
+ font-family: inherit;
1293
+ }
1291
1294
  .lego-land .font-mono {
1292
1295
  font-family: var(--font-mono);
1293
1296
  }
1297
+ .lego-land .font-nunito {
1298
+ font-family: Nunito, ui-sans-serif, system-ui, sans-serif;
1299
+ }
1294
1300
  .lego-land .text-2xl {
1295
1301
  font-size: var(--text-2xl);
1296
1302
  line-height: var(--tw-leading, var(--text-2xl--line-height));
@@ -2404,7 +2410,10 @@
2404
2410
  .lego-land .rdp-caption_before_exit {
2405
2411
  animation: rdp-fade_out var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
2406
2412
  }
2413
+ @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap");
2407
2414
  .lego-land {
2415
+ --font-sans: "Nunito", ui-sans-serif, system-ui, sans-serif;
2416
+ font-family: var(--font-sans);
2408
2417
  --background: 0 0% 100%;
2409
2418
  --foreground: 222.2 84% 4.9%;
2410
2419
  --card: 0 0% 100%;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nurix/ui-component-library",
3
- "version": "1.1.3-stage.103",
3
+ "version": "1.1.3-stage.104",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",