UNPKG

json-edit-react

Version:

React component for editing or viewing JSON/object data

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