modern-json-react 1.0.0 → 1.1.0

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 (9) hide show
  1. package/README.md +3 -3
  2. package/dist/index.d.mts +9 -2
  3. package/dist/index.d.ts +9 -2
  4. package/dist/index.js +608 -175
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +608 -176
  7. package/dist/index.mjs.map +1 -1
  8. package/dist/styles.css +937 -0
  9. package/package.json +25 -7
package/README.md CHANGED
@@ -8,19 +8,19 @@ A production-grade, fully-featured JSON editor React component. Combines code ed
8
8
 
9
9
  Syntax-highlighted editor with line numbers, bracket matching, and real-time validation:
10
10
 
11
- ![Code Mode - Light Theme](docs/screenshots/code-mode-light.svg)
11
+ ![Code Mode - Light Theme](docs/screenshots/code-mode-light.png)
12
12
 
13
13
  ### Tree Mode (Light)
14
14
 
15
15
  Collapsible tree view with inline editing, type badges, and hover actions:
16
16
 
17
- ![Tree Mode - Light Theme](docs/screenshots/tree-mode-light.svg)
17
+ ![Tree Mode - Light Theme](docs/screenshots/tree-mode-light.png)
18
18
 
19
19
  ### Code Mode (Dark)
20
20
 
21
21
  Full dark theme support with VS Code-inspired color palette:
22
22
 
23
- ![Code Mode - Dark Theme](docs/screenshots/code-mode-dark.svg)
23
+ ![Code Mode - Dark Theme](docs/screenshots/code-mode-dark.png)
24
24
 
25
25
  ## Features
26
26
 
package/dist/index.d.mts CHANGED
@@ -1,4 +1,4 @@
1
- import React$1 from 'react';
1
+ import React$1, { RefObject } from 'react';
2
2
 
3
3
  /** Severity level for validation messages */
4
4
  type ValidationSeverity = 'error' | 'warning' | 'info';
@@ -437,4 +437,11 @@ interface UseSearchResult {
437
437
  */
438
438
  declare function useSearch(text: string): UseSearchResult;
439
439
 
440
- export { type ContextMenuItem, type CursorPosition, type CustomValidator, type EditorMode, type EditorState, type IndentationType, type JSONSchema, JsonEditor, type JsonEditorProps, type JsonNodeType, type ParseError, type SelectionRange, type ThemeConfig, type TreeAction, type TreeNode, type ValidationError, type ValidationMode, type ValidationResult, type ValidationSeverity, buildPath, computeStats, darkTheme, deleteByPath, formatJson, getByPath, isValidJson, lightTheme, minifyJson, parseJson, parsePath, runCustomValidators, setByPath, sortJsonKeys, stringifyJson, useJsonParser, useSearch, useUndoRedo, validateSchema };
440
+ /**
441
+ * Observes the width of a container element using ResizeObserver.
442
+ * Returns the current width so components can adapt their layout
443
+ * based on actual available space (container queries approach).
444
+ */
445
+ declare function useContainerWidth(ref: RefObject<HTMLElement | null>): number;
446
+
447
+ export { type ContextMenuItem, type CursorPosition, type CustomValidator, type EditorMode, type EditorState, type IndentationType, type JSONSchema, JsonEditor, type JsonEditorProps, type JsonNodeType, type ParseError, type SelectionRange, type ThemeConfig, type TreeAction, type TreeNode, type ValidationError, type ValidationMode, type ValidationResult, type ValidationSeverity, buildPath, computeStats, darkTheme, deleteByPath, formatJson, getByPath, isValidJson, lightTheme, minifyJson, parseJson, parsePath, runCustomValidators, setByPath, sortJsonKeys, stringifyJson, useContainerWidth, useJsonParser, useSearch, useUndoRedo, validateSchema };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React$1 from 'react';
1
+ import React$1, { RefObject } from 'react';
2
2
 
3
3
  /** Severity level for validation messages */
4
4
  type ValidationSeverity = 'error' | 'warning' | 'info';
@@ -437,4 +437,11 @@ interface UseSearchResult {
437
437
  */
438
438
  declare function useSearch(text: string): UseSearchResult;
439
439
 
440
- export { type ContextMenuItem, type CursorPosition, type CustomValidator, type EditorMode, type EditorState, type IndentationType, type JSONSchema, JsonEditor, type JsonEditorProps, type JsonNodeType, type ParseError, type SelectionRange, type ThemeConfig, type TreeAction, type TreeNode, type ValidationError, type ValidationMode, type ValidationResult, type ValidationSeverity, buildPath, computeStats, darkTheme, deleteByPath, formatJson, getByPath, isValidJson, lightTheme, minifyJson, parseJson, parsePath, runCustomValidators, setByPath, sortJsonKeys, stringifyJson, useJsonParser, useSearch, useUndoRedo, validateSchema };
440
+ /**
441
+ * Observes the width of a container element using ResizeObserver.
442
+ * Returns the current width so components can adapt their layout
443
+ * based on actual available space (container queries approach).
444
+ */
445
+ declare function useContainerWidth(ref: RefObject<HTMLElement | null>): number;
446
+
447
+ export { type ContextMenuItem, type CursorPosition, type CustomValidator, type EditorMode, type EditorState, type IndentationType, type JSONSchema, JsonEditor, type JsonEditorProps, type JsonNodeType, type ParseError, type SelectionRange, type ThemeConfig, type TreeAction, type TreeNode, type ValidationError, type ValidationMode, type ValidationResult, type ValidationSeverity, buildPath, computeStats, darkTheme, deleteByPath, formatJson, getByPath, isValidJson, lightTheme, minifyJson, parseJson, parsePath, runCustomValidators, setByPath, sortJsonKeys, stringifyJson, useContainerWidth, useJsonParser, useSearch, useUndoRedo, validateSchema };