json-edit-react 1.21.2 → 1.22.1

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 +147 -78
  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)
@@ -110,60 +118,96 @@ It's pretty self explanatory (click the "edit" icon to edit, etc.), but there ar
110
118
  - Drag and drop items to change the structure or modify display order
111
119
  - JSON text input can accept "looser" input, if an additional JSON parsing method is provided (e.g. [JSON5](https://json5.org/)). See `jsonParse` prop.
112
120
 
121
+ [Have a play with the Demo app](https://carlosnz.github.io/json-edit-react/) to get a feel for it!
122
+
113
123
  ## Props overview
114
124
 
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. | |
125
+ The only *required* property is `data` (although you will need to provide a `setData` method to update your data).
126
+
127
+ ### Data management
128
+
129
+ | Prop | Type | Default | Description |
130
+ | ----------------- | ----------------------- | ------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
131
+ | `data` | `object\|array` | none | The data to be displayed / edited |
132
+ | `setData` | `object\|array => void` | none | Method to update your `data` object. See [Managing state](#managing-state) below for additional notes. |
133
+ | `onUpdate` | `UpdateFunction` | none | A function to run whenever a value is **updated** (edit, delete *or* add) in the editor. See [Update functions](#update-functions). |
134
+ | `onEdit` | `UpdateFunction` | none | A function to run whenever a value is **edited**. |
135
+ | `onDelete` | `UpdateFunction` | none | A function to run whenever a value is **deleted**. |
136
+ | `onAdd` | `UpdateFunction` | none | A function to run whenever a new property is **added**. |
137
+ | `onChange` | `OnChangeFunction` | none | A function to modify/constrain user input as they type — see [OnChange functions](#onchange-function). |
138
+ | `onError` | `OnErrorFunction` | none | A function to run whenever the component reports an error — see [OnErrorFunction](#onerror-function). |
139
+ | `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) |
140
+
141
+
142
+ ### Restricting editing
143
+
144
+ | Prop | Type | Default | Description |
145
+ | ----------------------- | ----------------------------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
146
+ | `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) |
147
+ | `restrictDelete` | `boolean\|FilterFunction` | `false` | As with `restrictEdit` but for deletion |
148
+ | `restrictAdd` | `boolean\|FilterFunction` | `false` | As with `restrictEdit` but for adding new properties |
149
+ | `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) |
150
+ | `restrictDrag` | `boolean\|FilterFunction` | `true` | Set to `false` to enable drag and drop functionality — see [Drag-n-drop](#drag-n-drop) |
151
+
152
+ ### Look and Feel / UI
153
+
154
+ | Prop | Type | Default | Description |
155
+ | ----------------------- | --------------------------------- | --------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
156
+ | `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). |
157
+ | `icons` | `{[iconName]: JSX.Element, ... }` | `{ }` | Replace the built-in icons by specifying them here — see [Themes](#themes--styles). | |
158
+ | `indent` | `number` | `3` | Specify the amount of indentation for each level of nesting in the displayed data. |
159
+ | `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). |
160
+ | `collapseAnimationTime` | `number` | `300` | Time (in milliseconds) for the transition animation when collapsing collection nodes. |
161
+ | `rootName` | `string` | `"data"` | A name to display in the editor as the root of the data object. |
162
+ | `showArrayIndices` | `boolean` | `true` | Whether or not to display the index (as a property key) for array elements. |
163
+ | `showStringQuotes` | `boolean` | `true` | Whether or not to display string values in "quotes". |
164
+ | `showCollectionCount` | `boolean\|"when-closed"` | `true` | Whether or not to display the number of items in each collection (object or array). |
165
+ | `stringTruncate` | `number` | `250` | String values longer than this many characters will be displayed truncated (with `...`). The full string will always be visible when editing. |
166
+ | `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` |
167
+ | `minWidth` | `number\|string` (CSS value) | `250` | Minimum width for the editor container. |
168
+ | `maxWidth` | `number\|string` (CSS value) | `600` | Maximum width for the editor container. |
169
+ | `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. |
170
+ | `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. | |
171
+ | `errorMessageTimeout` | `number` | `2500` | Time (in milliseconds) to display the error message in the UI. | |
172
+ | `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) |
173
+
174
+
175
+ ### Search and Filtering
176
+
177
+ | Prop | Type | Default | Description |
178
+ | -------------------- | --------------------------------------------- | ----------- | --------------------------------------------------------------------------------------------------------------- |
179
+ | `searchText` | `string` | `undefined` | Data visibility will be filtered by matching against value, using the method defined below in `searchFilter` |
180
+ | `searchFilter` | `"key"\|"value"\|"all"\|SearchFilterFunction` | `undefined` | Define how `searchText` should be matched to filter the visible items. See [Search/Filtering](#searchfiltering) |
181
+ | `searchDebounceTime` | `number` | `350` | Debounce time when `searchText` changes |
182
+
183
+
184
+ ### Custom components & overrides (incl. Localisation)
185
+
186
+ | Prop | Type | Default | Description |
187
+ | ----------------------- | --------------------------------- | ----------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
188
+ | `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)) |
189
+ | `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) |
190
+ | `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) |
191
+ | `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. |
192
+ | `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) |
193
+ | `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/) |
194
+ | `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. |
195
+ | `keyboardControls` | `KeyboardControls` | As explained [above](#usage) | Override some or all of the keyboard controls. See [Keyboard customisation](#keyboard-customisation) for details. | |
196
+
197
+ ### Miscellaneous
198
+
199
+ | Prop | Type | Default | Description |
200
+ | -------------- | --------------------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
201
+ | `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.) |
202
+ | `id` | `string` | none | Name for the HTML `id` attribute on the main component container. |
203
+ | `className` | `string` | none | Name of a CSS class to apply to the overall component. In most cases, specifying `theme` properties will be more straightforward. |
204
+
205
+
206
+ ----
163
207
 
164
208
  ## Managing state
165
209
 
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`.
210
+ 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
211
 
168
212
  ## Update functions
169
213
 
@@ -240,29 +284,18 @@ Normally, the component will display simple error messages whenever an error con
240
284
  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
285
 
242
286
  ```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)
287
+ key // name of the property being copied
288
+ path // path to the property
289
+ value // the value copied to the clipboard
290
+ type // Either "path" or "value" depending on whether "Cmd/Ctrl" was pressed
291
+ stringValue // A nicely stringified version of `value`
292
+ // (i.e. what the clipboard actually receives)
293
+ success // true/false -- whether clipboard copy action actually succeeded
294
+ errorMessage // Error detail if `success === false`
249
295
  ```
250
296
 
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.
252
-
253
- ### Custom Buttons
297
+ 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.
254
298
 
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
299
 
267
300
  ## Filter functions
268
301
 
@@ -286,6 +319,8 @@ The function receives the following object:
286
319
 
287
320
  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
321
 
322
+ ### TypeFilterFunction
323
+
289
324
  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
325
  - `"string"`
291
326
  - `"number"`
@@ -384,9 +419,6 @@ return
384
419
 
385
420
  ### Drag-n-drop
386
421
 
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
422
  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
423
 
392
424
  - 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 +428,26 @@ The `restrictDrag` property controls which items (if any) can be dragged into ne
396
428
  - 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
429
  - 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
430
 
431
+ ## Full object editing
432
+
433
+ 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:
434
+
435
+ - `value: string` — the current text
436
+ - `onChange: (value: string) => void` — should be called on every keystroke to update `value`
437
+ - `onKeyDown: (e: React.KeyboardEvent) => void` — should be called on every keystroke to detect "Accept"/"Cancel" keys
438
+
439
+ 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:
440
+
441
+ <img width="800" alt="Text editor comparison" src="image/text-editor-comparison.png">
442
+
443
+ See the codebase for the exact implementation details:
444
+
445
+ - [Simple component that wraps CodeMirror](https://github.com/CarlosNZ/json-edit-react/blob/main/demo/src/CodeEditor.tsx)
446
+ - [Prop passed to json-edit-react](https://github.com/CarlosNZ/json-edit-react/blob/d6e3c39d1fe876fa8ed267301ebecf128132b602/demo/src/App.tsx#L450-L465)
447
+
399
448
  ## Search/Filtering
400
449
 
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").
450
+ 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
451
 
403
452
  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
453
 
@@ -443,7 +492,7 @@ const MyApp = () => {
443
492
  }
444
493
  ```
445
494
 
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):
495
+ 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
496
  - `githubDarkTheme`
448
497
  - `githubLightTheme`
449
498
  - `monoDarkTheme`
@@ -491,7 +540,7 @@ However, you can pass in your own theme object, or part thereof. The theme struc
491
540
  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
541
  - a `string`, in which case it is interpreted as the colour (or background colour in the case of `container` and `inputHighlight`)
493
542
  - 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.
543
+ - 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
544
  - 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
545
 
497
546
  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 +603,7 @@ iconEdit: [ "iconAdjust", "anotherFragment", { marginLeft: "1em" } ]
554
603
 
555
604
  ### A note about sizing and scaling
556
605
 
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.
606
+ 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
607
 
559
608
  ### Icons
560
609
 
@@ -686,6 +735,20 @@ customText = {
686
735
  }
687
736
  ```
688
737
 
738
+ ## Custom Buttons
739
+
740
+ 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:
741
+
742
+ ```ts
743
+ {
744
+ Element: React.FC<{ nodeData: NodeData }>,
745
+ onClick?: (nodeData: NodeData, e: React.MouseEvent) => void
746
+ }
747
+ ```
748
+ Where `NodeData` is the same data structure received by the previous "Update Functions".
749
+
750
+ The `onClick` is optional -- don't provide it if you have your own `onClick` handler within your button component.
751
+
689
752
  ## Keyboard customisation
690
753
 
691
754
  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:
@@ -700,6 +763,8 @@ The default keyboard controls are [outlined above](#usage), but it's possible to
700
763
  numberConfirm: 'Enter',
701
764
  numberUp: 'ArrowUp',
702
765
  numberDown: 'ArrowDown',
766
+ tabForward: 'Tab',
767
+ tabBack: { key: 'Tab', modifier: 'Shift' },
703
768
  booleanConfirm: 'Enter',
704
769
  booleanToggle: ' ', // Space bar
705
770
  clipboardModifier: ['Meta', 'Control'],
@@ -749,7 +814,6 @@ A few helper functions, components and types that might be useful in your own im
749
814
 
750
815
  ### Types
751
816
 
752
- - `ThemeName`: string literal list of built-in theme names
753
817
  - `Theme`: a full [Theme](#themes--styles) object
754
818
  - `ThemeInput`: input type for the `theme` prop
755
819
  - `JsonEditorProps`: all input props for the Json Editor component
@@ -762,6 +826,7 @@ A few helper functions, components and types that might be useful in your own im
762
826
  - `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
827
  - `DataType`: `"string"` | `"number"` | `"boolean"` | `"null"` | `"object"` | `"array"`
764
828
  - `KeyboardControls`: structure for [keyboard customisation](#keyboard-customisation) prop
829
+ - `TextEditorProps`: props for custom [Text Editor](#full-object-editing)
765
830
 
766
831
  ## Issues, bugs, suggestions?
767
832
 
@@ -780,6 +845,10 @@ This component is heavily inspired by [react-json-view](https://github.com/mac-s
780
845
 
781
846
  ## Changelog
782
847
 
848
+ - **1.22.1**: Fix custom nodes not re-calculating condition when `data` changes
849
+ - **1.22.0**:
850
+ - Option for [custom text/code editor](#full-object-editing) when editing full JSON object [#157](https://github.com/CarlosNZ/json-edit-react/issues/157)
851
+ - 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
852
  - **1.21.1**: Users can now navigate between nodes using "Tab"/"Shift-Tab" key
784
853
  - **1.20.0**: Refactor out direct access of global `document` object, which allows component to work with server-side rendering
785
854
  - **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)),[y]),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;line-height:1.1em}.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)),[j]),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;line-height:1.1em}.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.1",
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",