json-edit-react 1.21.2 → 1.22.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 (5) hide show
  1. package/README.md +142 -77
  2. package/build/index.cjs.js +1 -1
  3. package/build/index.d.ts +11 -2
  4. package/build/index.esm.js +1 -1
  5. package/package.json +1 -1
package/README.md CHANGED
@@ -41,16 +41,23 @@ A [React](https://github.com/facebook/react) component for editing or viewing JS
41
41
  - [Implementation](#implementation)
42
42
  - [Usage](#usage)
43
43
  - [Props overview](#props-overview)
44
+ - [Data management](#data-management)
45
+ - [Restricting editing](#restricting-editing)
46
+ - [Look and Feel / UI](#look-and-feel--ui)
47
+ - [Search and Filtering](#search-and-filtering)
48
+ - [Custom components \& overrides (incl. Localisation)](#custom-components--overrides-incl-localisation)
49
+ - [Miscellaneous](#miscellaneous)
44
50
  - [Managing state](#managing-state)
45
51
  - [Update functions](#update-functions)
46
52
  - [OnChange function](#onchange-function)
47
53
  - [OnError function](#onerror-function)
48
54
  - [Copy function](#copy-function)
49
- - [Custom Buttons](#custom-buttons)
50
55
  - [Filter functions](#filter-functions)
56
+ - [TypeFilterFunction](#typefilterfunction)
51
57
  - [Examples](#examples-1)
52
58
  - [JSON Schema validation](#json-schema-validation)
53
59
  - [Drag-n-drop](#drag-n-drop)
60
+ - [Full object editing](#full-object-editing)
54
61
  - [Search/Filtering](#searchfiltering)
55
62
  - [Themes \& Styles](#themes--styles)
56
63
  - [Fragments](#fragments)
@@ -61,6 +68,7 @@ A [React](https://github.com/facebook/react) component for editing or viewing JS
61
68
  - [Active hyperlinks](#active-hyperlinks)
62
69
  - [Custom Collection nodes](#custom-collection-nodes)
63
70
  - [Custom Text](#custom-text)
71
+ - [Custom Buttons](#custom-buttons)
64
72
  - [Keyboard customisation](#keyboard-customisation)
65
73
  - [Undo functionality](#undo-functionality)
66
74
  - [Exported helpers](#exported-helpers)
@@ -112,58 +120,92 @@ It's pretty self explanatory (click the "edit" icon to edit, etc.), but there ar
112
120
 
113
121
  ## Props overview
114
122
 
115
- The only *required* value is `data` (although you will need to provide a `setData` method to update your data).
116
-
117
- | prop | type | default | description |
118
- | ----------------------- | --------------------------------------------- | ----------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
119
- | `data` | `object\|array` | | The data to be displayed / edited |
120
- | `setData` | `object\|array => void` | | Method to update your `data` object. See [Managing state](#managing-state) below for additional notes. |
121
- | `rootName` | `string` | `"data"` | A name to display in the editor as the root of the data object. |
122
- | `onUpdate` | `UpdateFunction` | | A function to run whenever a value is **updated** (edit, delete *or* add) in the editor. See [Update functions](#update-functions). |
123
- | `onEdit` | `UpdateFunction` | | A function to run whenever a value is **edited**. |
124
- | `onDelete` | `UpdateFunction` | | A function to run whenever a value is **deleted**. |
125
- | `onAdd` | `UpdateFunction` | | A function to run whenever a new property is **added**. |
126
- | `onChange` | `OnChangeFunction` | | A function to modify/constrain user input as they type -- see [OnChange functions](#onchange-function). |
127
- | `onError` | `OnErrorFunction` | | A function to run whenever the component reports an error -- see [OnErrorFunction](#onerror-function). |
128
- | `showErrorMessages` | `boolean ` | `true` | Whether or not the component should display its own error messages (you'd probably only want to disable this if you provided your own `onError` function) |
129
- | `enableClipboard` | `boolean\|CopyFunction` | `true` | Whether or not to enable the "Copy to clipboard" button in the UI. If a function is provided, `true` is assumed and this function will be run whenever an item is copied. |
130
- | `indent` | `number` | `3` | Specify the amount of indentation for each level of nesting in the displayed data. |
131
- | `collapse` | `boolean\|number\|FilterFunction` | `false` | Defines which nodes of the JSON tree will be displayed "opened" in the UI on load. If `boolean`, it'll be either all or none. A `number` specifies a nesting depth after which nodes will be closed. For more fine control a function can be provided — see [Filter functions](#filter-functions). |
132
- | `collapseAnimationTime` | `number` | `300` | Time (in milliseconds) for the transition animation when collapsing collection nodes. |
133
- | `restrictEdit` | `boolean\|FilterFunction` | `false` | If `true`, no editing is permitted. A function can be provided for more specificity — see [Filter functions](#filter-functions) |
134
- | `restrictDelete` | `boolean\|FilterFunction` | `false` | As with `restrictEdit` but for deletion |
135
- | `restrictAdd` | `boolean\|FilterFunction` | `false` | As with `restrictEdit` but for adding new properties |
136
- | `restrictTypeSelection` | `boolean\|DataType[]\|TypeFilterFunction` | `true` | For restricting the data types the user can select. Can be a list of data types (e.g. `[ 'string', 'number', 'boolean', 'array', 'object', 'null' ]`) or a boolean. A function can be provided -- it should take the same input as the above `FilterFunction`s, but output should be `boolean \| DataType[]`. |
137
- | `restrictDrag` | `boolean\|FilterFunction` | `true` | Set to `false` to enable drag and drop functionality. See [Drag-n-drop](#drag-n-drop) |
138
- | `searchText` | `string` | `undefined` | Data visibility will be filtered by matching against value, using the method defined below in `searchFilter` |
139
- | `searchFilter` | `"key"\|"value"\|"all"\|SearchFilterFunction` | `undefined` | Define how `searchText` should be matched to filter the visible items. See [Search/Filtering](#searchfiltering) |
140
- | `searchDebounceTime` | `number` | `350` | Debounce time when `searchText` changes |
141
- | `keySort` | `boolean\|CompareFunction` | `false` | If `true`, object keys will be ordered (using default JS `.sort()`). A [compare function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) can also be provided to define sorting behaviour, except the input type should be a tuple of the key and the value of a node i.e. `(a: [string \| number, ValueData], b: [string \| number, ValueData]) => number` |
142
- | `showArrayIndices` | `boolean` | `true` | Whether or not to display the index (as a property key) for array elements. |
143
- | `showStringQuotes` | `boolean` | `true` | Whether or not to display string values in "quotes". |
144
- | `showCollectionCount` | `boolean\|"when-closed"` | `true` | Whether or not to display the number of items in each collection (object or array). |
145
- | `defaultValue` | `any\|DefaultValueFilterFunction` | `null` | When a new property is added, it is initialised with this value. A [function can be provided](#filter-functions) with the almost the same input as the `FilterFunction`s, but should output a value. This allows a different default value to be used depending on the data state (e.g. default for top level is an object, but a string elsewhere.) |
146
- | `stringTruncate` | `number` | `250` | String values longer than this many characters will be displayed truncated (with `...`). The full string will always be visible when editing. |
147
- | `translations` | `LocalisedStrings` object | `{ }` | UI strings (such as error messages) can be translated by passing an object containing localised string values (there are only a few). See [Localisation](#localisation) |
148
- | `theme` | `ThemeInput` | `default` | Either one of the built-in themes (imported separately), or an object specifying some or all theme properties. See [Themes](#themes--styles). |
149
- | `className` | `string` | | Name of a CSS class to apply to the component. In most cases, specifying `theme` properties will be more straightforward. |
150
- | `id` | `string` | | Name for the HTML `id` attribute on the main component container. |
151
- | `icons` | `{[iconName]: JSX.Element, ... }` | `{ }` | Replace the built-in icons by specifying them here. See [Themes](#themes--styles). | |
152
- | `minWidth` | `number\|string` (CSS value) | `250` | Minimum width for the editor container. |
153
- | `maxWidth` | `number\|string` (CSS value) | `600` | Maximum width for the editor container. |
154
- | `rootFontSize` | `number\|string` (CSS value) | `16px` | The "base" font size from which all other sizings are derived (in `em`s). By changing this you will scale the entire component. container. |
155
- | `customNodeDefinitions` | `CustomNodeDefinition[]` | | You can provide customised components to override specific nodes in the data tree, according to a condition function. See see [Custom nodes](#custom-nodes) for more detail. (A simple custom component to turn url strings into active links is provided in the main package -- see [here](#active-hyperlinks)) |
156
- | `customText` | `CustomTextDefinitions` | | In addition to [localising the component](#localisation) text strings, you can also *dynamically* alter it, depending on the data. See [Custom Text](#custom-text) for more detail. |
157
- | `customButtons` | `CustomButtonDefinition[]` | `[]` | You can add your own buttons to the Edit Buttons panel if you'd like to be able to perform a custom operation on the data. See [Custom Buttons](#custom-buttons) |
158
- | `jsonParse` | `(input: string) => JsonData` | `JSON.parse` | When editing a block of JSON directly, you may wish to allow some "looser" input -- e.g. 'single quotes', trailing commas, or unquoted field names. In this case, you can provide a third-party JSON parsing method. I recommend [JSON5](https://json5.org/), which is what is used in the [Demo](https://carlosnz.github.io/json-edit-react/) |
159
- | `jsonStringify` | `(data: JsonData) => string` | `(data) => JSON.stringify(data, null, 2)` | Similarly, you can override the default presentation of the JSON string when starting editing JSON. You can supply different formatting parameters to the native `JSON.stringify()`, or provide a third-party option, like the aforementioned JSON5. |
160
- | `errorMessageTimeout` | `number` | `2500` | Time (in milliseconds) to display the error message in the UI. | |
161
- | `keyboardControls` | `KeyboardControls` | As explained [above](#usage) | Override some or all of the keyboard controls. See [Keyboard customisation](#keyboard-customisation) for details. | |
162
- | `insertAtTop` | `boolean\| "object \| "array"` | `false` | If `true`, inserts new values at the *top* rather than bottom. Can set the behaviour just for arrays or objects by setting to `"object"` or `"array"` respectively. | |
123
+ The only *required* property is `data` (although you will need to provide a `setData` method to update your data).
124
+
125
+ ### Data management
126
+
127
+ | Prop | Type | Default | Description |
128
+ | ----------------- | ----------------------- | ------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
129
+ | `data` | `object\|array` | none | The data to be displayed / edited |
130
+ | `setData` | `object\|array => void` | none | Method to update your `data` object. See [Managing state](#managing-state) below for additional notes. |
131
+ | `onUpdate` | `UpdateFunction` | none | A function to run whenever a value is **updated** (edit, delete *or* add) in the editor. See [Update functions](#update-functions). |
132
+ | `onEdit` | `UpdateFunction` | none | A function to run whenever a value is **edited**. |
133
+ | `onDelete` | `UpdateFunction` | none | A function to run whenever a value is **deleted**. |
134
+ | `onAdd` | `UpdateFunction` | none | A function to run whenever a new property is **added**. |
135
+ | `onChange` | `OnChangeFunction` | none | A function to modify/constrain user input as they type — see [OnChange functions](#onchange-function). |
136
+ | `onError` | `OnErrorFunction` | none | A function to run whenever the component reports an error — see [OnErrorFunction](#onerror-function). |
137
+ | `enableClipboard` | `boolean\|CopyFunction` | `true` | Whether or not to enable the "Copy to clipboard" button in the UI. If a function is provided, `true` is assumed and this function will be run whenever an item is copied — see [Copy Function](#copy-function) |
138
+
139
+
140
+ ### Restricting editing
141
+
142
+ | Prop | Type | Default | Description |
143
+ | ----------------------- | ----------------------------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
144
+ | `restrictEdit` | `boolean\|FilterFunction` | `false` | If `true`, no editing at all is permitted. A function can be provided for more specificity — see [Filter functions](#filter-functions) |
145
+ | `restrictDelete` | `boolean\|FilterFunction` | `false` | As with `restrictEdit` but for deletion |
146
+ | `restrictAdd` | `boolean\|FilterFunction` | `false` | As with `restrictEdit` but for adding new properties |
147
+ | `restrictTypeSelection` | `boolean\|DataType[]\|TypeFilterFunction` | `false` | For restricting the data types the user can select. Can be a list of data types (e.g. `[ 'string', 'number', 'boolean', 'array', 'object', 'null' ]`), a boolean. or a function — see [TypeFilterFunction](#typefilterfunction) |
148
+ | `restrictDrag` | `boolean\|FilterFunction` | `true` | Set to `false` to enable drag and drop functionality — see [Drag-n-drop](#drag-n-drop) |
149
+
150
+ ### Look and Feel / UI
151
+
152
+ | Prop | Type | Default | Description |
153
+ | ----------------------- | --------------------------------- | --------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
154
+ | `theme` | `ThemeInput` | `default` | Either one of the built-in themes (imported separately), or an object specifying some or all theme properties — see [Themes](#themes--styles). |
155
+ | `icons` | `{[iconName]: JSX.Element, ... }` | `{ }` | Replace the built-in icons by specifying them here — see [Themes](#themes--styles). | |
156
+ | `indent` | `number` | `3` | Specify the amount of indentation for each level of nesting in the displayed data. |
157
+ | `collapse` | `boolean\|number\|FilterFunction` | `false` | Defines which nodes of the JSON tree will be displayed "opened" in the UI on load. If `boolean`, it'll be either all or none. A `number` specifies a nesting depth after which nodes will be closed. For more fine control a function can be provided — see [Filter functions](#filter-functions). |
158
+ | `collapseAnimationTime` | `number` | `300` | Time (in milliseconds) for the transition animation when collapsing collection nodes. |
159
+ | `rootName` | `string` | `"data"` | A name to display in the editor as the root of the data object. |
160
+ | `showArrayIndices` | `boolean` | `true` | Whether or not to display the index (as a property key) for array elements. |
161
+ | `showStringQuotes` | `boolean` | `true` | Whether or not to display string values in "quotes". |
162
+ | `showCollectionCount` | `boolean\|"when-closed"` | `true` | Whether or not to display the number of items in each collection (object or array). |
163
+ | `stringTruncate` | `number` | `250` | String values longer than this many characters will be displayed truncated (with `...`). The full string will always be visible when editing. |
164
+ | `keySort` | `boolean\|CompareFunction` | `false` | If `true`, object keys will be ordered (using default JS `.sort()`). A [compare function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) can also be provided to define sorting behaviour, except the input type should be a tuple of the key and the value of a node i.e. `(a: [string \| number, ValueData], b: [string \| number, ValueData]) => number` |
165
+ | `minWidth` | `number\|string` (CSS value) | `250` | Minimum width for the editor container. |
166
+ | `maxWidth` | `number\|string` (CSS value) | `600` | Maximum width for the editor container. |
167
+ | `rootFontSize` | `number\|string` (CSS value) | `16px` | The "base" font size from which all other sizings are derived (in `em`s). By changing this you will scale the entire component container. |
168
+ | `insertAtTop` | `boolean\| "object \| "array"` | `false` | If `true`, inserts new values at the *top* rather than bottom. Can set the behaviour just for arrays or objects by setting to `"object"` or `"array"` respectively. | |
169
+ | `errorMessageTimeout` | `number` | `2500` | Time (in milliseconds) to display the error message in the UI. | |
170
+ | `showErrorMessages` | `boolean ` | `true` | Whether or not the component should display its own error messages (you'd probably only want to disable this if you provided your own `onError` function) |
171
+
172
+
173
+ ### Search and Filtering
174
+
175
+ | Prop | Type | Default | Description |
176
+ | -------------------- | --------------------------------------------- | ----------- | --------------------------------------------------------------------------------------------------------------- |
177
+ | `searchText` | `string` | `undefined` | Data visibility will be filtered by matching against value, using the method defined below in `searchFilter` |
178
+ | `searchFilter` | `"key"\|"value"\|"all"\|SearchFilterFunction` | `undefined` | Define how `searchText` should be matched to filter the visible items. See [Search/Filtering](#searchfiltering) |
179
+ | `searchDebounceTime` | `number` | `350` | Debounce time when `searchText` changes |
180
+
181
+
182
+ ### Custom components & overrides (incl. Localisation)
183
+
184
+ | Prop | Type | Default | Description |
185
+ | ----------------------- | --------------------------------- | ----------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
186
+ | `customNodeDefinitions` | `CustomNodeDefinition[]` | | You can provide custom React components to override specific nodes in the data tree, according to a condition function — see [Custom nodes](#custom-nodes). (A simple custom component to turn url strings into active links is provided in the main package — see [here](#active-hyperlinks)) |
187
+ | `customButtons` | `CustomButtonDefinition[]` | `[]` | You can add your own buttons to the Edit Buttons panel if you'd like to be able to perform a custom operation on the data. See [Custom Buttons](#custom-buttons) |
188
+ | `translations` | `LocalisedStrings` object | `{ }` | UI strings (such as error messages) can be translated by passing an object containing localised string values (there are only a few). See [Localisation](#localisation) |
189
+ | `customText` | `CustomTextDefinitions` | | In addition to [localising the component](#localisation) text strings, you can also *dynamically* alter it, depending on the data. See [Custom Text](#custom-text) for more detail. |
190
+ | `TextEditor` | `ReactComponent<TextEditorProps>` | | Pass a component to offer a custom text/code editor when editing full JSON object as text. [See details](#full-object-editing) |
191
+ | `jsonParse` | `(input: string) => JsonData` | `JSON.parse` | When editing a block of JSON directly, you may wish to allow some "looser" input -- e.g. 'single quotes', trailing commas, or unquoted field names. In this case, you can provide a third-party JSON parsing method. I recommend [JSON5](https://json5.org/), which is what is used in the [Demo](https://carlosnz.github.io/json-edit-react/) |
192
+ | `jsonStringify` | `(data: JsonData) => string` | `(data) => JSON.stringify(data, null, 2)` | Similarly, you can override the default presentation of the JSON string when starting editing JSON. You can supply different formatting parameters to the native `JSON.stringify()`, or provide a third-party option, like the aforementioned JSON5. |
193
+ | `keyboardControls` | `KeyboardControls` | As explained [above](#usage) | Override some or all of the keyboard controls. See [Keyboard customisation](#keyboard-customisation) for details. | |
194
+
195
+ ### Miscellaneous
196
+
197
+ | Prop | Type | Default | Description |
198
+ | -------------- | --------------------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
199
+ | `defaultValue` | `any\|DefaultValueFilterFunction` | `null` | When a new property is added, it is initialised with this value. A [function can be provided](#filter-functions) with the almost the same input as the `FilterFunction`s, but should output a value. This allows a different default value to be used depending on the data state (e.g. default for top level is an object, but a string elsewhere.) |
200
+ | `id` | `string` | none | Name for the HTML `id` attribute on the main component container. |
201
+ | `className` | `string` | none | Name of a CSS class to apply to the overall component. In most cases, specifying `theme` properties will be more straightforward. |
202
+
203
+
204
+ ----
163
205
 
164
206
  ## Managing state
165
207
 
166
- It is recommended that you manage the `data` state yourself outside this component -- just pass in a `setData` method, which is called internally to update your `data`. However, this is not compulsory -- if you don't provide a `setData` method, the data will be managed internally, which would be fine if you're not doing anything with the data. The alternative is to use the [Update functions](#update-functions) to update your `data` externally, but this is not recommended except in special circumstances as you can run into issues keeping your data in sync with the internal state (which is what is displayed), as well as unnecessary re-renders. Update functions should be ideally be used only for implementing side effects, checking for errors, or mutating the data before setting it with `setData`.
208
+ It is recommended that you manage the `data` state yourself outside this component — just pass in a `setData` method, which is called internally to update your `data`. However, this is not compulsory -- if you don't provide a `setData` method, the data will be managed internally, which would be fine if you're not doing anything with the data. The alternative is to use the [Update functions](#update-functions) to update your `data` externally, but this is not recommended except in special circumstances as you can run into issues keeping your data in sync with the internal state (which is what is displayed), as well as unnecessary re-renders. Update functions should ideally be used only for implementing side effects (e.g. notifications), validation, or mutating the data before setting it with `setData`.
167
209
 
168
210
  ## Update functions
169
211
 
@@ -240,29 +282,18 @@ Normally, the component will display simple error messages whenever an error con
240
282
  A similar callback is executed whenever an item is copied to the clipboard (if passed to the `enableClipboard` prop), but with a different input parameter:
241
283
 
242
284
  ```js
243
- key // name of the property being copied
244
- path // path to the property
245
- value // the value copied to the clipboard
246
- type // Either "path" or "value" depending on whether "Cmd/Ctrl" was pressed
247
- stringValue // A nicely stringified version of `value`
248
- // (i.e. what the clipboard actually receives)
285
+ key // name of the property being copied
286
+ path // path to the property
287
+ value // the value copied to the clipboard
288
+ type // Either "path" or "value" depending on whether "Cmd/Ctrl" was pressed
289
+ stringValue // A nicely stringified version of `value`
290
+ // (i.e. what the clipboard actually receives)
291
+ success // true/false -- whether clipboard copy action actually succeeded
292
+ errorMessage // Error detail if `success === false`
249
293
  ```
250
294
 
251
- Since there is very little user feedback when clicking "Copy", a good idea would be to present some kind of notification in this callback.
295
+ Since there is very little user feedback when clicking "Copy", a good idea would be to present some kind of notification in this callback (see [Demo](https://carlosnz.github.io/json-edit-react/)). There are situations (such as an insecure environment) where the browser won't actually permit any clipboard actions. In this case, the `success` property will be `false`, so you can handle it appropriately.
252
296
 
253
- ### Custom Buttons
254
-
255
- In addition to the "Copy", "Edit" and "Delete" buttons that appear by each value, you can add your own buttons if you need to allow some custom operations on the data. Provide an array of button definitions in the `customButtons` prop, in the following definition structure:
256
-
257
- ```ts
258
- {
259
- Element: React.FC<{ nodeData: NodeData }>,
260
- onClick?: (nodeData: NodeData, e: React.MouseEvent) => void
261
- }
262
- ```
263
- Where `NodeData` is the same data structure received by the previous "Update Functions".
264
-
265
- The `onClick` is optional -- don't provide it if you have your own `onClick` handler within your button component.
266
297
 
267
298
  ## Filter functions
268
299
 
@@ -286,6 +317,8 @@ The function receives the following object:
286
317
 
287
318
  A Filter function is available for the `collapse` prop as well, so you can have your data appear with deeply-nested collections opened up, while collapsing everything else, for example.
288
319
 
320
+ ### TypeFilterFunction
321
+
289
322
  For restricting data types, the (Type) filter function is slightly more sophisticated. The input is the same, but the output can be either a `boolean` (which would restrict the available types for a given node to either *all* or *none*), or an array of data types to be restricted to. The available values are:
290
323
  - `"string"`
291
324
  - `"number"`
@@ -384,9 +417,6 @@ return
384
417
 
385
418
  ### Drag-n-drop
386
419
 
387
- > [!NOTE]
388
- > *This is a new feature and should be considered "experimental". Please provide [feedback or suggestions](https://github.com/CarlosNZ/json-edit-react/issues) to help improve it.*
389
-
390
420
  The `restrictDrag` property controls which items (if any) can be dragged into new positions. By default, this is *off*, so you must set `restrictDrag = false` to enable this functionality. Like the Edit restrictions above, this property can also take a Filter function for fine-grained control. There are a couple of additional considerations, though:
391
421
 
392
422
  - Javascript does *not* guarantee object property order, so enabling this feature may yield unpredictable results. See [here](https://dev.to/frehner/the-order-of-js-object-keys-458d) for an explanation of how key ordering is handled. It is strongly advised that you only enable drag-and-drop functionality if:
@@ -396,9 +426,26 @@ The `restrictDrag` property controls which items (if any) can be dragged into ne
396
426
  - To be draggable, the node must *also* be delete-able (via the `restrictDelete` prop), as dragging a node to a new destination is essentially just deleting it and adding it back elsewhere.
397
427
  - Similarly, the destination collection must be editable in order to drop it in there. This means that, if you've gone to the trouble of configuring restrictive editing constraints using Filter functions, you can be confident that they can't be circumvented via drag-n-drop.
398
428
 
429
+ ## Full object editing
430
+
431
+ The user can edit the entire JSON object (or a sub-node) as raw text (provided you haven't restricted it using a [`restrictEdit` function](#filter-functions)). By default, we just display a native HTML [textarea](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea) element for plain-text editing. However, you can offer a more sophisticated text/code editor by passing the component into the `TextEditor` prop. Your component must provide the following props for json-edit-react to use:
432
+
433
+ - `value: string` — the current text
434
+ - `onChange: (value: string) => void` — should be called on every keystroke to update `value`
435
+ - `onKeyDown: (e: React.KeyboardEvent) => void` — should be called on every keystroke to detect "Accept"/"Cancel" keys
436
+
437
+ You can see an example in the [demo](https://carlosnz.github.io/json-edit-react/) where I have implemented [**CodeMirror**](https://codemirror.net/) when the "Custom Text Editor" option is checked. It changes the native editor (on the left) into the one shown on the right:
438
+
439
+ <img width="800" alt="Text editor comparison" src="image/text-editor-comparison.png">
440
+
441
+ See the codebase for the exact implementation details:
442
+
443
+ - [Simple component that wraps CodeMirror](https://github.com/CarlosNZ/json-edit-react/blob/main/demo/src/CodeEditor.tsx)
444
+ - [Prop passed to json-edit-react](https://github.com/CarlosNZ/json-edit-react/blob/d6e3c39d1fe876fa8ed267301ebecf128132b602/demo/src/App.tsx#L450-L465)
445
+
399
446
  ## Search/Filtering
400
447
 
401
- The displayed data can be filtered based on search input from a user. The user input should be captured independently (we don't provide a UI here) and passed in with the `searchText` prop. This input is debounced internally (time can be set with the `searchDebounceTime` prop), so no need for that as well. The values that the `searchText` are tested against is specified with the `searchFilter` prop. By default (no `searchFilter` defined), it will match against the data *values* (with case-insensitive partial matching -- i.e. input "Ilb", will match value "Bilbo").
448
+ The displayed data can be filtered based on search input from a user. The user input should be captured independently (we don't provide a UI here) and passed in with the `searchText` prop. This input is debounced internally (time can be set with the `searchDebounceTime` prop), so no need for that as well. The values that the `searchText` are tested against is specified with the `searchFilter` prop. By default (no `searchFilter` defined), it will match against the data *values* (with case-insensitive partial matching — i.e. input "Ilb", will match value "Bilbo").
402
449
 
403
450
  You can specify what should be matched by setting `searchFilter` to either `"key"` (match property names), `"value"` (the default described above), or `"all"` (match both properties and values). This should be enough for the majority of use cases, but you can specify your own `SearchFilterFunction`. The search function is the same signature as the above [FilterFunctions](#filter-functions) but takes one additional argument for the `searchText`, i.e.
404
451
 
@@ -443,7 +490,7 @@ const MyApp = () => {
443
490
  }
444
491
  ```
445
492
 
446
- The following themes are available in the package (although realistically, these exist more to showcase the capabilities — I'm open to better built-in themes, so feel free to [create an issue](https://github.com/CarlosNZ/json-edit-react/issues) with suggestions):
493
+ The following themes are available in the package (although realistically, these exist more to showcase the capabilities — I'm open to better built-in themes, so feel free to [create an issue](https://github.com/CarlosNZ/json-edit-react/issues) with suggestions):
447
494
  - `githubDarkTheme`
448
495
  - `githubLightTheme`
449
496
  - `monoDarkTheme`
@@ -491,7 +538,7 @@ However, you can pass in your own theme object, or part thereof. The theme struc
491
538
  The `styles` property is the main one to focus on. Each key (`property`, `bracket`, `itemCount`) refers to a part of the UI. The value for each key is *either*:
492
539
  - a `string`, in which case it is interpreted as the colour (or background colour in the case of `container` and `inputHighlight`)
493
540
  - a full CSS style object for fine-grained definition. You only need to provide properties you wish to override — all unspecified ones will fallback to either the default theme, or another theme that you specify as the "base".
494
- - a "Style Function", which is a function that takes the same input as [Filter Functions](#filter-functions), but returns a CSS style object (or `null`). This allows you to *dynamically* change styling of various elements based on content or structure.
541
+ - a "Style Function", which is a function that takes the same input as [Filter Functions](#filter-functions), but returns a CSS style object (or `null`). This allows you to *dynamically* change styling of various elements based on content or structure. (An example is in the [Demo](https://carlosnz.github.io/json-edit-react/?data=customNodes) "Custom Nodes" data set, where the character names are styled larger than other string values)
495
542
  - an array containing any combination of the above, in which case they are merged together. For example, you could provide a Theme Function with styling for a very specific condition, but then provide "fallback" styles whenever the function returns `null`. (In the array, the *later* items have higher precedence)
496
543
 
497
544
  For a simple example, if you want to use the "githubDark" theme, but just change a couple of small things, you'd specify something like this:
@@ -554,7 +601,7 @@ iconEdit: [ "iconAdjust", "anotherFragment", { marginLeft: "1em" } ]
554
601
 
555
602
  ### A note about sizing and scaling
556
603
 
557
- Internally, all sizing and spacing is done in `em`s, never `px` (aside from the [`rootFontSize`](#props-overview), which sets the "base" size). This makes scaling a lot easier — just change the `rootFontSize` prop (or set `fontSize` on the main container via targeting the class, or tweaking the [theme](#themes--styles)), and watch the *whole* component scale accordingly.
604
+ Internally, all sizing and spacing is done in `em`s, never `px` (aside from the [`rootFontSize`](#look-and-feel--ui), which sets the "base" size). This makes scaling a lot easier — just change the `rootFontSize` prop (or set `fontSize` on the main container via targeting the class, or tweaking the [theme](#themes--styles)), and watch the *whole* component scale accordingly.
558
605
 
559
606
  ### Icons
560
607
 
@@ -686,6 +733,20 @@ customText = {
686
733
  }
687
734
  ```
688
735
 
736
+ ## Custom Buttons
737
+
738
+ In addition to the "Copy", "Edit" and "Delete" buttons that appear by each value, you can add your own buttons if you need to allow some custom operations on the data. Provide an array of button definitions in the `customButtons` prop, with the following definition structure:
739
+
740
+ ```ts
741
+ {
742
+ Element: React.FC<{ nodeData: NodeData }>,
743
+ onClick?: (nodeData: NodeData, e: React.MouseEvent) => void
744
+ }
745
+ ```
746
+ Where `NodeData` is the same data structure received by the previous "Update Functions".
747
+
748
+ The `onClick` is optional -- don't provide it if you have your own `onClick` handler within your button component.
749
+
689
750
  ## Keyboard customisation
690
751
 
691
752
  The default keyboard controls are [outlined above](#usage), but it's possible to customise/override these. Just pass in a `keyboardControls` prop with the actions you wish to override defined. The default config object is:
@@ -762,6 +823,7 @@ A few helper functions, components and types that might be useful in your own im
762
823
  - `CustomNodeProps`: all props passed internally to [Custom nodes](#custom-nodes); basically the same as `CollectionNodeProps` with an extra `customNodeProps` field for passing props unique to your component`
763
824
  - `DataType`: `"string"` | `"number"` | `"boolean"` | `"null"` | `"object"` | `"array"`
764
825
  - `KeyboardControls`: structure for [keyboard customisation](#keyboard-customisation) prop
826
+ - `TextEditorProps`: props for custom [Text Editor](#full-object-editing)
765
827
 
766
828
  ## Issues, bugs, suggestions?
767
829
 
@@ -780,6 +842,9 @@ This component is heavily inspired by [react-json-view](https://github.com/mac-s
780
842
 
781
843
  ## Changelog
782
844
 
845
+ - **1.22.0**:
846
+ - Option for [custom text/code editor](#full-object-editing) when editing full JSON object [#157](https://github.com/CarlosNZ/json-edit-react/issues/157)
847
+ - Handle clipboard copy errors [#159](https://github.com/CarlosNZ/json-edit-react/pull/159) (thanks @dm-xai) [#160](https://github.com/CarlosNZ/json-edit-react/issues/160)
783
848
  - **1.21.1**: Users can now navigate between nodes using "Tab"/"Shift-Tab" key
784
849
  - **1.20.0**: Refactor out direct access of global `document` object, which allows component to work with server-side rendering
785
850
  - **1.19.2**:
package/build/index.cjs.js CHANGED
@@ -1 +1 @@
1
- "use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("object-property-assigner"),r=require("object-property-extractor");function o(e,t,n,r){return new(n||(n=Promise))((function(o,a){function i(e){try{l(r.next(e))}catch(e){a(e)}}function s(e){try{l(r.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,s)}l((r=r.apply(e,t||[])).next())}))}"function"==typeof SuppressedError&&SuppressedError;const a=({className:t,name:n,value:r,setValue:o,handleKeyPress:a,styles:i,textAreaRef:s})=>{if("string"!=typeof r)return null;const l="\n"===r.slice(-1)?r+".":r;return e.jsxs("div",{style:{display:"grid"},children:[e.jsx("textarea",{id:`${n}_textarea`,ref:s,style:Object.assign({height:"auto",gridArea:"1 / 1 / 2 / 2",overflowY:"auto",whiteSpace:"pre-wrap"},i),rows:1,className:t,name:`${n}_textarea`,value:r,onChange:e=>o(e.target.value),autoFocus:!0,onFocus:e=>{r.length<40&&e.target.select()},onKeyDown:a}),e.jsx("span",{className:t,style:Object.assign({visibility:"hidden",height:"auto",gridArea:"1 / 1 / 2 / 2",color:"red",opacity:.9,whiteSpace:"pre-wrap",overflowY:"auto",border:"1px solid transparent"},i),children:l})]})},i=e=>null!==e&&"object"==typeof e,s=(e,t,n,r="")=>{if(!n&&!r)return!0;switch(e){case"collection":if(n){if(n(t,r))return!0;if(!l(r,t,n))return!1}if(!n&&r&&!l(r,t))return!1;break;case"value":if(n&&!n(t,r))return!1;if(!n&&r&&!c(t,r))return!1}return!0},l=(e="",t,n=c)=>{const r=t.value;return Object.entries(r).some((([o,a])=>{const s=[...t.path,o],c=Object.assign(Object.assign({},t),{key:o,path:s,level:t.level+1,value:a,size:s.length,parentData:r});return i(a)?l(e,c,n):n(c,e)}))},c=(e,t="")=>{const{value:n}=e;if(null===n&&"null".includes(t.toLowerCase()))return!0;switch(typeof n){case"string":return n.toLowerCase().includes(t.toLowerCase());case"number":return!!String(n).includes(t);case"boolean":return n?"true".includes(t.toLowerCase())||"1"===t:"false".includes(t.toLowerCase())||"0"===t;default:return!1}},d=({key:e,path:t},n="")=>!!c({value:e},n)||!!t.some((e=>c({value:e},n))),u=(e,t=200)=>"string"==typeof e?e.length<t?e:`${e.slice(0,t-2).trim()}...`:e,p=(e,t)=>(null!=t?t:"")+e.map((e=>""===e?String.fromCharCode(0):e)).join("."),m=e=>e.shiftKey?"Shift":e.metaKey?"Meta":e.ctrlKey?"Control":e.altKey?"Alt":void 0,g=(e,t,n)=>{const r=e.key,o=m(e);if(Array.isArray(t))return!!o&&t.includes(o);const{key:a,modifier:i}=t;return("stringLineBreak"!==n||"Enter"!==r||"Shift"!==o||"Enter"!==a||!(null==i?void 0:i.includes("Shift")))&&(r===a&&(i===o||Array.isArray(i)&&i.includes(o)))},h={key:"Enter"},y={confirm:h,cancel:{key:"Escape"},objectConfirm:Object.assign(Object.assign({},h),{modifier:["Meta","Shift","Control"]}),objectLineBreak:h,stringConfirm:h,stringLineBreak:Object.assign(Object.assign({},h),{modifier:["Shift"]}),numberConfirm:h,numberUp:{key:"ArrowUp"},numberDown:{key:"ArrowDown"},tabForward:{key:"Tab"},tabBack:{key:"Tab",modifier:"Shift"},booleanConfirm:h,booleanToggle:{key:" "},clipboardModifier:["Meta","Control"],collapseModifier:["Alt"]},f=(e,t,n="next",o)=>{const a=t.slice(0,t.length-1),s=t.slice(-1)[0];if(void 0===s)return null;const l=r(e,a),c=j(l);Array.isArray(l)||o(c,(({key:e,value:t})=>[e,t]));const d=c.findIndex((e=>e.key===s)),u=c[d+("next"===n?1:-1)];return u?i(u.value)?0===Object.keys(u.value).length?f(e,[...a,u.key],n,o):b(e,[...a,u.key],n,o):[...a,u.key]:0===a.length?null:f(e,a,n,o)},b=(e,t,n="next",o)=>{const a=r(e,t);if(!i(a))return t;const s=Array.isArray(a)?a.map(((e,t)=>t)):Object.keys(a);o(s,(e=>[e,a]));const l="next"===n?s[0]:s[s.length-1];return b(e,[...t,l],n,o)},j=e=>Array.isArray(e)?e.map(((e,t)=>({index:t,value:e,key:t}))):Object.entries(e).map((([e,t],n)=>({key:e,value:t,index:n}))),v=(e,t)=>{var n,r,o,a;const i=e.current,s=null!==(n=null==i?void 0:i.selectionStart)&&void 0!==n?n:1/0,l=null!==(r=null==i?void 0:i.selectionEnd)&&void 0!==r?r:1/0,c=(null===(o=null==i?void 0:i.textContent)||void 0===o?void 0:o.slice(0,s))+t+(null===(a=null==i?void 0:i.textContent)||void 0===a?void 0:a.slice(l));return i.value=c,null==i||i.setSelectionRange(s+1,s+1),c},x={displayName:"Default",fragments:{edit:"rgb(42, 161, 152)"},styles:{container:{backgroundColor:"#f6f6f6",fontFamily:"monospace"},collection:{},collectionInner:{},collectionElement:{},dropZone:{},property:"#292929",bracket:{color:"rgb(0, 43, 54)",fontWeight:"bold"},itemCount:{color:"rgba(0, 0, 0, 0.3)",fontStyle:"italic"},string:"rgb(203, 75, 22)",number:"rgb(38, 139, 210)",boolean:"green",null:{color:"rgb(220, 50, 47)",fontVariant:"small-caps",fontWeight:"bold"},input:["#292929"],inputHighlight:"#b3d8ff",error:{fontSize:"0.8em",color:"red",fontWeight:"bold"},iconCollection:"rgb(0, 43, 54)",iconEdit:"edit",iconDelete:"rgb(203, 75, 22)",iconAdd:"edit",iconCopy:"rgb(38, 139, 210)",iconOk:"green",iconCancel:"rgb(203, 75, 22)"}},E=t.createContext({getStyles:()=>({}),icons:{}}),D=({theme:t=x,icons:n={},docRoot:r,children:o})=>{const a=C(t,r);return e.jsx(E.Provider,{value:{getStyles:(e,t)=>"function"==typeof a[e]?a[e](t):a[e],icons:n},children:o})},w=()=>t.useContext(E),C=(e,t)=>{var n,r,o,a;const i={},s=(Array.isArray(e)?e:[e]).map((e=>S(e)?k({fragments:{},styles:e},i):k(e,i))),l=k(x,{});Object.keys(l).forEach((e=>{const t=e;s.forEach((e=>{e[t]&&(l[t]=Object.assign(Object.assign({},l[t]),e[t]))}))}));const c=Object.assign({},l);return Object.entries(i).forEach((([e,t])=>{const n=e;c[n]=e=>{const r=t(e)||{};return Object.assign(Object.assign({},l[n]),r)}})),"function"!=typeof(null==c?void 0:c.inputHighlight)&&(null===(n=null==c?void 0:c.inputHighlight)||void 0===n?void 0:n.backgroundColor)&&t.style.setProperty("--jer-highlight-color",null===(r=null==c?void 0:c.inputHighlight)||void 0===r?void 0:r.backgroundColor),"function"!=typeof(null==c?void 0:c.iconCopy)&&(null===(o=null==c?void 0:c.iconCopy)||void 0===o?void 0:o.color)&&t.style.setProperty("--jer-icon-copy-color",null===(a=null==c?void 0:c.iconCopy)||void 0===a?void 0:a.color),c},k=(e,t)=>{const{fragments:n,styles:r}=e,o={};return Object.entries(r).forEach((([e,r])=>{const a=(Array.isArray(r)?r:[r]).reduce(((r,o)=>{var a,i;if("function"==typeof o)return t[e]=o,Object.assign({},r);if("string"==typeof o){const t=null!==(a=null==n?void 0:n[o])&&void 0!==a?a:o;return"string"==typeof t?Object.assign(Object.assign({},r),{[null!==(i=O[e])&&void 0!==i?i:"color"]:t}):Object.assign(Object.assign({},r),t)}return Object.assign(Object.assign({},r),o)}),{});o[e]=a})),o},S=e=>!("styles"in e),O={container:"backgroundColor",collection:"backgroundColor",collectionInner:"backgroundColor",collectionElement:"backgroundColor",dropZone:"borderColor",inputHighlight:"backgroundColor"},N=t.createContext({collapseState:null,setCollapseState:()=>{},doesPathMatch:()=>!1,currentlyEditingElement:null,setCurrentlyEditingElement:()=>{},previouslyEditedElement:null,setPreviouslyEditedElement:()=>{},areChildrenBeingEdited:()=>!1,dragSource:{path:null,pathString:null},setDragSource:()=>{},tabDirection:"next",setTabDirection:()=>{}}),A=({children:n})=>{const[r,o]=t.useState(null),[a,i]=t.useState(null),[s,l]=t.useState({path:null,pathString:null}),c=t.useRef(null),d=t.useRef("next"),u=t.useRef(null);return e.jsx(N.Provider,{value:{collapseState:r,setCollapseState:e=>{o(e),null!==e&&setTimeout((()=>o(null)),2e3)},doesPathMatch:e=>{if(null===r)return!1;for(const[t,n]of r.path.entries())if(n!==e[t])return!1;return!0},currentlyEditingElement:a,setCurrentlyEditingElement:(e,t)=>{const n="string"==typeof e||null===e?e:p(e,"key"===t?"key_":void 0);null!==a&&null!==n&&null!==c.current&&c.current(),i(n),c.current="function"==typeof t?t:null},areChildrenBeingEdited:e=>null!==a&&a.includes(e),previouslyEditedElement:u.current,setPreviouslyEditedElement:e=>{u.current=e},tabDirection:d.current,setTabDirection:e=>{d.current=e},dragSource:s,setDragSource:l},children:n})},T=()=>t.useContext(N),R="**INVALID_FUNCTION**",M=({value:n,setValue:r,isEditing:o,path:i,setIsEditing:s,handleEdit:l,stringTruncate:c,showStringQuotes:d,nodeData:m,handleKeyboard:g,keyboardCommon:h})=>{const{getStyles:y}=w(),f=t.useRef(null),b=p(i),j=d?'"':"";return o?e.jsx(a,{className:"jer-input-text",textAreaRef:f,name:b,value:n,setValue:r,isEditing:o,handleKeyPress:e=>{g(e,Object.assign({stringConfirm:l,stringLineBreak:()=>{const e=v(f,"\n");r(e)}},h))},styles:y("input",m)}):e.jsxs("div",{id:`${b}_display`,onDoubleClick:()=>s(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&s(!0)},className:"jer-value-string",style:y("string",m),children:[j,u(n,c),j]})},P=({value:t,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:s,handleKeyboard:l,keyboardCommon:c})=>{const{getStyles:d}=w();return r?e.jsx("input",{className:"jer-input-number",type:"text",name:p(o),value:t,onChange:e=>n(e.target.value.replace(/[^0-9.-]/g,"")),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>l(e,Object.assign({numberConfirm:i,numberUp:()=>n(Number(t)+1),numberDown:()=>n(Number(t)-1)},c)),style:Object.assign({width:String(t).length/1.5+2+"em"},d("input",s))}):e.jsx("span",{onDoubleClick:()=>a(!0),className:"jer-value-number",style:d("number",s),children:t})},F=({value:t,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:s,handleKeyboard:l,keyboardCommon:c})=>{const{getStyles:d}=w();return r?e.jsx("input",{className:"jer-input-boolean",type:"checkbox",name:p(o),checked:t,onChange:()=>n(!t),onKeyDown:e=>{" "===e.key&&e.preventDefault(),l(e,Object.assign({booleanConfirm:i,booleanToggle:()=>n(!t)},c))},autoFocus:!0}):e.jsx("span",{onDoubleClick:()=>a(!0),className:"jer-value-boolean",style:d("boolean",s),children:String(t)})},V=({value:n,isEditing:r,setIsEditing:o,handleEdit:a,nodeData:i,handleKeyboard:s,keyboardCommon:l})=>{const{getStyles:c}=w(),d=t.useRef();t.useEffect((()=>{if(r)return d.current=window.setTimeout((()=>window.addEventListener("keydown",u)),100),()=>window.removeEventListener("keydown",u);window.clearTimeout(d.current)}),[r]);const u=e=>s(e,Object.assign({confirm:a},l));return e.jsx("div",{onDoubleClick:()=>o(!0),className:"jer-value-null",style:c("null",i),children:String(n)})},z=({value:t})=>{let n="Error!";switch(typeof t){case"string":t===R&&(n="Function");break;case"undefined":n="Undefined";break;case"symbol":n="Symbol"}return e.jsx("span",{className:"jer-value-invalid",children:n})},I=({size:t,style:n,className:r})=>e.jsxs("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,children:[e.jsx("path",{d:"M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4z"}),e.jsx("path",{d:"M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z"})]}),K=({size:t,style:n,className:r})=>e.jsxs("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,transform:"translate(0, 0.5)",children:[e.jsx("path",{d:"M7 17.013l4.413-.015 9.632-9.54c.378-.378.586-.88.586-1.414s-.208-1.036-.586-1.414l-1.586-1.586c-.756-.756-2.075-.752-2.825-.003L7 12.583v4.43zM18.045 4.458l1.589 1.583-1.597 1.582-1.586-1.585 1.594-1.58zM9 13.417l6.03-5.973 1.586 1.586-6.029 5.971L9 15.006v-1.589z"}),e.jsx("path",{d:"M5 21h14c1.103 0 2-.897 2-2v-8.668l-2 2V19H8.158c-.026 0-.053.01-.079.01-.033 0-.066-.009-.1-.01H5V5h6.847l2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2z"})]}),L=({size:t,style:n,className:r})=>e.jsx("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,children:e.jsx("path",{d:"M6 19a2 2 0 002 2h8a2 2 0 002-2V7H6v12m2.46-7.12l1.41-1.41L12 12.59l2.12-2.12 1.41 1.41L13.41 14l2.12 2.12-1.41 1.41L12 15.41l-2.12 2.12-1.41-1.41L10.59 14l-2.13-2.12M15.5 4l-1-1h-5l-1 1H5v2h14V4h-3.5z"})}),_=({size:t,style:n,className:r})=>e.jsxs("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:t,height:t,className:r,style:n,children:[e.jsx("path",{d:"M9 2 H15 A1 1 0 0 1 16 3 V5 A1 1 0 0 1 15 6 H9 A1 1 0 0 1 8 5 V3 A1 1 0 0 1 9 2 z"}),e.jsx("path",{d:"M8 4H6a2 2 0 00-2 2v14a2 2 0 002 2h12a2 2 0 002-2v-2M16 4h2a2 2 0 012 2v4M21 14H11"}),e.jsx("path",{d:"M15 10l-4 4 4 4"})]}),B=({size:t,style:n,className:r})=>e.jsxs("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:t,height:t,className:r,style:n,children:[e.jsx("path",{d:"M22 11.08V12a10 10 0 11-5.93-9.14"}),e.jsx("path",{d:"M22 4L12 14.01l-3-3"})]}),W=({size:t,style:n,className:r})=>e.jsx("svg",{baseProfile:"tiny",viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,children:e.jsx("path",{d:"M12 4c-4.411 0-8 3.589-8 8s3.589 8 8 8 8-3.589 8-8-3.589-8-8-8zm-5 8c0-.832.224-1.604.584-2.295l6.711 6.711A4.943 4.943 0 0112 17c-2.757 0-5-2.243-5-5zm9.416 2.295L9.705 7.584A4.943 4.943 0 0112 7c2.757 0 5 2.243 5 5 0 .832-.224 1.604-.584 2.295z"})}),G=({size:t,style:n,className:r})=>e.jsx("svg",{viewBox:"0 0 512 512",fill:"currentColor",width:t,height:t,className:r,style:n,children:e.jsx("path",{d:"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"})}),U=({name:t,nodeData:n,rotate:r})=>{var o,a,i,s,l,c,d;const{getStyles:u,icons:p}=w(),m={size:"1.4em",className:"jer-icon"};switch(t){case"add":return null!==(o=null==p?void 0:p.add)&&void 0!==o?o:e.jsx(I,Object.assign({},m,{style:u("iconAdd",n)}));case"edit":return null!==(a=null==p?void 0:p.edit)&&void 0!==a?a:e.jsx(K,Object.assign({},m,{style:u("iconEdit",n)}));case"delete":return null!==(i=null==p?void 0:p.delete)&&void 0!==i?i:e.jsx(L,Object.assign({},m,{style:u("iconDelete",n),size:"1.45em"}));case"copy":return null!==(s=null==p?void 0:p.copy)&&void 0!==s?s:e.jsx(_,Object.assign({},m,{style:u("iconCopy",n),size:"1.2em"}));case"ok":return null!==(l=null==p?void 0:p.ok)&&void 0!==l?l:e.jsx(B,Object.assign({},m,{style:Object.assign({fontSize:"90%"},u("iconOk",n))}));case"cancel":return null!==(c=null==p?void 0:p.cancel)&&void 0!==c?c:e.jsx(W,Object.assign({},m,{style:Object.assign({fontSize:"130%"},u("iconCancel",n))}));case"chevron":return null!==(d=null==p?void 0:p.chevron)&&void 0!==d?d:e.jsx(G,{size:"1em",style:u("iconCollection",n)});default:return e.jsx(e.Fragment,{})}},H=({startEdit:n,handleDelete:r,handleAdd:o,enableClipboard:a,type:i,customButtons:s,nodeData:l,translate:c,keyboardControls:d,handleKeyboard:u})=>{const{getStyles:p}=w(),g=c("KEY_NEW",l),[h,y]=t.useState(!1),[f,b]=t.useState(g),{key:j,path:v,value:x}=l;return e.jsxs("div",{className:"jer-edit-buttons",style:{opacity:h?1:void 0},children:[a&&e.jsx("div",{onClick:e=>{e.stopPropagation();let t,n="value",r="";if(a){const o=m(e);o&&d.clipboardModifier.includes(o)?(t=$(v),r=t,n="path"):(t=x,r=i?JSON.stringify(x,null,2):String(t)),navigator.clipboard.writeText(r)}"function"==typeof a&&a({value:t,stringValue:r,path:v,key:j,type:n})},className:"jer-copy-pulse",children:e.jsx(U,{name:"copy",nodeData:l})}),n&&e.jsx("div",{onClick:e=>{e.stopPropagation(),n()},children:e.jsx(U,{name:"edit",nodeData:l})}),r&&e.jsx("div",{onClick:e=>{e.stopPropagation(),r()},children:e.jsx(U,{name:"delete",nodeData:l})}),o&&e.jsx("div",{onClick:e=>{e.stopPropagation(),"object"===i?y(!0):o("")},children:e.jsx(U,{name:"add",nodeData:l})}),null==s?void 0:s.map((({Element:t,onClick:n},r)=>e.jsx("div",{onClick:e=>n&&n(l,e),children:e.jsx(t,{nodeData:l})},r))),h&&o&&"object"===i&&e.jsxs(e.Fragment,{children:[e.jsx("input",{className:"jer-input-new-key",type:"text",name:"new-object-key",value:f,onChange:e=>b(e.target.value),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>{u(e,{stringConfirm:()=>{o&&(y(!1),o(f),b(g))},cancel:()=>{y(!1),b(g)}})},style:p("input",l)}),e.jsx(Y,{onOk:e=>{f&&(e.stopPropagation(),y(!1),o(f))},onCancel:e=>{e.stopPropagation(),y(!1)},nodeData:l})]})]})},Y=({onOk:t,onCancel:n,nodeData:r})=>e.jsxs("div",{className:"jer-confirm-buttons",children:[e.jsx("div",{onClick:t,children:e.jsx(U,{name:"ok",nodeData:r})}),e.jsx("div",{onClick:n,children:e.jsx(U,{name:"cancel",nodeData:r})})]}),$=e=>e.reduce(((e,t)=>"number"==typeof t?`${e}[${t}]`:""===e?t:`${e}.${t}`),""),J=["string","number","boolean","null","object","array"],X=(e=[],t)=>{const n=e.filter((({condition:e})=>e(t)));if(0===n.length)return{};const r=n[0],{element:o,wrapperElement:a,customNodeProps:i,wrapperProps:s,hideKey:l=!1,showEditTools:c=!0,showOnEdit:d=!1,showOnView:u=!0,showCollectionWrapper:p=!0}=r,m=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n}(r,["element","wrapperElement","customNodeProps","wrapperProps","hideKey","showEditTools","showOnEdit","showOnView","showCollectionWrapper"]);return Object.assign({CustomNode:o,CustomWrapper:a,customNodeProps:i,wrapperProps:s,hideKey:l,showEditTools:c,showOnEdit:d,showOnView:u,showCollectionWrapper:p},m)},Z=({props:e,collapsed:n})=>{const{data:r,nodeData:o,parentData:a,onEdit:i,onError:s,showErrorMessages:l,restrictEditFilter:c,restrictDeleteFilter:d,restrictAddFilter:u,restrictDragFilter:m,translate:g,errorMessageTimeout:h}=e,{currentlyEditingElement:y,setCurrentlyEditingElement:f}=T(),[b,j]=t.useState(null),v=Object.assign(Object.assign({},o),{collapsed:n}),{path:x,key:E,size:D}=v,w=p(x),C=t.useMemo((()=>!c(v)),[v]),k=t.useMemo((()=>!d(v)),[v]),S=t.useMemo((()=>!u(v)),[v]),O=t.useMemo((()=>!m(v)&&k&&null===y),[v]),N=e=>{l&&(j(e),setTimeout((()=>j(null)),h)),console.warn("Error",e)},A=t.useMemo((()=>(e,t)=>{N(e.message),s&&s({currentData:v.fullData,errorValue:t,currentValue:r,name:E,path:x,error:e})}),[s,l]),R=y===w,M=y===`key_${w}`,P="number"==typeof x.slice(-1)[0];return{pathString:w,nodeData:v,path:x,name:E,size:D,canEdit:C,canDelete:k,canAdd:S,canDrag:O,error:b,showError:N,onError:A,setError:j,handleEditKey:e=>{if(f(null),E===e)return;if(!a)return;const t=x.slice(0,-1);if(Object.keys(a).includes(e))return void A({code:"KEY_EXISTS",message:g("ERROR_KEY_EXISTS",v)},e);const n=Object.fromEntries(Object.entries(a).map((([t,n])=>t===E?[e,n]:[t,n])));i(n,t).then((t=>{t&&A({code:"UPDATE_ERROR",message:t},e)}))},derivedValues:{isEditing:R,isEditingKey:M,isArray:P,canEditKey:null!==a&&C&&S&&k&&!P}}},q=({canDrag:n,canDragOnto:r,path:o,nodeData:a,onMove:i,onError:s,translate:l})=>{const{getStyles:c}=w(),{dragSource:d,setDragSource:u}=T(),[m,g]=t.useState(!1),h=p(o),y=t.useMemo((()=>n?{onDragStart:e=>{e.stopPropagation(),u({path:o,pathString:h})},onDragEnd:e=>{e.stopPropagation(),u({path:null,pathString:null})}}:{}),[n]),f=t.useMemo((()=>e=>r?{onDragOver:e=>{e.stopPropagation(),e.preventDefault()},onDrop:t=>{t.stopPropagation(),j(e),u({path:null,pathString:null}),g(!1)},onDragEnter:t=>{var n;t.stopPropagation(),h.startsWith(null!==(n=d.pathString)&&void 0!==n?n:"")||g(e)},onDragExit:e=>{e.stopPropagation(),g(!1)}}:{}),[d,r]),b=t.useMemo((()=>r&&null!==d.pathString?e.jsx("div",Object.assign({className:"jer-drop-target-bottom",style:{height:"50%",position:"absolute",width:"100%",top:"50%",zIndex:o.length}},f("below"))):null),[d,r]),j=e=>{var t,n;const r=null===(t=d.path)||void 0===t?void 0:t.slice(-1)[0],c=null===(n=d.path)||void 0===n?void 0:n.slice(0,-1).join("."),u=o.slice(0,-1).join(""),{parentData:p}=a;"string"==typeof r&&p&&!Array.isArray(p)&&Object.keys(p).includes(r)&&r in p&&c!==u?s({code:"KEY_EXISTS",message:l("ERROR_KEY_EXISTS",a)},r):i(d.path,o,e).then((e=>{e&&s({code:"UPDATE_ERROR",message:e},a.value)}))};return{dragSourceProps:y,getDropTargetProps:f,BottomDropTarget:b,DropTargetPadding:({position:t,nodeData:n})=>m===t?e.jsx("div",{className:"jer-drag-n-drop-padding",style:c("dropZone",n)}):null,handleDrop:j}},Q=(e,t,n)=>{var r,o,a;const i=parseInt(null!==(r=getComputedStyle(n.current).getPropertyValue("line-height"))&&void 0!==r?r:"16px"),s=(null!==(a=null===(o=t.current)||void 0===o?void 0:o.offsetWidth)&&void 0!==a?a:0)/(.5*i),l=JSON.stringify(e,null,2).replace(/\\n/g,"\n").split("\n").map((e=>Math.ceil(e.length/s))).reduce(((e,t)=>e+t),0)*i;return Math.min(l+30,window.innerHeight-50)},ee=n=>{const{data:r,parentData:o,onEdit:a,onDelete:i,onChange:l,onMove:c,enableClipboard:d,canDragOnto:u,restrictTypeSelection:p,searchFilter:m,searchText:g,showLabel:h,stringTruncate:y,showStringQuotes:b,indent:j,translate:v,customNodeDefinitions:x,handleKeyboard:E,keyboardControls:D,sort:C}=n,{getStyles:k}=w(),{setCurrentlyEditingElement:S,setCollapseState:O,previouslyEditedElement:N,setPreviouslyEditedElement:A,tabDirection:M,setTabDirection:P}=T(),[F,V]=t.useState("function"==typeof r?R:r),{pathString:z,nodeData:I,path:K,name:L,canEdit:_,canDelete:B,canDrag:W,error:G,onError:U,handleEditKey:$,derivedValues:Q}=Z({props:n}),{dragSourceProps:ee,getDropTargetProps:oe,BottomDropTarget:ae,DropTargetPadding:ie}=q({canDrag:W,canDragOnto:u,path:K,nodeData:I,onMove:c,onError:U,translate:v}),se=X(x,I),[le,ce]=t.useState(te(r,se)),de=t.useCallback((e=>{if(!l)return void V(e);const t=l({currentData:I.fullData,newValue:e,currentValue:F,name:L,path:K});V(t)}),[l]);t.useEffect((()=>{V("function"==typeof r?R:r),ce(te(r,se))}),[r,G]);const{CustomNode:ue,customNodeProps:pe,hideKey:me,showEditTools:ge=!0,showOnEdit:he,showOnView:ye}=se,fe=[...J,...x.filter((({showInTypesSelector:e=!1,name:t})=>e&&!!t)).map((({name:e})=>e))],be=t.useMemo((()=>{if("boolean"==typeof p)return p?[]:fe;if(Array.isArray(p))return p;const e=p(I);return"boolean"==typeof e?e?[]:fe:e}),[I,p]),{isEditing:je}=Q,ve=s("value",I,m,g);if(je&&(!ve||!_)){const e=f(I.fullData,K,M,C);S(e||N)}if(!ve)return null;const xe=()=>{let e;switch(S(null),le){case"object":e={[v("DEFAULT_NEW_KEY",I)]:F};break;case"array":e=null!=F?F:[];break;case"number":{const t=Number(F);e=isNaN(t)?0:t;break}default:e=F}a(e,K).then((t=>{t&&U({code:"UPDATE_ERROR",message:t},e)}))},Ee=()=>{S(null),V(r),ce(te(r,se))},{isEditingKey:De,canEditKey:we}=Q,Ce=!je&&G,ke=je&&be.length>0,Se="invalid"!==le&&!G&&ge,Oe=h&&De,Ne=h&&!De&&!me,Ae={value:F,parentData:o,setValue:de,isEditing:je,setIsEditing:_?()=>S(K):()=>{},handleEdit:xe,handleCancel:Ee,path:K,stringTruncate:y,showStringQuotes:b,nodeData:I,translate:v,handleKeyboard:E,keyboardCommon:{cancel:Ee,tabForward:()=>{P("next"),A(z);const e=f(I.fullData,K,"next",C);e&&(xe(),S(e))},tabBack:()=>{P("prev"),A(z);const e=f(I.fullData,K,"prev",C);e&&(xe(),S(e))}}},Te=ue&&(je&&he||!je&&ye)?e.jsx(ue,Object.assign({},n,{value:F,customNodeProps:pe,setValue:de,handleEdit:xe,handleCancel:Ee,handleKeyPress:e=>E(e,{stringConfirm:xe,cancel:Ee}),isEditing:je,setIsEditing:()=>S(K),getStyles:k})):ne(te(r),Ae);return e.jsxs("div",Object.assign({className:"jer-component jer-value-component",style:{marginLeft:j/2+"em",position:"relative"},draggable:W},ee,oe("above"),{children:[ae,e.jsx(ie,{position:"above",nodeData:I}),e.jsxs("div",{className:"jer-value-main-row",style:{flexWrap:L.length>10?"wrap":"nowrap"},children:[Ne&&e.jsx("span",{className:"jer-key-text",style:Object.assign(Object.assign({},k("property",I)),{minWidth:`${Math.min(String(L).length+1,5)}ch`,flexShrink:L.length>10?1:0}),onDoubleClick:()=>we&&S(K,"key"),children:""===L?e.jsx("span",{className:K.length>0?"jer-empty-string":void 0}):`${L}:`}),Oe&&e.jsx("input",{className:"jer-input-text jer-key-edit",type:"text",name:z,defaultValue:L,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>E(e,{stringConfirm:()=>$(e.target.value),cancel:Ee,tabForward:()=>{$(e.target.value),S(K)},tabBack:()=>{$(e.target.value),S(f(I.fullData,K,"prev",C))}}),style:{width:String(L).length/1.5+.5+"em"}}),e.jsxs("div",{className:"jer-value-and-buttons",children:[e.jsx("div",{className:"jer-input-component",children:Te}),je?e.jsx(Y,{onOk:xe,onCancel:Ee,nodeData:I}):Se&&e.jsx(H,{startEdit:_?()=>S(K,Ee):void 0,handleDelete:B?()=>{i(F,K).then((e=>{e&&U({code:"DELETE_ERROR",message:e},F)}))}:void 0,enableClipboard:d,translate:v,customButtons:n.customButtons,nodeData:I,handleKeyboard:E,keyboardControls:D}),ke&&e.jsxs("div",{className:"jer-select",children:[e.jsx("select",{name:`${L}-type-select`,className:"jer-type-select",onChange:e=>(e=>{const t=x.find((t=>t.name===e));if(t)a(t.defaultValue,K),ce(e),S(null),O({path:K,collapsed:!1});else{const t=re(F,e,v("DEFAULT_NEW_KEY",I),(null==se?void 0:se.CustomNode)?v("DEFAULT_STRING",I):void 0);de(t),a(t,K).then((e=>{e&&(U({code:"UPDATE_ERROR",message:e},t),S(null))}))}})(e.target.value),value:le,children:be.map((t=>e.jsx("option",{value:t,children:t},t)))}),e.jsx("span",{className:"focus"})]}),Ce&&e.jsx("span",{className:"jer-error-slug",style:k("error",I),children:G})]})]}),e.jsx(ie,{position:"below",nodeData:I})]}))},te=(e,t)=>(null==t?void 0:t.CustomNode)&&(null==t?void 0:t.name)&&t.showInTypesSelector?t.name:"string"==typeof e?"string":"number"==typeof e?"number":"boolean"==typeof e?"boolean":null===e?"null":"invalid",ne=(t,n)=>{const r=n.value;switch(t){case"string":return e.jsx(M,Object.assign({},n,{value:r}));case"number":return e.jsx(P,Object.assign({},n,{value:r}));case"boolean":return e.jsx(F,Object.assign({},n,{value:r}));case"null":return e.jsx(V,Object.assign({},n));default:return e.jsx(z,Object.assign({},n))}},re=(e,t,n,r)=>{switch(t){case"string":return null!=r?r:String(e);case"number":{const t=Number(e);return isNaN(t)?0:t}case"boolean":return!!e;case"null":return null;case"object":return{[n]:e};case"array":return[e];default:return String(e)}},oe=n=>{const{getStyles:r}=w(),{collapseState:l,setCollapseState:c,doesPathMatch:d,currentlyEditingElement:u,setCurrentlyEditingElement:p,areChildrenBeingEdited:g}=T(),{mainContainerRef:h,data:y,nodeData:b,parentData:j,showCollectionCount:x,onEdit:E,onAdd:D,onDelete:C,canDragOnto:k,collapseFilter:S,collapseAnimationTime:O,onMove:N,enableClipboard:A,searchFilter:R,searchText:M,indent:P,sort:F,showArrayIndices:V,defaultValue:z,translate:I,customNodeDefinitions:K,jsonParse:L,jsonStringify:_,keyboardControls:B,handleKeyboard:W,insertAtTop:G}=n,[$,J]=t.useState(_(y)),te=S(b),{contentRef:ne,isAnimating:re,maxHeight:ae,collapsed:ie,animateCollapse:se}=((e,n,r,o)=>{const[a,i]=t.useState(r?0:void 0),[s,l]=t.useState(r),c=t.useRef(!1),d=t.useRef(null),u=t.useRef(0),p=t.useRef();return{contentRef:d,isAnimating:c.current,animateCollapse:t=>{var r,a;if(s!==t){switch(window.clearTimeout(p.current),c.current=!0,t){case!0:{const e=null!==(a=null===(r=d.current)||void 0===r?void 0:r.offsetHeight)&&void 0!==a?a:0;u.current=e,i(e),setTimeout((()=>{i(0)}),5);break}case!1:i(u.current||Q(e,d,o))}l(!s),p.current=window.setTimeout((()=>{c.current=!1,t||i(void 0)}),n)}},maxHeight:a,collapsed:s}})(y,O,te,h),{pathString:le,nodeData:ce,path:de,name:ue,size:pe,canEdit:me,canDelete:ge,canAdd:he,canDrag:ye,error:fe,setError:be,onError:je,handleEditKey:ve,derivedValues:xe}=Z({props:n,collapsed:ie}),{dragSourceProps:Ee,getDropTargetProps:De,BottomDropTarget:we,DropTargetPadding:Ce}=q({canDrag:ye,canDragOnto:k,path:de,nodeData:ce,onMove:N,onError:je,translate:I}),ke=t.useRef(!te);t.useEffect((()=>{J(_(y))}),[y]),t.useEffect((()=>{const e=S(ce)&&!xe.isEditing;ke.current=!e,se(e)}),[S]),t.useEffect((()=>{null!==l&&d(de)&&(ke.current=!0,se(l.collapsed))}),[l]);const Se=t.useRef(null),Oe=t.useMemo((()=>(e,t)=>"function"!=typeof z?z:z(e,t)),[z]),{CustomNode:Ne,customNodeProps:Ae,CustomWrapper:Te,wrapperProps:Re={},hideKey:Me,showEditTools:Pe=!0,showOnEdit:Fe,showOnView:Ve,showCollectionWrapper:ze=!0}=t.useMemo((()=>X(K,ce)),[]),Ie=g(le);Ie&&ie&&se(!1);if(!(s("collection",ce,R,M)||0===ce.level)&&!Ie)return null;const Ke=Array.isArray(y)?"array":"object",Le="array"===Ke?{open:"[",close:"]"}:{open:"{",close:"}"},_e=e=>{if("Tab"!==e.key||e.getModifierState("Shift"))W(e,{objectConfirm:We,cancel:Ue});else{e.preventDefault();const t=v(Se,"\t");J(t)}},Be=e=>{const t=m(e);if(t&&B.collapseModifier.includes(t))return ke.current=!0,void c({collapsed:!ie,path:de});u&&u.includes(le)||(ke.current=!0,c(null),se(!ie))},We=()=>{try{const e=L($);if(p(null),be(null),JSON.stringify(e)===JSON.stringify(y))return;E(e,de).then((t=>{t&&je({code:"UPDATE_ERROR",message:t},e)}))}catch(e){je({code:"INVALID_JSON",message:I("ERROR_INVALID_JSON",ce)},$)}},Ge=de.length>0?()=>{C(y,de).then((e=>{e&&je({code:"DELETE_ERROR",message:e},y)}))}:void 0,Ue=()=>{p(null),be(null),J(_(y))},{isEditing:He,isEditingKey:Ye,isArray:$e,canEditKey:Je}=xe,Xe="when-closed"===x?ie:x,Ze=!He&&Pe,qe=(V||!$e)&&!Me&&void 0!==ue,Qe=Ne&&(He&&Fe||!He&&Ve),et=Object.entries(y).map((([e,t])=>["array"===Ke?Number(e):e,t]));"object"===Ke&&F(et,(e=>e));const tt=ke.current?He?e.jsx("div",{className:"jer-collection-text-edit",children:e.jsxs("div",{children:[e.jsx(a,{textAreaRef:Se,className:"jer-collection-text-area",name:le,value:$,setValue:J,isEditing:He,handleKeyPress:_e,styles:r("input",ce)}),e.jsx("div",{className:"jer-collection-input-button-row",children:e.jsx(Y,{onOk:We,onCancel:Ue,nodeData:ce})})]})}):et.map((([t,o],a)=>{const s={key:t,value:o,path:[...de,t],level:de.length+1,index:a,size:i(o)?Object.keys(o).length:1,parentData:y,fullData:ce.fullData};return e.jsx("div",{className:"jer-collection-element",style:r("collectionElement",s),children:i(o)?e.jsx(oe,Object.assign({},n,{data:o,parentData:y,nodeData:s,showCollectionCount:x,canDragOnto:me}),t):e.jsx(ee,Object.assign({},n,{data:o,parentData:y,nodeData:s,canDragOnto:me,showLabel:"object"===Ke||V}),t)},t)})):null,nt=!!ze&&(ie&&!Ie);nt||(ke.current=!0);const rt=Object.assign(Object.assign({},n),{data:y,value:y,parentData:j,nodeData:ce,setValue:e=>o(void 0,void 0,void 0,(function*(){return yield E(e,de)})),handleEdit:We,handleCancel:Ue,handleKeyPress:_e,isEditing:He,setIsEditing:()=>p(de),getStyles:r,canDragOnto:me}),ot=Qe?e.jsx(Ne,Object.assign({customNodeProps:Ae},rt,{children:tt})):tt,at=Ye?e.jsx("input",{className:"jer-input-text jer-key-edit",type:"text",name:le,defaultValue:ue,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>W(e,{stringConfirm:()=>ve(e.target.value),cancel:Ue,tabForward:()=>{ve(e.target.value);const t=null==et?void 0:et[0][0];p(t?[...de,t]:f(ce.fullData,de,"next",F))},tabBack:()=>{ve(e.target.value),p(f(ce.fullData,de,"prev",F))}}),style:{width:String(ue).length/1.5+.5+"em"}}):qe&&e.jsx("span",{className:"jer-key-text",style:r("property",ce),onClick:e=>e.stopPropagation(),onDoubleClick:()=>Je&&p(de,"key"),children:""===ue?e.jsx("span",{className:de.length>0?"jer-empty-string":void 0}):`${ue}:`}),it=Ze&&e.jsx(H,{startEdit:me?()=>{ke.current=!0,p(de)}:void 0,handleAdd:he?e=>{se(!1);const t=Oe(ce,e);if("array"===Ke){const e=G.array?0:y.length,n=G.array?{insert:!0}:{};D(t,[...de,e],n).then((e=>{e&&je({code:"ADD_ERROR",message:e},t)}))}else if(e in y)je({code:"KEY_EXISTS",message:I("ERROR_KEY_EXISTS",ce)},e);else{const n=G.object?{insertBefore:0}:{};D(t,[...de,e],n).then((e=>{e&&je({code:"ADD_ERROR",message:e},t)}))}}:void 0,handleDelete:ge?Ge:void 0,enableClipboard:A,type:Ke,nodeData:ce,translate:I,customButtons:n.customButtons,keyboardControls:B,handleKeyboard:W}),st=e.jsxs("div",Object.assign({className:"jer-component jer-collection-component",style:Object.assign(Object.assign({marginLeft:(0===de.length?0:P/2)+"em"},r("collection",ce)),{position:"relative"}),draggable:ye},Ee,De("above"),{children:[e.jsx("div",{className:"jer-clickzone",style:{width:P/2+1+"em",zIndex:10+2*ce.level},onClick:e=>Be(e)}),!He&&we,e.jsx(Ce,{position:"above",nodeData:ce}),ze?e.jsxs("div",{className:"jer-collection-header-row",style:{position:"relative"},onClick:e=>Be(e),children:[e.jsxs("div",{className:"jer-collection-name",children:[e.jsx("div",{className:"jer-collapse-icon jer-accordion-icon"+(ie?" jer-rotate-90":""),style:{zIndex:11+2*ce.level},onClick:e=>Be(e),children:e.jsx(U,{name:"chevron",rotate:ie,nodeData:ce})}),at,!He&&e.jsx("span",{className:"jer-brackets jer-bracket-open",style:r("bracket",ce),children:Le.open})]}),!He&&Xe&&e.jsx("div",{className:"jer-collection-item-count"+(Xe?" jer-visible":" jer-hidden"),style:r("itemCount",ce),children:1===pe?I("ITEM_SINGLE",Object.assign(Object.assign({},ce),{size:1}),1):I("ITEMS_MULTIPLE",ce,pe)}),e.jsx("div",{className:"jer-brackets"+(nt?" jer-visible":" jer-hidden"),style:r("bracket",ce),children:Le.close}),it]}):Me?e.jsx(e.Fragment,{}):e.jsxs("div",{className:"jer-collection-header-row",style:{position:"relative"},children:[at,it]}),e.jsxs("div",{className:"jer-collection-inner",style:Object.assign({overflowY:nt||re?"clip":"visible",maxHeight:Ie?void 0:ae},r("collectionInner",ce)),ref:ne,children:[ot,e.jsx("div",{className:He?"jer-collection-error-row":"jer-collection-error-row-edit",children:fe&&e.jsx("span",{className:"jer-error-slug",style:r("error",ce),children:fe})}),!He&&ze&&e.jsx("div",{className:"jer-brackets jer-bracket-outside",style:Object.assign(Object.assign({},r("bracket",ce)),{marginLeft:(P<3?-1:P<6?-.5:0)+"em"}),children:Le.close})]}),e.jsx(Ce,{position:"below",nodeData:ce})]}));return Te?e.jsx(Te,Object.assign({customNodeProps:Re},rt,{children:st})):st},ae={ITEM_SINGLE:"{{count}} item",ITEMS_MULTIPLE:"{{count}} items",KEY_NEW:"Enter new key",ERROR_KEY_EXISTS:"Key already exists",ERROR_INVALID_JSON:"Invalid JSON",ERROR_UPDATE:"Update unsuccessful",ERROR_DELETE:"Delete unsuccessful",ERROR_ADD:"Adding node unsuccessful",DEFAULT_STRING:"New data!",DEFAULT_NEW_KEY:"key"},ie=(e,t)=>(n,r,o)=>((e,t,n,r,o)=>{if(t[r]){const e=t[r](n);if(null!==e)return e}const a=r in e?e[r]:ae[r];return void 0===o?a:null==a?void 0:a.replace("{{count}}",String(o))})(e,t,r,n,o);var se=[],le=[];!function(e,t){if(e&&"undefined"!=typeof document){var n,r=!0===t.prepend?"prepend":"append",o=!0===t.singleTag,a="string"==typeof t.container?document.querySelector(t.container):document.getElementsByTagName("head")[0];if(o){var i=se.indexOf(a);-1===i&&(i=se.push(a)-1,le[i]={}),n=le[i]&&le[i][r]?le[i][r]:le[i][r]=s()}else n=s();65279===e.charCodeAt(0)&&(e=e.substring(1)),n.styleSheet?n.styleSheet.cssText+=e:n.appendChild(document.createTextNode(e))}function s(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),t.attributes)for(var n=Object.keys(t.attributes),o=0;o<n.length;o++)e.setAttribute(n[o],t.attributes[n[o]]);var i="prepend"===r?"afterbegin":"beforeend";return a.insertAdjacentElement(i,e),e}}(':root{--jer-select-border:#b6b6b6;--jer-select-focus:#777;--jer-select-arrow:#777;--jer-form-border:1px solid #ededf0;--jer-form-border-focus:1px solid #e2e2e2;--jer-expand-transition-time:0.3s;--jer-highlight-color:#b3d8ff}.jer-visible{opacity:1}.jer-hidden,.jer-visible{transition:var(--jer-expand-transition-time)}.jer-hidden{opacity:0}.jer-select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:#000;cursor:inherit;font-family:inherit;font-size:.8em;line-height:inherit;margin:0;outline:none;padding:0 1em 0 0;z-index:1}select::-ms-expand{display:none}.jer-select{align-items:center;background-color:#fff;background-image:linear-gradient(0deg,#f9f9f9,#fff 33%);border:1px solid var(--jer-select-border);border-radius:.25em;cursor:pointer;display:grid;grid-template-areas:"select";line-height:1.1;max-width:15ch;min-width:12ch;padding:.25em .5em;position:relative}.jer-select select,.jer-select:after{grid-area:select}.jer-select:not(.jer-select--multiple):after{background-color:var(--jer-select-arrow);clip-path:polygon(100% 0,0 0,50% 100%);content:"";height:.5em;justify-self:end;width:.8em}select:focus+.focus{border:1px solid var(--jer-select-focus);border-radius:inherit;bottom:-1px;left:-1px;position:absolute;right:-1px;top:-1px}.jer-editor-container{border-radius:.5em;font-size:16px;line-height:1;padding:1em 1em 1em 2em;position:relative;text-align:left}.jer-editor-container textarea{border:var(--jer-form-border);border-radius:.3em;color:var(--jer-input-color);outline:none}.jer-editor-container textarea:focus{border:var(--jer-form-border-focus)}.jer-editor-container input{border:var(--jer-form-border);border-radius:.3em;font-family:inherit;outline:none}.jer-editor-container input:focus{border:var(--jer-form-border-focus)}.jer-editor-container ::selection{background-color:var(--jer-highlight-color)}.jer-collection-header-row,.jer-value-main-row{align-items:center;display:flex;gap:.3em;min-height:1.7em}.jer-collection-header-row{display:flex;flex-wrap:wrap}.jer-collapse-icon{left:-1.2em;position:absolute;top:.35em}.jer-collection-inner{position:relative;transition:var(--jer-expand-transition-time)}.jer-collection-text-edit{align-items:flex-start;display:flex;flex-direction:column;gap:.3em}.jer-collection-text-area{font-family:inherit;font-size:.85em;max-height:40em;overflow:hidden;padding:.2em .5em 0;resize:both}.jer-collection-input-button-row{display:flex;font-size:150%;justify-content:flex-end;margin-top:.4em}.jer-collection-error-row{bottom:.5em;position:absolute}.jer-error-slug{margin-left:1em}.jer-value-component{position:relative}.jer-value-main-row{display:flex;gap:0}.jer-value-and-buttons{align-items:center;display:flex;justify-content:flex-start;padding-left:.5em}.jer-value-error-row{position:absolute}.jer-value-string{line-height:1.3em;overflow-wrap:anywhere;white-space:pre-wrap}.jer-hyperlink{text-decoration:underline}.jer-input-text{font-family:inherit;font-size:.9em;height:1.4em;line-height:1.2em;margin:0;min-width:6em;overflow:hidden;padding:.25em .5em .2em;resize:none}.jer-input-boolean{margin-left:.3em;margin-right:.3em;transform:scale(1.5)}.jer-key-text{line-height:1.1em;white-space:pre-wrap;word-break:break-word}.jer-key-edit{font-size:inherit;font-size:.9em;padding:0 .3em}.jer-value-invalid{font-style:italic;opacity:.5}.jer-input-number{font-size:90%;min-width:3em}.jer-confirm-buttons,.jer-edit-buttons{align-items:center;cursor:pointer;display:flex;height:1em}.jer-input-buttons{gap:.4em}.jer-edit-buttons{gap:.4em;margin-left:.5em;opacity:0}.jer-confirm-buttons{gap:.2em;margin-left:.4em}.jer-edit-buttons:hover{opacity:1;position:relative}.jer-collection-header-row:hover>.jer-edit-buttons,.jer-value-and-buttons:hover>.jer-edit-buttons,.jer-value-main-row:hover>.jer-edit-buttons{opacity:1}.jer-copy-pulse{position:relative;transition:transform var(--jer-expand-transition-time)}.jer-copy-pulse:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-copy-pulse:after{border-radius:50%;box-shadow:0 0 15px 5px var(--jer-icon-copy-color);content:"";display:block;height:100%;left:0;opacity:0;position:absolute;top:0;transition:all .5s;width:100%}.jer-copy-pulse:active:after{border-radius:4em;box-shadow:0 0 0 0 var(--jer-icon-copy-color);left:0;opacity:1;position:absolute;top:0;transition:0s}.jer-copy-pulse:active{top:.07em}.jer-rotate-90{transform:rotate(-90deg)}.jer-accordion-icon,.jer-rotate-90{transition:transform var(--jer-expand-transition-time)}.jer-icon:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-empty-string:after{content:"<empty string>:";font-size:90%;font-style:italic}.jer-drag-n-drop-padding{border:1px dashed #e0e0e0;border-radius:.3em;height:.5em}.jer-clickzone{height:calc(100% - .8em);left:-1em;position:absolute;top:1.2em}',{});const ce=({data:n,setData:r,rootName:a="root",onUpdate:s=(()=>{}),onEdit:l=s,onDelete:c=s,onAdd:d=s,onChange:u,onError:p,showErrorMessages:m=!0,enableClipboard:h=!0,indent:f=2,collapse:b=!1,collapseAnimationTime:j=300,showCollectionCount:v=!0,restrictEdit:x=!1,restrictDelete:E=!1,restrictAdd:D=!1,restrictTypeSelection:C=!1,restrictDrag:k=!0,searchFilter:S,searchText:O,searchDebounceTime:N=350,keySort:A=!1,showArrayIndices:R=!0,showStringQuotes:M=!0,defaultValue:P=null,minWidth:F=250,maxWidth:V="min(600px, 90vw)",rootFontSize:z,stringTruncate:I=250,translations:K={},className:L,id:_,customText:B={},customNodeDefinitions:W=[],customButtons:G=[],jsonParse:U=JSON.parse,jsonStringify:H=(e=>JSON.stringify(e,null,2)),errorMessageTimeout:Y=2500,keyboardControls:$={},insertAtTop:J=!1})=>{const{getStyles:X}=w(),{setCurrentlyEditingElement:Z}=T(),q=t.useCallback(ue(b),[b]),Q=t.useCallback(ie(K,B),[K,B]),[te,ne]=t.useState(O),[re,ae]=(({setData:e,data:n})=>{const[r,o]=t.useState(e?void 0:n),a=t.useCallback((t=>{e?e(t):o(t)}),[e]);return t.useEffect((()=>{e||o(n)}),[n]),[e?n:r,a]})({setData:r,data:n}),se=t.useRef(null);t.useEffect((()=>{Z(null);const e=setTimeout((()=>ne(O)),N);return()=>clearTimeout(e)}),[O,N]);const le={key:a,path:[],level:0,index:0,value:re,size:"object"==typeof re&&null!==re?Object.keys(re).length:1,parentData:null,fullData:re},ce=(e,t)=>o(void 0,void 0,void 0,(function*(){const n=yield e(t);if(!0===n||void 0===n)return void ae(t.newData);const r=me(n)?n:["error",n],[o,a]=r;if("error"===o)return ae(t.currentData),!1===a?Q("ERROR_UPDATE",le):String(a);ae(a)})),ge=t.useMemo((()=>ue(x)),[x]),he=t.useMemo((()=>ue(E)),[E]),ye=t.useMemo((()=>ue(D)),[D]),fe=t.useMemo((()=>ue(k)),[k]),be=t.useMemo((()=>pe(S)),[S]),je=t.useMemo((()=>(e=>{const t=Object.assign({},y);for(const n of Object.keys(y)){const r=n;if(e[r]){const o=e[r],a=["clipboardModifier","collapseModifier"].includes(n)?Array.isArray(o)?o:[o]:"string"==typeof o?{key:o}:o;t[r]=a,["stringConfirm","numberConfirm","booleanConfirm"].forEach((n=>{!e[n]&&e.confirm&&(t[n]=t.confirm)}))}}return t})($)),[$]),ve=t.useCallback(((e,t)=>((e,t,n)=>{const r=Object.entries(t);for(const[t,o]of r)if(g(n,e[t],t)){n.preventDefault(),o();break}})(je,t,e)),[$]),xe=t.useCallback(((e,t)=>{!1!==A&&("function"!=typeof A?e.sort(((e,n)=>{const r=t(e)[0],o=t(n)[0];return r<o?-1:r>o?1:0})):e.sort(((e,n)=>A(t(e),t(n)))))}),[A]),Ee={mainContainerRef:se,name:a,nodeData:le,onEdit:(e,t)=>o(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=de(re,t,e,"update");if(o!==a)return yield ce(l,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onDelete:(e,t)=>o(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=de(re,t,e,"delete");return yield ce(c,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onAdd:(e,t,n)=>o(void 0,void 0,void 0,(function*(){const{currentData:r,newData:o,currentValue:a,newValue:i}=de(re,t,e,"add",n);return yield ce(d,{currentData:r,newData:o,currentValue:a,newValue:i,name:t.slice(-1)[0],path:t})})),onChange:u,onError:p,showErrorMessages:m,onMove:(e,t,n)=>o(void 0,void 0,void 0,(function*(){if(null===e)return;const{currentData:r,newData:o,currentValue:a}=de(re,e,"","delete"),i=e.slice(-1)[0],s=t.slice(0,-1),c=t.slice(-1)[0];let d="number"==typeof c?"above"===n?c:c+1:"number"==typeof i?`arr_${i}`:i;e.slice(0,-1).join(".")===t.slice(0,-1).join(".")&&"number"==typeof i&&"number"==typeof d&&i<d&&(d-=1);const u="number"==typeof d?{insert:!0}:"above"===n?{insertBefore:c}:{insertAfter:c},{newData:p,newValue:m}=de(o,[...s,d],a,"add",u);return yield ce(l,{currentData:r,newData:p,currentValue:a,newValue:m,name:t.slice(-1)[0],path:t})})),showCollectionCount:v,collapseFilter:q,collapseAnimationTime:j,restrictEditFilter:ge,restrictDeleteFilter:he,restrictAddFilter:ye,restrictTypeSelection:C,restrictDragFilter:fe,canDragOnto:!1,searchFilter:be,searchText:te,enableClipboard:h,keySort:A,sort:xe,showArrayIndices:R,showStringQuotes:M,indent:f,defaultValue:P,stringTruncate:I,translate:Q,customNodeDefinitions:W,customButtons:G,parentData:null,jsonParse:U,jsonStringify:H,errorMessageTimeout:Y,handleKeyboard:ve,keyboardControls:je,insertAtTop:{object:!0===J||"object"===J,array:!0===J||"array"===J}},De=Object.assign(Object.assign({},X("container",le)),{minWidth:F,maxWidth:V});return De.fontSize=null!=z?z:De.fontSize,e.jsx("div",{id:_,ref:se,className:`jer-editor-container ${null!=L?L:""}`,style:De,children:i(re)?e.jsx(oe,Object.assign({data:re},Ee)):e.jsx(ee,Object.assign({data:re,showLabel:!0},Ee))})},de=(e,t,o,a,i={})=>{if(0===t.length)return{currentData:e,newData:o,currentValue:e,newValue:o};const s=Object.assign({remove:"delete"===a},i),l="add"!==a?r(e,t):void 0;return{currentData:e,newData:n(e,t,o,s),currentValue:l,newValue:"delete"!==a?o:void 0}},ue=e=>"boolean"==typeof e?()=>e:"number"==typeof e?({level:t})=>t>=e:e,pe=e=>{if(void 0!==e)return"value"===e?c:"key"===e?d:"all"===e?(e,t)=>c(e,t)||d(e,t):e},me=e=>Array.isArray(e)&&2===e.length&&["error","value"].includes(e[0]),ge=({value:t,setIsEditing:n,getStyles:r,customNodeProps:o,nodeData:a})=>{var i,s;const l=null!==(i=null==o?void 0:o.stringTruncate)&&void 0!==i?i:100,c=r("string",a);return e.jsx("div",{onDoubleClick:()=>n(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&n(!0)},className:"jer-value-string jer-hyperlink",style:c,children:e.jsxs("a",{href:t,target:"_blank",rel:"noreferrer",style:{color:null!==(s=c.color)&&void 0!==s?s:void 0},children:['"',u(t,l),'"']})})},he={condition:({value:e})=>"string"==typeof e&&/^https?:\/\/.+\..+$/.test(e),element:ge,showOnView:!0,showOnEdit:!1};exports.assign=n,exports.extract=r,exports.IconAdd=I,exports.IconCancel=W,exports.IconChevron=G,exports.IconCopy=_,exports.IconDelete=L,exports.IconEdit=K,exports.IconOk=B,exports.JsonEditor=n=>{var r;const[o,a]=t.useState();t.useEffect((()=>{const e=document.documentElement;a(e)}),[]);const{collapseAnimationTime:i=300}=n;if(!o)return null;const s=getComputedStyle(o).getPropertyValue("--jer-expand-transition-time");return 1e3*parseFloat(s)!==i&&o.style.setProperty("--jer-expand-transition-time",i/1e3+"s"),e.jsx(D,{theme:null!==(r=n.theme)&&void 0!==r?r:x,icons:n.icons,docRoot:o,children:e.jsx(A,{children:e.jsx(ce,Object.assign({},n))})})},exports.LinkCustomComponent=ge,exports.LinkCustomNodeDefinition=he,exports.candyWrapperTheme={displayName:"Candy Wrapper",fragments:{minty:{backgroundColor:"#F1FAEE"},pale:{color:"#A8DADC"},mid:{color:"#457B9D"},dark:{color:"#1D3557"},pop:{color:"#E63946"},darkBlue:{color:"#2B2D42"}},styles:{container:"minty",property:"pop",dropZone:"#eb121217",bracket:"dark",itemCount:"pale",string:"mid",number:["darkBlue",{fontSize:"85%"}],boolean:["mid",{fontStyle:"italic",fontWeight:"bold",fontSize:"80%"}],null:["#cccccc",{fontWeight:"bold"}],input:{border:"1px solid rgb(115, 194, 198)"},iconCollection:"#1D3557",iconEdit:"#457B9D",iconDelete:"#E63946",iconAdd:"#2B2D42",iconCopy:"#1D3557",iconCancel:"#E63946"}},exports.defaultTheme=x,exports.githubDarkTheme={displayName:"Github Dark",styles:{container:{backgroundColor:"#0d1117",color:"white"},dropZone:"rgba(165, 214, 255, 0.17)",property:"#E6EDF3",bracket:"#56d364",itemCount:"#8B949E",string:"#A5D6FF",number:"#D2A8FF",boolean:{color:"#FF7B72",fontSize:"90%",fontWeight:"bold"},null:"green",iconCollection:"#D2A8FF",iconEdit:"#D2A8FF",iconDelete:"rgb(203, 75, 22)",iconAdd:"rgb(203, 75, 22)",iconCopy:"#A5D6FF",iconOk:"#56d364",iconCancel:"rgb(203, 75, 22)"}},exports.githubLightTheme={displayName:"Github Light",styles:{container:"white",property:"#1F2328",bracket:"#00802e",itemCount:"#8B949E",string:"#0A3069",number:"#953800",boolean:{color:"#CF222E",fontSize:"90%",fontWeight:"bold"},null:"#FF7B72",iconCollection:"#8250DF",iconEdit:"#8250DF",iconDelete:"rgb(203, 75, 22)",iconAdd:"#8250DF",iconCopy:"#57606A"}},exports.isCollection=i,exports.matchNode=c,exports.matchNodeKey=d,exports.monoDarkTheme={displayName:"Black & White",fragments:{lightText:{color:"white"},midGrey:"#5c5c5c"},styles:{container:["lightText",{backgroundColor:"black"}],dropZone:"#e0e0e029",property:"lightText",bracket:"midGrey",itemCount:"#4a4a4a",string:"#a8a8a8",number:"#666666",boolean:{color:"#848484",fontStyle:"italic"},null:"#333333",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},exports.monoLightTheme={fragments:{midGrey:"#a3a3a3"},displayName:"White & Black",styles:{container:"white",property:"black",bracket:"midGrey",itemCount:"#b5b5b5",string:"#575757",number:"#999999",boolean:{color:"#7b7b7b",fontStyle:"italic"},null:"#cccccc",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},exports.psychedelicTheme={displayName:"Psychedelic",fragments:{pale:{color:"#A8DADC"},fluroYellow:"rgb(242, 228, 21)",fluroGreen:"rgb(68, 255, 62)",hotPink:"#f7379a"},styles:{container:{backgroundColor:"unset",background:"linear-gradient(90deg, hsla(333, 100%, 53%, 1) 0%, hsla(33, 94%, 57%, 1) 100%)",color:"black"},dropZone:"fluroYellow",property:"black",bracket:"fluroYellow",itemCount:["pale",{opacity:.7}],string:"white",number:["#33d9ff",{fontSize:"90%",fontWeight:"bold"}],boolean:["fluroGreen",{fontWeight:"bold",fontSize:"80%"}],null:["black",{fontWeight:"bold",opacity:.3,backgroundColor:"rgb(255, 255, 255, 0.5)",padding:"0 0.4em",borderRadius:"0.4em"}],iconCollection:"fluroYellow",iconEdit:["black"],iconDelete:["white",{opacity:.5}],iconAdd:["white",{opacity:.5}],iconCopy:"rgb(32, 84, 242)",iconOk:"fluroGreen",iconCancel:"hotPink"}},exports.truncate=u;
1
+ "use strict";var e=require("react/jsx-runtime"),t=require("react"),n=require("object-property-assigner"),r=require("object-property-extractor");function o(e,t,n,r){return new(n||(n=Promise))((function(o,a){function i(e){try{l(r.next(e))}catch(e){a(e)}}function s(e){try{l(r.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,s)}l((r=r.apply(e,t||[])).next())}))}"function"==typeof SuppressedError&&SuppressedError;const a=({className:t,name:n,value:r,setValue:o,handleKeyPress:a,styles:i,textAreaRef:s})=>{if("string"!=typeof r)return null;const l="\n"===r.slice(-1)?r+".":r;return e.jsxs("div",{style:{display:"grid"},children:[e.jsx("textarea",{id:`${n}_textarea`,ref:s,style:Object.assign({height:"auto",gridArea:"1 / 1 / 2 / 2",overflowY:"auto",whiteSpace:"pre-wrap"},i),rows:1,className:t,name:`${n}_textarea`,value:r,onChange:e=>o(e.target.value),autoFocus:!0,onFocus:e=>{r.length<40&&e.target.select()},onKeyDown:a}),e.jsx("span",{className:t,style:Object.assign({visibility:"hidden",height:"auto",gridArea:"1 / 1 / 2 / 2",color:"red",opacity:.9,whiteSpace:"pre-wrap",overflowY:"auto",border:"1px solid transparent"},i),children:l})]})},i=e=>null!==e&&"object"==typeof e,s=(e,t,n,r="")=>{if(!n&&!r)return!0;switch(e){case"collection":if(n){if(n(t,r))return!0;if(!l(r,t,n))return!1}if(!n&&r&&!l(r,t))return!1;break;case"value":if(n&&!n(t,r))return!1;if(!n&&r&&!c(t,r))return!1}return!0},l=(e="",t,n=c)=>{const r=t.value;return Object.entries(r).some((([o,a])=>{const s=[...t.path,o],c=Object.assign(Object.assign({},t),{key:o,path:s,level:t.level+1,value:a,size:s.length,parentData:r});return i(a)?l(e,c,n):n(c,e)}))},c=(e,t="")=>{const{value:n}=e;if(null===n&&"null".includes(t.toLowerCase()))return!0;switch(typeof n){case"string":return n.toLowerCase().includes(t.toLowerCase());case"number":return!!String(n).includes(t);case"boolean":return n?"true".includes(t.toLowerCase())||"1"===t:"false".includes(t.toLowerCase())||"0"===t;default:return!1}},d=({key:e,path:t},n="")=>!!c({value:e},n)||!!t.some((e=>c({value:e},n))),u=(e,t=200)=>"string"==typeof e?e.length<t?e:`${e.slice(0,t-2).trim()}...`:e,p=(e,t)=>(null!=t?t:"")+e.map((e=>""===e?String.fromCharCode(0):e)).join("."),m=e=>e.shiftKey?"Shift":e.metaKey?"Meta":e.ctrlKey?"Control":e.altKey?"Alt":void 0,g=(e,t,n)=>{const r=e.key,o=m(e);if(Array.isArray(t))return!!o&&t.includes(o);const{key:a,modifier:i}=t;return("stringLineBreak"!==n||"Enter"!==r||"Shift"!==o||"Enter"!==a||!(null==i?void 0:i.includes("Shift")))&&(r===a&&(i===o||Array.isArray(i)&&i.includes(o)))},h={key:"Enter"},y={confirm:h,cancel:{key:"Escape"},objectConfirm:Object.assign(Object.assign({},h),{modifier:["Meta","Shift","Control"]}),objectLineBreak:h,stringConfirm:h,stringLineBreak:Object.assign(Object.assign({},h),{modifier:["Shift"]}),numberConfirm:h,numberUp:{key:"ArrowUp"},numberDown:{key:"ArrowDown"},tabForward:{key:"Tab"},tabBack:{key:"Tab",modifier:"Shift"},booleanConfirm:h,booleanToggle:{key:" "},clipboardModifier:["Meta","Control"],collapseModifier:["Alt"]},f=(e,t,n="next",o)=>{const a=t.slice(0,t.length-1),s=t.slice(-1)[0];if(void 0===s)return null;const l=r(e,a),c=j(l);Array.isArray(l)||o(c,(({key:e,value:t})=>[e,t]));const d=c.findIndex((e=>e.key===s)),u=c[d+("next"===n?1:-1)];return u?i(u.value)?0===Object.keys(u.value).length?f(e,[...a,u.key],n,o):b(e,[...a,u.key],n,o):[...a,u.key]:0===a.length?null:f(e,a,n,o)},b=(e,t,n="next",o)=>{const a=r(e,t);if(!i(a))return t;const s=Array.isArray(a)?a.map(((e,t)=>t)):Object.keys(a);o(s,(e=>[e,a]));const l="next"===n?s[0]:s[s.length-1];return b(e,[...t,l],n,o)},j=e=>Array.isArray(e)?e.map(((e,t)=>({index:t,value:e,key:t}))):Object.entries(e).map((([e,t],n)=>({key:e,value:t,index:n}))),v=(e,t)=>{var n,r,o,a;const i=e.current,s=null!==(n=null==i?void 0:i.selectionStart)&&void 0!==n?n:1/0,l=null!==(r=null==i?void 0:i.selectionEnd)&&void 0!==r?r:1/0,c=(null===(o=null==i?void 0:i.textContent)||void 0===o?void 0:o.slice(0,s))+t+(null===(a=null==i?void 0:i.textContent)||void 0===a?void 0:a.slice(l));return i.value=c,null==i||i.setSelectionRange(s+1,s+1),c},x={displayName:"Default",fragments:{edit:"rgb(42, 161, 152)"},styles:{container:{backgroundColor:"#f6f6f6",fontFamily:"monospace"},collection:{},collectionInner:{},collectionElement:{},dropZone:{},property:"#292929",bracket:{color:"rgb(0, 43, 54)",fontWeight:"bold"},itemCount:{color:"rgba(0, 0, 0, 0.3)",fontStyle:"italic"},string:"rgb(203, 75, 22)",number:"rgb(38, 139, 210)",boolean:"green",null:{color:"rgb(220, 50, 47)",fontVariant:"small-caps",fontWeight:"bold"},input:["#292929"],inputHighlight:"#b3d8ff",error:{fontSize:"0.8em",color:"red",fontWeight:"bold"},iconCollection:"rgb(0, 43, 54)",iconEdit:"edit",iconDelete:"rgb(203, 75, 22)",iconAdd:"edit",iconCopy:"rgb(38, 139, 210)",iconOk:"green",iconCancel:"rgb(203, 75, 22)"}},E=t.createContext({getStyles:()=>({}),icons:{}}),D=({theme:t=x,icons:n={},docRoot:r,children:o})=>{const a=C(t,r);return e.jsx(E.Provider,{value:{getStyles:(e,t)=>"function"==typeof a[e]?a[e](t):a[e],icons:n},children:o})},w=()=>t.useContext(E),C=(e,t)=>{var n,r,o,a;const i={},s=(Array.isArray(e)?e:[e]).map((e=>S(e)?k({fragments:{},styles:e},i):k(e,i))),l=k(x,{});Object.keys(l).forEach((e=>{const t=e;s.forEach((e=>{e[t]&&(l[t]=Object.assign(Object.assign({},l[t]),e[t]))}))}));const c=Object.assign({},l);return Object.entries(i).forEach((([e,t])=>{const n=e;c[n]=e=>{const r=t(e)||{};return Object.assign(Object.assign({},l[n]),r)}})),"function"!=typeof(null==c?void 0:c.inputHighlight)&&(null===(n=null==c?void 0:c.inputHighlight)||void 0===n?void 0:n.backgroundColor)&&t.style.setProperty("--jer-highlight-color",null===(r=null==c?void 0:c.inputHighlight)||void 0===r?void 0:r.backgroundColor),"function"!=typeof(null==c?void 0:c.iconCopy)&&(null===(o=null==c?void 0:c.iconCopy)||void 0===o?void 0:o.color)&&t.style.setProperty("--jer-icon-copy-color",null===(a=null==c?void 0:c.iconCopy)||void 0===a?void 0:a.color),c},k=(e,t)=>{const{fragments:n,styles:r}=e,o={};return Object.entries(r).forEach((([e,r])=>{const a=(Array.isArray(r)?r:[r]).reduce(((r,o)=>{var a,i;if("function"==typeof o)return t[e]=o,Object.assign({},r);if("string"==typeof o){const t=null!==(a=null==n?void 0:n[o])&&void 0!==a?a:o;return"string"==typeof t?Object.assign(Object.assign({},r),{[null!==(i=O[e])&&void 0!==i?i:"color"]:t}):Object.assign(Object.assign({},r),t)}return Object.assign(Object.assign({},r),o)}),{});o[e]=a})),o},S=e=>!("styles"in e),O={container:"backgroundColor",collection:"backgroundColor",collectionInner:"backgroundColor",collectionElement:"backgroundColor",dropZone:"borderColor",inputHighlight:"backgroundColor"},N=t.createContext({collapseState:null,setCollapseState:()=>{},doesPathMatch:()=>!1,currentlyEditingElement:null,setCurrentlyEditingElement:()=>{},previouslyEditedElement:null,setPreviouslyEditedElement:()=>{},areChildrenBeingEdited:()=>!1,dragSource:{path:null,pathString:null},setDragSource:()=>{},tabDirection:"next",setTabDirection:()=>{}}),A=({children:n})=>{const[r,o]=t.useState(null),[a,i]=t.useState(null),[s,l]=t.useState({path:null,pathString:null}),c=t.useRef(null),d=t.useRef("next"),u=t.useRef(null);return e.jsx(N.Provider,{value:{collapseState:r,setCollapseState:e=>{o(e),null!==e&&setTimeout((()=>o(null)),2e3)},doesPathMatch:e=>{if(null===r)return!1;for(const[t,n]of r.path.entries())if(n!==e[t])return!1;return!0},currentlyEditingElement:a,setCurrentlyEditingElement:(e,t)=>{const n="string"==typeof e||null===e?e:p(e,"key"===t?"key_":void 0);null!==a&&null!==n&&null!==c.current&&c.current(),i(n),c.current="function"==typeof t?t:null},areChildrenBeingEdited:e=>null!==a&&a.includes(e),previouslyEditedElement:u.current,setPreviouslyEditedElement:e=>{u.current=e},tabDirection:d.current,setTabDirection:e=>{d.current=e},dragSource:s,setDragSource:l},children:n})},T=()=>t.useContext(N),R="**INVALID_FUNCTION**",M=({value:n,setValue:r,isEditing:o,path:i,setIsEditing:s,handleEdit:l,stringTruncate:c,showStringQuotes:d,nodeData:m,handleKeyboard:g,keyboardCommon:h})=>{const{getStyles:y}=w(),f=t.useRef(null),b=p(i),j=d?'"':"";return o?e.jsx(a,{className:"jer-input-text",textAreaRef:f,name:b,value:n,setValue:r,isEditing:o,handleKeyPress:e=>{g(e,Object.assign({stringConfirm:l,stringLineBreak:()=>{const e=v(f,"\n");r(e)}},h))},styles:y("input",m)}):e.jsxs("div",{id:`${b}_display`,onDoubleClick:()=>s(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&s(!0)},className:"jer-value-string",style:y("string",m),children:[j,u(n,c),j]})},P=({value:t,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:s,handleKeyboard:l,keyboardCommon:c})=>{const{getStyles:d}=w();return r?e.jsx("input",{className:"jer-input-number",type:"text",name:p(o),value:t,onChange:e=>n(e.target.value.replace(/[^0-9.-]/g,"")),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>l(e,Object.assign({numberConfirm:i,numberUp:()=>n(Number(t)+1),numberDown:()=>n(Number(t)-1)},c)),style:Object.assign({width:String(t).length/1.5+2+"em"},d("input",s))}):e.jsx("span",{onDoubleClick:()=>a(!0),className:"jer-value-number",style:d("number",s),children:t})},F=({value:t,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:s,handleKeyboard:l,keyboardCommon:c})=>{const{getStyles:d}=w();return r?e.jsx("input",{className:"jer-input-boolean",type:"checkbox",name:p(o),checked:t,onChange:()=>n(!t),onKeyDown:e=>{" "===e.key&&e.preventDefault(),l(e,Object.assign({booleanConfirm:i,booleanToggle:()=>n(!t)},c))},autoFocus:!0}):e.jsx("span",{onDoubleClick:()=>a(!0),className:"jer-value-boolean",style:d("boolean",s),children:String(t)})},V=({value:n,isEditing:r,setIsEditing:o,handleEdit:a,nodeData:i,handleKeyboard:s,keyboardCommon:l})=>{const{getStyles:c}=w(),d=t.useRef();t.useEffect((()=>{if(r)return d.current=window.setTimeout((()=>window.addEventListener("keydown",u)),100),()=>window.removeEventListener("keydown",u);window.clearTimeout(d.current)}),[r]);const u=e=>s(e,Object.assign({confirm:a},l));return e.jsx("div",{onDoubleClick:()=>o(!0),className:"jer-value-null",style:c("null",i),children:String(n)})},z=({value:t})=>{let n="Error!";switch(typeof t){case"string":t===R&&(n="Function");break;case"undefined":n="Undefined";break;case"symbol":n="Symbol"}return e.jsx("span",{className:"jer-value-invalid",children:n})},I=({size:t,style:n,className:r})=>e.jsxs("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,children:[e.jsx("path",{d:"M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4z"}),e.jsx("path",{d:"M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z"})]}),K=({size:t,style:n,className:r})=>e.jsxs("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,transform:"translate(0, 0.5)",children:[e.jsx("path",{d:"M7 17.013l4.413-.015 9.632-9.54c.378-.378.586-.88.586-1.414s-.208-1.036-.586-1.414l-1.586-1.586c-.756-.756-2.075-.752-2.825-.003L7 12.583v4.43zM18.045 4.458l1.589 1.583-1.597 1.582-1.586-1.585 1.594-1.58zM9 13.417l6.03-5.973 1.586 1.586-6.029 5.971L9 15.006v-1.589z"}),e.jsx("path",{d:"M5 21h14c1.103 0 2-.897 2-2v-8.668l-2 2V19H8.158c-.026 0-.053.01-.079.01-.033 0-.066-.009-.1-.01H5V5h6.847l2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2z"})]}),L=({size:t,style:n,className:r})=>e.jsx("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,children:e.jsx("path",{d:"M6 19a2 2 0 002 2h8a2 2 0 002-2V7H6v12m2.46-7.12l1.41-1.41L12 12.59l2.12-2.12 1.41 1.41L13.41 14l2.12 2.12-1.41 1.41L12 15.41l-2.12 2.12-1.41-1.41L10.59 14l-2.13-2.12M15.5 4l-1-1h-5l-1 1H5v2h14V4h-3.5z"})}),_=({size:t,style:n,className:r})=>e.jsxs("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:t,height:t,className:r,style:n,children:[e.jsx("path",{d:"M9 2 H15 A1 1 0 0 1 16 3 V5 A1 1 0 0 1 15 6 H9 A1 1 0 0 1 8 5 V3 A1 1 0 0 1 9 2 z"}),e.jsx("path",{d:"M8 4H6a2 2 0 00-2 2v14a2 2 0 002 2h12a2 2 0 002-2v-2M16 4h2a2 2 0 012 2v4M21 14H11"}),e.jsx("path",{d:"M15 10l-4 4 4 4"})]}),B=({size:t,style:n,className:r})=>e.jsxs("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:t,height:t,className:r,style:n,children:[e.jsx("path",{d:"M22 11.08V12a10 10 0 11-5.93-9.14"}),e.jsx("path",{d:"M22 4L12 14.01l-3-3"})]}),W=({size:t,style:n,className:r})=>e.jsx("svg",{baseProfile:"tiny",viewBox:"0 0 24 24",fill:"currentColor",width:t,height:t,className:r,style:n,children:e.jsx("path",{d:"M12 4c-4.411 0-8 3.589-8 8s3.589 8 8 8 8-3.589 8-8-3.589-8-8-8zm-5 8c0-.832.224-1.604.584-2.295l6.711 6.711A4.943 4.943 0 0112 17c-2.757 0-5-2.243-5-5zm9.416 2.295L9.705 7.584A4.943 4.943 0 0112 7c2.757 0 5 2.243 5 5 0 .832-.224 1.604-.584 2.295z"})}),G=({size:t,style:n,className:r})=>e.jsx("svg",{viewBox:"0 0 512 512",fill:"currentColor",width:t,height:t,className:r,style:n,children:e.jsx("path",{d:"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"})}),U=({name:t,nodeData:n,rotate:r})=>{var o,a,i,s,l,c,d;const{getStyles:u,icons:p}=w(),m={size:"1.4em",className:"jer-icon"};switch(t){case"add":return null!==(o=null==p?void 0:p.add)&&void 0!==o?o:e.jsx(I,Object.assign({},m,{style:u("iconAdd",n)}));case"edit":return null!==(a=null==p?void 0:p.edit)&&void 0!==a?a:e.jsx(K,Object.assign({},m,{style:u("iconEdit",n)}));case"delete":return null!==(i=null==p?void 0:p.delete)&&void 0!==i?i:e.jsx(L,Object.assign({},m,{style:u("iconDelete",n),size:"1.45em"}));case"copy":return null!==(s=null==p?void 0:p.copy)&&void 0!==s?s:e.jsx(_,Object.assign({},m,{style:u("iconCopy",n),size:"1.2em"}));case"ok":return null!==(l=null==p?void 0:p.ok)&&void 0!==l?l:e.jsx(B,Object.assign({},m,{style:Object.assign({fontSize:"90%"},u("iconOk",n))}));case"cancel":return null!==(c=null==p?void 0:p.cancel)&&void 0!==c?c:e.jsx(W,Object.assign({},m,{style:Object.assign({fontSize:"130%"},u("iconCancel",n))}));case"chevron":return null!==(d=null==p?void 0:p.chevron)&&void 0!==d?d:e.jsx(G,{size:"1em",style:u("iconCollection",n)});default:return e.jsx(e.Fragment,{})}},H=({startEdit:n,handleDelete:r,handleAdd:o,enableClipboard:a,type:i,customButtons:s,nodeData:l,translate:c,keyboardControls:d,handleKeyboard:u})=>{const{getStyles:p}=w(),g=c("KEY_NEW",l),[h,y]=t.useState(!1),[f,b]=t.useState(g),{key:j,path:v,value:x}=l;return e.jsxs("div",{className:"jer-edit-buttons",style:{opacity:h?1:void 0},children:[a&&e.jsx("div",{onClick:e=>{var t;e.stopPropagation();let n,r,o="value",s="",l=null;if(a){const c=m(e);if(c&&d.clipboardModifier.includes(c)?(n=$(v),s=n,o="path"):(n=x,s=i?JSON.stringify(x,null,2):String(n)),!navigator.clipboard)return void("function"==typeof a&&a({success:!1,value:n,stringValue:s,path:v,key:j,type:o,errorMessage:"Can't access clipboard API"}));null===(t=navigator.clipboard)||void 0===t||t.writeText(s).then((()=>r=!0)).catch((e=>{r=!1,l=e.message})).finally((()=>{"function"==typeof a&&a({success:r,errorMessage:l,value:n,stringValue:s,path:v,key:j,type:o})}))}},className:"jer-copy-pulse",children:e.jsx(U,{name:"copy",nodeData:l})}),n&&e.jsx("div",{onClick:e=>{e.stopPropagation(),n()},children:e.jsx(U,{name:"edit",nodeData:l})}),r&&e.jsx("div",{onClick:e=>{e.stopPropagation(),r()},children:e.jsx(U,{name:"delete",nodeData:l})}),o&&e.jsx("div",{onClick:e=>{e.stopPropagation(),"object"===i?y(!0):o("")},children:e.jsx(U,{name:"add",nodeData:l})}),null==s?void 0:s.map((({Element:t,onClick:n},r)=>e.jsx("div",{onClick:e=>n&&n(l,e),children:e.jsx(t,{nodeData:l})},r))),h&&o&&"object"===i&&e.jsxs(e.Fragment,{children:[e.jsx("input",{className:"jer-input-new-key",type:"text",name:"new-object-key",value:f,onChange:e=>b(e.target.value),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>{u(e,{stringConfirm:()=>{o&&(y(!1),o(f),b(g))},cancel:()=>{y(!1),b(g)}})},style:p("input",l)}),e.jsx(Y,{onOk:e=>{f&&(e.stopPropagation(),y(!1),o(f))},onCancel:e=>{e.stopPropagation(),y(!1)},nodeData:l})]})]})},Y=({onOk:t,onCancel:n,nodeData:r})=>e.jsxs("div",{className:"jer-confirm-buttons",children:[e.jsx("div",{onClick:t,children:e.jsx(U,{name:"ok",nodeData:r})}),e.jsx("div",{onClick:n,children:e.jsx(U,{name:"cancel",nodeData:r})})]}),$=e=>e.reduce(((e,t)=>"number"==typeof t?`${e}[${t}]`:""===e?t:`${e}.${t}`),""),J=["string","number","boolean","null","object","array"],X=(e=[],t)=>{const n=e.filter((({condition:e})=>e(t)));if(0===n.length)return{};const r=n[0],{element:o,wrapperElement:a,customNodeProps:i,wrapperProps:s,hideKey:l=!1,showEditTools:c=!0,showOnEdit:d=!1,showOnView:u=!0,showCollectionWrapper:p=!0}=r,m=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n}(r,["element","wrapperElement","customNodeProps","wrapperProps","hideKey","showEditTools","showOnEdit","showOnView","showCollectionWrapper"]);return Object.assign({CustomNode:o,CustomWrapper:a,customNodeProps:i,wrapperProps:s,hideKey:l,showEditTools:c,showOnEdit:d,showOnView:u,showCollectionWrapper:p},m)},Z=({props:e,collapsed:n})=>{const{data:r,nodeData:o,parentData:a,onEdit:i,onError:s,showErrorMessages:l,restrictEditFilter:c,restrictDeleteFilter:d,restrictAddFilter:u,restrictDragFilter:m,translate:g,errorMessageTimeout:h}=e,{currentlyEditingElement:y,setCurrentlyEditingElement:f}=T(),[b,j]=t.useState(null),v=Object.assign(Object.assign({},o),{collapsed:n}),{path:x,key:E,size:D}=v,w=p(x),C=t.useMemo((()=>!c(v)),[v]),k=t.useMemo((()=>!d(v)),[v]),S=t.useMemo((()=>!u(v)),[v]),O=t.useMemo((()=>!m(v)&&k&&null===y),[v]),N=e=>{l&&(j(e),setTimeout((()=>j(null)),h)),console.warn("Error",e)},A=t.useMemo((()=>(e,t)=>{N(e.message),s&&s({currentData:v.fullData,errorValue:t,currentValue:r,name:E,path:x,error:e})}),[s,l]),R=y===w,M=y===`key_${w}`,P="number"==typeof x.slice(-1)[0];return{pathString:w,nodeData:v,path:x,name:E,size:D,canEdit:C,canDelete:k,canAdd:S,canDrag:O,error:b,showError:N,onError:A,setError:j,handleEditKey:e=>{if(f(null),E===e)return;if(!a)return;const t=x.slice(0,-1);if(Object.keys(a).includes(e))return void A({code:"KEY_EXISTS",message:g("ERROR_KEY_EXISTS",v)},e);const n=Object.fromEntries(Object.entries(a).map((([t,n])=>t===E?[e,n]:[t,n])));i(n,t).then((t=>{t&&A({code:"UPDATE_ERROR",message:t},e)}))},derivedValues:{isEditing:R,isEditingKey:M,isArray:P,canEditKey:null!==a&&C&&S&&k&&!P}}},q=({canDrag:n,canDragOnto:r,path:o,nodeData:a,onMove:i,onError:s,translate:l})=>{const{getStyles:c}=w(),{dragSource:d,setDragSource:u}=T(),[m,g]=t.useState(!1),h=p(o),y=t.useMemo((()=>n?{onDragStart:e=>{e.stopPropagation(),u({path:o,pathString:h})},onDragEnd:e=>{e.stopPropagation(),u({path:null,pathString:null})}}:{}),[n]),f=t.useMemo((()=>e=>r?{onDragOver:e=>{e.stopPropagation(),e.preventDefault()},onDrop:t=>{t.stopPropagation(),j(e),u({path:null,pathString:null}),g(!1)},onDragEnter:t=>{var n;t.stopPropagation(),h.startsWith(null!==(n=d.pathString)&&void 0!==n?n:"")||g(e)},onDragExit:e=>{e.stopPropagation(),g(!1)}}:{}),[d,r]),b=t.useMemo((()=>r&&null!==d.pathString?e.jsx("div",Object.assign({className:"jer-drop-target-bottom",style:{height:"50%",position:"absolute",width:"100%",top:"50%",zIndex:o.length}},f("below"))):null),[d,r]),j=e=>{var t,n;const r=null===(t=d.path)||void 0===t?void 0:t.slice(-1)[0],c=null===(n=d.path)||void 0===n?void 0:n.slice(0,-1).join("."),u=o.slice(0,-1).join(""),{parentData:p}=a;"string"==typeof r&&p&&!Array.isArray(p)&&Object.keys(p).includes(r)&&r in p&&c!==u?s({code:"KEY_EXISTS",message:l("ERROR_KEY_EXISTS",a)},r):i(d.path,o,e).then((e=>{e&&s({code:"UPDATE_ERROR",message:e},a.value)}))};return{dragSourceProps:y,getDropTargetProps:f,BottomDropTarget:b,DropTargetPadding:({position:t,nodeData:n})=>m===t?e.jsx("div",{className:"jer-drag-n-drop-padding",style:c("dropZone",n)}):null,handleDrop:j}},Q=(e,t,n)=>{var r,o,a;const i=parseInt(null!==(r=getComputedStyle(n.current).getPropertyValue("line-height"))&&void 0!==r?r:"16px"),s=(null!==(a=null===(o=t.current)||void 0===o?void 0:o.offsetWidth)&&void 0!==a?a:0)/(.5*i),l=JSON.stringify(e,null,2).replace(/\\n/g,"\n").split("\n").map((e=>Math.ceil(e.length/s))).reduce(((e,t)=>e+t),0)*i;return Math.min(l+30,window.innerHeight-50)},ee=n=>{const{data:r,parentData:o,onEdit:a,onDelete:i,onChange:l,onMove:c,enableClipboard:d,canDragOnto:u,restrictTypeSelection:p,searchFilter:m,searchText:g,showLabel:h,stringTruncate:y,showStringQuotes:b,indent:j,translate:v,customNodeDefinitions:x,handleKeyboard:E,keyboardControls:D,sort:C}=n,{getStyles:k}=w(),{setCurrentlyEditingElement:S,setCollapseState:O,previouslyEditedElement:N,setPreviouslyEditedElement:A,tabDirection:M,setTabDirection:P}=T(),[F,V]=t.useState("function"==typeof r?R:r),{pathString:z,nodeData:I,path:K,name:L,canEdit:_,canDelete:B,canDrag:W,error:G,onError:U,handleEditKey:$,derivedValues:Q}=Z({props:n}),{dragSourceProps:ee,getDropTargetProps:oe,BottomDropTarget:ae,DropTargetPadding:ie}=q({canDrag:W,canDragOnto:u,path:K,nodeData:I,onMove:c,onError:U,translate:v}),se=X(x,I),[le,ce]=t.useState(te(r,se)),de=t.useCallback((e=>{if(!l)return void V(e);const t=l({currentData:I.fullData,newValue:e,currentValue:F,name:L,path:K});V(t)}),[l]);t.useEffect((()=>{V("function"==typeof r?R:r),ce(te(r,se))}),[r,G]);const{CustomNode:ue,customNodeProps:pe,hideKey:me,showEditTools:ge=!0,showOnEdit:he,showOnView:ye}=se,fe=[...J,...x.filter((({showInTypesSelector:e=!1,name:t})=>e&&!!t)).map((({name:e})=>e))],be=t.useMemo((()=>{if("boolean"==typeof p)return p?[]:fe;if(Array.isArray(p))return p;const e=p(I);return"boolean"==typeof e?e?[]:fe:e}),[I,p]),{isEditing:je}=Q,ve=s("value",I,m,g);if(je&&(!ve||!_)){const e=f(I.fullData,K,M,C);S(e||N)}if(!ve)return null;const xe=()=>{let e;switch(S(null),le){case"object":e={[v("DEFAULT_NEW_KEY",I)]:F};break;case"array":e=null!=F?F:[];break;case"number":{const t=Number(F);e=isNaN(t)?0:t;break}default:e=F}a(e,K).then((t=>{t&&U({code:"UPDATE_ERROR",message:t},e)}))},Ee=()=>{S(null),V(r),ce(te(r,se))},{isEditingKey:De,canEditKey:we}=Q,Ce=!je&&G,ke=je&&be.length>0,Se="invalid"!==le&&!G&&ge,Oe=h&&De,Ne=h&&!De&&!me,Ae={value:F,parentData:o,setValue:de,isEditing:je,setIsEditing:_?()=>S(K):()=>{},handleEdit:xe,handleCancel:Ee,path:K,stringTruncate:y,showStringQuotes:b,nodeData:I,translate:v,handleKeyboard:E,keyboardCommon:{cancel:Ee,tabForward:()=>{P("next"),A(z);const e=f(I.fullData,K,"next",C);e&&(xe(),S(e))},tabBack:()=>{P("prev"),A(z);const e=f(I.fullData,K,"prev",C);e&&(xe(),S(e))}}},Te=ue&&(je&&he||!je&&ye)?e.jsx(ue,Object.assign({},n,{value:F,customNodeProps:pe,setValue:de,handleEdit:xe,handleCancel:Ee,handleKeyPress:e=>E(e,{stringConfirm:xe,cancel:Ee}),isEditing:je,setIsEditing:()=>S(K),getStyles:k})):ne(te(r),Ae);return e.jsxs("div",Object.assign({className:"jer-component jer-value-component",style:{marginLeft:j/2+"em",position:"relative"},draggable:W},ee,oe("above"),{children:[ae,e.jsx(ie,{position:"above",nodeData:I}),e.jsxs("div",{className:"jer-value-main-row",style:{flexWrap:L.length>10?"wrap":"nowrap"},children:[Ne&&e.jsx("span",{className:"jer-key-text",style:Object.assign(Object.assign({},k("property",I)),{minWidth:`${Math.min(String(L).length+1,5)}ch`,flexShrink:L.length>10?1:0}),onDoubleClick:()=>we&&S(K,"key"),children:""===L?e.jsx("span",{className:K.length>0?"jer-empty-string":void 0}):`${L}:`}),Oe&&e.jsx("input",{className:"jer-input-text jer-key-edit",type:"text",name:z,defaultValue:L,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>E(e,{stringConfirm:()=>$(e.target.value),cancel:Ee,tabForward:()=>{$(e.target.value),S(K)},tabBack:()=>{$(e.target.value),S(f(I.fullData,K,"prev",C))}}),style:{width:String(L).length/1.5+.5+"em"}}),e.jsxs("div",{className:"jer-value-and-buttons",children:[e.jsx("div",{className:"jer-input-component",children:Te}),je?e.jsx(Y,{onOk:xe,onCancel:Ee,nodeData:I}):Se&&e.jsx(H,{startEdit:_?()=>S(K,Ee):void 0,handleDelete:B?()=>{i(F,K).then((e=>{e&&U({code:"DELETE_ERROR",message:e},F)}))}:void 0,enableClipboard:d,translate:v,customButtons:n.customButtons,nodeData:I,handleKeyboard:E,keyboardControls:D}),ke&&e.jsxs("div",{className:"jer-select",children:[e.jsx("select",{name:`${L}-type-select`,className:"jer-type-select",onChange:e=>(e=>{const t=x.find((t=>t.name===e));if(t)a(t.defaultValue,K),ce(e),S(null),O({path:K,collapsed:!1});else{const t=re(F,e,v("DEFAULT_NEW_KEY",I),(null==se?void 0:se.CustomNode)?v("DEFAULT_STRING",I):void 0);de(t),a(t,K).then((e=>{e&&(U({code:"UPDATE_ERROR",message:e},t),S(null))}))}})(e.target.value),value:le,children:be.map((t=>e.jsx("option",{value:t,children:t},t)))}),e.jsx("span",{className:"focus"})]}),Ce&&e.jsx("span",{className:"jer-error-slug",style:k("error",I),children:G})]})]}),e.jsx(ie,{position:"below",nodeData:I})]}))},te=(e,t)=>(null==t?void 0:t.CustomNode)&&(null==t?void 0:t.name)&&t.showInTypesSelector?t.name:"string"==typeof e?"string":"number"==typeof e?"number":"boolean"==typeof e?"boolean":null===e?"null":"invalid",ne=(t,n)=>{const r=n.value;switch(t){case"string":return e.jsx(M,Object.assign({},n,{value:r}));case"number":return e.jsx(P,Object.assign({},n,{value:r}));case"boolean":return e.jsx(F,Object.assign({},n,{value:r}));case"null":return e.jsx(V,Object.assign({},n));default:return e.jsx(z,Object.assign({},n))}},re=(e,t,n,r)=>{switch(t){case"string":return null!=r?r:String(e);case"number":{const t=Number(e);return isNaN(t)?0:t}case"boolean":return!!e;case"null":return null;case"object":return{[n]:e};case"array":return[e];default:return String(e)}},oe=n=>{const{getStyles:r}=w(),{collapseState:l,setCollapseState:c,doesPathMatch:d,currentlyEditingElement:u,setCurrentlyEditingElement:p,areChildrenBeingEdited:g}=T(),{mainContainerRef:h,data:y,nodeData:b,parentData:j,showCollectionCount:x,onEdit:E,onAdd:D,onDelete:C,canDragOnto:k,collapseFilter:S,collapseAnimationTime:O,onMove:N,enableClipboard:A,searchFilter:R,searchText:M,indent:P,sort:F,showArrayIndices:V,defaultValue:z,translate:I,customNodeDefinitions:K,jsonParse:L,jsonStringify:_,TextEditor:B,keyboardControls:W,handleKeyboard:G,insertAtTop:$}=n,[J,te]=t.useState(_(y)),ne=S(b),{contentRef:re,isAnimating:ae,maxHeight:ie,collapsed:se,animateCollapse:le}=((e,n,r,o)=>{const[a,i]=t.useState(r?0:void 0),[s,l]=t.useState(r),c=t.useRef(!1),d=t.useRef(null),u=t.useRef(0),p=t.useRef();return{contentRef:d,isAnimating:c.current,animateCollapse:t=>{var r,a;if(s!==t){switch(window.clearTimeout(p.current),c.current=!0,t){case!0:{const e=null!==(a=null===(r=d.current)||void 0===r?void 0:r.offsetHeight)&&void 0!==a?a:0;u.current=e,i(e),setTimeout((()=>{i(0)}),5);break}case!1:i(u.current||Q(e,d,o))}l(!s),p.current=window.setTimeout((()=>{c.current=!1,t||i(void 0)}),n)}},maxHeight:a,collapsed:s}})(y,O,ne,h),{pathString:ce,nodeData:de,path:ue,name:pe,size:me,canEdit:ge,canDelete:he,canAdd:ye,canDrag:fe,error:be,setError:je,onError:ve,handleEditKey:xe,derivedValues:Ee}=Z({props:n,collapsed:se}),{dragSourceProps:De,getDropTargetProps:we,BottomDropTarget:Ce,DropTargetPadding:ke}=q({canDrag:fe,canDragOnto:k,path:ue,nodeData:de,onMove:N,onError:ve,translate:I}),Se=t.useRef(!ne);t.useEffect((()=>{te(_(y)),Ye&&p(null)}),[y]),t.useEffect((()=>{const e=S(de)&&!Ee.isEditing;Se.current=!e,le(e)}),[S]),t.useEffect((()=>{null!==l&&d(ue)&&(Se.current=!0,le(l.collapsed))}),[l]);const Oe=t.useRef(null),Ne=t.useMemo((()=>(e,t)=>"function"!=typeof z?z:z(e,t)),[z]),{CustomNode:Ae,customNodeProps:Te,CustomWrapper:Re,wrapperProps:Me={},hideKey:Pe,showEditTools:Fe=!0,showOnEdit:Ve,showOnView:ze,showCollectionWrapper:Ie=!0}=t.useMemo((()=>X(K,de)),[]),Ke=g(ce);Ke&&se&&le(!1);if(!(s("collection",de,R,M)||0===de.level)&&!Ke)return null;const Le=Array.isArray(y)?"array":"object",_e="array"===Le?{open:"[",close:"]"}:{open:"{",close:"}"},Be=e=>{if("Tab"!==e.key||e.getModifierState("Shift"))G(e,{objectConfirm:Ge,cancel:He});else{e.preventDefault();const t=v(Oe,"\t");te(t)}},We=e=>{const t=m(e);if(t&&W.collapseModifier.includes(t))return Se.current=!0,void c({collapsed:!se,path:ue});u&&u.includes(ce)||(Se.current=!0,c(null),le(!se))},Ge=()=>{try{const e=L(J);if(p(null),je(null),JSON.stringify(e)===JSON.stringify(y))return;E(e,ue).then((t=>{t&&ve({code:"UPDATE_ERROR",message:t},e)}))}catch(e){ve({code:"INVALID_JSON",message:I("ERROR_INVALID_JSON",de)},J)}},Ue=ue.length>0?()=>{C(y,ue).then((e=>{e&&ve({code:"DELETE_ERROR",message:e},y)}))}:void 0,He=()=>{p(null),je(null),te(_(y))},{isEditing:Ye,isEditingKey:$e,isArray:Je,canEditKey:Xe}=Ee,Ze="when-closed"===x?se:x,qe=!Ye&&Fe,Qe=(V||!Je)&&!Pe&&void 0!==pe,et=Ae&&(Ye&&Ve||!Ye&&ze),tt=Object.entries(y).map((([e,t])=>["array"===Le?Number(e):e,t]));"object"===Le&&F(tt,(e=>e));const nt=Se.current?Ye?e.jsxs("div",{className:"jer-collection-text-edit",children:[B?e.jsx(B,{value:J,onChange:te,onKeyDown:e=>G(e,{objectConfirm:Ge,cancel:He})}):e.jsx(a,{textAreaRef:Oe,className:"jer-collection-text-area",name:ce,value:J,setValue:te,isEditing:Ye,handleKeyPress:Be,styles:r("input",de)}),e.jsx("div",{className:"jer-collection-input-button-row",children:e.jsx(Y,{onOk:Ge,onCancel:He,nodeData:de})})]}):tt.map((([t,o],a)=>{const s={key:t,value:o,path:[...ue,t],level:ue.length+1,index:a,size:i(o)?Object.keys(o).length:1,parentData:y,fullData:de.fullData};return e.jsx("div",{className:"jer-collection-element",style:r("collectionElement",s),children:i(o)?e.jsx(oe,Object.assign({},n,{data:o,parentData:y,nodeData:s,showCollectionCount:x,canDragOnto:ge}),t):e.jsx(ee,Object.assign({},n,{data:o,parentData:y,nodeData:s,canDragOnto:ge,showLabel:"object"===Le||V}),t)},t)})):null,rt=!!Ie&&(se&&!Ke);rt||(Se.current=!0);const ot=Object.assign(Object.assign({},n),{data:y,value:y,parentData:j,nodeData:de,setValue:e=>o(void 0,void 0,void 0,(function*(){return yield E(e,ue)})),handleEdit:Ge,handleCancel:He,handleKeyPress:Be,isEditing:Ye,setIsEditing:()=>p(ue),getStyles:r,canDragOnto:ge}),at=et?e.jsx(Ae,Object.assign({customNodeProps:Te},ot,{children:nt})):nt,it=$e?e.jsx("input",{className:"jer-input-text jer-key-edit",type:"text",name:ce,defaultValue:pe,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>G(e,{stringConfirm:()=>xe(e.target.value),cancel:He,tabForward:()=>{xe(e.target.value);const t=null==tt?void 0:tt[0][0];p(t?[...ue,t]:f(de.fullData,ue,"next",F))},tabBack:()=>{xe(e.target.value),p(f(de.fullData,ue,"prev",F))}}),style:{width:String(pe).length/1.5+.5+"em"}}):Qe&&e.jsx("span",{className:"jer-key-text",style:r("property",de),onClick:e=>e.stopPropagation(),onDoubleClick:()=>Xe&&p(ue,"key"),children:""===pe?e.jsx("span",{className:ue.length>0?"jer-empty-string":void 0}):`${pe}:`}),st=qe&&e.jsx(H,{startEdit:ge?()=>{Se.current=!0,p(ue)}:void 0,handleAdd:ye?e=>{le(!1);const t=Ne(de,e);if("array"===Le){const e=$.array?0:y.length,n=$.array?{insert:!0}:{};D(t,[...ue,e],n).then((e=>{e&&ve({code:"ADD_ERROR",message:e},t)}))}else if(e in y)ve({code:"KEY_EXISTS",message:I("ERROR_KEY_EXISTS",de)},e);else{const n=$.object?{insertBefore:0}:{};D(t,[...ue,e],n).then((e=>{e&&ve({code:"ADD_ERROR",message:e},t)}))}}:void 0,handleDelete:he?Ue:void 0,enableClipboard:A,type:Le,nodeData:de,translate:I,customButtons:n.customButtons,keyboardControls:W,handleKeyboard:G}),lt=e.jsxs("div",Object.assign({className:"jer-component jer-collection-component",style:Object.assign(Object.assign({marginLeft:(0===ue.length?0:P/2)+"em"},r("collection",de)),{position:"relative"}),draggable:fe},De,we("above"),{children:[e.jsx("div",{className:"jer-clickzone",style:{width:P/2+1+"em",zIndex:10+2*de.level},onClick:e=>We(e)}),!Ye&&Ce,e.jsx(ke,{position:"above",nodeData:de}),Ie?e.jsxs("div",{className:"jer-collection-header-row",style:{position:"relative"},onClick:e=>We(e),children:[e.jsxs("div",{className:"jer-collection-name",children:[e.jsx("div",{className:"jer-collapse-icon jer-accordion-icon"+(se?" jer-rotate-90":""),style:{zIndex:11+2*de.level},onClick:e=>We(e),children:e.jsx(U,{name:"chevron",rotate:se,nodeData:de})}),it,!Ye&&e.jsx("span",{className:"jer-brackets jer-bracket-open",style:r("bracket",de),children:_e.open})]}),!Ye&&Ze&&e.jsx("div",{className:"jer-collection-item-count"+(Ze?" jer-visible":" jer-hidden"),style:r("itemCount",de),children:1===me?I("ITEM_SINGLE",Object.assign(Object.assign({},de),{size:1}),1):I("ITEMS_MULTIPLE",de,me)}),e.jsx("div",{className:"jer-brackets"+(rt?" jer-visible":" jer-hidden"),style:r("bracket",de),children:_e.close}),st]}):Pe?e.jsx(e.Fragment,{}):e.jsxs("div",{className:"jer-collection-header-row",style:{position:"relative"},children:[it,st]}),e.jsxs("div",{className:"jer-collection-inner",style:Object.assign({overflowY:rt||ae?"clip":"visible",maxHeight:Ke?void 0:ie},r("collectionInner",de)),ref:re,children:[at,e.jsx("div",{className:Ye?"jer-collection-error-row":"jer-collection-error-row-edit",children:be&&e.jsx("span",{className:"jer-error-slug",style:r("error",de),children:be})}),!Ye&&Ie&&e.jsx("div",{className:"jer-brackets jer-bracket-outside",style:Object.assign(Object.assign({},r("bracket",de)),{marginLeft:(P<3?-1:P<6?-.5:0)+"em"}),children:_e.close})]}),e.jsx(ke,{position:"below",nodeData:de})]}));return Re?e.jsx(Re,Object.assign({customNodeProps:Me},ot,{children:lt})):lt},ae={ITEM_SINGLE:"{{count}} item",ITEMS_MULTIPLE:"{{count}} items",KEY_NEW:"Enter new key",ERROR_KEY_EXISTS:"Key already exists",ERROR_INVALID_JSON:"Invalid JSON",ERROR_UPDATE:"Update unsuccessful",ERROR_DELETE:"Delete unsuccessful",ERROR_ADD:"Adding node unsuccessful",DEFAULT_STRING:"New data!",DEFAULT_NEW_KEY:"key"},ie=(e,t)=>(n,r,o)=>((e,t,n,r,o)=>{if(t[r]){const e=t[r](n);if(null!==e)return e}const a=r in e?e[r]:ae[r];return void 0===o?a:null==a?void 0:a.replace("{{count}}",String(o))})(e,t,r,n,o);var se=[],le=[];!function(e,t){if(e&&"undefined"!=typeof document){var n,r=!0===t.prepend?"prepend":"append",o=!0===t.singleTag,a="string"==typeof t.container?document.querySelector(t.container):document.getElementsByTagName("head")[0];if(o){var i=se.indexOf(a);-1===i&&(i=se.push(a)-1,le[i]={}),n=le[i]&&le[i][r]?le[i][r]:le[i][r]=s()}else n=s();65279===e.charCodeAt(0)&&(e=e.substring(1)),n.styleSheet?n.styleSheet.cssText+=e:n.appendChild(document.createTextNode(e))}function s(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),t.attributes)for(var n=Object.keys(t.attributes),o=0;o<n.length;o++)e.setAttribute(n[o],t.attributes[n[o]]);var i="prepend"===r?"afterbegin":"beforeend";return a.insertAdjacentElement(i,e),e}}(':root{--jer-select-border:#b6b6b6;--jer-select-focus:#777;--jer-select-arrow:#777;--jer-form-border:1px solid #ededf0;--jer-form-border-focus:1px solid #e2e2e2;--jer-expand-transition-time:0.3s;--jer-highlight-color:#b3d8ff}.jer-visible{opacity:1}.jer-hidden,.jer-visible{transition:var(--jer-expand-transition-time)}.jer-hidden{opacity:0}.jer-select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:#000;cursor:inherit;font-family:inherit;font-size:.8em;line-height:inherit;margin:0;outline:none;padding:0 1em 0 0;z-index:1}select::-ms-expand{display:none}.jer-select{align-items:center;background-color:#fff;background-image:linear-gradient(0deg,#f9f9f9,#fff 33%);border:1px solid var(--jer-select-border);border-radius:.25em;cursor:pointer;display:grid;grid-template-areas:"select";line-height:1.1;max-width:15ch;min-width:12ch;padding:.25em .5em;position:relative}.jer-select select,.jer-select:after{grid-area:select}.jer-select:not(.jer-select--multiple):after{background-color:var(--jer-select-arrow);clip-path:polygon(100% 0,0 0,50% 100%);content:"";height:.5em;justify-self:end;width:.8em}select:focus+.focus{border:1px solid var(--jer-select-focus);border-radius:inherit;bottom:-1px;left:-1px;position:absolute;right:-1px;top:-1px}.jer-editor-container{border-radius:.5em;font-size:16px;line-height:1;padding:1em 1em 1em 2em;position:relative;text-align:left}.jer-editor-container textarea{border:var(--jer-form-border);border-radius:.3em;color:var(--jer-input-color);outline:none}.jer-editor-container textarea:focus{border:var(--jer-form-border-focus)}.jer-editor-container input{border:var(--jer-form-border);border-radius:.3em;font-family:inherit;outline:none}.jer-editor-container input:focus{border:var(--jer-form-border-focus)}.jer-editor-container ::selection{background-color:var(--jer-highlight-color)}.jer-collection-header-row,.jer-value-main-row{align-items:center;display:flex;gap:.3em;min-height:1.7em}.jer-collection-header-row{display:flex;flex-wrap:wrap}.jer-collapse-icon{left:-1.2em;position:absolute;top:.35em}.jer-collection-inner{position:relative;transition:var(--jer-expand-transition-time)}.jer-collection-text-edit{align-items:flex-start;display:flex;flex-direction:column;gap:.3em}.jer-collection-text-area{font-family:inherit;font-size:.85em;max-height:40em;overflow:hidden;padding:.2em .5em 0;resize:both}.jer-collection-input-button-row{display:flex;font-size:150%;justify-content:flex-end;margin-top:.4em;width:100%}.jer-collection-error-row{bottom:.5em;position:absolute}.jer-error-slug{margin-left:1em}.jer-value-component{position:relative}.jer-value-main-row{display:flex;gap:0}.jer-value-and-buttons{align-items:center;display:flex;justify-content:flex-start;padding-left:.5em}.jer-value-error-row{position:absolute}.jer-value-string{line-height:1.3em;overflow-wrap:anywhere;white-space:pre-wrap}.jer-hyperlink{text-decoration:underline}.jer-input-text{font-family:inherit;font-size:.9em;height:1.4em;line-height:1.2em;margin:0;min-width:6em;overflow:hidden;padding:.25em .5em .2em;resize:none}.jer-input-boolean{margin-left:.3em;margin-right:.3em;transform:scale(1.5)}.jer-key-text{line-height:1.1em;white-space:pre-wrap;word-break:break-word}.jer-key-edit{font-size:inherit;font-size:.9em;padding:0 .3em}.jer-value-invalid{font-style:italic;opacity:.5}.jer-input-number{font-size:90%;min-width:3em}.jer-confirm-buttons,.jer-edit-buttons{align-items:center;cursor:pointer;display:flex;height:1em}.jer-input-buttons{gap:.4em}.jer-edit-buttons{gap:.4em;margin-left:.5em;opacity:0}.jer-confirm-buttons{gap:.2em;margin-left:.4em}.jer-edit-buttons:hover{opacity:1;position:relative}.jer-collection-header-row:hover>.jer-edit-buttons,.jer-value-and-buttons:hover>.jer-edit-buttons,.jer-value-main-row:hover>.jer-edit-buttons{opacity:1}.jer-copy-pulse{position:relative;transition:transform var(--jer-expand-transition-time)}.jer-copy-pulse:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-copy-pulse:after{border-radius:50%;box-shadow:0 0 15px 5px var(--jer-icon-copy-color);content:"";display:block;height:100%;left:0;opacity:0;position:absolute;top:0;transition:all .5s;width:100%}.jer-copy-pulse:active:after{border-radius:4em;box-shadow:0 0 0 0 var(--jer-icon-copy-color);left:0;opacity:1;position:absolute;top:0;transition:0s}.jer-copy-pulse:active{top:.07em}.jer-rotate-90{transform:rotate(-90deg)}.jer-accordion-icon,.jer-rotate-90{transition:transform var(--jer-expand-transition-time)}.jer-icon:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-empty-string:after{content:"<empty string>:";font-size:90%;font-style:italic}.jer-drag-n-drop-padding{border:1px dashed #e0e0e0;border-radius:.3em;height:.5em}.jer-clickzone{height:calc(100% - .8em);left:-1em;position:absolute;top:1.2em}',{});const ce=({data:n,setData:r,rootName:a="root",onUpdate:s=(()=>{}),onEdit:l=s,onDelete:c=s,onAdd:d=s,onChange:u,onError:p,showErrorMessages:m=!0,enableClipboard:h=!0,indent:f=2,collapse:b=!1,collapseAnimationTime:j=300,showCollectionCount:v=!0,restrictEdit:x=!1,restrictDelete:E=!1,restrictAdd:D=!1,restrictTypeSelection:C=!1,restrictDrag:k=!0,searchFilter:S,searchText:O,searchDebounceTime:N=350,keySort:A=!1,showArrayIndices:R=!0,showStringQuotes:M=!0,defaultValue:P=null,minWidth:F=250,maxWidth:V="min(600px, 90vw)",rootFontSize:z,stringTruncate:I=250,translations:K={},className:L,id:_,customText:B={},customNodeDefinitions:W=[],customButtons:G=[],jsonParse:U=JSON.parse,jsonStringify:H=(e=>JSON.stringify(e,null,2)),TextEditor:Y,errorMessageTimeout:$=2500,keyboardControls:J={},insertAtTop:X=!1})=>{const{getStyles:Z}=w(),{setCurrentlyEditingElement:q}=T(),Q=t.useCallback(ue(b),[b]),te=t.useCallback(ie(K,B),[K,B]),[ne,re]=t.useState(O),[ae,se]=(({setData:e,data:n})=>{const[r,o]=t.useState(e?void 0:n),a=t.useCallback((t=>{e?e(t):o(t)}),[e]);return t.useEffect((()=>{e||o(n)}),[n]),[e?n:r,a]})({setData:r,data:n}),le=t.useRef(null);t.useEffect((()=>{q(null);const e=setTimeout((()=>re(O)),N);return()=>clearTimeout(e)}),[O,N]);const ce={key:a,path:[],level:0,index:0,value:ae,size:"object"==typeof ae&&null!==ae?Object.keys(ae).length:1,parentData:null,fullData:ae},ge=(e,t)=>o(void 0,void 0,void 0,(function*(){const n=yield e(t);if(!0===n||void 0===n)return void se(t.newData);const r=me(n)?n:["error",n],[o,a]=r;if("error"===o)return se(t.currentData),!1===a?te("ERROR_UPDATE",ce):String(a);se(a)})),he=t.useMemo((()=>ue(x)),[x]),ye=t.useMemo((()=>ue(E)),[E]),fe=t.useMemo((()=>ue(D)),[D]),be=t.useMemo((()=>ue(k)),[k]),je=t.useMemo((()=>pe(S)),[S]),ve=t.useMemo((()=>(e=>{const t=Object.assign({},y);for(const n of Object.keys(y)){const r=n;if(e[r]){const o=e[r],a=["clipboardModifier","collapseModifier"].includes(n)?Array.isArray(o)?o:[o]:"string"==typeof o?{key:o}:o;t[r]=a,["stringConfirm","numberConfirm","booleanConfirm"].forEach((n=>{!e[n]&&e.confirm&&(t[n]=t.confirm)}))}}return t})(J)),[J]),xe=t.useCallback(((e,t)=>((e,t,n)=>{const r=Object.entries(t);for(const[t,o]of r)if(g(n,e[t],t)){n.preventDefault(),o();break}})(ve,t,e)),[J]),Ee=t.useCallback(((e,t)=>{!1!==A&&("function"!=typeof A?e.sort(((e,n)=>{const r=t(e)[0],o=t(n)[0];return r<o?-1:r>o?1:0})):e.sort(((e,n)=>A(t(e),t(n)))))}),[A]),De={mainContainerRef:le,name:a,nodeData:ce,onEdit:(e,t)=>o(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=de(ae,t,e,"update");if(o!==a)return yield ge(l,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onDelete:(e,t)=>o(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=de(ae,t,e,"delete");return yield ge(c,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onAdd:(e,t,n)=>o(void 0,void 0,void 0,(function*(){const{currentData:r,newData:o,currentValue:a,newValue:i}=de(ae,t,e,"add",n);return yield ge(d,{currentData:r,newData:o,currentValue:a,newValue:i,name:t.slice(-1)[0],path:t})})),onChange:u,onError:p,showErrorMessages:m,onMove:(e,t,n)=>o(void 0,void 0,void 0,(function*(){if(null===e)return;const{currentData:r,newData:o,currentValue:a}=de(ae,e,"","delete"),i=e.slice(-1)[0],s=t.slice(0,-1),c=t.slice(-1)[0];let d="number"==typeof c?"above"===n?c:c+1:"number"==typeof i?`arr_${i}`:i;e.slice(0,-1).join(".")===t.slice(0,-1).join(".")&&"number"==typeof i&&"number"==typeof d&&i<d&&(d-=1);const u="number"==typeof d?{insert:!0}:"above"===n?{insertBefore:c}:{insertAfter:c},{newData:p,newValue:m}=de(o,[...s,d],a,"add",u);return yield ge(l,{currentData:r,newData:p,currentValue:a,newValue:m,name:t.slice(-1)[0],path:t})})),showCollectionCount:v,collapseFilter:Q,collapseAnimationTime:j,restrictEditFilter:he,restrictDeleteFilter:ye,restrictAddFilter:fe,restrictTypeSelection:C,restrictDragFilter:be,canDragOnto:!1,searchFilter:je,searchText:ne,enableClipboard:h,keySort:A,sort:Ee,showArrayIndices:R,showStringQuotes:M,indent:f,defaultValue:P,stringTruncate:I,translate:te,customNodeDefinitions:W,customButtons:G,parentData:null,jsonParse:U,jsonStringify:H,TextEditor:Y,errorMessageTimeout:$,handleKeyboard:xe,keyboardControls:ve,insertAtTop:{object:!0===X||"object"===X,array:!0===X||"array"===X}},we=Object.assign(Object.assign({},Z("container",ce)),{minWidth:F,maxWidth:V});return we.fontSize=null!=z?z:we.fontSize,e.jsx("div",{id:_,ref:le,className:`jer-editor-container ${null!=L?L:""}`,style:we,children:i(ae)?e.jsx(oe,Object.assign({data:ae},De)):e.jsx(ee,Object.assign({data:ae,showLabel:!0},De))})},de=(e,t,o,a,i={})=>{if(0===t.length)return{currentData:e,newData:o,currentValue:e,newValue:o};const s=Object.assign({remove:"delete"===a},i),l="add"!==a?r(e,t):void 0;return{currentData:e,newData:n(e,t,o,s),currentValue:l,newValue:"delete"!==a?o:void 0}},ue=e=>"boolean"==typeof e?()=>e:"number"==typeof e?({level:t})=>t>=e:e,pe=e=>{if(void 0!==e)return"value"===e?c:"key"===e?d:"all"===e?(e,t)=>c(e,t)||d(e,t):e},me=e=>Array.isArray(e)&&2===e.length&&["error","value"].includes(e[0]),ge=({value:t,setIsEditing:n,getStyles:r,customNodeProps:o,nodeData:a})=>{var i,s;const l=null!==(i=null==o?void 0:o.stringTruncate)&&void 0!==i?i:100,c=r("string",a);return e.jsx("div",{onDoubleClick:()=>n(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&n(!0)},className:"jer-value-string jer-hyperlink",style:c,children:e.jsxs("a",{href:t,target:"_blank",rel:"noreferrer",style:{color:null!==(s=c.color)&&void 0!==s?s:void 0},children:['"',u(t,l),'"']})})},he={condition:({value:e})=>"string"==typeof e&&/^https?:\/\/.+\..+$/.test(e),element:ge,showOnView:!0,showOnEdit:!1};exports.assign=n,exports.extract=r,exports.IconAdd=I,exports.IconCancel=W,exports.IconChevron=G,exports.IconCopy=_,exports.IconDelete=L,exports.IconEdit=K,exports.IconOk=B,exports.JsonEditor=n=>{var r;const[o,a]=t.useState();t.useEffect((()=>{const e=document.documentElement;a(e)}),[]);const{collapseAnimationTime:i=300}=n;if(!o)return null;const s=getComputedStyle(o).getPropertyValue("--jer-expand-transition-time");return 1e3*parseFloat(s)!==i&&o.style.setProperty("--jer-expand-transition-time",i/1e3+"s"),e.jsx(D,{theme:null!==(r=n.theme)&&void 0!==r?r:x,icons:n.icons,docRoot:o,children:e.jsx(A,{children:e.jsx(ce,Object.assign({},n))})})},exports.LinkCustomComponent=ge,exports.LinkCustomNodeDefinition=he,exports.candyWrapperTheme={displayName:"Candy Wrapper",fragments:{minty:{backgroundColor:"#F1FAEE"},pale:{color:"#A8DADC"},mid:{color:"#457B9D"},dark:{color:"#1D3557"},pop:{color:"#E63946"},darkBlue:{color:"#2B2D42"}},styles:{container:"minty",property:"pop",dropZone:"#eb121217",bracket:"dark",itemCount:"pale",string:"mid",number:["darkBlue",{fontSize:"85%"}],boolean:["mid",{fontStyle:"italic",fontWeight:"bold",fontSize:"80%"}],null:["#cccccc",{fontWeight:"bold"}],input:{border:"1px solid rgb(115, 194, 198)"},iconCollection:"#1D3557",iconEdit:"#457B9D",iconDelete:"#E63946",iconAdd:"#2B2D42",iconCopy:"#1D3557",iconCancel:"#E63946"}},exports.defaultTheme=x,exports.githubDarkTheme={displayName:"Github Dark",styles:{container:{backgroundColor:"#0d1117",color:"white"},dropZone:"rgba(165, 214, 255, 0.17)",property:"#E6EDF3",bracket:"#56d364",itemCount:"#8B949E",string:"#A5D6FF",number:"#D2A8FF",boolean:{color:"#FF7B72",fontSize:"90%",fontWeight:"bold"},null:"green",iconCollection:"#D2A8FF",iconEdit:"#D2A8FF",iconDelete:"rgb(203, 75, 22)",iconAdd:"rgb(203, 75, 22)",iconCopy:"#A5D6FF",iconOk:"#56d364",iconCancel:"rgb(203, 75, 22)"}},exports.githubLightTheme={displayName:"Github Light",styles:{container:"white",property:"#1F2328",bracket:"#00802e",itemCount:"#8B949E",string:"#0A3069",number:"#953800",boolean:{color:"#CF222E",fontSize:"90%",fontWeight:"bold"},null:"#FF7B72",iconCollection:"#8250DF",iconEdit:"#8250DF",iconDelete:"rgb(203, 75, 22)",iconAdd:"#8250DF",iconCopy:"#57606A"}},exports.isCollection=i,exports.matchNode=c,exports.matchNodeKey=d,exports.monoDarkTheme={displayName:"Black & White",fragments:{lightText:{color:"white"},midGrey:"#5c5c5c"},styles:{container:["lightText",{backgroundColor:"black"}],dropZone:"#e0e0e029",property:"lightText",bracket:"midGrey",itemCount:"#4a4a4a",string:"#a8a8a8",number:"#666666",boolean:{color:"#848484",fontStyle:"italic"},null:"#333333",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},exports.monoLightTheme={fragments:{midGrey:"#a3a3a3"},displayName:"White & Black",styles:{container:"white",property:"black",bracket:"midGrey",itemCount:"#b5b5b5",string:"#575757",number:"#999999",boolean:{color:"#7b7b7b",fontStyle:"italic"},null:"#cccccc",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},exports.psychedelicTheme={displayName:"Psychedelic",fragments:{pale:{color:"#A8DADC"},fluroYellow:"rgb(242, 228, 21)",fluroGreen:"rgb(68, 255, 62)",hotPink:"#f7379a"},styles:{container:{backgroundColor:"unset",background:"linear-gradient(90deg, hsla(333, 100%, 53%, 1) 0%, hsla(33, 94%, 57%, 1) 100%)",color:"black"},dropZone:"fluroYellow",property:"black",bracket:"fluroYellow",itemCount:["pale",{opacity:.7}],string:"white",number:["#33d9ff",{fontSize:"90%",fontWeight:"bold"}],boolean:["fluroGreen",{fontWeight:"bold",fontSize:"80%"}],null:["black",{fontWeight:"bold",opacity:.3,backgroundColor:"rgb(255, 255, 255, 0.5)",padding:"0 0.4em",borderRadius:"0.4em"}],iconCollection:"fluroYellow",iconEdit:["black"],iconDelete:["white",{opacity:.5}],iconAdd:["white",{opacity:.5}],iconCopy:"rgb(32, 84, 242)",iconOk:"fluroGreen",iconCancel:"hotPink"}},exports.truncate=u;
package/build/index.d.ts CHANGED
@@ -61,6 +61,7 @@ interface JsonEditorProps {
61
61
  customButtons?: CustomButtonDefinition[];
62
62
  jsonParse?: (input: string) => JsonData;
63
63
  jsonStringify?: (input: JsonData) => string;
64
+ TextEditor?: React.FC<TextEditorProps>;
64
65
  errorMessageTimeout?: number;
65
66
  keyboardControls?: KeyboardControls;
66
67
  insertAtTop?: boolean | 'array' | 'object';
@@ -79,6 +80,11 @@ interface IconReplacements {
79
80
  cancel?: JSX.Element;
80
81
  chevron?: JSX.Element;
81
82
  }
83
+ interface TextEditorProps {
84
+ value: string;
85
+ onChange: (value: string) => void;
86
+ onKeyDown: (e: React.KeyboardEvent) => void;
87
+ }
82
88
  interface UpdateFunctionProps {
83
89
  newData: JsonData;
84
90
  currentData: JsonData;
@@ -115,6 +121,8 @@ type DefaultValueFunction = (input: NodeData) => unknown;
115
121
  type SearchFilterFunction = (inputData: NodeData, searchText: string) => boolean;
116
122
  type CopyType = 'path' | 'value';
117
123
  type CopyFunction = (input: {
124
+ success: boolean;
125
+ errorMessage: string | null;
118
126
  key: CollectionKey;
119
127
  path: CollectionKey[];
120
128
  value: unknown;
@@ -158,7 +166,7 @@ interface NodeData {
158
166
  path: CollectionKey[];
159
167
  level: number;
160
168
  index: number;
161
- value: unknown;
169
+ value: JsonData;
162
170
  size: number | null;
163
171
  parentData: object | null;
164
172
  fullData: JsonData;
@@ -208,6 +216,7 @@ interface CollectionNodeProps extends BaseNodeProps {
208
216
  object: boolean;
209
217
  array: boolean;
210
218
  };
219
+ TextEditor?: React.FC<TextEditorProps>;
211
220
  }
212
221
  type ValueData = string | number | boolean;
213
222
  interface ValueNodeProps extends BaseNodeProps {
@@ -300,4 +309,4 @@ declare const monoLightTheme: Theme;
300
309
  declare const candyWrapperTheme: Theme;
301
310
  declare const psychedelicTheme: Theme;
302
311
 
303
- export { CollectionNodeProps, CompareFunction, CopyFunction, CustomNodeDefinition, CustomNodeProps, CustomTextDefinitions, CustomTextFunction, DataType, DefaultValueFunction, FilterFunction, IconAdd, IconCancel, IconChevron, IconCopy, IconDelete, IconEdit, IconOk, IconReplacements, JerError, JsonData, JsonEditor, JsonEditorProps, KeyboardControls, LinkCustomComponent, LinkCustomNodeDefinition, LocalisedStrings, NodeData, OnChangeFunction, OnErrorFunction, SearchFilterFunction, Theme, ThemeInput, ThemeStyles, TranslateFunction, TypeFilterFunction, UpdateFunction, ValueNodeProps, candyWrapperTheme, defaultTheme, githubDarkTheme, githubLightTheme, isCollection, matchNode, matchNodeKey, monoDarkTheme, monoLightTheme, psychedelicTheme, truncate };
312
+ export { CollectionNodeProps, CompareFunction, CopyFunction, CustomNodeDefinition, CustomNodeProps, CustomTextDefinitions, CustomTextFunction, DataType, DefaultValueFunction, FilterFunction, IconAdd, IconCancel, IconChevron, IconCopy, IconDelete, IconEdit, IconOk, IconReplacements, JerError, JsonData, JsonEditor, JsonEditorProps, KeyboardControls, LinkCustomComponent, LinkCustomNodeDefinition, LocalisedStrings, NodeData, OnChangeFunction, OnErrorFunction, SearchFilterFunction, TextEditorProps, Theme, ThemeInput, ThemeStyles, TranslateFunction, TypeFilterFunction, UpdateFunction, ValueNodeProps, candyWrapperTheme, defaultTheme, githubDarkTheme, githubLightTheme, isCollection, matchNode, matchNodeKey, monoDarkTheme, monoLightTheme, psychedelicTheme, truncate };
package/build/index.esm.js CHANGED
@@ -1 +1 @@
1
- import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{createContext as r,useContext as o,useState as a,useRef as i,useEffect as l,useMemo as s,useCallback as c}from"react";import d from"object-property-assigner";export{default as assign}from"object-property-assigner";import u from"object-property-extractor";export{default as extract}from"object-property-extractor";function p(e,t,n,r){return new(n||(n=Promise))((function(o,a){function i(e){try{s(r.next(e))}catch(e){a(e)}}function l(e){try{s(r.throw(e))}catch(e){a(e)}}function s(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,l)}s((r=r.apply(e,t||[])).next())}))}"function"==typeof SuppressedError&&SuppressedError;const g=({className:n,name:r,value:o,setValue:a,handleKeyPress:i,styles:l,textAreaRef:s})=>{if("string"!=typeof o)return null;const c="\n"===o.slice(-1)?o+".":o;return e("div",{style:{display:"grid"},children:[t("textarea",{id:`${r}_textarea`,ref:s,style:Object.assign({height:"auto",gridArea:"1 / 1 / 2 / 2",overflowY:"auto",whiteSpace:"pre-wrap"},l),rows:1,className:n,name:`${r}_textarea`,value:o,onChange:e=>a(e.target.value),autoFocus:!0,onFocus:e=>{o.length<40&&e.target.select()},onKeyDown:i}),t("span",{className:n,style:Object.assign({visibility:"hidden",height:"auto",gridArea:"1 / 1 / 2 / 2",color:"red",opacity:.9,whiteSpace:"pre-wrap",overflowY:"auto",border:"1px solid transparent"},l),children:c})]})},m=e=>null!==e&&"object"==typeof e,h=(e,t,n,r="")=>{if(!n&&!r)return!0;switch(e){case"collection":if(n){if(n(t,r))return!0;if(!y(r,t,n))return!1}if(!n&&r&&!y(r,t))return!1;break;case"value":if(n&&!n(t,r))return!1;if(!n&&r&&!b(t,r))return!1}return!0},y=(e="",t,n=b)=>{const r=t.value;return Object.entries(r).some((([o,a])=>{const i=[...t.path,o],l=Object.assign(Object.assign({},t),{key:o,path:i,level:t.level+1,value:a,size:i.length,parentData:r});return m(a)?y(e,l,n):n(l,e)}))},b=(e,t="")=>{const{value:n}=e;if(null===n&&"null".includes(t.toLowerCase()))return!0;switch(typeof n){case"string":return n.toLowerCase().includes(t.toLowerCase());case"number":return!!String(n).includes(t);case"boolean":return n?"true".includes(t.toLowerCase())||"1"===t:"false".includes(t.toLowerCase())||"0"===t;default:return!1}},f=({key:e,path:t},n="")=>!!b({value:e},n)||!!t.some((e=>b({value:e},n))),v=(e,t=200)=>"string"==typeof e?e.length<t?e:`${e.slice(0,t-2).trim()}...`:e,j=(e,t)=>(null!=t?t:"")+e.map((e=>""===e?String.fromCharCode(0):e)).join("."),E=e=>e.shiftKey?"Shift":e.metaKey?"Meta":e.ctrlKey?"Control":e.altKey?"Alt":void 0,D=(e,t,n)=>{const r=e.key,o=E(e);if(Array.isArray(t))return!!o&&t.includes(o);const{key:a,modifier:i}=t;return("stringLineBreak"!==n||"Enter"!==r||"Shift"!==o||"Enter"!==a||!(null==i?void 0:i.includes("Shift")))&&(r===a&&(i===o||Array.isArray(i)&&i.includes(o)))},w={key:"Enter"},k={confirm:w,cancel:{key:"Escape"},objectConfirm:Object.assign(Object.assign({},w),{modifier:["Meta","Shift","Control"]}),objectLineBreak:w,stringConfirm:w,stringLineBreak:Object.assign(Object.assign({},w),{modifier:["Shift"]}),numberConfirm:w,numberUp:{key:"ArrowUp"},numberDown:{key:"ArrowDown"},tabForward:{key:"Tab"},tabBack:{key:"Tab",modifier:"Shift"},booleanConfirm:w,booleanToggle:{key:" "},clipboardModifier:["Meta","Control"],collapseModifier:["Alt"]},C=(e,t,n="next",r)=>{const o=t.slice(0,t.length-1),a=t.slice(-1)[0];if(void 0===a)return null;const i=u(e,o),l=S(i);Array.isArray(i)||r(l,(({key:e,value:t})=>[e,t]));const s=l.findIndex((e=>e.key===a)),c=l[s+("next"===n?1:-1)];return c?m(c.value)?0===Object.keys(c.value).length?C(e,[...o,c.key],n,r):O(e,[...o,c.key],n,r):[...o,c.key]:0===o.length?null:C(e,o,n,r)},O=(e,t,n="next",r)=>{const o=u(e,t);if(!m(o))return t;const a=Array.isArray(o)?o.map(((e,t)=>t)):Object.keys(o);r(a,(e=>[e,o]));const i="next"===n?a[0]:a[a.length-1];return O(e,[...t,i],n,r)},S=e=>Array.isArray(e)?e.map(((e,t)=>({index:t,value:e,key:t}))):Object.entries(e).map((([e,t],n)=>({key:e,value:t,index:n}))),N=(e,t)=>{var n,r,o,a;const i=e.current,l=null!==(n=null==i?void 0:i.selectionStart)&&void 0!==n?n:1/0,s=null!==(r=null==i?void 0:i.selectionEnd)&&void 0!==r?r:1/0,c=(null===(o=null==i?void 0:i.textContent)||void 0===o?void 0:o.slice(0,l))+t+(null===(a=null==i?void 0:i.textContent)||void 0===a?void 0:a.slice(s));return i.value=c,null==i||i.setSelectionRange(l+1,l+1),c},x={displayName:"Default",fragments:{edit:"rgb(42, 161, 152)"},styles:{container:{backgroundColor:"#f6f6f6",fontFamily:"monospace"},collection:{},collectionInner:{},collectionElement:{},dropZone:{},property:"#292929",bracket:{color:"rgb(0, 43, 54)",fontWeight:"bold"},itemCount:{color:"rgba(0, 0, 0, 0.3)",fontStyle:"italic"},string:"rgb(203, 75, 22)",number:"rgb(38, 139, 210)",boolean:"green",null:{color:"rgb(220, 50, 47)",fontVariant:"small-caps",fontWeight:"bold"},input:["#292929"],inputHighlight:"#b3d8ff",error:{fontSize:"0.8em",color:"red",fontWeight:"bold"},iconCollection:"rgb(0, 43, 54)",iconEdit:"edit",iconDelete:"rgb(203, 75, 22)",iconAdd:"edit",iconCopy:"rgb(38, 139, 210)",iconOk:"green",iconCancel:"rgb(203, 75, 22)"}},A=r({getStyles:()=>({}),icons:{}}),T=({theme:e=x,icons:n={},docRoot:r,children:o})=>{const a=R(e,r);return t(A.Provider,{value:{getStyles:(e,t)=>"function"==typeof a[e]?a[e](t):a[e],icons:n},children:o})},P=()=>o(A),R=(e,t)=>{var n,r,o,a;const i={},l=(Array.isArray(e)?e:[e]).map((e=>z(e)?V({fragments:{},styles:e},i):V(e,i))),s=V(x,{});Object.keys(s).forEach((e=>{const t=e;l.forEach((e=>{e[t]&&(s[t]=Object.assign(Object.assign({},s[t]),e[t]))}))}));const c=Object.assign({},s);return Object.entries(i).forEach((([e,t])=>{const n=e;c[n]=e=>{const r=t(e)||{};return Object.assign(Object.assign({},s[n]),r)}})),"function"!=typeof(null==c?void 0:c.inputHighlight)&&(null===(n=null==c?void 0:c.inputHighlight)||void 0===n?void 0:n.backgroundColor)&&t.style.setProperty("--jer-highlight-color",null===(r=null==c?void 0:c.inputHighlight)||void 0===r?void 0:r.backgroundColor),"function"!=typeof(null==c?void 0:c.iconCopy)&&(null===(o=null==c?void 0:c.iconCopy)||void 0===o?void 0:o.color)&&t.style.setProperty("--jer-icon-copy-color",null===(a=null==c?void 0:c.iconCopy)||void 0===a?void 0:a.color),c},V=(e,t)=>{const{fragments:n,styles:r}=e,o={};return Object.entries(r).forEach((([e,r])=>{const a=(Array.isArray(r)?r:[r]).reduce(((r,o)=>{var a,i;if("function"==typeof o)return t[e]=o,Object.assign({},r);if("string"==typeof o){const t=null!==(a=null==n?void 0:n[o])&&void 0!==a?a:o;return"string"==typeof t?Object.assign(Object.assign({},r),{[null!==(i=F[e])&&void 0!==i?i:"color"]:t}):Object.assign(Object.assign({},r),t)}return Object.assign(Object.assign({},r),o)}),{});o[e]=a})),o},z=e=>!("styles"in e),F={container:"backgroundColor",collection:"backgroundColor",collectionInner:"backgroundColor",collectionElement:"backgroundColor",dropZone:"borderColor",inputHighlight:"backgroundColor"},M=r({collapseState:null,setCollapseState:()=>{},doesPathMatch:()=>!1,currentlyEditingElement:null,setCurrentlyEditingElement:()=>{},previouslyEditedElement:null,setPreviouslyEditedElement:()=>{},areChildrenBeingEdited:()=>!1,dragSource:{path:null,pathString:null},setDragSource:()=>{},tabDirection:"next",setTabDirection:()=>{}}),K=({children:e})=>{const[n,r]=a(null),[o,l]=a(null),[s,c]=a({path:null,pathString:null}),d=i(null),u=i("next"),p=i(null);return t(M.Provider,{value:{collapseState:n,setCollapseState:e=>{r(e),null!==e&&setTimeout((()=>r(null)),2e3)},doesPathMatch:e=>{if(null===n)return!1;for(const[t,r]of n.path.entries())if(r!==e[t])return!1;return!0},currentlyEditingElement:o,setCurrentlyEditingElement:(e,t)=>{const n="string"==typeof e||null===e?e:j(e,"key"===t?"key_":void 0);null!==o&&null!==n&&null!==d.current&&d.current(),l(n),d.current="function"==typeof t?t:null},areChildrenBeingEdited:e=>null!==o&&o.includes(e),previouslyEditedElement:p.current,setPreviouslyEditedElement:e=>{p.current=e},tabDirection:u.current,setTabDirection:e=>{u.current=e},dragSource:s,setDragSource:c},children:e})},_=()=>o(M),I="**INVALID_FUNCTION**",L=({value:n,setValue:r,isEditing:o,path:a,setIsEditing:l,handleEdit:s,stringTruncate:c,showStringQuotes:d,nodeData:u,handleKeyboard:p,keyboardCommon:m})=>{const{getStyles:h}=P(),y=i(null),b=j(a),f=d?'"':"";return o?t(g,{className:"jer-input-text",textAreaRef:y,name:b,value:n,setValue:r,isEditing:o,handleKeyPress:e=>{p(e,Object.assign({stringConfirm:s,stringLineBreak:()=>{const e=N(y,"\n");r(e)}},m))},styles:h("input",u)}):e("div",{id:`${b}_display`,onDoubleClick:()=>l(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&l(!0)},className:"jer-value-string",style:h("string",u),children:[f,v(n,c),f]})},B=({value:e,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:l,handleKeyboard:s,keyboardCommon:c})=>{const{getStyles:d}=P();return r?t("input",{className:"jer-input-number",type:"text",name:j(o),value:e,onChange:e=>n(e.target.value.replace(/[^0-9.-]/g,"")),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:t=>s(t,Object.assign({numberConfirm:i,numberUp:()=>n(Number(e)+1),numberDown:()=>n(Number(e)-1)},c)),style:Object.assign({width:String(e).length/1.5+2+"em"},d("input",l))}):t("span",{onDoubleClick:()=>a(!0),className:"jer-value-number",style:d("number",l),children:e})},W=({value:e,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:l,handleKeyboard:s,keyboardCommon:c})=>{const{getStyles:d}=P();return r?t("input",{className:"jer-input-boolean",type:"checkbox",name:j(o),checked:e,onChange:()=>n(!e),onKeyDown:t=>{" "===t.key&&t.preventDefault(),s(t,Object.assign({booleanConfirm:i,booleanToggle:()=>n(!e)},c))},autoFocus:!0}):t("span",{onDoubleClick:()=>a(!0),className:"jer-value-boolean",style:d("boolean",l),children:String(e)})},G=({value:e,isEditing:n,setIsEditing:r,handleEdit:o,nodeData:a,handleKeyboard:s,keyboardCommon:c})=>{const{getStyles:d}=P(),u=i();l((()=>{if(n)return u.current=window.setTimeout((()=>window.addEventListener("keydown",p)),100),()=>window.removeEventListener("keydown",p);window.clearTimeout(u.current)}),[n]);const p=e=>s(e,Object.assign({confirm:o},c));return t("div",{onDoubleClick:()=>r(!0),className:"jer-value-null",style:d("null",a),children:String(e)})},U=({value:e})=>{let n="Error!";switch(typeof e){case"string":e===I&&(n="Function");break;case"undefined":n="Undefined";break;case"symbol":n="Symbol"}return t("span",{className:"jer-value-invalid",children:n})},H=({size:n,style:r,className:o})=>e("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:n,height:n,className:o,style:r,children:[t("path",{d:"M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4z"}),t("path",{d:"M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z"})]}),Y=({size:n,style:r,className:o})=>e("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:n,height:n,className:o,style:r,transform:"translate(0, 0.5)",children:[t("path",{d:"M7 17.013l4.413-.015 9.632-9.54c.378-.378.586-.88.586-1.414s-.208-1.036-.586-1.414l-1.586-1.586c-.756-.756-2.075-.752-2.825-.003L7 12.583v4.43zM18.045 4.458l1.589 1.583-1.597 1.582-1.586-1.585 1.594-1.58zM9 13.417l6.03-5.973 1.586 1.586-6.029 5.971L9 15.006v-1.589z"}),t("path",{d:"M5 21h14c1.103 0 2-.897 2-2v-8.668l-2 2V19H8.158c-.026 0-.053.01-.079.01-.033 0-.066-.009-.1-.01H5V5h6.847l2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2z"})]}),$=({size:e,style:n,className:r})=>t("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:e,height:e,className:r,style:n,children:t("path",{d:"M6 19a2 2 0 002 2h8a2 2 0 002-2V7H6v12m2.46-7.12l1.41-1.41L12 12.59l2.12-2.12 1.41 1.41L13.41 14l2.12 2.12-1.41 1.41L12 15.41l-2.12 2.12-1.41-1.41L10.59 14l-2.13-2.12M15.5 4l-1-1h-5l-1 1H5v2h14V4h-3.5z"})}),J=({size:n,style:r,className:o})=>e("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:n,height:n,className:o,style:r,children:[t("path",{d:"M9 2 H15 A1 1 0 0 1 16 3 V5 A1 1 0 0 1 15 6 H9 A1 1 0 0 1 8 5 V3 A1 1 0 0 1 9 2 z"}),t("path",{d:"M8 4H6a2 2 0 00-2 2v14a2 2 0 002 2h12a2 2 0 002-2v-2M16 4h2a2 2 0 012 2v4M21 14H11"}),t("path",{d:"M15 10l-4 4 4 4"})]}),X=({size:n,style:r,className:o})=>e("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:n,height:n,className:o,style:r,children:[t("path",{d:"M22 11.08V12a10 10 0 11-5.93-9.14"}),t("path",{d:"M22 4L12 14.01l-3-3"})]}),Z=({size:e,style:n,className:r})=>t("svg",{baseProfile:"tiny",viewBox:"0 0 24 24",fill:"currentColor",width:e,height:e,className:r,style:n,children:t("path",{d:"M12 4c-4.411 0-8 3.589-8 8s3.589 8 8 8 8-3.589 8-8-3.589-8-8-8zm-5 8c0-.832.224-1.604.584-2.295l6.711 6.711A4.943 4.943 0 0112 17c-2.757 0-5-2.243-5-5zm9.416 2.295L9.705 7.584A4.943 4.943 0 0112 7c2.757 0 5 2.243 5 5 0 .832-.224 1.604-.584 2.295z"})}),Q=({size:e,style:n,className:r})=>t("svg",{viewBox:"0 0 512 512",fill:"currentColor",width:e,height:e,className:r,style:n,children:t("path",{d:"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"})}),q=({name:e,nodeData:r,rotate:o})=>{var a,i,l,s,c,d,u;const{getStyles:p,icons:g}=P(),m={size:"1.4em",className:"jer-icon"};switch(e){case"add":return null!==(a=null==g?void 0:g.add)&&void 0!==a?a:t(H,Object.assign({},m,{style:p("iconAdd",r)}));case"edit":return null!==(i=null==g?void 0:g.edit)&&void 0!==i?i:t(Y,Object.assign({},m,{style:p("iconEdit",r)}));case"delete":return null!==(l=null==g?void 0:g.delete)&&void 0!==l?l:t($,Object.assign({},m,{style:p("iconDelete",r),size:"1.45em"}));case"copy":return null!==(s=null==g?void 0:g.copy)&&void 0!==s?s:t(J,Object.assign({},m,{style:p("iconCopy",r),size:"1.2em"}));case"ok":return null!==(c=null==g?void 0:g.ok)&&void 0!==c?c:t(X,Object.assign({},m,{style:Object.assign({fontSize:"90%"},p("iconOk",r))}));case"cancel":return null!==(d=null==g?void 0:g.cancel)&&void 0!==d?d:t(Z,Object.assign({},m,{style:Object.assign({fontSize:"130%"},p("iconCancel",r))}));case"chevron":return null!==(u=null==g?void 0:g.chevron)&&void 0!==u?u:t(Q,{size:"1em",style:p("iconCollection",r)});default:return t(n,{})}},ee=({startEdit:r,handleDelete:o,handleAdd:i,enableClipboard:l,type:s,customButtons:c,nodeData:d,translate:u,keyboardControls:p,handleKeyboard:g})=>{const{getStyles:m}=P(),h=u("KEY_NEW",d),[y,b]=a(!1),[f,v]=a(h),{key:j,path:D,value:w}=d;return e("div",{className:"jer-edit-buttons",style:{opacity:y?1:void 0},children:[l&&t("div",{onClick:e=>{e.stopPropagation();let t,n="value",r="";if(l){const o=E(e);o&&p.clipboardModifier.includes(o)?(t=ne(D),r=t,n="path"):(t=w,r=s?JSON.stringify(w,null,2):String(t)),navigator.clipboard.writeText(r)}"function"==typeof l&&l({value:t,stringValue:r,path:D,key:j,type:n})},className:"jer-copy-pulse",children:t(q,{name:"copy",nodeData:d})}),r&&t("div",{onClick:e=>{e.stopPropagation(),r()},children:t(q,{name:"edit",nodeData:d})}),o&&t("div",{onClick:e=>{e.stopPropagation(),o()},children:t(q,{name:"delete",nodeData:d})}),i&&t("div",{onClick:e=>{e.stopPropagation(),"object"===s?b(!0):i("")},children:t(q,{name:"add",nodeData:d})}),null==c?void 0:c.map((({Element:e,onClick:n},r)=>t("div",{onClick:e=>n&&n(d,e),children:t(e,{nodeData:d})},r))),y&&i&&"object"===s&&e(n,{children:[t("input",{className:"jer-input-new-key",type:"text",name:"new-object-key",value:f,onChange:e=>v(e.target.value),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>{g(e,{stringConfirm:()=>{i&&(b(!1),i(f),v(h))},cancel:()=>{b(!1),v(h)}})},style:m("input",d)}),t(te,{onOk:e=>{f&&(e.stopPropagation(),b(!1),i(f))},onCancel:e=>{e.stopPropagation(),b(!1)},nodeData:d})]})]})},te=({onOk:n,onCancel:r,nodeData:o})=>e("div",{className:"jer-confirm-buttons",children:[t("div",{onClick:n,children:t(q,{name:"ok",nodeData:o})}),t("div",{onClick:r,children:t(q,{name:"cancel",nodeData:o})})]}),ne=e=>e.reduce(((e,t)=>"number"==typeof t?`${e}[${t}]`:""===e?t:`${e}.${t}`),""),re=["string","number","boolean","null","object","array"],oe=(e=[],t)=>{const n=e.filter((({condition:e})=>e(t)));if(0===n.length)return{};const r=n[0],{element:o,wrapperElement:a,customNodeProps:i,wrapperProps:l,hideKey:s=!1,showEditTools:c=!0,showOnEdit:d=!1,showOnView:u=!0,showCollectionWrapper:p=!0}=r,g=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n}(r,["element","wrapperElement","customNodeProps","wrapperProps","hideKey","showEditTools","showOnEdit","showOnView","showCollectionWrapper"]);return Object.assign({CustomNode:o,CustomWrapper:a,customNodeProps:i,wrapperProps:l,hideKey:s,showEditTools:c,showOnEdit:d,showOnView:u,showCollectionWrapper:p},g)},ae=({props:e,collapsed:t})=>{const{data:n,nodeData:r,parentData:o,onEdit:i,onError:l,showErrorMessages:c,restrictEditFilter:d,restrictDeleteFilter:u,restrictAddFilter:p,restrictDragFilter:g,translate:m,errorMessageTimeout:h}=e,{currentlyEditingElement:y,setCurrentlyEditingElement:b}=_(),[f,v]=a(null),E=Object.assign(Object.assign({},r),{collapsed:t}),{path:D,key:w,size:k}=E,C=j(D),O=s((()=>!d(E)),[E]),S=s((()=>!u(E)),[E]),N=s((()=>!p(E)),[E]),x=s((()=>!g(E)&&S&&null===y),[E]),A=e=>{c&&(v(e),setTimeout((()=>v(null)),h)),console.warn("Error",e)},T=s((()=>(e,t)=>{A(e.message),l&&l({currentData:E.fullData,errorValue:t,currentValue:n,name:w,path:D,error:e})}),[l,c]),P=y===C,R=y===`key_${C}`,V="number"==typeof D.slice(-1)[0];return{pathString:C,nodeData:E,path:D,name:w,size:k,canEdit:O,canDelete:S,canAdd:N,canDrag:x,error:f,showError:A,onError:T,setError:v,handleEditKey:e=>{if(b(null),w===e)return;if(!o)return;const t=D.slice(0,-1);if(Object.keys(o).includes(e))return void T({code:"KEY_EXISTS",message:m("ERROR_KEY_EXISTS",E)},e);const n=Object.fromEntries(Object.entries(o).map((([t,n])=>t===w?[e,n]:[t,n])));i(n,t).then((t=>{t&&T({code:"UPDATE_ERROR",message:t},e)}))},derivedValues:{isEditing:P,isEditingKey:R,isArray:V,canEditKey:null!==o&&O&&N&&S&&!V}}},ie=({canDrag:e,canDragOnto:n,path:r,nodeData:o,onMove:i,onError:l,translate:c})=>{const{getStyles:d}=P(),{dragSource:u,setDragSource:p}=_(),[g,m]=a(!1),h=j(r),y=s((()=>e?{onDragStart:e=>{e.stopPropagation(),p({path:r,pathString:h})},onDragEnd:e=>{e.stopPropagation(),p({path:null,pathString:null})}}:{}),[e]),b=s((()=>e=>n?{onDragOver:e=>{e.stopPropagation(),e.preventDefault()},onDrop:t=>{t.stopPropagation(),v(e),p({path:null,pathString:null}),m(!1)},onDragEnter:t=>{var n;t.stopPropagation(),h.startsWith(null!==(n=u.pathString)&&void 0!==n?n:"")||m(e)},onDragExit:e=>{e.stopPropagation(),m(!1)}}:{}),[u,n]),f=s((()=>n&&null!==u.pathString?t("div",Object.assign({className:"jer-drop-target-bottom",style:{height:"50%",position:"absolute",width:"100%",top:"50%",zIndex:r.length}},b("below"))):null),[u,n]),v=e=>{var t,n;const a=null===(t=u.path)||void 0===t?void 0:t.slice(-1)[0],s=null===(n=u.path)||void 0===n?void 0:n.slice(0,-1).join("."),d=r.slice(0,-1).join(""),{parentData:p}=o;"string"==typeof a&&p&&!Array.isArray(p)&&Object.keys(p).includes(a)&&a in p&&s!==d?l({code:"KEY_EXISTS",message:c("ERROR_KEY_EXISTS",o)},a):i(u.path,r,e).then((e=>{e&&l({code:"UPDATE_ERROR",message:e},o.value)}))};return{dragSourceProps:y,getDropTargetProps:b,BottomDropTarget:f,DropTargetPadding:({position:e,nodeData:n})=>g===e?t("div",{className:"jer-drag-n-drop-padding",style:d("dropZone",n)}):null,handleDrop:v}},le=(e,t,n)=>{var r,o,a;const i=parseInt(null!==(r=getComputedStyle(n.current).getPropertyValue("line-height"))&&void 0!==r?r:"16px"),l=(null!==(a=null===(o=t.current)||void 0===o?void 0:o.offsetWidth)&&void 0!==a?a:0)/(.5*i),s=JSON.stringify(e,null,2).replace(/\\n/g,"\n").split("\n").map((e=>Math.ceil(e.length/l))).reduce(((e,t)=>e+t),0)*i;return Math.min(s+30,window.innerHeight-50)},se=n=>{const{data:r,parentData:o,onEdit:i,onDelete:d,onChange:u,onMove:p,enableClipboard:g,canDragOnto:m,restrictTypeSelection:y,searchFilter:b,searchText:f,showLabel:v,stringTruncate:j,showStringQuotes:E,indent:D,translate:w,customNodeDefinitions:k,handleKeyboard:O,keyboardControls:S,sort:N}=n,{getStyles:x}=P(),{setCurrentlyEditingElement:A,setCollapseState:T,previouslyEditedElement:R,setPreviouslyEditedElement:V,tabDirection:z,setTabDirection:F}=_(),[M,K]=a("function"==typeof r?I:r),{pathString:L,nodeData:B,path:W,name:G,canEdit:U,canDelete:H,canDrag:Y,error:$,onError:J,handleEditKey:X,derivedValues:Z}=ae({props:n}),{dragSourceProps:Q,getDropTargetProps:q,BottomDropTarget:ne,DropTargetPadding:le}=ie({canDrag:Y,canDragOnto:m,path:W,nodeData:B,onMove:p,onError:J,translate:w}),se=oe(k,B),[pe,ge]=a(ce(r,se)),me=c((e=>{if(!u)return void K(e);const t=u({currentData:B.fullData,newValue:e,currentValue:M,name:G,path:W});K(t)}),[u]);l((()=>{K("function"==typeof r?I:r),ge(ce(r,se))}),[r,$]);const{CustomNode:he,customNodeProps:ye,hideKey:be,showEditTools:fe=!0,showOnEdit:ve,showOnView:je}=se,Ee=[...re,...k.filter((({showInTypesSelector:e=!1,name:t})=>e&&!!t)).map((({name:e})=>e))],De=s((()=>{if("boolean"==typeof y)return y?[]:Ee;if(Array.isArray(y))return y;const e=y(B);return"boolean"==typeof e?e?[]:Ee:e}),[B,y]),{isEditing:we}=Z,ke=h("value",B,b,f);if(we&&(!ke||!U)){const e=C(B.fullData,W,z,N);A(e||R)}if(!ke)return null;const Ce=()=>{let e;switch(A(null),pe){case"object":e={[w("DEFAULT_NEW_KEY",B)]:M};break;case"array":e=null!=M?M:[];break;case"number":{const t=Number(M);e=isNaN(t)?0:t;break}default:e=M}i(e,W).then((t=>{t&&J({code:"UPDATE_ERROR",message:t},e)}))},Oe=()=>{A(null),K(r),ge(ce(r,se))},{isEditingKey:Se,canEditKey:Ne}=Z,xe=!we&&$,Ae=we&&De.length>0,Te="invalid"!==pe&&!$&&fe,Pe=v&&Se,Re=v&&!Se&&!be,Ve={value:M,parentData:o,setValue:me,isEditing:we,setIsEditing:U?()=>A(W):()=>{},handleEdit:Ce,handleCancel:Oe,path:W,stringTruncate:j,showStringQuotes:E,nodeData:B,translate:w,handleKeyboard:O,keyboardCommon:{cancel:Oe,tabForward:()=>{F("next"),V(L);const e=C(B.fullData,W,"next",N);e&&(Ce(),A(e))},tabBack:()=>{F("prev"),V(L);const e=C(B.fullData,W,"prev",N);e&&(Ce(),A(e))}}},ze=he&&(we&&ve||!we&&je)?t(he,Object.assign({},n,{value:M,customNodeProps:ye,setValue:me,handleEdit:Ce,handleCancel:Oe,handleKeyPress:e=>O(e,{stringConfirm:Ce,cancel:Oe}),isEditing:we,setIsEditing:()=>A(W),getStyles:x})):de(ce(r),Ve);return e("div",Object.assign({className:"jer-component jer-value-component",style:{marginLeft:D/2+"em",position:"relative"},draggable:Y},Q,q("above"),{children:[ne,t(le,{position:"above",nodeData:B}),e("div",{className:"jer-value-main-row",style:{flexWrap:G.length>10?"wrap":"nowrap"},children:[Re&&t("span",{className:"jer-key-text",style:Object.assign(Object.assign({},x("property",B)),{minWidth:`${Math.min(String(G).length+1,5)}ch`,flexShrink:G.length>10?1:0}),onDoubleClick:()=>Ne&&A(W,"key"),children:""===G?t("span",{className:W.length>0?"jer-empty-string":void 0}):`${G}:`}),Pe&&t("input",{className:"jer-input-text jer-key-edit",type:"text",name:L,defaultValue:G,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>O(e,{stringConfirm:()=>X(e.target.value),cancel:Oe,tabForward:()=>{X(e.target.value),A(W)},tabBack:()=>{X(e.target.value),A(C(B.fullData,W,"prev",N))}}),style:{width:String(G).length/1.5+.5+"em"}}),e("div",{className:"jer-value-and-buttons",children:[t("div",{className:"jer-input-component",children:ze}),we?t(te,{onOk:Ce,onCancel:Oe,nodeData:B}):Te&&t(ee,{startEdit:U?()=>A(W,Oe):void 0,handleDelete:H?()=>{d(M,W).then((e=>{e&&J({code:"DELETE_ERROR",message:e},M)}))}:void 0,enableClipboard:g,translate:w,customButtons:n.customButtons,nodeData:B,handleKeyboard:O,keyboardControls:S}),Ae&&e("div",{className:"jer-select",children:[t("select",{name:`${G}-type-select`,className:"jer-type-select",onChange:e=>(e=>{const t=k.find((t=>t.name===e));if(t)i(t.defaultValue,W),ge(e),A(null),T({path:W,collapsed:!1});else{const t=ue(M,e,w("DEFAULT_NEW_KEY",B),(null==se?void 0:se.CustomNode)?w("DEFAULT_STRING",B):void 0);me(t),i(t,W).then((e=>{e&&(J({code:"UPDATE_ERROR",message:e},t),A(null))}))}})(e.target.value),value:pe,children:De.map((e=>t("option",{value:e,children:e},e)))}),t("span",{className:"focus"})]}),xe&&t("span",{className:"jer-error-slug",style:x("error",B),children:$})]})]}),t(le,{position:"below",nodeData:B})]}))},ce=(e,t)=>(null==t?void 0:t.CustomNode)&&(null==t?void 0:t.name)&&t.showInTypesSelector?t.name:"string"==typeof e?"string":"number"==typeof e?"number":"boolean"==typeof e?"boolean":null===e?"null":"invalid",de=(e,n)=>{const r=n.value;switch(e){case"string":return t(L,Object.assign({},n,{value:r}));case"number":return t(B,Object.assign({},n,{value:r}));case"boolean":return t(W,Object.assign({},n,{value:r}));case"null":return t(G,Object.assign({},n));default:return t(U,Object.assign({},n))}},ue=(e,t,n,r)=>{switch(t){case"string":return null!=r?r:String(e);case"number":{const t=Number(e);return isNaN(t)?0:t}case"boolean":return!!e;case"null":return null;case"object":return{[n]:e};case"array":return[e];default:return String(e)}},pe=r=>{const{getStyles:o}=P(),{collapseState:c,setCollapseState:d,doesPathMatch:u,currentlyEditingElement:y,setCurrentlyEditingElement:b,areChildrenBeingEdited:f}=_(),{mainContainerRef:v,data:j,nodeData:D,parentData:w,showCollectionCount:k,onEdit:O,onAdd:S,onDelete:x,canDragOnto:A,collapseFilter:T,collapseAnimationTime:R,onMove:V,enableClipboard:z,searchFilter:F,searchText:M,indent:K,sort:I,showArrayIndices:L,defaultValue:B,translate:W,customNodeDefinitions:G,jsonParse:U,jsonStringify:H,keyboardControls:Y,handleKeyboard:$,insertAtTop:J}=r,[X,Z]=a(H(j)),Q=T(D),{contentRef:ne,isAnimating:re,maxHeight:ce,collapsed:de,animateCollapse:ue}=((e,t,n,r)=>{const[o,l]=a(n?0:void 0),[s,c]=a(n),d=i(!1),u=i(null),p=i(0),g=i();return{contentRef:u,isAnimating:d.current,animateCollapse:n=>{var o,a;if(s!==n){switch(window.clearTimeout(g.current),d.current=!0,n){case!0:{const e=null!==(a=null===(o=u.current)||void 0===o?void 0:o.offsetHeight)&&void 0!==a?a:0;p.current=e,l(e),setTimeout((()=>{l(0)}),5);break}case!1:l(p.current||le(e,u,r))}c(!s),g.current=window.setTimeout((()=>{d.current=!1,n||l(void 0)}),t)}},maxHeight:o,collapsed:s}})(j,R,Q,v),{pathString:ge,nodeData:me,path:he,name:ye,size:be,canEdit:fe,canDelete:ve,canAdd:je,canDrag:Ee,error:De,setError:we,onError:ke,handleEditKey:Ce,derivedValues:Oe}=ae({props:r,collapsed:de}),{dragSourceProps:Se,getDropTargetProps:Ne,BottomDropTarget:xe,DropTargetPadding:Ae}=ie({canDrag:Ee,canDragOnto:A,path:he,nodeData:me,onMove:V,onError:ke,translate:W}),Te=i(!Q);l((()=>{Z(H(j))}),[j]),l((()=>{const e=T(me)&&!Oe.isEditing;Te.current=!e,ue(e)}),[T]),l((()=>{null!==c&&u(he)&&(Te.current=!0,ue(c.collapsed))}),[c]);const Pe=i(null),Re=s((()=>(e,t)=>"function"!=typeof B?B:B(e,t)),[B]),{CustomNode:Ve,customNodeProps:ze,CustomWrapper:Fe,wrapperProps:Me={},hideKey:Ke,showEditTools:_e=!0,showOnEdit:Ie,showOnView:Le,showCollectionWrapper:Be=!0}=s((()=>oe(G,me)),[]),We=f(ge);We&&de&&ue(!1);if(!(h("collection",me,F,M)||0===me.level)&&!We)return null;const Ge=Array.isArray(j)?"array":"object",Ue="array"===Ge?{open:"[",close:"]"}:{open:"{",close:"}"},He=e=>{if("Tab"!==e.key||e.getModifierState("Shift"))$(e,{objectConfirm:$e,cancel:Xe});else{e.preventDefault();const t=N(Pe,"\t");Z(t)}},Ye=e=>{const t=E(e);if(t&&Y.collapseModifier.includes(t))return Te.current=!0,void d({collapsed:!de,path:he});y&&y.includes(ge)||(Te.current=!0,d(null),ue(!de))},$e=()=>{try{const e=U(X);if(b(null),we(null),JSON.stringify(e)===JSON.stringify(j))return;O(e,he).then((t=>{t&&ke({code:"UPDATE_ERROR",message:t},e)}))}catch(e){ke({code:"INVALID_JSON",message:W("ERROR_INVALID_JSON",me)},X)}},Je=he.length>0?()=>{x(j,he).then((e=>{e&&ke({code:"DELETE_ERROR",message:e},j)}))}:void 0,Xe=()=>{b(null),we(null),Z(H(j))},{isEditing:Ze,isEditingKey:Qe,isArray:qe,canEditKey:et}=Oe,tt="when-closed"===k?de:k,nt=!Ze&&_e,rt=(L||!qe)&&!Ke&&void 0!==ye,ot=Ve&&(Ze&&Ie||!Ze&&Le),at=Object.entries(j).map((([e,t])=>["array"===Ge?Number(e):e,t]));"object"===Ge&&I(at,(e=>e));const it=Te.current?Ze?t("div",{className:"jer-collection-text-edit",children:e("div",{children:[t(g,{textAreaRef:Pe,className:"jer-collection-text-area",name:ge,value:X,setValue:Z,isEditing:Ze,handleKeyPress:He,styles:o("input",me)}),t("div",{className:"jer-collection-input-button-row",children:t(te,{onOk:$e,onCancel:Xe,nodeData:me})})]})}):at.map((([e,n],a)=>{const i={key:e,value:n,path:[...he,e],level:he.length+1,index:a,size:m(n)?Object.keys(n).length:1,parentData:j,fullData:me.fullData};return t("div",{className:"jer-collection-element",style:o("collectionElement",i),children:m(n)?t(pe,Object.assign({},r,{data:n,parentData:j,nodeData:i,showCollectionCount:k,canDragOnto:fe}),e):t(se,Object.assign({},r,{data:n,parentData:j,nodeData:i,canDragOnto:fe,showLabel:"object"===Ge||L}),e)},e)})):null,lt=!!Be&&(de&&!We);lt||(Te.current=!0);const st=Object.assign(Object.assign({},r),{data:j,value:j,parentData:w,nodeData:me,setValue:e=>p(void 0,void 0,void 0,(function*(){return yield O(e,he)})),handleEdit:$e,handleCancel:Xe,handleKeyPress:He,isEditing:Ze,setIsEditing:()=>b(he),getStyles:o,canDragOnto:fe}),ct=ot?t(Ve,Object.assign({customNodeProps:ze},st,{children:it})):it,dt=Qe?t("input",{className:"jer-input-text jer-key-edit",type:"text",name:ge,defaultValue:ye,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>$(e,{stringConfirm:()=>Ce(e.target.value),cancel:Xe,tabForward:()=>{Ce(e.target.value);const t=null==at?void 0:at[0][0];b(t?[...he,t]:C(me.fullData,he,"next",I))},tabBack:()=>{Ce(e.target.value),b(C(me.fullData,he,"prev",I))}}),style:{width:String(ye).length/1.5+.5+"em"}}):rt&&t("span",{className:"jer-key-text",style:o("property",me),onClick:e=>e.stopPropagation(),onDoubleClick:()=>et&&b(he,"key"),children:""===ye?t("span",{className:he.length>0?"jer-empty-string":void 0}):`${ye}:`}),ut=nt&&t(ee,{startEdit:fe?()=>{Te.current=!0,b(he)}:void 0,handleAdd:je?e=>{ue(!1);const t=Re(me,e);if("array"===Ge){const e=J.array?0:j.length,n=J.array?{insert:!0}:{};S(t,[...he,e],n).then((e=>{e&&ke({code:"ADD_ERROR",message:e},t)}))}else if(e in j)ke({code:"KEY_EXISTS",message:W("ERROR_KEY_EXISTS",me)},e);else{const n=J.object?{insertBefore:0}:{};S(t,[...he,e],n).then((e=>{e&&ke({code:"ADD_ERROR",message:e},t)}))}}:void 0,handleDelete:ve?Je:void 0,enableClipboard:z,type:Ge,nodeData:me,translate:W,customButtons:r.customButtons,keyboardControls:Y,handleKeyboard:$}),pt=e("div",Object.assign({className:"jer-component jer-collection-component",style:Object.assign(Object.assign({marginLeft:(0===he.length?0:K/2)+"em"},o("collection",me)),{position:"relative"}),draggable:Ee},Se,Ne("above"),{children:[t("div",{className:"jer-clickzone",style:{width:K/2+1+"em",zIndex:10+2*me.level},onClick:e=>Ye(e)}),!Ze&&xe,t(Ae,{position:"above",nodeData:me}),Be?e("div",{className:"jer-collection-header-row",style:{position:"relative"},onClick:e=>Ye(e),children:[e("div",{className:"jer-collection-name",children:[t("div",{className:"jer-collapse-icon jer-accordion-icon"+(de?" jer-rotate-90":""),style:{zIndex:11+2*me.level},onClick:e=>Ye(e),children:t(q,{name:"chevron",rotate:de,nodeData:me})}),dt,!Ze&&t("span",{className:"jer-brackets jer-bracket-open",style:o("bracket",me),children:Ue.open})]}),!Ze&&tt&&t("div",{className:"jer-collection-item-count"+(tt?" jer-visible":" jer-hidden"),style:o("itemCount",me),children:1===be?W("ITEM_SINGLE",Object.assign(Object.assign({},me),{size:1}),1):W("ITEMS_MULTIPLE",me,be)}),t("div",{className:"jer-brackets"+(lt?" jer-visible":" jer-hidden"),style:o("bracket",me),children:Ue.close}),ut]}):Ke?t(n,{}):e("div",{className:"jer-collection-header-row",style:{position:"relative"},children:[dt,ut]}),e("div",{className:"jer-collection-inner",style:Object.assign({overflowY:lt||re?"clip":"visible",maxHeight:We?void 0:ce},o("collectionInner",me)),ref:ne,children:[ct,t("div",{className:Ze?"jer-collection-error-row":"jer-collection-error-row-edit",children:De&&t("span",{className:"jer-error-slug",style:o("error",me),children:De})}),!Ze&&Be&&t("div",{className:"jer-brackets jer-bracket-outside",style:Object.assign(Object.assign({},o("bracket",me)),{marginLeft:(K<3?-1:K<6?-.5:0)+"em"}),children:Ue.close})]}),t(Ae,{position:"below",nodeData:me})]}));return Fe?t(Fe,Object.assign({customNodeProps:Me},st,{children:pt})):pt},ge={ITEM_SINGLE:"{{count}} item",ITEMS_MULTIPLE:"{{count}} items",KEY_NEW:"Enter new key",ERROR_KEY_EXISTS:"Key already exists",ERROR_INVALID_JSON:"Invalid JSON",ERROR_UPDATE:"Update unsuccessful",ERROR_DELETE:"Delete unsuccessful",ERROR_ADD:"Adding node unsuccessful",DEFAULT_STRING:"New data!",DEFAULT_NEW_KEY:"key"},me=(e,t)=>(n,r,o)=>((e,t,n,r,o)=>{if(t[r]){const e=t[r](n);if(null!==e)return e}const a=r in e?e[r]:ge[r];return void 0===o?a:null==a?void 0:a.replace("{{count}}",String(o))})(e,t,r,n,o);var he=[],ye=[];!function(e,t){if(e&&"undefined"!=typeof document){var n,r=!0===t.prepend?"prepend":"append",o=!0===t.singleTag,a="string"==typeof t.container?document.querySelector(t.container):document.getElementsByTagName("head")[0];if(o){var i=he.indexOf(a);-1===i&&(i=he.push(a)-1,ye[i]={}),n=ye[i]&&ye[i][r]?ye[i][r]:ye[i][r]=l()}else n=l();65279===e.charCodeAt(0)&&(e=e.substring(1)),n.styleSheet?n.styleSheet.cssText+=e:n.appendChild(document.createTextNode(e))}function l(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),t.attributes)for(var n=Object.keys(t.attributes),o=0;o<n.length;o++)e.setAttribute(n[o],t.attributes[n[o]]);var i="prepend"===r?"afterbegin":"beforeend";return a.insertAdjacentElement(i,e),e}}(':root{--jer-select-border:#b6b6b6;--jer-select-focus:#777;--jer-select-arrow:#777;--jer-form-border:1px solid #ededf0;--jer-form-border-focus:1px solid #e2e2e2;--jer-expand-transition-time:0.3s;--jer-highlight-color:#b3d8ff}.jer-visible{opacity:1}.jer-hidden,.jer-visible{transition:var(--jer-expand-transition-time)}.jer-hidden{opacity:0}.jer-select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:#000;cursor:inherit;font-family:inherit;font-size:.8em;line-height:inherit;margin:0;outline:none;padding:0 1em 0 0;z-index:1}select::-ms-expand{display:none}.jer-select{align-items:center;background-color:#fff;background-image:linear-gradient(0deg,#f9f9f9,#fff 33%);border:1px solid var(--jer-select-border);border-radius:.25em;cursor:pointer;display:grid;grid-template-areas:"select";line-height:1.1;max-width:15ch;min-width:12ch;padding:.25em .5em;position:relative}.jer-select select,.jer-select:after{grid-area:select}.jer-select:not(.jer-select--multiple):after{background-color:var(--jer-select-arrow);clip-path:polygon(100% 0,0 0,50% 100%);content:"";height:.5em;justify-self:end;width:.8em}select:focus+.focus{border:1px solid var(--jer-select-focus);border-radius:inherit;bottom:-1px;left:-1px;position:absolute;right:-1px;top:-1px}.jer-editor-container{border-radius:.5em;font-size:16px;line-height:1;padding:1em 1em 1em 2em;position:relative;text-align:left}.jer-editor-container textarea{border:var(--jer-form-border);border-radius:.3em;color:var(--jer-input-color);outline:none}.jer-editor-container textarea:focus{border:var(--jer-form-border-focus)}.jer-editor-container input{border:var(--jer-form-border);border-radius:.3em;font-family:inherit;outline:none}.jer-editor-container input:focus{border:var(--jer-form-border-focus)}.jer-editor-container ::selection{background-color:var(--jer-highlight-color)}.jer-collection-header-row,.jer-value-main-row{align-items:center;display:flex;gap:.3em;min-height:1.7em}.jer-collection-header-row{display:flex;flex-wrap:wrap}.jer-collapse-icon{left:-1.2em;position:absolute;top:.35em}.jer-collection-inner{position:relative;transition:var(--jer-expand-transition-time)}.jer-collection-text-edit{align-items:flex-start;display:flex;flex-direction:column;gap:.3em}.jer-collection-text-area{font-family:inherit;font-size:.85em;max-height:40em;overflow:hidden;padding:.2em .5em 0;resize:both}.jer-collection-input-button-row{display:flex;font-size:150%;justify-content:flex-end;margin-top:.4em}.jer-collection-error-row{bottom:.5em;position:absolute}.jer-error-slug{margin-left:1em}.jer-value-component{position:relative}.jer-value-main-row{display:flex;gap:0}.jer-value-and-buttons{align-items:center;display:flex;justify-content:flex-start;padding-left:.5em}.jer-value-error-row{position:absolute}.jer-value-string{line-height:1.3em;overflow-wrap:anywhere;white-space:pre-wrap}.jer-hyperlink{text-decoration:underline}.jer-input-text{font-family:inherit;font-size:.9em;height:1.4em;line-height:1.2em;margin:0;min-width:6em;overflow:hidden;padding:.25em .5em .2em;resize:none}.jer-input-boolean{margin-left:.3em;margin-right:.3em;transform:scale(1.5)}.jer-key-text{line-height:1.1em;white-space:pre-wrap;word-break:break-word}.jer-key-edit{font-size:inherit;font-size:.9em;padding:0 .3em}.jer-value-invalid{font-style:italic;opacity:.5}.jer-input-number{font-size:90%;min-width:3em}.jer-confirm-buttons,.jer-edit-buttons{align-items:center;cursor:pointer;display:flex;height:1em}.jer-input-buttons{gap:.4em}.jer-edit-buttons{gap:.4em;margin-left:.5em;opacity:0}.jer-confirm-buttons{gap:.2em;margin-left:.4em}.jer-edit-buttons:hover{opacity:1;position:relative}.jer-collection-header-row:hover>.jer-edit-buttons,.jer-value-and-buttons:hover>.jer-edit-buttons,.jer-value-main-row:hover>.jer-edit-buttons{opacity:1}.jer-copy-pulse{position:relative;transition:transform var(--jer-expand-transition-time)}.jer-copy-pulse:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-copy-pulse:after{border-radius:50%;box-shadow:0 0 15px 5px var(--jer-icon-copy-color);content:"";display:block;height:100%;left:0;opacity:0;position:absolute;top:0;transition:all .5s;width:100%}.jer-copy-pulse:active:after{border-radius:4em;box-shadow:0 0 0 0 var(--jer-icon-copy-color);left:0;opacity:1;position:absolute;top:0;transition:0s}.jer-copy-pulse:active{top:.07em}.jer-rotate-90{transform:rotate(-90deg)}.jer-accordion-icon,.jer-rotate-90{transition:transform var(--jer-expand-transition-time)}.jer-icon:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-empty-string:after{content:"<empty string>:";font-size:90%;font-style:italic}.jer-drag-n-drop-padding{border:1px dashed #e0e0e0;border-radius:.3em;height:.5em}.jer-clickzone{height:calc(100% - .8em);left:-1em;position:absolute;top:1.2em}',{});const be=({data:e,setData:n,rootName:r="root",onUpdate:o=(()=>{}),onEdit:d=o,onDelete:u=o,onAdd:g=o,onChange:h,onError:y,showErrorMessages:b=!0,enableClipboard:f=!0,indent:v=2,collapse:j=!1,collapseAnimationTime:E=300,showCollectionCount:w=!0,restrictEdit:C=!1,restrictDelete:O=!1,restrictAdd:S=!1,restrictTypeSelection:N=!1,restrictDrag:x=!0,searchFilter:A,searchText:T,searchDebounceTime:R=350,keySort:V=!1,showArrayIndices:z=!0,showStringQuotes:F=!0,defaultValue:M=null,minWidth:K=250,maxWidth:I="min(600px, 90vw)",rootFontSize:L,stringTruncate:B=250,translations:W={},className:G,id:U,customText:H={},customNodeDefinitions:Y=[],customButtons:$=[],jsonParse:J=JSON.parse,jsonStringify:X=(e=>JSON.stringify(e,null,2)),errorMessageTimeout:Z=2500,keyboardControls:Q={},insertAtTop:q=!1})=>{const{getStyles:ee}=P(),{setCurrentlyEditingElement:te}=_(),ne=c(je(j),[j]),re=c(me(W,H),[W,H]),[oe,ae]=a(T),[ie,le]=(({setData:e,data:t})=>{const[n,r]=a(e?void 0:t),o=c((t=>{e?e(t):r(t)}),[e]);return l((()=>{e||r(t)}),[t]),[e?t:n,o]})({setData:n,data:e}),ce=i(null);l((()=>{te(null);const e=setTimeout((()=>ae(T)),R);return()=>clearTimeout(e)}),[T,R]);const de={key:r,path:[],level:0,index:0,value:ie,size:"object"==typeof ie&&null!==ie?Object.keys(ie).length:1,parentData:null,fullData:ie},ue=(e,t)=>p(void 0,void 0,void 0,(function*(){const n=yield e(t);if(!0===n||void 0===n)return void le(t.newData);const r=De(n)?n:["error",n],[o,a]=r;if("error"===o)return le(t.currentData),!1===a?re("ERROR_UPDATE",de):String(a);le(a)})),ge=s((()=>je(C)),[C]),he=s((()=>je(O)),[O]),ye=s((()=>je(S)),[S]),be=s((()=>je(x)),[x]),fe=s((()=>Ee(A)),[A]),we=s((()=>(e=>{const t=Object.assign({},k);for(const n of Object.keys(k)){const r=n;if(e[r]){const o=e[r],a=["clipboardModifier","collapseModifier"].includes(n)?Array.isArray(o)?o:[o]:"string"==typeof o?{key:o}:o;t[r]=a,["stringConfirm","numberConfirm","booleanConfirm"].forEach((n=>{!e[n]&&e.confirm&&(t[n]=t.confirm)}))}}return t})(Q)),[Q]),ke=c(((e,t)=>((e,t,n)=>{const r=Object.entries(t);for(const[t,o]of r)if(D(n,e[t],t)){n.preventDefault(),o();break}})(we,t,e)),[Q]),Ce=c(((e,t)=>{!1!==V&&("function"!=typeof V?e.sort(((e,n)=>{const r=t(e)[0],o=t(n)[0];return r<o?-1:r>o?1:0})):e.sort(((e,n)=>V(t(e),t(n)))))}),[V]),Oe={mainContainerRef:ce,name:r,nodeData:de,onEdit:(e,t)=>p(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=ve(ie,t,e,"update");if(o!==a)return yield ue(d,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onDelete:(e,t)=>p(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=ve(ie,t,e,"delete");return yield ue(u,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onAdd:(e,t,n)=>p(void 0,void 0,void 0,(function*(){const{currentData:r,newData:o,currentValue:a,newValue:i}=ve(ie,t,e,"add",n);return yield ue(g,{currentData:r,newData:o,currentValue:a,newValue:i,name:t.slice(-1)[0],path:t})})),onChange:h,onError:y,showErrorMessages:b,onMove:(e,t,n)=>p(void 0,void 0,void 0,(function*(){if(null===e)return;const{currentData:r,newData:o,currentValue:a}=ve(ie,e,"","delete"),i=e.slice(-1)[0],l=t.slice(0,-1),s=t.slice(-1)[0];let c="number"==typeof s?"above"===n?s:s+1:"number"==typeof i?`arr_${i}`:i;e.slice(0,-1).join(".")===t.slice(0,-1).join(".")&&"number"==typeof i&&"number"==typeof c&&i<c&&(c-=1);const u="number"==typeof c?{insert:!0}:"above"===n?{insertBefore:s}:{insertAfter:s},{newData:p,newValue:g}=ve(o,[...l,c],a,"add",u);return yield ue(d,{currentData:r,newData:p,currentValue:a,newValue:g,name:t.slice(-1)[0],path:t})})),showCollectionCount:w,collapseFilter:ne,collapseAnimationTime:E,restrictEditFilter:ge,restrictDeleteFilter:he,restrictAddFilter:ye,restrictTypeSelection:N,restrictDragFilter:be,canDragOnto:!1,searchFilter:fe,searchText:oe,enableClipboard:f,keySort:V,sort:Ce,showArrayIndices:z,showStringQuotes:F,indent:v,defaultValue:M,stringTruncate:B,translate:re,customNodeDefinitions:Y,customButtons:$,parentData:null,jsonParse:J,jsonStringify:X,errorMessageTimeout:Z,handleKeyboard:ke,keyboardControls:we,insertAtTop:{object:!0===q||"object"===q,array:!0===q||"array"===q}},Se=Object.assign(Object.assign({},ee("container",de)),{minWidth:K,maxWidth:I});return Se.fontSize=null!=L?L:Se.fontSize,t("div",{id:U,ref:ce,className:`jer-editor-container ${null!=G?G:""}`,style:Se,children:m(ie)?t(pe,Object.assign({data:ie},Oe)):t(se,Object.assign({data:ie,showLabel:!0},Oe))})},fe=e=>{var n;const[r,o]=a();l((()=>{const e=document.documentElement;o(e)}),[]);const{collapseAnimationTime:i=300}=e;if(!r)return null;const s=getComputedStyle(r).getPropertyValue("--jer-expand-transition-time");return 1e3*parseFloat(s)!==i&&r.style.setProperty("--jer-expand-transition-time",i/1e3+"s"),t(T,{theme:null!==(n=e.theme)&&void 0!==n?n:x,icons:e.icons,docRoot:r,children:t(K,{children:t(be,Object.assign({},e))})})},ve=(e,t,n,r,o={})=>{if(0===t.length)return{currentData:e,newData:n,currentValue:e,newValue:n};const a=Object.assign({remove:"delete"===r},o),i="add"!==r?u(e,t):void 0;return{currentData:e,newData:d(e,t,n,a),currentValue:i,newValue:"delete"!==r?n:void 0}},je=e=>"boolean"==typeof e?()=>e:"number"==typeof e?({level:t})=>t>=e:e,Ee=e=>{if(void 0!==e)return"value"===e?b:"key"===e?f:"all"===e?(e,t)=>b(e,t)||f(e,t):e},De=e=>Array.isArray(e)&&2===e.length&&["error","value"].includes(e[0]),we=({value:n,setIsEditing:r,getStyles:o,customNodeProps:a,nodeData:i})=>{var l,s;const c=null!==(l=null==a?void 0:a.stringTruncate)&&void 0!==l?l:100,d=o("string",i);return t("div",{onDoubleClick:()=>r(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&r(!0)},className:"jer-value-string jer-hyperlink",style:d,children:e("a",{href:n,target:"_blank",rel:"noreferrer",style:{color:null!==(s=d.color)&&void 0!==s?s:void 0},children:['"',v(n,c),'"']})})},ke={condition:({value:e})=>"string"==typeof e&&/^https?:\/\/.+\..+$/.test(e),element:we,showOnView:!0,showOnEdit:!1},Ce={displayName:"Github Dark",styles:{container:{backgroundColor:"#0d1117",color:"white"},dropZone:"rgba(165, 214, 255, 0.17)",property:"#E6EDF3",bracket:"#56d364",itemCount:"#8B949E",string:"#A5D6FF",number:"#D2A8FF",boolean:{color:"#FF7B72",fontSize:"90%",fontWeight:"bold"},null:"green",iconCollection:"#D2A8FF",iconEdit:"#D2A8FF",iconDelete:"rgb(203, 75, 22)",iconAdd:"rgb(203, 75, 22)",iconCopy:"#A5D6FF",iconOk:"#56d364",iconCancel:"rgb(203, 75, 22)"}},Oe={displayName:"Github Light",styles:{container:"white",property:"#1F2328",bracket:"#00802e",itemCount:"#8B949E",string:"#0A3069",number:"#953800",boolean:{color:"#CF222E",fontSize:"90%",fontWeight:"bold"},null:"#FF7B72",iconCollection:"#8250DF",iconEdit:"#8250DF",iconDelete:"rgb(203, 75, 22)",iconAdd:"#8250DF",iconCopy:"#57606A"}},Se={displayName:"Black & White",fragments:{lightText:{color:"white"},midGrey:"#5c5c5c"},styles:{container:["lightText",{backgroundColor:"black"}],dropZone:"#e0e0e029",property:"lightText",bracket:"midGrey",itemCount:"#4a4a4a",string:"#a8a8a8",number:"#666666",boolean:{color:"#848484",fontStyle:"italic"},null:"#333333",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},Ne={fragments:{midGrey:"#a3a3a3"},displayName:"White & Black",styles:{container:"white",property:"black",bracket:"midGrey",itemCount:"#b5b5b5",string:"#575757",number:"#999999",boolean:{color:"#7b7b7b",fontStyle:"italic"},null:"#cccccc",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},xe={displayName:"Candy Wrapper",fragments:{minty:{backgroundColor:"#F1FAEE"},pale:{color:"#A8DADC"},mid:{color:"#457B9D"},dark:{color:"#1D3557"},pop:{color:"#E63946"},darkBlue:{color:"#2B2D42"}},styles:{container:"minty",property:"pop",dropZone:"#eb121217",bracket:"dark",itemCount:"pale",string:"mid",number:["darkBlue",{fontSize:"85%"}],boolean:["mid",{fontStyle:"italic",fontWeight:"bold",fontSize:"80%"}],null:["#cccccc",{fontWeight:"bold"}],input:{border:"1px solid rgb(115, 194, 198)"},iconCollection:"#1D3557",iconEdit:"#457B9D",iconDelete:"#E63946",iconAdd:"#2B2D42",iconCopy:"#1D3557",iconCancel:"#E63946"}},Ae={displayName:"Psychedelic",fragments:{pale:{color:"#A8DADC"},fluroYellow:"rgb(242, 228, 21)",fluroGreen:"rgb(68, 255, 62)",hotPink:"#f7379a"},styles:{container:{backgroundColor:"unset",background:"linear-gradient(90deg, hsla(333, 100%, 53%, 1) 0%, hsla(33, 94%, 57%, 1) 100%)",color:"black"},dropZone:"fluroYellow",property:"black",bracket:"fluroYellow",itemCount:["pale",{opacity:.7}],string:"white",number:["#33d9ff",{fontSize:"90%",fontWeight:"bold"}],boolean:["fluroGreen",{fontWeight:"bold",fontSize:"80%"}],null:["black",{fontWeight:"bold",opacity:.3,backgroundColor:"rgb(255, 255, 255, 0.5)",padding:"0 0.4em",borderRadius:"0.4em"}],iconCollection:"fluroYellow",iconEdit:["black"],iconDelete:["white",{opacity:.5}],iconAdd:["white",{opacity:.5}],iconCopy:"rgb(32, 84, 242)",iconOk:"fluroGreen",iconCancel:"hotPink"}};export{H as IconAdd,Z as IconCancel,Q as IconChevron,J as IconCopy,$ as IconDelete,Y as IconEdit,X as IconOk,fe as JsonEditor,we as LinkCustomComponent,ke as LinkCustomNodeDefinition,xe as candyWrapperTheme,x as defaultTheme,Ce as githubDarkTheme,Oe as githubLightTheme,m as isCollection,b as matchNode,f as matchNodeKey,Se as monoDarkTheme,Ne as monoLightTheme,Ae as psychedelicTheme,v as truncate};
1
+ import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import{createContext as r,useContext as o,useState as a,useRef as i,useEffect as l,useMemo as s,useCallback as c}from"react";import d from"object-property-assigner";export{default as assign}from"object-property-assigner";import u from"object-property-extractor";export{default as extract}from"object-property-extractor";function p(e,t,n,r){return new(n||(n=Promise))((function(o,a){function i(e){try{s(r.next(e))}catch(e){a(e)}}function l(e){try{s(r.throw(e))}catch(e){a(e)}}function s(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,l)}s((r=r.apply(e,t||[])).next())}))}"function"==typeof SuppressedError&&SuppressedError;const g=({className:n,name:r,value:o,setValue:a,handleKeyPress:i,styles:l,textAreaRef:s})=>{if("string"!=typeof o)return null;const c="\n"===o.slice(-1)?o+".":o;return e("div",{style:{display:"grid"},children:[t("textarea",{id:`${r}_textarea`,ref:s,style:Object.assign({height:"auto",gridArea:"1 / 1 / 2 / 2",overflowY:"auto",whiteSpace:"pre-wrap"},l),rows:1,className:n,name:`${r}_textarea`,value:o,onChange:e=>a(e.target.value),autoFocus:!0,onFocus:e=>{o.length<40&&e.target.select()},onKeyDown:i}),t("span",{className:n,style:Object.assign({visibility:"hidden",height:"auto",gridArea:"1 / 1 / 2 / 2",color:"red",opacity:.9,whiteSpace:"pre-wrap",overflowY:"auto",border:"1px solid transparent"},l),children:c})]})},m=e=>null!==e&&"object"==typeof e,h=(e,t,n,r="")=>{if(!n&&!r)return!0;switch(e){case"collection":if(n){if(n(t,r))return!0;if(!y(r,t,n))return!1}if(!n&&r&&!y(r,t))return!1;break;case"value":if(n&&!n(t,r))return!1;if(!n&&r&&!b(t,r))return!1}return!0},y=(e="",t,n=b)=>{const r=t.value;return Object.entries(r).some((([o,a])=>{const i=[...t.path,o],l=Object.assign(Object.assign({},t),{key:o,path:i,level:t.level+1,value:a,size:i.length,parentData:r});return m(a)?y(e,l,n):n(l,e)}))},b=(e,t="")=>{const{value:n}=e;if(null===n&&"null".includes(t.toLowerCase()))return!0;switch(typeof n){case"string":return n.toLowerCase().includes(t.toLowerCase());case"number":return!!String(n).includes(t);case"boolean":return n?"true".includes(t.toLowerCase())||"1"===t:"false".includes(t.toLowerCase())||"0"===t;default:return!1}},f=({key:e,path:t},n="")=>!!b({value:e},n)||!!t.some((e=>b({value:e},n))),v=(e,t=200)=>"string"==typeof e?e.length<t?e:`${e.slice(0,t-2).trim()}...`:e,j=(e,t)=>(null!=t?t:"")+e.map((e=>""===e?String.fromCharCode(0):e)).join("."),E=e=>e.shiftKey?"Shift":e.metaKey?"Meta":e.ctrlKey?"Control":e.altKey?"Alt":void 0,D=(e,t,n)=>{const r=e.key,o=E(e);if(Array.isArray(t))return!!o&&t.includes(o);const{key:a,modifier:i}=t;return("stringLineBreak"!==n||"Enter"!==r||"Shift"!==o||"Enter"!==a||!(null==i?void 0:i.includes("Shift")))&&(r===a&&(i===o||Array.isArray(i)&&i.includes(o)))},w={key:"Enter"},C={confirm:w,cancel:{key:"Escape"},objectConfirm:Object.assign(Object.assign({},w),{modifier:["Meta","Shift","Control"]}),objectLineBreak:w,stringConfirm:w,stringLineBreak:Object.assign(Object.assign({},w),{modifier:["Shift"]}),numberConfirm:w,numberUp:{key:"ArrowUp"},numberDown:{key:"ArrowDown"},tabForward:{key:"Tab"},tabBack:{key:"Tab",modifier:"Shift"},booleanConfirm:w,booleanToggle:{key:" "},clipboardModifier:["Meta","Control"],collapseModifier:["Alt"]},k=(e,t,n="next",r)=>{const o=t.slice(0,t.length-1),a=t.slice(-1)[0];if(void 0===a)return null;const i=u(e,o),l=S(i);Array.isArray(i)||r(l,(({key:e,value:t})=>[e,t]));const s=l.findIndex((e=>e.key===a)),c=l[s+("next"===n?1:-1)];return c?m(c.value)?0===Object.keys(c.value).length?k(e,[...o,c.key],n,r):O(e,[...o,c.key],n,r):[...o,c.key]:0===o.length?null:k(e,o,n,r)},O=(e,t,n="next",r)=>{const o=u(e,t);if(!m(o))return t;const a=Array.isArray(o)?o.map(((e,t)=>t)):Object.keys(o);r(a,(e=>[e,o]));const i="next"===n?a[0]:a[a.length-1];return O(e,[...t,i],n,r)},S=e=>Array.isArray(e)?e.map(((e,t)=>({index:t,value:e,key:t}))):Object.entries(e).map((([e,t],n)=>({key:e,value:t,index:n}))),x=(e,t)=>{var n,r,o,a;const i=e.current,l=null!==(n=null==i?void 0:i.selectionStart)&&void 0!==n?n:1/0,s=null!==(r=null==i?void 0:i.selectionEnd)&&void 0!==r?r:1/0,c=(null===(o=null==i?void 0:i.textContent)||void 0===o?void 0:o.slice(0,l))+t+(null===(a=null==i?void 0:i.textContent)||void 0===a?void 0:a.slice(s));return i.value=c,null==i||i.setSelectionRange(l+1,l+1),c},N={displayName:"Default",fragments:{edit:"rgb(42, 161, 152)"},styles:{container:{backgroundColor:"#f6f6f6",fontFamily:"monospace"},collection:{},collectionInner:{},collectionElement:{},dropZone:{},property:"#292929",bracket:{color:"rgb(0, 43, 54)",fontWeight:"bold"},itemCount:{color:"rgba(0, 0, 0, 0.3)",fontStyle:"italic"},string:"rgb(203, 75, 22)",number:"rgb(38, 139, 210)",boolean:"green",null:{color:"rgb(220, 50, 47)",fontVariant:"small-caps",fontWeight:"bold"},input:["#292929"],inputHighlight:"#b3d8ff",error:{fontSize:"0.8em",color:"red",fontWeight:"bold"},iconCollection:"rgb(0, 43, 54)",iconEdit:"edit",iconDelete:"rgb(203, 75, 22)",iconAdd:"edit",iconCopy:"rgb(38, 139, 210)",iconOk:"green",iconCancel:"rgb(203, 75, 22)"}},A=r({getStyles:()=>({}),icons:{}}),T=({theme:e=N,icons:n={},docRoot:r,children:o})=>{const a=R(e,r);return t(A.Provider,{value:{getStyles:(e,t)=>"function"==typeof a[e]?a[e](t):a[e],icons:n},children:o})},P=()=>o(A),R=(e,t)=>{var n,r,o,a;const i={},l=(Array.isArray(e)?e:[e]).map((e=>z(e)?V({fragments:{},styles:e},i):V(e,i))),s=V(N,{});Object.keys(s).forEach((e=>{const t=e;l.forEach((e=>{e[t]&&(s[t]=Object.assign(Object.assign({},s[t]),e[t]))}))}));const c=Object.assign({},s);return Object.entries(i).forEach((([e,t])=>{const n=e;c[n]=e=>{const r=t(e)||{};return Object.assign(Object.assign({},s[n]),r)}})),"function"!=typeof(null==c?void 0:c.inputHighlight)&&(null===(n=null==c?void 0:c.inputHighlight)||void 0===n?void 0:n.backgroundColor)&&t.style.setProperty("--jer-highlight-color",null===(r=null==c?void 0:c.inputHighlight)||void 0===r?void 0:r.backgroundColor),"function"!=typeof(null==c?void 0:c.iconCopy)&&(null===(o=null==c?void 0:c.iconCopy)||void 0===o?void 0:o.color)&&t.style.setProperty("--jer-icon-copy-color",null===(a=null==c?void 0:c.iconCopy)||void 0===a?void 0:a.color),c},V=(e,t)=>{const{fragments:n,styles:r}=e,o={};return Object.entries(r).forEach((([e,r])=>{const a=(Array.isArray(r)?r:[r]).reduce(((r,o)=>{var a,i;if("function"==typeof o)return t[e]=o,Object.assign({},r);if("string"==typeof o){const t=null!==(a=null==n?void 0:n[o])&&void 0!==a?a:o;return"string"==typeof t?Object.assign(Object.assign({},r),{[null!==(i=F[e])&&void 0!==i?i:"color"]:t}):Object.assign(Object.assign({},r),t)}return Object.assign(Object.assign({},r),o)}),{});o[e]=a})),o},z=e=>!("styles"in e),F={container:"backgroundColor",collection:"backgroundColor",collectionInner:"backgroundColor",collectionElement:"backgroundColor",dropZone:"borderColor",inputHighlight:"backgroundColor"},M=r({collapseState:null,setCollapseState:()=>{},doesPathMatch:()=>!1,currentlyEditingElement:null,setCurrentlyEditingElement:()=>{},previouslyEditedElement:null,setPreviouslyEditedElement:()=>{},areChildrenBeingEdited:()=>!1,dragSource:{path:null,pathString:null},setDragSource:()=>{},tabDirection:"next",setTabDirection:()=>{}}),K=({children:e})=>{const[n,r]=a(null),[o,l]=a(null),[s,c]=a({path:null,pathString:null}),d=i(null),u=i("next"),p=i(null);return t(M.Provider,{value:{collapseState:n,setCollapseState:e=>{r(e),null!==e&&setTimeout((()=>r(null)),2e3)},doesPathMatch:e=>{if(null===n)return!1;for(const[t,r]of n.path.entries())if(r!==e[t])return!1;return!0},currentlyEditingElement:o,setCurrentlyEditingElement:(e,t)=>{const n="string"==typeof e||null===e?e:j(e,"key"===t?"key_":void 0);null!==o&&null!==n&&null!==d.current&&d.current(),l(n),d.current="function"==typeof t?t:null},areChildrenBeingEdited:e=>null!==o&&o.includes(e),previouslyEditedElement:p.current,setPreviouslyEditedElement:e=>{p.current=e},tabDirection:u.current,setTabDirection:e=>{u.current=e},dragSource:s,setDragSource:c},children:e})},_=()=>o(M),I="**INVALID_FUNCTION**",L=({value:n,setValue:r,isEditing:o,path:a,setIsEditing:l,handleEdit:s,stringTruncate:c,showStringQuotes:d,nodeData:u,handleKeyboard:p,keyboardCommon:m})=>{const{getStyles:h}=P(),y=i(null),b=j(a),f=d?'"':"";return o?t(g,{className:"jer-input-text",textAreaRef:y,name:b,value:n,setValue:r,isEditing:o,handleKeyPress:e=>{p(e,Object.assign({stringConfirm:s,stringLineBreak:()=>{const e=x(y,"\n");r(e)}},m))},styles:h("input",u)}):e("div",{id:`${b}_display`,onDoubleClick:()=>l(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&l(!0)},className:"jer-value-string",style:h("string",u),children:[f,v(n,c),f]})},B=({value:e,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:l,handleKeyboard:s,keyboardCommon:c})=>{const{getStyles:d}=P();return r?t("input",{className:"jer-input-number",type:"text",name:j(o),value:e,onChange:e=>n(e.target.value.replace(/[^0-9.-]/g,"")),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:t=>s(t,Object.assign({numberConfirm:i,numberUp:()=>n(Number(e)+1),numberDown:()=>n(Number(e)-1)},c)),style:Object.assign({width:String(e).length/1.5+2+"em"},d("input",l))}):t("span",{onDoubleClick:()=>a(!0),className:"jer-value-number",style:d("number",l),children:e})},W=({value:e,setValue:n,isEditing:r,path:o,setIsEditing:a,handleEdit:i,nodeData:l,handleKeyboard:s,keyboardCommon:c})=>{const{getStyles:d}=P();return r?t("input",{className:"jer-input-boolean",type:"checkbox",name:j(o),checked:e,onChange:()=>n(!e),onKeyDown:t=>{" "===t.key&&t.preventDefault(),s(t,Object.assign({booleanConfirm:i,booleanToggle:()=>n(!e)},c))},autoFocus:!0}):t("span",{onDoubleClick:()=>a(!0),className:"jer-value-boolean",style:d("boolean",l),children:String(e)})},G=({value:e,isEditing:n,setIsEditing:r,handleEdit:o,nodeData:a,handleKeyboard:s,keyboardCommon:c})=>{const{getStyles:d}=P(),u=i();l((()=>{if(n)return u.current=window.setTimeout((()=>window.addEventListener("keydown",p)),100),()=>window.removeEventListener("keydown",p);window.clearTimeout(u.current)}),[n]);const p=e=>s(e,Object.assign({confirm:o},c));return t("div",{onDoubleClick:()=>r(!0),className:"jer-value-null",style:d("null",a),children:String(e)})},U=({value:e})=>{let n="Error!";switch(typeof e){case"string":e===I&&(n="Function");break;case"undefined":n="Undefined";break;case"symbol":n="Symbol"}return t("span",{className:"jer-value-invalid",children:n})},H=({size:n,style:r,className:o})=>e("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:n,height:n,className:o,style:r,children:[t("path",{d:"M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4z"}),t("path",{d:"M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z"})]}),Y=({size:n,style:r,className:o})=>e("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:n,height:n,className:o,style:r,transform:"translate(0, 0.5)",children:[t("path",{d:"M7 17.013l4.413-.015 9.632-9.54c.378-.378.586-.88.586-1.414s-.208-1.036-.586-1.414l-1.586-1.586c-.756-.756-2.075-.752-2.825-.003L7 12.583v4.43zM18.045 4.458l1.589 1.583-1.597 1.582-1.586-1.585 1.594-1.58zM9 13.417l6.03-5.973 1.586 1.586-6.029 5.971L9 15.006v-1.589z"}),t("path",{d:"M5 21h14c1.103 0 2-.897 2-2v-8.668l-2 2V19H8.158c-.026 0-.053.01-.079.01-.033 0-.066-.009-.1-.01H5V5h6.847l2-2H5c-1.103 0-2 .897-2 2v14c0 1.103.897 2 2 2z"})]}),$=({size:e,style:n,className:r})=>t("svg",{viewBox:"0 0 24 24",fill:"currentColor",width:e,height:e,className:r,style:n,children:t("path",{d:"M6 19a2 2 0 002 2h8a2 2 0 002-2V7H6v12m2.46-7.12l1.41-1.41L12 12.59l2.12-2.12 1.41 1.41L13.41 14l2.12 2.12-1.41 1.41L12 15.41l-2.12 2.12-1.41-1.41L10.59 14l-2.13-2.12M15.5 4l-1-1h-5l-1 1H5v2h14V4h-3.5z"})}),J=({size:n,style:r,className:o})=>e("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:n,height:n,className:o,style:r,children:[t("path",{d:"M9 2 H15 A1 1 0 0 1 16 3 V5 A1 1 0 0 1 15 6 H9 A1 1 0 0 1 8 5 V3 A1 1 0 0 1 9 2 z"}),t("path",{d:"M8 4H6a2 2 0 00-2 2v14a2 2 0 002 2h12a2 2 0 002-2v-2M16 4h2a2 2 0 012 2v4M21 14H11"}),t("path",{d:"M15 10l-4 4 4 4"})]}),X=({size:n,style:r,className:o})=>e("svg",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,viewBox:"0 0 24 24",width:n,height:n,className:o,style:r,children:[t("path",{d:"M22 11.08V12a10 10 0 11-5.93-9.14"}),t("path",{d:"M22 4L12 14.01l-3-3"})]}),Z=({size:e,style:n,className:r})=>t("svg",{baseProfile:"tiny",viewBox:"0 0 24 24",fill:"currentColor",width:e,height:e,className:r,style:n,children:t("path",{d:"M12 4c-4.411 0-8 3.589-8 8s3.589 8 8 8 8-3.589 8-8-3.589-8-8-8zm-5 8c0-.832.224-1.604.584-2.295l6.711 6.711A4.943 4.943 0 0112 17c-2.757 0-5-2.243-5-5zm9.416 2.295L9.705 7.584A4.943 4.943 0 0112 7c2.757 0 5 2.243 5 5 0 .832-.224 1.604-.584 2.295z"})}),Q=({size:e,style:n,className:r})=>t("svg",{viewBox:"0 0 512 512",fill:"currentColor",width:e,height:e,className:r,style:n,children:t("path",{d:"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"})}),q=({name:e,nodeData:r,rotate:o})=>{var a,i,l,s,c,d,u;const{getStyles:p,icons:g}=P(),m={size:"1.4em",className:"jer-icon"};switch(e){case"add":return null!==(a=null==g?void 0:g.add)&&void 0!==a?a:t(H,Object.assign({},m,{style:p("iconAdd",r)}));case"edit":return null!==(i=null==g?void 0:g.edit)&&void 0!==i?i:t(Y,Object.assign({},m,{style:p("iconEdit",r)}));case"delete":return null!==(l=null==g?void 0:g.delete)&&void 0!==l?l:t($,Object.assign({},m,{style:p("iconDelete",r),size:"1.45em"}));case"copy":return null!==(s=null==g?void 0:g.copy)&&void 0!==s?s:t(J,Object.assign({},m,{style:p("iconCopy",r),size:"1.2em"}));case"ok":return null!==(c=null==g?void 0:g.ok)&&void 0!==c?c:t(X,Object.assign({},m,{style:Object.assign({fontSize:"90%"},p("iconOk",r))}));case"cancel":return null!==(d=null==g?void 0:g.cancel)&&void 0!==d?d:t(Z,Object.assign({},m,{style:Object.assign({fontSize:"130%"},p("iconCancel",r))}));case"chevron":return null!==(u=null==g?void 0:g.chevron)&&void 0!==u?u:t(Q,{size:"1em",style:p("iconCollection",r)});default:return t(n,{})}},ee=({startEdit:r,handleDelete:o,handleAdd:i,enableClipboard:l,type:s,customButtons:c,nodeData:d,translate:u,keyboardControls:p,handleKeyboard:g})=>{const{getStyles:m}=P(),h=u("KEY_NEW",d),[y,b]=a(!1),[f,v]=a(h),{key:j,path:D,value:w}=d;return e("div",{className:"jer-edit-buttons",style:{opacity:y?1:void 0},children:[l&&t("div",{onClick:e=>{var t;e.stopPropagation();let n,r,o="value",a="",i=null;if(l){const c=E(e);if(c&&p.clipboardModifier.includes(c)?(n=ne(D),a=n,o="path"):(n=w,a=s?JSON.stringify(w,null,2):String(n)),!navigator.clipboard)return void("function"==typeof l&&l({success:!1,value:n,stringValue:a,path:D,key:j,type:o,errorMessage:"Can't access clipboard API"}));null===(t=navigator.clipboard)||void 0===t||t.writeText(a).then((()=>r=!0)).catch((e=>{r=!1,i=e.message})).finally((()=>{"function"==typeof l&&l({success:r,errorMessage:i,value:n,stringValue:a,path:D,key:j,type:o})}))}},className:"jer-copy-pulse",children:t(q,{name:"copy",nodeData:d})}),r&&t("div",{onClick:e=>{e.stopPropagation(),r()},children:t(q,{name:"edit",nodeData:d})}),o&&t("div",{onClick:e=>{e.stopPropagation(),o()},children:t(q,{name:"delete",nodeData:d})}),i&&t("div",{onClick:e=>{e.stopPropagation(),"object"===s?b(!0):i("")},children:t(q,{name:"add",nodeData:d})}),null==c?void 0:c.map((({Element:e,onClick:n},r)=>t("div",{onClick:e=>n&&n(d,e),children:t(e,{nodeData:d})},r))),y&&i&&"object"===s&&e(n,{children:[t("input",{className:"jer-input-new-key",type:"text",name:"new-object-key",value:f,onChange:e=>v(e.target.value),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>{g(e,{stringConfirm:()=>{i&&(b(!1),i(f),v(h))},cancel:()=>{b(!1),v(h)}})},style:m("input",d)}),t(te,{onOk:e=>{f&&(e.stopPropagation(),b(!1),i(f))},onCancel:e=>{e.stopPropagation(),b(!1)},nodeData:d})]})]})},te=({onOk:n,onCancel:r,nodeData:o})=>e("div",{className:"jer-confirm-buttons",children:[t("div",{onClick:n,children:t(q,{name:"ok",nodeData:o})}),t("div",{onClick:r,children:t(q,{name:"cancel",nodeData:o})})]}),ne=e=>e.reduce(((e,t)=>"number"==typeof t?`${e}[${t}]`:""===e?t:`${e}.${t}`),""),re=["string","number","boolean","null","object","array"],oe=(e=[],t)=>{const n=e.filter((({condition:e})=>e(t)));if(0===n.length)return{};const r=n[0],{element:o,wrapperElement:a,customNodeProps:i,wrapperProps:l,hideKey:s=!1,showEditTools:c=!0,showOnEdit:d=!1,showOnView:u=!0,showCollectionWrapper:p=!0}=r,g=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n}(r,["element","wrapperElement","customNodeProps","wrapperProps","hideKey","showEditTools","showOnEdit","showOnView","showCollectionWrapper"]);return Object.assign({CustomNode:o,CustomWrapper:a,customNodeProps:i,wrapperProps:l,hideKey:s,showEditTools:c,showOnEdit:d,showOnView:u,showCollectionWrapper:p},g)},ae=({props:e,collapsed:t})=>{const{data:n,nodeData:r,parentData:o,onEdit:i,onError:l,showErrorMessages:c,restrictEditFilter:d,restrictDeleteFilter:u,restrictAddFilter:p,restrictDragFilter:g,translate:m,errorMessageTimeout:h}=e,{currentlyEditingElement:y,setCurrentlyEditingElement:b}=_(),[f,v]=a(null),E=Object.assign(Object.assign({},r),{collapsed:t}),{path:D,key:w,size:C}=E,k=j(D),O=s((()=>!d(E)),[E]),S=s((()=>!u(E)),[E]),x=s((()=>!p(E)),[E]),N=s((()=>!g(E)&&S&&null===y),[E]),A=e=>{c&&(v(e),setTimeout((()=>v(null)),h)),console.warn("Error",e)},T=s((()=>(e,t)=>{A(e.message),l&&l({currentData:E.fullData,errorValue:t,currentValue:n,name:w,path:D,error:e})}),[l,c]),P=y===k,R=y===`key_${k}`,V="number"==typeof D.slice(-1)[0];return{pathString:k,nodeData:E,path:D,name:w,size:C,canEdit:O,canDelete:S,canAdd:x,canDrag:N,error:f,showError:A,onError:T,setError:v,handleEditKey:e=>{if(b(null),w===e)return;if(!o)return;const t=D.slice(0,-1);if(Object.keys(o).includes(e))return void T({code:"KEY_EXISTS",message:m("ERROR_KEY_EXISTS",E)},e);const n=Object.fromEntries(Object.entries(o).map((([t,n])=>t===w?[e,n]:[t,n])));i(n,t).then((t=>{t&&T({code:"UPDATE_ERROR",message:t},e)}))},derivedValues:{isEditing:P,isEditingKey:R,isArray:V,canEditKey:null!==o&&O&&x&&S&&!V}}},ie=({canDrag:e,canDragOnto:n,path:r,nodeData:o,onMove:i,onError:l,translate:c})=>{const{getStyles:d}=P(),{dragSource:u,setDragSource:p}=_(),[g,m]=a(!1),h=j(r),y=s((()=>e?{onDragStart:e=>{e.stopPropagation(),p({path:r,pathString:h})},onDragEnd:e=>{e.stopPropagation(),p({path:null,pathString:null})}}:{}),[e]),b=s((()=>e=>n?{onDragOver:e=>{e.stopPropagation(),e.preventDefault()},onDrop:t=>{t.stopPropagation(),v(e),p({path:null,pathString:null}),m(!1)},onDragEnter:t=>{var n;t.stopPropagation(),h.startsWith(null!==(n=u.pathString)&&void 0!==n?n:"")||m(e)},onDragExit:e=>{e.stopPropagation(),m(!1)}}:{}),[u,n]),f=s((()=>n&&null!==u.pathString?t("div",Object.assign({className:"jer-drop-target-bottom",style:{height:"50%",position:"absolute",width:"100%",top:"50%",zIndex:r.length}},b("below"))):null),[u,n]),v=e=>{var t,n;const a=null===(t=u.path)||void 0===t?void 0:t.slice(-1)[0],s=null===(n=u.path)||void 0===n?void 0:n.slice(0,-1).join("."),d=r.slice(0,-1).join(""),{parentData:p}=o;"string"==typeof a&&p&&!Array.isArray(p)&&Object.keys(p).includes(a)&&a in p&&s!==d?l({code:"KEY_EXISTS",message:c("ERROR_KEY_EXISTS",o)},a):i(u.path,r,e).then((e=>{e&&l({code:"UPDATE_ERROR",message:e},o.value)}))};return{dragSourceProps:y,getDropTargetProps:b,BottomDropTarget:f,DropTargetPadding:({position:e,nodeData:n})=>g===e?t("div",{className:"jer-drag-n-drop-padding",style:d("dropZone",n)}):null,handleDrop:v}},le=(e,t,n)=>{var r,o,a;const i=parseInt(null!==(r=getComputedStyle(n.current).getPropertyValue("line-height"))&&void 0!==r?r:"16px"),l=(null!==(a=null===(o=t.current)||void 0===o?void 0:o.offsetWidth)&&void 0!==a?a:0)/(.5*i),s=JSON.stringify(e,null,2).replace(/\\n/g,"\n").split("\n").map((e=>Math.ceil(e.length/l))).reduce(((e,t)=>e+t),0)*i;return Math.min(s+30,window.innerHeight-50)},se=n=>{const{data:r,parentData:o,onEdit:i,onDelete:d,onChange:u,onMove:p,enableClipboard:g,canDragOnto:m,restrictTypeSelection:y,searchFilter:b,searchText:f,showLabel:v,stringTruncate:j,showStringQuotes:E,indent:D,translate:w,customNodeDefinitions:C,handleKeyboard:O,keyboardControls:S,sort:x}=n,{getStyles:N}=P(),{setCurrentlyEditingElement:A,setCollapseState:T,previouslyEditedElement:R,setPreviouslyEditedElement:V,tabDirection:z,setTabDirection:F}=_(),[M,K]=a("function"==typeof r?I:r),{pathString:L,nodeData:B,path:W,name:G,canEdit:U,canDelete:H,canDrag:Y,error:$,onError:J,handleEditKey:X,derivedValues:Z}=ae({props:n}),{dragSourceProps:Q,getDropTargetProps:q,BottomDropTarget:ne,DropTargetPadding:le}=ie({canDrag:Y,canDragOnto:m,path:W,nodeData:B,onMove:p,onError:J,translate:w}),se=oe(C,B),[pe,ge]=a(ce(r,se)),me=c((e=>{if(!u)return void K(e);const t=u({currentData:B.fullData,newValue:e,currentValue:M,name:G,path:W});K(t)}),[u]);l((()=>{K("function"==typeof r?I:r),ge(ce(r,se))}),[r,$]);const{CustomNode:he,customNodeProps:ye,hideKey:be,showEditTools:fe=!0,showOnEdit:ve,showOnView:je}=se,Ee=[...re,...C.filter((({showInTypesSelector:e=!1,name:t})=>e&&!!t)).map((({name:e})=>e))],De=s((()=>{if("boolean"==typeof y)return y?[]:Ee;if(Array.isArray(y))return y;const e=y(B);return"boolean"==typeof e?e?[]:Ee:e}),[B,y]),{isEditing:we}=Z,Ce=h("value",B,b,f);if(we&&(!Ce||!U)){const e=k(B.fullData,W,z,x);A(e||R)}if(!Ce)return null;const ke=()=>{let e;switch(A(null),pe){case"object":e={[w("DEFAULT_NEW_KEY",B)]:M};break;case"array":e=null!=M?M:[];break;case"number":{const t=Number(M);e=isNaN(t)?0:t;break}default:e=M}i(e,W).then((t=>{t&&J({code:"UPDATE_ERROR",message:t},e)}))},Oe=()=>{A(null),K(r),ge(ce(r,se))},{isEditingKey:Se,canEditKey:xe}=Z,Ne=!we&&$,Ae=we&&De.length>0,Te="invalid"!==pe&&!$&&fe,Pe=v&&Se,Re=v&&!Se&&!be,Ve={value:M,parentData:o,setValue:me,isEditing:we,setIsEditing:U?()=>A(W):()=>{},handleEdit:ke,handleCancel:Oe,path:W,stringTruncate:j,showStringQuotes:E,nodeData:B,translate:w,handleKeyboard:O,keyboardCommon:{cancel:Oe,tabForward:()=>{F("next"),V(L);const e=k(B.fullData,W,"next",x);e&&(ke(),A(e))},tabBack:()=>{F("prev"),V(L);const e=k(B.fullData,W,"prev",x);e&&(ke(),A(e))}}},ze=he&&(we&&ve||!we&&je)?t(he,Object.assign({},n,{value:M,customNodeProps:ye,setValue:me,handleEdit:ke,handleCancel:Oe,handleKeyPress:e=>O(e,{stringConfirm:ke,cancel:Oe}),isEditing:we,setIsEditing:()=>A(W),getStyles:N})):de(ce(r),Ve);return e("div",Object.assign({className:"jer-component jer-value-component",style:{marginLeft:D/2+"em",position:"relative"},draggable:Y},Q,q("above"),{children:[ne,t(le,{position:"above",nodeData:B}),e("div",{className:"jer-value-main-row",style:{flexWrap:G.length>10?"wrap":"nowrap"},children:[Re&&t("span",{className:"jer-key-text",style:Object.assign(Object.assign({},N("property",B)),{minWidth:`${Math.min(String(G).length+1,5)}ch`,flexShrink:G.length>10?1:0}),onDoubleClick:()=>xe&&A(W,"key"),children:""===G?t("span",{className:W.length>0?"jer-empty-string":void 0}):`${G}:`}),Pe&&t("input",{className:"jer-input-text jer-key-edit",type:"text",name:L,defaultValue:G,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>O(e,{stringConfirm:()=>X(e.target.value),cancel:Oe,tabForward:()=>{X(e.target.value),A(W)},tabBack:()=>{X(e.target.value),A(k(B.fullData,W,"prev",x))}}),style:{width:String(G).length/1.5+.5+"em"}}),e("div",{className:"jer-value-and-buttons",children:[t("div",{className:"jer-input-component",children:ze}),we?t(te,{onOk:ke,onCancel:Oe,nodeData:B}):Te&&t(ee,{startEdit:U?()=>A(W,Oe):void 0,handleDelete:H?()=>{d(M,W).then((e=>{e&&J({code:"DELETE_ERROR",message:e},M)}))}:void 0,enableClipboard:g,translate:w,customButtons:n.customButtons,nodeData:B,handleKeyboard:O,keyboardControls:S}),Ae&&e("div",{className:"jer-select",children:[t("select",{name:`${G}-type-select`,className:"jer-type-select",onChange:e=>(e=>{const t=C.find((t=>t.name===e));if(t)i(t.defaultValue,W),ge(e),A(null),T({path:W,collapsed:!1});else{const t=ue(M,e,w("DEFAULT_NEW_KEY",B),(null==se?void 0:se.CustomNode)?w("DEFAULT_STRING",B):void 0);me(t),i(t,W).then((e=>{e&&(J({code:"UPDATE_ERROR",message:e},t),A(null))}))}})(e.target.value),value:pe,children:De.map((e=>t("option",{value:e,children:e},e)))}),t("span",{className:"focus"})]}),Ne&&t("span",{className:"jer-error-slug",style:N("error",B),children:$})]})]}),t(le,{position:"below",nodeData:B})]}))},ce=(e,t)=>(null==t?void 0:t.CustomNode)&&(null==t?void 0:t.name)&&t.showInTypesSelector?t.name:"string"==typeof e?"string":"number"==typeof e?"number":"boolean"==typeof e?"boolean":null===e?"null":"invalid",de=(e,n)=>{const r=n.value;switch(e){case"string":return t(L,Object.assign({},n,{value:r}));case"number":return t(B,Object.assign({},n,{value:r}));case"boolean":return t(W,Object.assign({},n,{value:r}));case"null":return t(G,Object.assign({},n));default:return t(U,Object.assign({},n))}},ue=(e,t,n,r)=>{switch(t){case"string":return null!=r?r:String(e);case"number":{const t=Number(e);return isNaN(t)?0:t}case"boolean":return!!e;case"null":return null;case"object":return{[n]:e};case"array":return[e];default:return String(e)}},pe=r=>{const{getStyles:o}=P(),{collapseState:c,setCollapseState:d,doesPathMatch:u,currentlyEditingElement:y,setCurrentlyEditingElement:b,areChildrenBeingEdited:f}=_(),{mainContainerRef:v,data:j,nodeData:D,parentData:w,showCollectionCount:C,onEdit:O,onAdd:S,onDelete:N,canDragOnto:A,collapseFilter:T,collapseAnimationTime:R,onMove:V,enableClipboard:z,searchFilter:F,searchText:M,indent:K,sort:I,showArrayIndices:L,defaultValue:B,translate:W,customNodeDefinitions:G,jsonParse:U,jsonStringify:H,TextEditor:Y,keyboardControls:$,handleKeyboard:J,insertAtTop:X}=r,[Z,Q]=a(H(j)),ne=T(D),{contentRef:re,isAnimating:ce,maxHeight:de,collapsed:ue,animateCollapse:ge}=((e,t,n,r)=>{const[o,l]=a(n?0:void 0),[s,c]=a(n),d=i(!1),u=i(null),p=i(0),g=i();return{contentRef:u,isAnimating:d.current,animateCollapse:n=>{var o,a;if(s!==n){switch(window.clearTimeout(g.current),d.current=!0,n){case!0:{const e=null!==(a=null===(o=u.current)||void 0===o?void 0:o.offsetHeight)&&void 0!==a?a:0;p.current=e,l(e),setTimeout((()=>{l(0)}),5);break}case!1:l(p.current||le(e,u,r))}c(!s),g.current=window.setTimeout((()=>{d.current=!1,n||l(void 0)}),t)}},maxHeight:o,collapsed:s}})(j,R,ne,v),{pathString:me,nodeData:he,path:ye,name:be,size:fe,canEdit:ve,canDelete:je,canAdd:Ee,canDrag:De,error:we,setError:Ce,onError:ke,handleEditKey:Oe,derivedValues:Se}=ae({props:r,collapsed:ue}),{dragSourceProps:xe,getDropTargetProps:Ne,BottomDropTarget:Ae,DropTargetPadding:Te}=ie({canDrag:De,canDragOnto:A,path:ye,nodeData:he,onMove:V,onError:ke,translate:W}),Pe=i(!ne);l((()=>{Q(H(j)),Qe&&b(null)}),[j]),l((()=>{const e=T(he)&&!Se.isEditing;Pe.current=!e,ge(e)}),[T]),l((()=>{null!==c&&u(ye)&&(Pe.current=!0,ge(c.collapsed))}),[c]);const Re=i(null),Ve=s((()=>(e,t)=>"function"!=typeof B?B:B(e,t)),[B]),{CustomNode:ze,customNodeProps:Fe,CustomWrapper:Me,wrapperProps:Ke={},hideKey:_e,showEditTools:Ie=!0,showOnEdit:Le,showOnView:Be,showCollectionWrapper:We=!0}=s((()=>oe(G,he)),[]),Ge=f(me);Ge&&ue&&ge(!1);if(!(h("collection",he,F,M)||0===he.level)&&!Ge)return null;const Ue=Array.isArray(j)?"array":"object",He="array"===Ue?{open:"[",close:"]"}:{open:"{",close:"}"},Ye=e=>{if("Tab"!==e.key||e.getModifierState("Shift"))J(e,{objectConfirm:Je,cancel:Ze});else{e.preventDefault();const t=x(Re,"\t");Q(t)}},$e=e=>{const t=E(e);if(t&&$.collapseModifier.includes(t))return Pe.current=!0,void d({collapsed:!ue,path:ye});y&&y.includes(me)||(Pe.current=!0,d(null),ge(!ue))},Je=()=>{try{const e=U(Z);if(b(null),Ce(null),JSON.stringify(e)===JSON.stringify(j))return;O(e,ye).then((t=>{t&&ke({code:"UPDATE_ERROR",message:t},e)}))}catch(e){ke({code:"INVALID_JSON",message:W("ERROR_INVALID_JSON",he)},Z)}},Xe=ye.length>0?()=>{N(j,ye).then((e=>{e&&ke({code:"DELETE_ERROR",message:e},j)}))}:void 0,Ze=()=>{b(null),Ce(null),Q(H(j))},{isEditing:Qe,isEditingKey:qe,isArray:et,canEditKey:tt}=Se,nt="when-closed"===C?ue:C,rt=!Qe&&Ie,ot=(L||!et)&&!_e&&void 0!==be,at=ze&&(Qe&&Le||!Qe&&Be),it=Object.entries(j).map((([e,t])=>["array"===Ue?Number(e):e,t]));"object"===Ue&&I(it,(e=>e));const lt=Pe.current?Qe?e("div",{className:"jer-collection-text-edit",children:[Y?t(Y,{value:Z,onChange:Q,onKeyDown:e=>J(e,{objectConfirm:Je,cancel:Ze})}):t(g,{textAreaRef:Re,className:"jer-collection-text-area",name:me,value:Z,setValue:Q,isEditing:Qe,handleKeyPress:Ye,styles:o("input",he)}),t("div",{className:"jer-collection-input-button-row",children:t(te,{onOk:Je,onCancel:Ze,nodeData:he})})]}):it.map((([e,n],a)=>{const i={key:e,value:n,path:[...ye,e],level:ye.length+1,index:a,size:m(n)?Object.keys(n).length:1,parentData:j,fullData:he.fullData};return t("div",{className:"jer-collection-element",style:o("collectionElement",i),children:m(n)?t(pe,Object.assign({},r,{data:n,parentData:j,nodeData:i,showCollectionCount:C,canDragOnto:ve}),e):t(se,Object.assign({},r,{data:n,parentData:j,nodeData:i,canDragOnto:ve,showLabel:"object"===Ue||L}),e)},e)})):null,st=!!We&&(ue&&!Ge);st||(Pe.current=!0);const ct=Object.assign(Object.assign({},r),{data:j,value:j,parentData:w,nodeData:he,setValue:e=>p(void 0,void 0,void 0,(function*(){return yield O(e,ye)})),handleEdit:Je,handleCancel:Ze,handleKeyPress:Ye,isEditing:Qe,setIsEditing:()=>b(ye),getStyles:o,canDragOnto:ve}),dt=at?t(ze,Object.assign({customNodeProps:Fe},ct,{children:lt})):lt,ut=qe?t("input",{className:"jer-input-text jer-key-edit",type:"text",name:me,defaultValue:be,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>J(e,{stringConfirm:()=>Oe(e.target.value),cancel:Ze,tabForward:()=>{Oe(e.target.value);const t=null==it?void 0:it[0][0];b(t?[...ye,t]:k(he.fullData,ye,"next",I))},tabBack:()=>{Oe(e.target.value),b(k(he.fullData,ye,"prev",I))}}),style:{width:String(be).length/1.5+.5+"em"}}):ot&&t("span",{className:"jer-key-text",style:o("property",he),onClick:e=>e.stopPropagation(),onDoubleClick:()=>tt&&b(ye,"key"),children:""===be?t("span",{className:ye.length>0?"jer-empty-string":void 0}):`${be}:`}),pt=rt&&t(ee,{startEdit:ve?()=>{Pe.current=!0,b(ye)}:void 0,handleAdd:Ee?e=>{ge(!1);const t=Ve(he,e);if("array"===Ue){const e=X.array?0:j.length,n=X.array?{insert:!0}:{};S(t,[...ye,e],n).then((e=>{e&&ke({code:"ADD_ERROR",message:e},t)}))}else if(e in j)ke({code:"KEY_EXISTS",message:W("ERROR_KEY_EXISTS",he)},e);else{const n=X.object?{insertBefore:0}:{};S(t,[...ye,e],n).then((e=>{e&&ke({code:"ADD_ERROR",message:e},t)}))}}:void 0,handleDelete:je?Xe:void 0,enableClipboard:z,type:Ue,nodeData:he,translate:W,customButtons:r.customButtons,keyboardControls:$,handleKeyboard:J}),gt=e("div",Object.assign({className:"jer-component jer-collection-component",style:Object.assign(Object.assign({marginLeft:(0===ye.length?0:K/2)+"em"},o("collection",he)),{position:"relative"}),draggable:De},xe,Ne("above"),{children:[t("div",{className:"jer-clickzone",style:{width:K/2+1+"em",zIndex:10+2*he.level},onClick:e=>$e(e)}),!Qe&&Ae,t(Te,{position:"above",nodeData:he}),We?e("div",{className:"jer-collection-header-row",style:{position:"relative"},onClick:e=>$e(e),children:[e("div",{className:"jer-collection-name",children:[t("div",{className:"jer-collapse-icon jer-accordion-icon"+(ue?" jer-rotate-90":""),style:{zIndex:11+2*he.level},onClick:e=>$e(e),children:t(q,{name:"chevron",rotate:ue,nodeData:he})}),ut,!Qe&&t("span",{className:"jer-brackets jer-bracket-open",style:o("bracket",he),children:He.open})]}),!Qe&&nt&&t("div",{className:"jer-collection-item-count"+(nt?" jer-visible":" jer-hidden"),style:o("itemCount",he),children:1===fe?W("ITEM_SINGLE",Object.assign(Object.assign({},he),{size:1}),1):W("ITEMS_MULTIPLE",he,fe)}),t("div",{className:"jer-brackets"+(st?" jer-visible":" jer-hidden"),style:o("bracket",he),children:He.close}),pt]}):_e?t(n,{}):e("div",{className:"jer-collection-header-row",style:{position:"relative"},children:[ut,pt]}),e("div",{className:"jer-collection-inner",style:Object.assign({overflowY:st||ce?"clip":"visible",maxHeight:Ge?void 0:de},o("collectionInner",he)),ref:re,children:[dt,t("div",{className:Qe?"jer-collection-error-row":"jer-collection-error-row-edit",children:we&&t("span",{className:"jer-error-slug",style:o("error",he),children:we})}),!Qe&&We&&t("div",{className:"jer-brackets jer-bracket-outside",style:Object.assign(Object.assign({},o("bracket",he)),{marginLeft:(K<3?-1:K<6?-.5:0)+"em"}),children:He.close})]}),t(Te,{position:"below",nodeData:he})]}));return Me?t(Me,Object.assign({customNodeProps:Ke},ct,{children:gt})):gt},ge={ITEM_SINGLE:"{{count}} item",ITEMS_MULTIPLE:"{{count}} items",KEY_NEW:"Enter new key",ERROR_KEY_EXISTS:"Key already exists",ERROR_INVALID_JSON:"Invalid JSON",ERROR_UPDATE:"Update unsuccessful",ERROR_DELETE:"Delete unsuccessful",ERROR_ADD:"Adding node unsuccessful",DEFAULT_STRING:"New data!",DEFAULT_NEW_KEY:"key"},me=(e,t)=>(n,r,o)=>((e,t,n,r,o)=>{if(t[r]){const e=t[r](n);if(null!==e)return e}const a=r in e?e[r]:ge[r];return void 0===o?a:null==a?void 0:a.replace("{{count}}",String(o))})(e,t,r,n,o);var he=[],ye=[];!function(e,t){if(e&&"undefined"!=typeof document){var n,r=!0===t.prepend?"prepend":"append",o=!0===t.singleTag,a="string"==typeof t.container?document.querySelector(t.container):document.getElementsByTagName("head")[0];if(o){var i=he.indexOf(a);-1===i&&(i=he.push(a)-1,ye[i]={}),n=ye[i]&&ye[i][r]?ye[i][r]:ye[i][r]=l()}else n=l();65279===e.charCodeAt(0)&&(e=e.substring(1)),n.styleSheet?n.styleSheet.cssText+=e:n.appendChild(document.createTextNode(e))}function l(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),t.attributes)for(var n=Object.keys(t.attributes),o=0;o<n.length;o++)e.setAttribute(n[o],t.attributes[n[o]]);var i="prepend"===r?"afterbegin":"beforeend";return a.insertAdjacentElement(i,e),e}}(':root{--jer-select-border:#b6b6b6;--jer-select-focus:#777;--jer-select-arrow:#777;--jer-form-border:1px solid #ededf0;--jer-form-border-focus:1px solid #e2e2e2;--jer-expand-transition-time:0.3s;--jer-highlight-color:#b3d8ff}.jer-visible{opacity:1}.jer-hidden,.jer-visible{transition:var(--jer-expand-transition-time)}.jer-hidden{opacity:0}.jer-select select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;color:#000;cursor:inherit;font-family:inherit;font-size:.8em;line-height:inherit;margin:0;outline:none;padding:0 1em 0 0;z-index:1}select::-ms-expand{display:none}.jer-select{align-items:center;background-color:#fff;background-image:linear-gradient(0deg,#f9f9f9,#fff 33%);border:1px solid var(--jer-select-border);border-radius:.25em;cursor:pointer;display:grid;grid-template-areas:"select";line-height:1.1;max-width:15ch;min-width:12ch;padding:.25em .5em;position:relative}.jer-select select,.jer-select:after{grid-area:select}.jer-select:not(.jer-select--multiple):after{background-color:var(--jer-select-arrow);clip-path:polygon(100% 0,0 0,50% 100%);content:"";height:.5em;justify-self:end;width:.8em}select:focus+.focus{border:1px solid var(--jer-select-focus);border-radius:inherit;bottom:-1px;left:-1px;position:absolute;right:-1px;top:-1px}.jer-editor-container{border-radius:.5em;font-size:16px;line-height:1;padding:1em 1em 1em 2em;position:relative;text-align:left}.jer-editor-container textarea{border:var(--jer-form-border);border-radius:.3em;color:var(--jer-input-color);outline:none}.jer-editor-container textarea:focus{border:var(--jer-form-border-focus)}.jer-editor-container input{border:var(--jer-form-border);border-radius:.3em;font-family:inherit;outline:none}.jer-editor-container input:focus{border:var(--jer-form-border-focus)}.jer-editor-container ::selection{background-color:var(--jer-highlight-color)}.jer-collection-header-row,.jer-value-main-row{align-items:center;display:flex;gap:.3em;min-height:1.7em}.jer-collection-header-row{display:flex;flex-wrap:wrap}.jer-collapse-icon{left:-1.2em;position:absolute;top:.35em}.jer-collection-inner{position:relative;transition:var(--jer-expand-transition-time)}.jer-collection-text-edit{align-items:flex-start;display:flex;flex-direction:column;gap:.3em}.jer-collection-text-area{font-family:inherit;font-size:.85em;max-height:40em;overflow:hidden;padding:.2em .5em 0;resize:both}.jer-collection-input-button-row{display:flex;font-size:150%;justify-content:flex-end;margin-top:.4em;width:100%}.jer-collection-error-row{bottom:.5em;position:absolute}.jer-error-slug{margin-left:1em}.jer-value-component{position:relative}.jer-value-main-row{display:flex;gap:0}.jer-value-and-buttons{align-items:center;display:flex;justify-content:flex-start;padding-left:.5em}.jer-value-error-row{position:absolute}.jer-value-string{line-height:1.3em;overflow-wrap:anywhere;white-space:pre-wrap}.jer-hyperlink{text-decoration:underline}.jer-input-text{font-family:inherit;font-size:.9em;height:1.4em;line-height:1.2em;margin:0;min-width:6em;overflow:hidden;padding:.25em .5em .2em;resize:none}.jer-input-boolean{margin-left:.3em;margin-right:.3em;transform:scale(1.5)}.jer-key-text{line-height:1.1em;white-space:pre-wrap;word-break:break-word}.jer-key-edit{font-size:inherit;font-size:.9em;padding:0 .3em}.jer-value-invalid{font-style:italic;opacity:.5}.jer-input-number{font-size:90%;min-width:3em}.jer-confirm-buttons,.jer-edit-buttons{align-items:center;cursor:pointer;display:flex;height:1em}.jer-input-buttons{gap:.4em}.jer-edit-buttons{gap:.4em;margin-left:.5em;opacity:0}.jer-confirm-buttons{gap:.2em;margin-left:.4em}.jer-edit-buttons:hover{opacity:1;position:relative}.jer-collection-header-row:hover>.jer-edit-buttons,.jer-value-and-buttons:hover>.jer-edit-buttons,.jer-value-main-row:hover>.jer-edit-buttons{opacity:1}.jer-copy-pulse{position:relative;transition:transform var(--jer-expand-transition-time)}.jer-copy-pulse:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-copy-pulse:after{border-radius:50%;box-shadow:0 0 15px 5px var(--jer-icon-copy-color);content:"";display:block;height:100%;left:0;opacity:0;position:absolute;top:0;transition:all .5s;width:100%}.jer-copy-pulse:active:after{border-radius:4em;box-shadow:0 0 0 0 var(--jer-icon-copy-color);left:0;opacity:1;position:absolute;top:0;transition:0s}.jer-copy-pulse:active{top:.07em}.jer-rotate-90{transform:rotate(-90deg)}.jer-accordion-icon,.jer-rotate-90{transition:transform var(--jer-expand-transition-time)}.jer-icon:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-empty-string:after{content:"<empty string>:";font-size:90%;font-style:italic}.jer-drag-n-drop-padding{border:1px dashed #e0e0e0;border-radius:.3em;height:.5em}.jer-clickzone{height:calc(100% - .8em);left:-1em;position:absolute;top:1.2em}',{});const be=({data:e,setData:n,rootName:r="root",onUpdate:o=(()=>{}),onEdit:d=o,onDelete:u=o,onAdd:g=o,onChange:h,onError:y,showErrorMessages:b=!0,enableClipboard:f=!0,indent:v=2,collapse:j=!1,collapseAnimationTime:E=300,showCollectionCount:w=!0,restrictEdit:k=!1,restrictDelete:O=!1,restrictAdd:S=!1,restrictTypeSelection:x=!1,restrictDrag:N=!0,searchFilter:A,searchText:T,searchDebounceTime:R=350,keySort:V=!1,showArrayIndices:z=!0,showStringQuotes:F=!0,defaultValue:M=null,minWidth:K=250,maxWidth:I="min(600px, 90vw)",rootFontSize:L,stringTruncate:B=250,translations:W={},className:G,id:U,customText:H={},customNodeDefinitions:Y=[],customButtons:$=[],jsonParse:J=JSON.parse,jsonStringify:X=(e=>JSON.stringify(e,null,2)),TextEditor:Z,errorMessageTimeout:Q=2500,keyboardControls:q={},insertAtTop:ee=!1})=>{const{getStyles:te}=P(),{setCurrentlyEditingElement:ne}=_(),re=c(je(j),[j]),oe=c(me(W,H),[W,H]),[ae,ie]=a(T),[le,ce]=(({setData:e,data:t})=>{const[n,r]=a(e?void 0:t),o=c((t=>{e?e(t):r(t)}),[e]);return l((()=>{e||r(t)}),[t]),[e?t:n,o]})({setData:n,data:e}),de=i(null);l((()=>{ne(null);const e=setTimeout((()=>ie(T)),R);return()=>clearTimeout(e)}),[T,R]);const ue={key:r,path:[],level:0,index:0,value:le,size:"object"==typeof le&&null!==le?Object.keys(le).length:1,parentData:null,fullData:le},ge=(e,t)=>p(void 0,void 0,void 0,(function*(){const n=yield e(t);if(!0===n||void 0===n)return void ce(t.newData);const r=De(n)?n:["error",n],[o,a]=r;if("error"===o)return ce(t.currentData),!1===a?oe("ERROR_UPDATE",ue):String(a);ce(a)})),he=s((()=>je(k)),[k]),ye=s((()=>je(O)),[O]),be=s((()=>je(S)),[S]),fe=s((()=>je(N)),[N]),we=s((()=>Ee(A)),[A]),Ce=s((()=>(e=>{const t=Object.assign({},C);for(const n of Object.keys(C)){const r=n;if(e[r]){const o=e[r],a=["clipboardModifier","collapseModifier"].includes(n)?Array.isArray(o)?o:[o]:"string"==typeof o?{key:o}:o;t[r]=a,["stringConfirm","numberConfirm","booleanConfirm"].forEach((n=>{!e[n]&&e.confirm&&(t[n]=t.confirm)}))}}return t})(q)),[q]),ke=c(((e,t)=>((e,t,n)=>{const r=Object.entries(t);for(const[t,o]of r)if(D(n,e[t],t)){n.preventDefault(),o();break}})(Ce,t,e)),[q]),Oe=c(((e,t)=>{!1!==V&&("function"!=typeof V?e.sort(((e,n)=>{const r=t(e)[0],o=t(n)[0];return r<o?-1:r>o?1:0})):e.sort(((e,n)=>V(t(e),t(n)))))}),[V]),Se={mainContainerRef:de,name:r,nodeData:ue,onEdit:(e,t)=>p(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=ve(le,t,e,"update");if(o!==a)return yield ge(d,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onDelete:(e,t)=>p(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:a}=ve(le,t,e,"delete");return yield ge(u,{currentData:n,newData:r,currentValue:o,newValue:a,name:t.slice(-1)[0],path:t})})),onAdd:(e,t,n)=>p(void 0,void 0,void 0,(function*(){const{currentData:r,newData:o,currentValue:a,newValue:i}=ve(le,t,e,"add",n);return yield ge(g,{currentData:r,newData:o,currentValue:a,newValue:i,name:t.slice(-1)[0],path:t})})),onChange:h,onError:y,showErrorMessages:b,onMove:(e,t,n)=>p(void 0,void 0,void 0,(function*(){if(null===e)return;const{currentData:r,newData:o,currentValue:a}=ve(le,e,"","delete"),i=e.slice(-1)[0],l=t.slice(0,-1),s=t.slice(-1)[0];let c="number"==typeof s?"above"===n?s:s+1:"number"==typeof i?`arr_${i}`:i;e.slice(0,-1).join(".")===t.slice(0,-1).join(".")&&"number"==typeof i&&"number"==typeof c&&i<c&&(c-=1);const u="number"==typeof c?{insert:!0}:"above"===n?{insertBefore:s}:{insertAfter:s},{newData:p,newValue:g}=ve(o,[...l,c],a,"add",u);return yield ge(d,{currentData:r,newData:p,currentValue:a,newValue:g,name:t.slice(-1)[0],path:t})})),showCollectionCount:w,collapseFilter:re,collapseAnimationTime:E,restrictEditFilter:he,restrictDeleteFilter:ye,restrictAddFilter:be,restrictTypeSelection:x,restrictDragFilter:fe,canDragOnto:!1,searchFilter:we,searchText:ae,enableClipboard:f,keySort:V,sort:Oe,showArrayIndices:z,showStringQuotes:F,indent:v,defaultValue:M,stringTruncate:B,translate:oe,customNodeDefinitions:Y,customButtons:$,parentData:null,jsonParse:J,jsonStringify:X,TextEditor:Z,errorMessageTimeout:Q,handleKeyboard:ke,keyboardControls:Ce,insertAtTop:{object:!0===ee||"object"===ee,array:!0===ee||"array"===ee}},xe=Object.assign(Object.assign({},te("container",ue)),{minWidth:K,maxWidth:I});return xe.fontSize=null!=L?L:xe.fontSize,t("div",{id:U,ref:de,className:`jer-editor-container ${null!=G?G:""}`,style:xe,children:m(le)?t(pe,Object.assign({data:le},Se)):t(se,Object.assign({data:le,showLabel:!0},Se))})},fe=e=>{var n;const[r,o]=a();l((()=>{const e=document.documentElement;o(e)}),[]);const{collapseAnimationTime:i=300}=e;if(!r)return null;const s=getComputedStyle(r).getPropertyValue("--jer-expand-transition-time");return 1e3*parseFloat(s)!==i&&r.style.setProperty("--jer-expand-transition-time",i/1e3+"s"),t(T,{theme:null!==(n=e.theme)&&void 0!==n?n:N,icons:e.icons,docRoot:r,children:t(K,{children:t(be,Object.assign({},e))})})},ve=(e,t,n,r,o={})=>{if(0===t.length)return{currentData:e,newData:n,currentValue:e,newValue:n};const a=Object.assign({remove:"delete"===r},o),i="add"!==r?u(e,t):void 0;return{currentData:e,newData:d(e,t,n,a),currentValue:i,newValue:"delete"!==r?n:void 0}},je=e=>"boolean"==typeof e?()=>e:"number"==typeof e?({level:t})=>t>=e:e,Ee=e=>{if(void 0!==e)return"value"===e?b:"key"===e?f:"all"===e?(e,t)=>b(e,t)||f(e,t):e},De=e=>Array.isArray(e)&&2===e.length&&["error","value"].includes(e[0]),we=({value:n,setIsEditing:r,getStyles:o,customNodeProps:a,nodeData:i})=>{var l,s;const c=null!==(l=null==a?void 0:a.stringTruncate)&&void 0!==l?l:100,d=o("string",i);return t("div",{onDoubleClick:()=>r(!0),onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&r(!0)},className:"jer-value-string jer-hyperlink",style:d,children:e("a",{href:n,target:"_blank",rel:"noreferrer",style:{color:null!==(s=d.color)&&void 0!==s?s:void 0},children:['"',v(n,c),'"']})})},Ce={condition:({value:e})=>"string"==typeof e&&/^https?:\/\/.+\..+$/.test(e),element:we,showOnView:!0,showOnEdit:!1},ke={displayName:"Github Dark",styles:{container:{backgroundColor:"#0d1117",color:"white"},dropZone:"rgba(165, 214, 255, 0.17)",property:"#E6EDF3",bracket:"#56d364",itemCount:"#8B949E",string:"#A5D6FF",number:"#D2A8FF",boolean:{color:"#FF7B72",fontSize:"90%",fontWeight:"bold"},null:"green",iconCollection:"#D2A8FF",iconEdit:"#D2A8FF",iconDelete:"rgb(203, 75, 22)",iconAdd:"rgb(203, 75, 22)",iconCopy:"#A5D6FF",iconOk:"#56d364",iconCancel:"rgb(203, 75, 22)"}},Oe={displayName:"Github Light",styles:{container:"white",property:"#1F2328",bracket:"#00802e",itemCount:"#8B949E",string:"#0A3069",number:"#953800",boolean:{color:"#CF222E",fontSize:"90%",fontWeight:"bold"},null:"#FF7B72",iconCollection:"#8250DF",iconEdit:"#8250DF",iconDelete:"rgb(203, 75, 22)",iconAdd:"#8250DF",iconCopy:"#57606A"}},Se={displayName:"Black & White",fragments:{lightText:{color:"white"},midGrey:"#5c5c5c"},styles:{container:["lightText",{backgroundColor:"black"}],dropZone:"#e0e0e029",property:"lightText",bracket:"midGrey",itemCount:"#4a4a4a",string:"#a8a8a8",number:"#666666",boolean:{color:"#848484",fontStyle:"italic"},null:"#333333",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},xe={fragments:{midGrey:"#a3a3a3"},displayName:"White & Black",styles:{container:"white",property:"black",bracket:"midGrey",itemCount:"#b5b5b5",string:"#575757",number:"#999999",boolean:{color:"#7b7b7b",fontStyle:"italic"},null:"#cccccc",iconCollection:"midGrey",iconEdit:"midGrey",iconDelete:"midGrey",iconAdd:"midGrey",iconCopy:"midGrey",iconOk:"midGrey",iconCancel:"midGrey"}},Ne={displayName:"Candy Wrapper",fragments:{minty:{backgroundColor:"#F1FAEE"},pale:{color:"#A8DADC"},mid:{color:"#457B9D"},dark:{color:"#1D3557"},pop:{color:"#E63946"},darkBlue:{color:"#2B2D42"}},styles:{container:"minty",property:"pop",dropZone:"#eb121217",bracket:"dark",itemCount:"pale",string:"mid",number:["darkBlue",{fontSize:"85%"}],boolean:["mid",{fontStyle:"italic",fontWeight:"bold",fontSize:"80%"}],null:["#cccccc",{fontWeight:"bold"}],input:{border:"1px solid rgb(115, 194, 198)"},iconCollection:"#1D3557",iconEdit:"#457B9D",iconDelete:"#E63946",iconAdd:"#2B2D42",iconCopy:"#1D3557",iconCancel:"#E63946"}},Ae={displayName:"Psychedelic",fragments:{pale:{color:"#A8DADC"},fluroYellow:"rgb(242, 228, 21)",fluroGreen:"rgb(68, 255, 62)",hotPink:"#f7379a"},styles:{container:{backgroundColor:"unset",background:"linear-gradient(90deg, hsla(333, 100%, 53%, 1) 0%, hsla(33, 94%, 57%, 1) 100%)",color:"black"},dropZone:"fluroYellow",property:"black",bracket:"fluroYellow",itemCount:["pale",{opacity:.7}],string:"white",number:["#33d9ff",{fontSize:"90%",fontWeight:"bold"}],boolean:["fluroGreen",{fontWeight:"bold",fontSize:"80%"}],null:["black",{fontWeight:"bold",opacity:.3,backgroundColor:"rgb(255, 255, 255, 0.5)",padding:"0 0.4em",borderRadius:"0.4em"}],iconCollection:"fluroYellow",iconEdit:["black"],iconDelete:["white",{opacity:.5}],iconAdd:["white",{opacity:.5}],iconCopy:"rgb(32, 84, 242)",iconOk:"fluroGreen",iconCancel:"hotPink"}};export{H as IconAdd,Z as IconCancel,Q as IconChevron,J as IconCopy,$ as IconDelete,Y as IconEdit,X as IconOk,fe as JsonEditor,we as LinkCustomComponent,Ce as LinkCustomNodeDefinition,Ne as candyWrapperTheme,N as defaultTheme,ke as githubDarkTheme,Oe as githubLightTheme,m as isCollection,b as matchNode,f as matchNodeKey,Se as monoDarkTheme,xe as monoLightTheme,Ae as psychedelicTheme,v as truncate};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "json-edit-react",
3
- "version": "1.21.2",
3
+ "version": "1.22.0",
4
4
  "description": "React component for editing or viewing JSON/object data",
5
5
  "main": "build/index.cjs.js",
6
6
  "module": "build/index.esm.js",