json-edit-react
Version:
React component for editing or viewing JSON/object data
1 lines • 55.3 kB
JavaScript
"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){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}function i(e,t,n,r){return new(n||(n=Promise))((function(o,i){function a(e){try{l(r.next(e))}catch(e){i(e)}}function s(e){try{l(r.throw(e))}catch(e){i(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(a,s)}l((r=r.apply(e,t||[])).next())}))}"function"==typeof SuppressedError&&SuppressedError;const a=({className:t,name:n,value:r,setValue:o,handleKeyPress:i,styles:a,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"},a),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:i}),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"},a),children:l})]})},s=e=>null!==e&&"object"==typeof e,l=(e,t,n,r="")=>{if(!n&&!r)return!0;switch(e){case"collection":if(n){if(n(t,r))return!0;if(!c(r,t,n))return!1}if(!n&&r&&!c(r,t))return!1;break;case"value":if(n&&!n(t,r))return!1;if(!n&&r&&!d(t,r))return!1}return!0},c=(e="",t,n=d)=>{const r=t.value;return Object.entries(r).some((([o,i])=>{const a=[...t.path,o],l=Object.assign(Object.assign({},t),{key:o,path:a,level:t.level+1,value:i,size:a.length,parentData:r});return s(i)?c(e,l,n):n(l,e)}))},d=(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}},u=({key:e,path:t},n="")=>!!d({value:e},n)||!!t.some((e=>d({value:e},n))),p=(e,t)=>(null!=t?t:"")+e.map((e=>""===e?String.fromCharCode(0):e)).join("."),g=e=>e.shiftKey?"Shift":e.metaKey?"Meta":e.ctrlKey?"Control":e.altKey?"Alt":void 0,m=(e,t,n)=>{const r=e.key,o=g(e);if(Array.isArray(t))return!!o&&t.includes(o);const{key:i,modifier:a}=t;return("stringLineBreak"!==n||"Enter"!==r||"Shift"!==o||"Enter"!==i||!(null==a?void 0:a.includes("Shift")))&&(r===i&&(a===o||Array.isArray(a)&&a.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 i=t.slice(0,t.length-1),a=t.slice(-1)[0];if(void 0===a)return null;const l=r(e,i),c=j(l);Array.isArray(l)||o(c,(({key:e,value:t})=>[e,t]));const d=c.findIndex((e=>e.key===a)),u=c[d+("next"===n?1:-1)];return u?s(u.value)?0===Object.keys(u.value).length?f(e,[...i,u.key],n,o):b(e,[...i,u.key],n,o):[...i,u.key]:0===i.length?null:f(e,i,n,o)},b=(e,t,n="next",o)=>{const i=r(e,t);if(!s(i))return t;const a=Array.isArray(i)?i.map(((e,t)=>t)):Object.keys(i);o(a,(e=>[e,i]));const l="next"===n?a[0]:a[a.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,i;const a=e.current,s=null!==(n=null==a?void 0:a.selectionStart)&&void 0!==n?n:1/0,l=null!==(r=null==a?void 0:a.selectionEnd)&&void 0!==r?r:1/0,c=(null===(o=null==a?void 0:a.textContent)||void 0===o?void 0:o.slice(0,s))+t+(null===(i=null==a?void 0:a.textContent)||void 0===i?void 0:i.slice(l));return a.value=c,null==a||a.setSelectionRange(s+1,s+1),c},E=e=>{if(e!==x){if(Array.isArray(e))return e.map((e=>E(e)));if(e&&"object"==typeof e)for(const t in e)e[t]=E(e[t]);return e}},x="__undefined__",C={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)"}},D=t.createContext({getStyles:()=>({}),icons:{}}),w=({theme:t=C,icons:n={},docRoot:r,children:o})=>{const i=O(t,r);return e.jsx(D.Provider,{value:{getStyles:(e,t)=>"function"==typeof i[e]?i[e](t):i[e],icons:n},children:o})},k=()=>t.useContext(D),O=(e,t)=>{var n,r,o,i;const a={},s=(Array.isArray(e)?e:[e]).map((e=>N(e)?S({fragments:{},styles:e},a):S(e,a))),l=S(C,{});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(a).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===(i=null==c?void 0:c.iconCopy)||void 0===i?void 0:i.color),c},S=(e,t)=>{const{fragments:n,styles:r}=e,o={};return Object.entries(r).forEach((([e,r])=>{const i=(Array.isArray(r)?r:[r]).reduce(((r,o)=>{var i,a;if("function"==typeof o)return t[e]=o,Object.assign({},r);if("string"==typeof o){const t=null!==(i=null==n?void 0:n[o])&&void 0!==i?i:o;return"string"==typeof t?Object.assign(Object.assign({},r),{[null!==(a=T[e])&&void 0!==a?a:"color"]:t}):Object.assign(Object.assign({},r),t)}return Object.assign(Object.assign({},r),o)}),{});o[e]=i})),o},N=e=>!("styles"in e),T={container:"backgroundColor",collection:"backgroundColor",collectionInner:"backgroundColor",collectionElement:"backgroundColor",dropZone:"borderColor",inputHighlight:"backgroundColor"},A=t.createContext(null),R=({children:n,onEditEvent:r,onCollapse:o})=>{const[i,a]=t.useState(null),[s,l]=t.useState(null),[c,d]=t.useState(null),[u,g]=t.useState({path:null,pathString:null}),m=t.useRef(null),h=t.useRef("next"),y=t.useRef(null);return e.jsx(A.Provider,{value:{collapseState:i,setCollapseState:e=>{a(e),o&&null!==e&&(Array.isArray(e)?e.forEach((e=>o(e))):o(e)),null!==e&&setTimeout((()=>a(null)),2e3)},getMatchingCollapseState:e=>{if(Array.isArray(i)){for(const t of i)if(K(e,t))return t;return null}return K(e,i)?i:null},currentlyEditingElement:s,setCurrentlyEditingElement:(e,t)=>{const n="string"==typeof e||null===e?e:p(e,"key"===t?"key_":void 0);null!==s&&null!==n&&null!==m.current&&m.current(),l(n),r&&(Array.isArray(e)||null===e)&&r(e,"key"===t),m.current="function"==typeof t?t:null},areChildrenBeingEdited:e=>null!==s&&s.includes(e),previouslyEditedElement:y.current,setPreviouslyEditedElement:e=>{y.current=e},tabDirection:h.current,setTabDirection:e=>{h.current=e},previousValue:c,setPreviousValue:d,dragSource:u,setDragSource:g},children:n})},P=()=>{const e=t.useContext(A);if(!e)throw new Error("Missing Context Provider");return e},K=(e,t)=>{if(null===t)return!1;if(!t.includeChildren)return t.path.every(((t,n)=>e[n]===t))&&t.path.length===e.length;for(const[n,r]of t.path.entries())if(r!==e[n])return!1;return!0},I="**INVALID_FUNCTION**",V=({nodeData:n,showStringQuotes:r=!0,stringTruncate:o=200,pathString:i,canEdit:a,setIsEditing:s,styles:l,translate:c,value:d,TextWrapper:u=({children:e})=>e})=>{const p=null!=d?d:n.value,[g,m]=t.useState(!1),h=r?'"':"",y=p.length>o,f=()=>{a?s(!0):m(!g)};return e.jsxs("div",{id:`${i}_display`,onDoubleClick:f,onClick:e=>{(e.getModifierState("Control")||e.getModifierState("Meta"))&&f()},className:"jer-value-string",style:l,children:[h,y?g?e.jsxs(e.Fragment,{children:[e.jsx(u,{children:e.jsxs("span",{children:[p,h]})}),e.jsxs("span",{className:"jer-string-expansion jer-show-less",onClick:()=>m(!1),children:[" ",c("SHOW_LESS",n)]})]}):e.jsxs(e.Fragment,{children:[e.jsxs(u,{children:[e.jsx("span",{children:p.slice(0,o-2).trimEnd()})," "]}),e.jsx("span",{className:"jer-string-expansion jer-ellipsis",onClick:()=>m(!0),children:"..."}),h]}):e.jsx(u,{children:`${p}${h}`})]})},M=({styles:n,pathString:r,value:o,setValue:i,handleEdit:s,handleKeyboard:l,keyboardCommon:c})=>{const d=t.useRef(null);return e.jsx(a,{className:"jer-input-text",textAreaRef:d,name:r,value:o,setValue:i,handleKeyPress:e=>{l(e,Object.assign({stringConfirm:s,stringLineBreak:()=>{const e=v(d,"\n");i(e)}},c))},styles:n})},_=t=>{var{isEditing:n,path:r,enumType:i}=t,a=o(t,["isEditing","path","enumType"]);const{getStyles:s}=k(),l=p(r),{value:c,setValue:d,nodeData:u,handleEdit:g,handleKeyboard:m,keyboardCommon:h}=a;return n&&i?e.jsxs("div",{className:"jer-select jer-select-enums",children:[e.jsx("select",{name:`${l}-value-select`,className:"jer-select-inner",onChange:e=>d(e.target.value),value:c,autoFocus:!0,onKeyDown:e=>{m(e,Object.assign({stringConfirm:g},h))},children:i.values.map((t=>e.jsx("option",{value:t,children:t},t)))}),e.jsx("span",{className:"focus"})]}):n?e.jsx(M,Object.assign({styles:s("input",u),pathString:l},a,{setValue:a.setValue})):e.jsx(V,Object.assign({pathString:l,styles:s("string",u)},a))},L=({value:t,setValue:n,isEditing:r,path:o,setIsEditing:i,handleEdit:a,nodeData:s,handleKeyboard:l,keyboardCommon:c})=>{const{getStyles:d}=k();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=>setTimeout((()=>e.target.select()),10),onKeyDown:e=>l(e,Object.assign({numberConfirm:a,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:()=>i(!0),className:"jer-value-number",style:d("number",s),children:t})},F=({value:t,setValue:n,isEditing:r,path:o,setIsEditing:i,handleEdit:a,nodeData:s,handleKeyboard:l,keyboardCommon:c})=>{const{getStyles:d}=k();return"boolean"!=typeof t?null: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:a,booleanToggle:()=>n(!t)},c))},autoFocus:!0}):e.jsx("span",{onDoubleClick:()=>i(!0),className:"jer-value-boolean",style:d("boolean",s),children:String(t)})},z=(e,n)=>{const r=t.useRef(void 0),o=t.useRef(n);t.useEffect((()=>{o.current=n}),[n]);const i=e=>{o.current(e)};t.useEffect((()=>{if(window.clearTimeout(r.current),e)return r.current=window.setTimeout((()=>{window.addEventListener("keydown",i)}),100),()=>{window.clearTimeout(r.current),window.removeEventListener("keydown",i)}}),[e])},B=({value:t,isEditing:n,setIsEditing:r,handleEdit:o,nodeData:i,handleKeyboard:a,keyboardCommon:s})=>{const{getStyles:l}=k();return z(n,(e=>a(e,Object.assign({confirm:o},s)))),e.jsx("div",{onDoubleClick:()=>r(!0),className:"jer-value-null",style:l("null",i),children:String(t)})},W=({value:t})=>{let n="Error!";switch(typeof t){case"string":t===I&&(n="Function");break;case"undefined":n="Undefined";break;case"symbol":n="Symbol"}return e.jsx("span",{className:"jer-value-invalid",children:n})},G=({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"})]}),Y=({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"})]}),H=({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"})}),U=({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"})]}),$=({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"})]}),Z=({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"})}),J=({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"})}),X=({name:t,nodeData:n})=>{var r,o,i,a,s,l,c;const{getStyles:d,icons:u}=k(),p={size:"1.4em",className:"jer-icon"};switch(t){case"add":return null!==(r=null==u?void 0:u.add)&&void 0!==r?r:e.jsx(G,Object.assign({},p,{style:d("iconAdd",n)}));case"edit":return null!==(o=null==u?void 0:u.edit)&&void 0!==o?o:e.jsx(Y,Object.assign({},p,{style:d("iconEdit",n)}));case"delete":return null!==(i=null==u?void 0:u.delete)&&void 0!==i?i:e.jsx(H,Object.assign({},p,{style:d("iconDelete",n),size:"1.45em"}));case"copy":return null!==(a=null==u?void 0:u.copy)&&void 0!==a?a:e.jsx(U,Object.assign({},p,{style:d("iconCopy",n),size:"1.2em"}));case"ok":return null!==(s=null==u?void 0:u.ok)&&void 0!==s?s:e.jsx($,Object.assign({},p,{style:Object.assign({fontSize:"90%"},d("iconOk",n))}));case"cancel":return null!==(l=null==u?void 0:u.cancel)&&void 0!==l?l:e.jsx(Z,Object.assign({},p,{style:Object.assign({fontSize:"130%"},d("iconCancel",n))}));case"chevron":return null!==(c=null==u?void 0:u.chevron)&&void 0!==c?c:e.jsx(J,{size:"1em",style:d("iconCollection",n)});default:return e.jsx(e.Fragment,{})}},q=({startEdit:n,handleDelete:o,handleAdd:i,enableClipboard:a,type:s,customButtons:l,nodeData:c,translate:d,keyboardControls:u,handleKeyboard:p,editConfirmRef:m,getNewKeyOptions:h,jsonStringify:y,onEditEvent:f,showIconTooltips:b})=>{const{getStyles:j}=k(),v=d("KEY_NEW",c),[E,x]=t.useState(v),[C,D]=t.useState(!1),{key:w,path:O,value:S}=c,N=Array.isArray(C),T=e=>{var t;if(f&&f(e?[...O,null]:null,e),!e)return void D(!1);const n=Object.keys(r(c.fullData,O)),o=h?null===(t=h(c))||void 0===t?void 0:t.filter((e=>!n.includes(e))):null;o&&x(""),D(null==o||o)};return e.jsxs("div",{className:"jer-edit-buttons",style:{opacity:C?1:void 0},onClick:e=>e.stopPropagation(),children:[a&&e.jsx("div",{onClick:e=>{var t;e.stopPropagation();let n,r,o="value",i="",s=null;if(a){const l=g(e);if(l&&u.clipboardModifier.includes(l)?(n=ee(O),i=n,o="path"):(n=S,i="object"==typeof n?y(S):String(n)),!navigator.clipboard)return void("function"==typeof a&&a({success:!1,value:n,stringValue:i,path:O,key:w,type:o,errorMessage:"Can't access clipboard API"}));null===(t=navigator.clipboard)||void 0===t||t.writeText(i).then((()=>r=!0)).catch((e=>{r=!1,s=e.message})).finally((()=>{"function"==typeof a&&a({success:r,errorMessage:s,value:n,stringValue:i,path:O,key:w,type:o})}))}},className:"jer-copy-pulse",title:b?d("TOOLTIP_COPY",c):"",children:e.jsx(X,{name:"copy",nodeData:c})}),n&&e.jsx("div",{onClick:n,title:b?d("TOOLTIP_EDIT",c):"",children:e.jsx(X,{name:"edit",nodeData:c})}),o&&e.jsx("div",{onClick:o,title:b?d("TOOLTIP_DELETE",c):"",children:e.jsx(X,{name:"delete",nodeData:c})}),i&&e.jsx("div",{onClick:()=>{"object"===s?T(!0):i("")},title:b?d("TOOLTIP_ADD",c):"",children:e.jsx(X,{name:"add",nodeData:c})}),null==l?void 0:l.map((({Element:t,onClick:n},r)=>e.jsx("div",{onClick:e=>n&&n(c,e),children:e.jsx(t,{nodeData:c})},r))),C&&i&&"object"===s&&e.jsxs(e.Fragment,{children:[N?e.jsxs("div",{className:"jer-select jer-select-keys",children:[e.jsxs("select",{name:"new-key-select",className:"jer-select-inner",onChange:e=>{i(e.target.value),T(!1)},defaultValue:"",autoFocus:!0,onKeyDown:e=>{p(e,{cancel:()=>T(!1)})},children:[e.jsx("option",{value:"",disabled:!0,children:C.length>0?d("KEY_SELECT",c):d("NO_KEY_OPTIONS",c)}),C.map((t=>e.jsx("option",{value:t,children:t},t)))]}),e.jsx("span",{className:"focus"})]}):e.jsx("input",{className:"jer-input-new-key",type:"text",name:"new-object-key",value:E,onChange:e=>x(e.target.value),autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>{p(e,{stringConfirm:()=>{i&&(T(!1),i(E),x(v))},cancel:()=>{T(!1),x(v)}})},style:j("input",c)}),e.jsx(Q,{onOk:()=>{N&&!E||(T(!1),i(E))},onCancel:()=>{T(!1)},nodeData:c,editConfirmRef:m,hideOk:N})]})]})},Q=({onOk:t,onCancel:n,nodeData:r,editConfirmRef:o,hideOk:i=!1})=>e.jsxs("div",{className:"jer-confirm-buttons",children:[!i&&e.jsx("div",{onClick:t,ref:o,children:e.jsx(X,{name:"ok",nodeData:r})}),e.jsx("div",{onClick:n,children:e.jsx(X,{name:"cancel",nodeData:r})})]}),ee=e=>e.reduce(((e,t)=>"number"==typeof t?`${e}[${t}]`:""===e?t:`${e}.${t}`),""),te=["string","number","boolean","null","object","array"],ne=({props:e,collapsed:n})=>{const{data:r,nodeData:o,parentData:i,onEdit:a,onError:s,showErrorMessages:l,restrictEditFilter:c,restrictDeleteFilter:d,restrictAddFilter:u,restrictDragFilter:g,translate:m,errorMessageTimeout:h}=e,{currentlyEditingElement:y,setCurrentlyEditingElement:f}=P(),[b,j]=t.useState(null),v=Object.assign(Object.assign({},o),{collapsed:n}),{path:E,key:x,size:C}=v,D=p(E),w=!c(v),k=!d(v),O=!u(v),S=!g(v)&&k&&null===y,N=e=>{l&&(j(e),setTimeout((()=>j(null)),h)),console.warn("Error",e)},T=t.useCallback(((e,t)=>{N(e.message),s&&s({currentData:v.fullData,errorValue:t,currentValue:r,name:x,path:E,error:e})}),[s,l]),A=y===D,R=y===`key_${D}`,K="number"==typeof E.slice(-1)[0],I={isEditing:A,isEditingKey:R,isArray:K,canEditKey:null!==i&&w&&O&&k&&!K},V=""===x&&E.length>0?m("EMPTY_STRING",v):null;return{pathString:D,nodeData:v,path:E,name:x,size:C,canEdit:w,canDelete:k,canAdd:O,canDrag:S,error:b,showError:N,onError:T,setError:j,handleEditKey:e=>{if(f(null),x===e)return;if(!i)return;const t=E.slice(0,-1);if(Object.keys(i).includes(e))return void T({code:"KEY_EXISTS",message:m("ERROR_KEY_EXISTS",v)},e);const n=Object.fromEntries(Object.entries(i).map((([t,n])=>t===x?[e,n]:[t,n])));a(n,t).then((t=>{t&&T({code:"UPDATE_ERROR",message:t},e)}))},derivedValues:I,emptyStringKey:V}},re=({canDrag:n,canDragOnto:r,path:o,nodeData:i,onMove:a,onError:s,translate:l})=>{const{getStyles:c}=k(),{dragSource:d,setDragSource:u}=P(),[g,m]=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,h]),f=t.useMemo((()=>e=>r?{onDragOver:e=>{e.stopPropagation(),e.preventDefault()},onDrop:t=>{t.stopPropagation(),j(e),u({path:null,pathString:null}),m(!1)},onDragEnter:t=>{var n;t.stopPropagation(),h.startsWith(null!==(n=d.pathString)&&void 0!==n?n:"")||m(e)},onDragExit:e=>{e.stopPropagation(),m(!1)}}:{}),[d,r,h]),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,o.length]),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}=i;"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",i)},r):a(d.path,o,e).then((e=>{e&&s({code:"UPDATE_ERROR",message:e},i.value)}))};return{dragSourceProps:y,getDropTargetProps:f,BottomDropTarget:b,DropTargetPadding:({position:t,nodeData:n})=>g===t?e.jsx("div",{className:"jer-drag-n-drop-padding",style:c("dropZone",n)}):null,handleDrop:j}},oe=(e,t,n,r)=>{var o,i,a;if(!t.current)return 0;const s=parseInt(null!==(o=getComputedStyle(n.current).getPropertyValue("line-height"))&&void 0!==o?o:"16px"),l=(null!==(a=null===(i=t.current)||void 0===i?void 0:i.offsetWidth)&&void 0!==a?a:0)/(.5*s),c=r(e).replace(/\\n/g,"\n").split("\n").map((e=>Math.ceil(e.length/l))).reduce(((e,t)=>e+t),0)*s;return Math.min(c+30,window.innerHeight-50)},ie=({isEditingKey:t,canEditKey:n,pathString:r,path:o,name:i,handleKeyboard:a,handleEditKey:s,handleCancel:l,handleClick:c,keyValueArray:d,styles:u,getNextOrPrevious:p,emptyStringKey:g})=>{const{setCurrentlyEditingElement:m}=P();return t?e.jsx("input",{className:"jer-input-text jer-key-edit",type:"text",name:r,defaultValue:i,autoFocus:!0,onFocus:e=>e.target.select(),onKeyDown:e=>a(e,{stringConfirm:()=>s(e.target.value),cancel:l,tabForward:()=>{if(s(e.target.value),d){const e=null==d?void 0:d[0][0];m(e?[...o,e]:p("next"))}else m(o)},tabBack:()=>{s(e.target.value),m(p("prev"))}}),style:{width:String(i).length/1.5+.5+"em"}}):e.jsxs("span",{className:"jer-key-text",style:Object.assign(Object.assign({},u),{minWidth:`${Math.min(String(i).length+1,5)}ch`,flexShrink:i.length>10?1:0}),onDoubleClick:()=>n&&m(o,"key"),onClick:c,children:[g?e.jsx("span",{className:"jer-empty-string",children:g}):i,""!==i||g?e.jsx("span",{className:"jer-key-colon",children:":"}):null]})},ae=n=>{const{data:r,parentData:o,onEdit:i,onDelete:a,onChange:s,onMove:c,enableClipboard:d,canDragOnto:u,restrictTypeSelection:p,searchFilter:g,searchText:m,showLabel:h,stringTruncate:y,showStringQuotes:b,indent:j,translate:v,customNodeDefinitions:E,customNodeData:x,handleKeyboard:C,keyboardControls:D,sort:w,editConfirmRef:O,jsonStringify:S,showIconTooltips:N}=n,{getStyles:T}=k(),{setCurrentlyEditingElement:A,setCollapseState:R,previouslyEditedElement:K,setPreviouslyEditedElement:V,tabDirection:M,setTabDirection:_,previousValue:L,setPreviousValue:F}=P(),[z,B]=t.useState("function"==typeof r?I:r),{pathString:W,nodeData:G,path:Y,name:H,canEdit:U,canDelete:$,canDrag:Z,error:J,onError:X,handleEditKey:ee,emptyStringKey:oe,derivedValues:ae}=ne({props:n}),{dragSourceProps:de,getDropTargetProps:ue,BottomDropTarget:pe,DropTargetPadding:ge}=re({canDrag:Z,canDragOnto:u,path:Y,nodeData:G,onMove:c,onError:X,translate:v}),[me,he]=t.useState(se(r,x)),ye=t.useCallback((e=>{if(!s)return void B(e);const t=s({currentData:G.fullData,newValue:e,currentValue:z,name:H,path:Y});B(t)}),[s]);t.useEffect((()=>{B("function"==typeof r?I:r),he(se(r,x))}),[r,J]);const{CustomNode:fe,customNodeProps:be,hideKey:je,showEditTools:ve=!0,showOnEdit:Ee,showOnView:xe,passOriginalNode:Ce}=x,De=[...te,...E.filter((({showInTypesSelector:e=!1,name:t})=>e&&!!t)).map((({name:e})=>e))],we=t.useMemo((()=>{if("boolean"==typeof p)return p?[]:De;if(Array.isArray(p))return p;const e=p(G);return"boolean"==typeof e?e?[]:De:e}),[G,p]),[ke,Oe]=t.useState(((e,t)=>{var n;if("string"!=typeof e)return null;const r=t.filter((t=>t instanceof Object&&t.enum&&t.values.includes(e)&&t.matchPriority));return r.sort(((e,t)=>{var n,r;return(null!==(n=t.matchPriority)&&void 0!==n?n:0)-(null!==(r=e.matchPriority)&&void 0!==r?r:0)})),null!==(n=r[0])&&void 0!==n?n:null})(z,we)),{isEditing:Se}=ae,Ne=l("value",G,g,m);if(Se&&(!Ne||!U)){const e=f(G.fullData,Y,M,w);A(e||K)}if(!Ne)return null;const Te=e=>{let t;if(A(null),F(null),void 0===e||(e=>e&&"object"==typeof e&&"type"in e&&"target"in e&&"preventDefault"in e&&"function"==typeof e.preventDefault)(e))switch(me){case"object":t={[v("DEFAULT_NEW_KEY",G)]:z};break;case"array":t=null!=z?z:[];break;case"number":{const e=Number(z);t=isNaN(e)?0:e;break}default:t=z}else t=e;i(t,Y).then((e=>{e&&X({code:"UPDATE_ERROR",message:e},t)}))},Ae=()=>{A(null),null===L?(B(r),F(null)):i(L,Y)},{isEditingKey:Re,canEditKey:Pe}=ae,Ke=!Se&&J,Ie=Se&&we.length>1,Ve=("invalid"!==me||fe)&&!J&&ve,Me=h&&!je,_e=fe&&(Se&&Ee||!Se&&xe),Le={value:z,parentData:o,setValue:ye,isEditing:Se,canEdit:U,setIsEditing:U?()=>A(Y):()=>{},handleEdit:Te,handleCancel:Ae,path:Y,stringTruncate:y,showStringQuotes:b,nodeData:G,enumType:ke,translate:v,handleKeyboard:C,keyboardCommon:{cancel:Ae,tabForward:()=>{_("next"),V(W);const e=f(G.fullData,Y,"next",w);e&&(Te(),A(e))},tabBack:()=>{_("prev"),V(W);const e=f(G.fullData,Y,"prev",w);e&&(Te(),A(e))}}},Fe={canEditKey:Pe,isEditingKey:Re,pathString:W,path:Y,name:H,handleKeyboard:C,handleEditKey:ee,handleCancel:Ae,styles:T("property",G),getNextOrPrevious:e=>f(G.fullData,Y,e,w),emptyStringKey:oe},ze=_e?e.jsx(fe,Object.assign({},n,{value:z,customNodeProps:be,setValue:ye,handleEdit:Te,handleCancel:Ae,handleKeyPress:e=>C(e,{stringConfirm:Te,cancel:Ae}),isEditing:Se,setIsEditing:()=>A(Y),getStyles:T,originalNode:Ce?le(r,Le):void 0,originalNodeKey:Ce?e.jsx(ie,Object.assign({},Fe)):void 0,canEdit:U,keyboardCommon:Le.keyboardCommon,onError:X})):le(r,Le);return e.jsxs("div",Object.assign({className:"jer-component jer-value-component",style:{marginLeft:null!==o?j/2+"em":0,position:"relative"},draggable:Z},de,ue("above"),{children:[pe,e.jsx(ge,{position:"above",nodeData:G}),e.jsxs("div",{className:"jer-value-main-row",style:{flexWrap:H.length>10?"wrap":"nowrap"},children:[Me&&e.jsx(ie,Object.assign({},Fe)),e.jsxs("div",{className:"jer-value-and-buttons",children:[e.jsx("div",{className:"jer-input-component",children:ze}),Se?e.jsx(Q,{onOk:Te,onCancel:Ae,nodeData:G,editConfirmRef:O}):Ve&&e.jsx(q,{startEdit:U?()=>{F(L),A(Y,Ae)}:void 0,handleDelete:$?()=>{a(z,Y).then((e=>{e&&X({code:"DELETE_ERROR",message:e},z)}))}:void 0,enableClipboard:d,translate:v,customButtons:n.customButtons,nodeData:G,handleKeyboard:C,keyboardControls:D,editConfirmRef:O,jsonStringify:S,showIconTooltips:N}),Ie&&e.jsxs("div",{className:"jer-select jer-select-types",children:[e.jsx("select",{name:`${H}-type-select`,className:"jer-select-inner",onChange:e=>(e=>{const t=E.find((t=>t.name===e));if(t)return i(t.defaultValue,Y),he(e),Oe(null),A(null),void R({path:Y,collapsed:!1,includeChildren:!1});const n=we.find((t=>t instanceof Object&&t.enum===e));if(n)return"string"==typeof z&&n.values.includes(z)||i(n.values[0],Y).then((e=>{e&&(X({code:"UPDATE_ERROR",message:e},r),A(null))})),void Oe(n);const r=ce(z,e,v("DEFAULT_NEW_KEY",G),(null==x?void 0:x.CustomNode)?v("DEFAULT_STRING",G):void 0);["string","number","boolean"].includes(e)||A(null),i(r,Y).then((e=>{e?(X({code:"UPDATE_ERROR",message:e},r),A(null)):Oe(null)}))})(e.target.value),value:ke?ke.enum:me,children:we.map((t=>t instanceof Object&&"enum"in t?e.jsx("option",{value:t.enum,children:t.enum},t.enum):e.jsx("option",{value:t,children:t},t)))}),e.jsx("span",{className:"focus"})]}),Ke&&e.jsx("span",{className:"jer-error-slug",style:T("error",G),children:J})]})]}),e.jsx(ge,{position:"below",nodeData:G})]}))},se=(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",le=(t,n)=>{const r=se(t),{value:o}=n;switch(r){case"string":return e.jsx(_,Object.assign({},n,{value:o}));case"number":return e.jsx(L,Object.assign({},n,{value:o}));case"boolean":return e.jsx(F,Object.assign({},n,{value:o}));case"null":return e.jsx(B,Object.assign({},n));default:return e.jsx(W,Object.assign({},n))}},ce=(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)}},de=(e=[],t)=>{const n=e.filter((({condition:e})=>e(t)));if(0===n.length)return{};const r=n[0],{element:i,wrapperElement:a,customNodeProps:s,wrapperProps:l,hideKey:c=!1,showEditTools:d=!0,showOnEdit:u=!1,showOnView:p=!0,showCollectionWrapper:g=!0}=r,m=o(r,["element","wrapperElement","customNodeProps","wrapperProps","hideKey","showEditTools","showOnEdit","showOnView","showCollectionWrapper"]);return Object.assign({CustomNode:i,CustomWrapper:a,customNodeProps:s,wrapperProps:l,hideKey:c,showEditTools:d,showOnEdit:u,showOnView:p,showCollectionWrapper:g},m)},ue=n=>{const{getStyles:r}=k(),{collapseState:o,setCollapseState:c,getMatchingCollapseState:d,currentlyEditingElement:u,setCurrentlyEditingElement:p,areChildrenBeingEdited:m,previousValue:h,setPreviousValue:y}=P(),{mainContainerRef:b,data:j,nodeData:E,parentData:x,showCollectionCount:C,onEdit:D,onAdd:w,onDelete:O,canDragOnto:S,collapseFilter:N,collapseAnimationTime:T,onMove:A,enableClipboard:R,onEditEvent:K,showIconTooltips:I,searchFilter:V,searchText:M,indent:_,sort:L,showArrayIndices:F,defaultValue:z,newKeyOptions:B,translate:W,customNodeDefinitions:G,customNodeData:Y,jsonParse:H,jsonStringify:U,TextEditor:$,keyboardControls:Z,handleKeyboard:J,insertAtTop:ee,onCollapse:te,editConfirmRef:se,collapseClickZones:le}=n,[ce,pe]=t.useState(U(j)),ge=N(E),{contentRef:me,isAnimating:he,maxHeight:ye,collapsed:fe,animateCollapse:be,cssTransitionValue:je}=((e,n,r,o,i)=>{const[a,s]=t.useState(r?0:void 0),[l,c]=t.useState(r),d=t.useRef(!1),u=t.useRef(null),p=t.useRef(0),g=t.useRef(0),m=n/1e3+"s",h=t.useCallback((t=>{var r,a;if(l!==t){switch(window.clearTimeout(g.current),d.current=!0,t){case!0:{const e=null!==(a=null===(r=u.current)||void 0===r?void 0:r.offsetHeight)&&void 0!==a?a:0;p.current=e,s(e),setTimeout((()=>{s(0)}),5);break}case!1:s(p.current||oe(e,u,o,i))}c(!l),g.current=window.setTimeout((()=>{d.current=!1,t||s(void 0)}),n)}}),[n,l,e,o,i]);return{contentRef:u,isAnimating:d.current,animateCollapse:h,maxHeight:a,collapsed:l,cssTransitionValue:m}})(j,T,ge,b,U),{pathString:ve,nodeData:Ee,path:xe,name:Ce,size:De,canEdit:we,canDelete:ke,canAdd:Oe,canDrag:Se,error:Ne,setError:Te,onError:Ae,handleEditKey:Re,emptyStringKey:Pe,derivedValues:Ke}=ne({props:n,collapsed:fe}),{dragSourceProps:Ie,getDropTargetProps:Ve,BottomDropTarget:Me,DropTargetPadding:_e}=re({canDrag:Se,canDragOnto:S,path:xe,nodeData:Ee,onMove:A,onError:Ae,translate:W}),Le=t.useRef(!ge),{isEditing:Fe,isEditingKey:ze,isArray:Be,canEditKey:We}=Ke;t.useEffect((()=>{pe(U(j))}),[j,U]),t.useEffect((()=>{const e=N(Ee)&&!Fe;Le.current=!e,be(e)}),[N]),t.useEffect((()=>{if(null!==o){const e=d(xe);e&&(Le.current=!0,be(e.collapsed))}}),[o]);const Ge=t.useRef(null),Ye=t.useCallback(((e,t)=>{if("function"!=typeof z)return z;const n=z(e,t);return void 0!==n?n:null}),[z]),He=t.useCallback((e=>B?"function"!=typeof B?B:B(e):null),[B]),{CustomNode:Ue,customNodeProps:$e,CustomWrapper:Ze,wrapperProps:Je={},hideKey:Xe,showEditTools:qe=!0,showOnEdit:Qe,showOnView:et,showCollectionWrapper:tt=!0}=Y,nt=m(ve);nt&&fe&&be(!1);if(!(l("collection",Ee,V,M)||0===Ee.level)&&!nt)return null;const rt=Array.isArray(j)?"array":"object",ot="array"===rt?{open:"[",close:"]"}:{open:"{",close:"}"},it=e=>{if("Tab"!==e.key||e.getModifierState("Shift"))J(e,{objectConfirm:st,cancel:ct});else{e.preventDefault();const t=v(Ge,"\t");pe(t)}},at=e=>{e.stopPropagation();const t=g(e);if(t&&Z.collapseModifier.includes(t))return Le.current=!0,void c({collapsed:!fe,path:xe,includeChildren:!0});u&&u.includes(ve)||(Le.current=!0,c(null),te&&te({path:xe,collapsed:!fe,includeChildren:!1}),be(!fe))},st=()=>{try{const e=H(ce);if(p(null),y(null),Te(null),U(e)===U(j))return;D(e,xe).then((t=>{t&&Ae({code:"UPDATE_ERROR",message:t},e)}))}catch(e){Ae({code:"INVALID_JSON",message:W("ERROR_INVALID_JSON",Ee)},ce)}},lt=xe.length>0?()=>{O(j,xe).then((e=>{e&&Ae({code:"DELETE_ERROR",message:e},j)}))}:void 0,ct=()=>{p(null),null===h?(Te(null),pe(U(j)),y(null)):D(h,xe)},dt="when-closed"===C?fe:C,ut=!Fe&&qe,pt=(F||!Be)&&!Xe&&void 0!==Ce,gt=Ue&&(Fe&&Qe||!Fe&&et),mt=Object.entries(j).map((([e,t])=>["array"===rt?Number(e):e,t]));"object"===rt&&L(mt,(e=>e));const ht=Le.current?Fe?e.jsxs("div",{className:"jer-collection-text-edit",children:[$?e.jsx($,{value:ce,onChange:pe,onKeyDown:e=>J(e,{objectConfirm:st,cancel:ct})}):e.jsx(a,{textAreaRef:Ge,className:"jer-collection-text-area",name:ve,value:ce,setValue:pe,handleKeyPress:it,styles:r("input",Ee)}),e.jsx("div",{className:"jer-collection-input-button-row",children:e.jsx(Q,{onOk:st,onCancel:ct,nodeData:Ee,editConfirmRef:se})})]}):mt.map((([t,o],i)=>{const a={key:t,value:o,path:[...xe,t],level:xe.length+1,index:i,size:s(o)?Object.keys(o).length:null,parentData:j,fullData:Ee.fullData},l=de(G,a);return e.jsx("div",{className:"jer-collection-element",style:r("collectionElement",a),children:s(o)&&!(null==l?void 0:l.renderCollectionAsValue)?e.jsx(ue,Object.assign({},n,{data:o,parentData:j,nodeData:a,showCollectionCount:C,canDragOnto:we,customNodeData:l}),t):e.jsx(ae,Object.assign({},n,{data:o,parentData:j,nodeData:a,canDragOnto:we,showLabel:"object"===rt||F,customNodeData:l}),t)},t)})):null,yt=!!tt&&(fe&&!nt);yt||(Le.current=!0);const ft=Object.assign(Object.assign({},n),{data:j,value:j,parentData:x,nodeData:Ee,setValue:e=>i(void 0,void 0,void 0,(function*(){return yield D(e,xe)})),handleEdit:st,handleCancel:ct,handleKeyPress:it,isEditing:Fe,setIsEditing:()=>p(xe),getStyles:r,canDragOnto:we,canEdit:we,keyboardCommon:{},onError:Ae}),bt=gt?e.jsx(Ue,Object.assign({customNodeProps:$e},ft,{children:ht})):ht,jt=ut&&e.jsx(q,{startEdit:we?()=>{Le.current=!0,y(null),p(xe)}:void 0,handleAdd:Oe?e=>{be(!1);const t=Ye(Ee,e);if("array"===rt){const e=ee.array?0:j.length,n=ee.array?{insert:!0}:{};w(t,[...xe,e],n).then((e=>{e&&Ae({code:"ADD_ERROR",message:e},t)}))}else if(e in j)Ae({code:"KEY_EXISTS",message:W("ERROR_KEY_EXISTS",Ee)},e);else{const n=ee.object?{insertBefore:0}:{};w(t,[...xe,e],n).then((e=>{e&&Ae({code:"ADD_ERROR",message:e},t)}))}}:void 0,handleDelete:ke?lt:void 0,enableClipboard:R,type:rt,nodeData:Ee,translate:W,customButtons:n.customButtons,keyboardControls:Z,handleKeyboard:J,getNewKeyOptions:He,editConfirmRef:se,jsonStringify:U,onEditEvent:K,showIconTooltips:I}),vt={canEditKey:We,isEditingKey:ze,pathString:ve,path:xe,name:Ce,handleKeyboard:J,handleEditKey:Re,handleCancel:ct,keyValueArray:mt,styles:r("property",Ee),getNextOrPrevious:e=>f(Ee.fullData,xe,e,L),handleClick:le.includes("property")?at:e=>e.stopPropagation(),emptyStringKey:Pe},Et=e.jsxs("div",Object.assign({className:"jer-component jer-collection-component",style:Object.assign(Object.assign({marginLeft:(0===xe.length?0:_/2)+"em"},r("collection",Ee)),{position:"relative"}),draggable:Se},Ie,Ve("above"),{children:[e.jsx("div",{className:"jer-clickzone",style:{width:_/2+1+"em",zIndex:10+2*Ee.level},onClick:le.includes("left")?at:void 0}),!Fe&&Me,e.jsx(_e,{position:"above",nodeData:Ee}),tt?e.jsxs("div",{className:"jer-collection-header-row",style:{position:"relative"},onClick:le.includes("header")?at:void 0,children:[e.jsxs("div",{className:"jer-collection-name",children:[e.jsx("div",{className:"jer-collapse-icon jer-accordion-icon"+(fe?" jer-rotate-90":""),style:{zIndex:11+2*Ee.level,transition:je},onClick:at,children:e.jsx(X,{name:"chevron",rotate:fe,nodeData:Ee})}),pt&&e.jsx(ie,Object.assign({},vt)),!Fe&&e.jsx("span",{className:"jer-brackets jer-bracket-open",style:r("bracket",Ee),children:ot.open})]}),!Fe&&dt&&e.jsx("div",{className:"jer-collection-item-count"+(dt?" jer-visible":" jer-hidden"),style:Object.assign(Object.assign({},r("itemCount",Ee)),{transition:je}),children:1===De?W("ITEM_SINGLE",Object.assign(Object.assign({},Ee),{size:1}),1):W("ITEMS_MULTIPLE",Ee,De)}),e.jsx("div",{className:"jer-brackets"+(yt?" jer-visible":" jer-hidden"),style:Object.assign(Object.assign({},r("bracket",Ee)),{transition:je}),children:ot.close}),jt]}):Xe?e.jsx(e.Fragment,{}):e.jsxs("div",{className:"jer-collection-header-row",style:{position:"relative"},children:[e.jsx(ie,Object.assign({},vt)),jt]}),e.jsxs("div",{className:"jer-collection-inner",style:Object.assign(Object.assign({overflowY:yt||he?"clip":"visible",maxHeight:nt?void 0:ye},r("collectionInner",Ee)),{transition:je}),ref:me,children:[bt,e.jsx("div",{className:Fe?"jer-collection-error-row":"jer-collection-error-row-edit",children:Ne&&e.jsx("span",{className:"jer-error-slug",style:r("error",Ee),children:Ne})}),!Fe&&tt&&e.jsx("div",{className:"jer-brackets jer-bracket-outside",style:Object.assign(Object.assign({},r("bracket",Ee)),{marginLeft:(_<3?-1:_<6?-.5:0)+"em"}),children:ot.close})]}),e.jsx(_e,{position:"below",nodeData:Ee})]}));return Ze?e.jsx(Ze,Object.assign({customNodeProps:Je},ft,{children:Et})):Et},pe={ITEM_SINGLE:"{{count}} item",ITEMS_MULTIPLE:"{{count}} items",KEY_NEW:"Enter new key",KEY_SELECT:"Select key",NO_KEY_OPTIONS:"No key options",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",SHOW_LESS:"(Show less)",EMPTY_STRING:"<empty string>",TOOLTIP_COPY:"Copy to clipboard",TOOLTIP_EDIT:"Edit",TOOLTIP_DELETE:"Delete",TOOLTIP_ADD:"Add"},ge=(e,t)=>(n,r,o)=>((e,t,n,r,o)=>{if(t[r]){const e=t[r](n);if(null!==e)return e}const i=r in e?e[r]:pe[r];return void 0===o?i:null==i?void 0:i.replace("{{count}}",String(o))})(e,t,r,n,o);var me=[],he=[];!function(e,t){if(e&&"undefined"!=typeof document){var n,r=!0===t.prepend?"prepend":"append",o=!0===t.singleTag,i="string"==typeof t.container?document.querySelector(t.container):document.getElementsByTagName("head")[0];if(o){var a=me.indexOf(i);-1===a&&(a=me.push(i)-1,he[a]={}),n=he[a]&&he[a][r]?he[a][r]:he[a][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 a="prepend"===r?"afterbegin":"beforeend";return i.insertAdjacentElement(a,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-highlight-color:#b3d8ff}.jer-visible{opacity:1}.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-select-inner{text-overflow:ellipsis;width:100%}.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}.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;word-break:break-word}.jer-string-expansion{cursor:pointer;filter:saturate(50%);opacity:.6}.jer-show-less{font-size:80%}.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:.3s}.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-icon:hover{opacity:.85;transform:scale(1.2);transition:.3s}.jer-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 ye=({data:n,setData:r,rootName:o="root",onUpdate:a=()=>{},onEdit:l=a,onDelete:c=a,onAdd:d=a,onChange:u,onError:g,onEditEvent:h,showErrorMessages:f=!0,enableClipboard:b=!0,indent:j=2,collapse:v=!1,collapseAnimationTime:x=300,showCollectionCount:C=!0,restrictEdit:D=!1,restrictDelete:w=!1,restrictAdd:O=!1,restrictTypeSelection:S=!1,restrictDrag:N=!0,viewOnly:T,searchFilter:A,searchText:R,searchDebounceTime:K=350,keySort:I=!1,showArrayIndices:V=!0,showStringQuotes:M=!0,showIconTooltips:_=!1,defaultValue:L=null,newKeyOptions:F,minWidth:z=250,maxWidth:B="min(600px, 90vw)",rootFontSize:W,stringTruncate:G=250,translations:Y={},className:H,id:U,customText:$={},customNodeDefinitions:Z=[],customButtons:J=[],jsonParse:X=JSON.parse,jsonStringify:q=(e,t)=>JSON.stringify(e,t,2),TextEditor:Q,errorMessageTimeout:ee=2500,keyboardControls:te={},externalTriggers:ne,insertAtTop:re=!1,onCollapse:oe,collapseClickZones:ie=["header","left"]})=>{const{getStyles:se}=k(),{setCurrentlyEditingElement:le}=P(),ce=t.useMemo((()=>be(v)),[v]),pe=t.useMemo((()=>ge(Y,$)),[Y,$]),[me,he]=t.useState(R),[ye,xe]=(({setData:e,data:n})=>{const[r,o]=t.useState(e?void 0:n),i=t.useCallback((t=>{e?e(t):o(t)}),[e]);return t.useEffect((()=>{e||o(n)}),[n]),[e?n:r,i]})({setData:r,data:n}),Ce=t.useRef(null);t.useEffect((()=>{le(null);const e=setTimeout((()=>he(R)),K);return()=>clearTimeout(e)}),[R,K]);const De={key:o,path:[],level:0,index:0,value:ye,size:"object"==typeof ye&&null!==ye?Object.keys(ye).length:1,parentData:null,fullData:ye},we=(e,t)=>i(void 0,void 0,void 0,(function*(){const n=yield e(t);if(!0===n||void 0===n)return void xe(t.newData);const r=ve(n)?n:["error",n],[o,i]=r;if("error"===o)return xe(t.currentData),!1===i?pe("ERROR_UPDATE",De):String(i);xe(i)})),ke=t.useMemo((()=>be(D,T)),[D,T]),Oe=t.useMemo((()=>be(w,T)),[w,T]),Se=t.useMemo((()=>be(O,T)),[O,T]),Ne=t.useMemo((()=>be(N,T)),[N,T]),Te=t.useMemo((()=>je(A)),[A]),Ae=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],i=["clipboardModifier","collapseModifier"].includes(n)?Array.isArray(o)?o:[o]:"string"==typeof o?{key:o}:o;t[r]=i,["stringConfirm","numberConfirm","booleanConfirm"].forEach((n=>{!e[n]&&e.confirm&&(t[n]=t.confirm)}))}}return t})(te)),[te]),Re=t.useCallback(((e,t)=>((e,t,n)=>{const r=Object.entries(t);for(const[t,o]of r)if(m(n,e[t],t)){n.preventDefault(),o();break}})(Ae,t,e)),[Ae]),Pe=t.useMemo((()=>{const e=Ee(Z,"stringifyReplacer");return t=>q(t,e)}),[Z,q]),Ke=t.useMemo((()=>{const e=Ee(Z,"parseReviver");return t=>{const n=X(t,e);return E(n)}}),[Z,X]),Ie=t.useRef(null);((e,n)=>{const{setCurrentlyEditingElement:r,currentlyEditingElement:o,setCollapseState:i}=P();t.useEffect((()=>{if(!e)return;const{collapse:t,edit:a}=e;t&&i(t);const s=!(null==a?void 0:a.path)||p(a.path)===o;switch(null==a?void 0:a.action){case"accept":s&&(n.current&&n.current.click(),r(null));break;case"cancel":s&&r(null);break;default:(null==a?void 0:a.path)&&r(a.path)}}),[e])})(ne,Ie);const Ve=t.useCallback(((e,t)=>{!1!==I&&("function"!=typeof I?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)=>I(t(e),t(n)))))}),[I]),Me=de(Z,De),_e={mainContainerRef:Ce,name:o,nodeData:De,onEdit:(e,t)=>i(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:i}=fe(ye,t,e,"update");if(o!==i)return yield we(l,{currentData:n,newData:r,currentValue:o,newValue:i,name:t.slice(-1)[0],path:t})})),onDelete:(e,t)=>i(void 0,void 0,void 0,(function*(){const{currentData:n,newData:r,currentValue:o,newValue:i}=fe(ye,t,e,"delete");return yield we(c,{currentData:n,newData:r,currentValue:o,newValue:i,name:t.slice(-1)[0],path:t})})),onAdd:(e,t,n)=>i(void 0,void 0,void 0,(function*(){const{currentData:r,newData:o,currentValue:i,newValue:a}=fe(ye,t,e,"add",n);return yield we(d,{currentData:r,newData:o,currentValue:i,newValue:a,name:t.slice(-1)[0],path:t})})),onChange:u,onError:g,onEditEvent:h,showErrorMessages:f,onMove:(e,t,n)=>i(void 0,void 0,void 0,(function*(){if(null===e)return;const{currentData:r,newData:o,currentValue:i}=fe(ye,e,"","delete"),a=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 a?`arr_${a}`:a;e.slice(0,-1).join(".")===t.slice(0,-1).join(".")&&"number"==typeof a&&"number"==typeof d&&a<d&&(d-=1);const u="number"==typeof d?{insert:!0}:"above"===n?{insertBefore:c}:{insertAfter:c},{newData:p,newValue:g}=fe(o,[...s,d],i,"add",u);return yield we(l,{currentData:r,newData:p,currentValue:i,newValue:g,name:t.slice(-1)[0],path:t})})),showCollectionCount:C,collapseFilter:ce,collapseAnimationTime:x,restrictEditFilter:ke,restrictDeleteFilter:Oe,restrictAddFilter:Se,restrictTypeSelection:S,restrictDragFilter:Ne,canDragOnto:!1,searchFilter:Te,searchText:me,enableClipboard:b,keySort:I,sort:Ve,showArrayIndices:V,showStringQuotes:M,showIconTooltips:_,indent:j,defaultValue:L,newKeyOptions:F,stringTruncate:G,translate:pe,customNodeDefinitions:Z,customNodeData:Me,customButtons:J,parentData:null,jsonParse:Ke,jsonStringify:Pe,TextEditor:Q,errorMessageTimeout:ee,handleKeyboard:Re,keyboardControls:Ae,insertAtTop:{object:!0===re||"object"===re,array:!0===re||"array"===re},onCollapse:oe,editConfirmRef:Ie,collapseClickZones:ie},Le=Object.assign(Object.assign({},se("container",De)),{minWidth:z,maxWidth:B});return Le.fontSize=null!=W?W:Le.fontSize,e.jsx("div",{id:U,ref:Ce,className:`jer-editor-container ${null!=H?H:""}`,style:Le,children:s(ye)&&!Me.renderC