@gfazioli/mantine-json-tree 3.1.0 → 3.2.1

package/dist/types/JsonTree.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Factory, MantineRadius, MantineSize, StylesApiProps, type BoxProps, type StyleProp, type TooltipProps } from '@mantine/core';
+import { Factory, MantineRadius, MantineSize, type TextInputProps, StylesApiProps, type BoxProps, type StyleProp, type TooltipProps } from '@mantine/core';
 export type JsonTreeStylesNames = 'root' | 'paper' | 'header' | 'toolbar' | 'controls' | 'expandCollapse' | 'keyCountBadge' | 'copyAllButton' | 'searchToggle' | 'searchBar' | 'searchInput' | 'searchHighlight' | 'key' | 'keyValueSeparator' | 'value' | 'bracket' | 'ellipsis' | 'itemsCount' | 'indentGuide' | 'copyButton' | 'lineNumber';
 export type JsonTreeCssVariables = {
     root: '--json-tree-font-family' | '--json-tree-font-size';
@@ -107,6 +107,26 @@ export interface JsonTreeBaseProps {
     onSearchChange?: (query: string) => void;
     /** Debounce delay for search in ms @default 300 */
     searchDebounce?: number;
+    /**
+     * Props forwarded to the internal search `TextInput`. Use this to fully customize
+     * the search input via Mantine's native `classNames`, `styles`, `vars`, `variant`,
+     * `radius`, `size`, etc. — no specificity workarounds required.
+     *
+     * `value`, `defaultValue`, and `onChange` are intentionally excluded:
+     * `JsonTree` owns the search state. To control or observe it, use the
+     * top-level `searchQuery` and `onSearchChange` props.
+     *
+     * @example
+     * ```tsx
+     * <JsonTree
+     *   withSearch
+     *   searchInputProps={{
+     *     styles: { input: { backgroundColor: 'var(--mantine-color-dark-7)' } },
+     *   }}
+     * />
+     * ```
+     */
+    searchInputProps?: Omit<TextInputProps, 'value' | 'defaultValue' | 'onChange'>;
 }
 /** Display mode for functions in JSON data */
 export type JsonTreeFunctionDisplay = 'as-string' | 'hide' | 'as-object';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gfazioli/mantine-json-tree",
-  "version": "3.1.0",
+  "version": "3.2.1",
   "description": "A Mantine extension component that renders interactive JSON trees with syntax highlighting, collapsible nodes, copy-to-clipboard, and configurable expansion depth.",
   "homepage": "https://gfazioli.github.io/mantine-json-tree/",
   "packageManager": "yarn@4.0.1",