@sciphergfx/json-to-table/dist/index.esm.js

UI-agnostic React components for JSON to Table and JSON to Form Fields conversion with support for Chakra UI, Tailwind CSS, and shadcn/ui

import{useState as e,useEffect as t}from"react";import{jsx as r,jsxs as n,Fragment as o}from"react/jsx-runtime";function a(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);r<t;r++)n[r]=e[r];return n}function l(e,t,r){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t);if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function i(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function s(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?i(Object(r),!0).forEach(function(t){l(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):i(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}function c(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r={};for(var n in e)if({}.hasOwnProperty.call(e,n)){if(-1!==t.indexOf(n))continue;r[n]=e[n]}return r}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)r=a[n],-1===t.indexOf(r)&&{}.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function u(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,a,l,i=[],s=!0,c=!1;try{if(a=(r=r.call(e)).next,0===t);else for(;!(s=(n=a.call(r)).done)&&(i.push(n.value),i.length!==t);s=!0);}catch(e){c=!0,o=e}finally{try{if(!s&&null!=r.return&&(l=r.return(),Object(l)!==l))return}finally{if(c)throw o}}return i}}(e,t)||m(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function d(e){return function(e){if(Array.isArray(e))return a(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||m(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function f(e){return f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},f(e)}function m(e,t){if(e){if("string"==typeof e)return a(e,t);var r={}.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?a(e,t):void 0}}var b=function(){return{Container:"div",Box:"div",Button:"button",Input:"input",Select:"select",Textarea:"textarea",Table:"table",Thead:"thead",Tbody:"tbody",Tr:"tr",Th:"th",Td:"td",Text:"span",Heading:"h2",Stack:"div",HStack:"div",VStack:"div",Card:"div",Alert:"div",Badge:"span",Grid:"div",GridItem:"div",Flex:"div",Label:"label"}},g=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"chakra",t=arguments.length>1?arguments[1]:void 0,r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"default";if("chakra"===e)return"";var n={tailwind:{Container:"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8",Box:"block",Button:{default:"inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500",secondary:"inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"},Input:{default:"block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm",checkbox:"h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"},Select:"block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm",Textarea:"block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm resize-vertical",Table:"min-w-full divide-y divide-gray-200",Thead:"bg-gray-50",Tbody:"bg-white divide-y divide-gray-200",Tr:"hover:bg-gray-50",Th:"px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider",Td:"px-6 py-4 whitespace-nowrap text-sm text-gray-900",Text:"text-gray-900",Heading:"text-2xl font-bold text-gray-900 mb-4",Stack:"space-y-4",HStack:"flex space-x-4 items-center",VStack:"flex flex-col space-y-4",Card:"bg-white overflow-hidden shadow rounded-lg p-6",Alert:{error:"bg-red-50 border border-red-200 rounded-md p-4 text-red-800",success:"bg-green-50 border border-green-200 rounded-md p-4 text-green-800",warning:"bg-yellow-50 border border-yellow-200 rounded-md p-4 text-yellow-800",info:"bg-blue-50 border border-blue-200 rounded-md p-4 text-blue-800"},Badge:"inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800",Grid:"grid",GridItem:"",Flex:"flex",Label:"block text-sm font-medium text-gray-700"},shadcn:{Container:"container mx-auto px-4",Box:"block",Button:{default:"inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-primary text-primary-foreground hover:bg-primary/90 h-10 px-4 py-2",secondary:"inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 bg-secondary text-secondary-foreground hover:bg-secondary/80 h-10 px-4 py-2"},Input:{default:"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",checkbox:"h-4 w-4 rounded border border-primary text-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"},Select:"flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",Textarea:"flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",Table:"w-full caption-bottom text-sm",Thead:"[&_tr]:border-b",Tbody:"[&_tr:last-child]:border-0",Tr:"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",Th:"h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",Td:"p-4 align-middle [&:has([role=checkbox])]:pr-0",Text:"text-sm text-muted-foreground",Heading:"scroll-m-20 text-2xl font-semibold tracking-tight",Stack:"flex flex-col space-y-4",HStack:"flex space-x-4",VStack:"flex flex-col space-y-4",Card:"rounded-lg border bg-card text-card-foreground shadow-sm",Alert:{error:"relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive",success:"relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",warning:"relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground",info:"relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground"},Badge:"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",Grid:"grid",GridItem:"",Flex:"flex",Label:"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"}}[e];if(!n||!n[t])return"";var o=n[t];return"object"===f(o)?o[r]||o.default||"":o},p=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"",r={};for(var n in e)if(Object.prototype.hasOwnProperty.call(e,n)){var o=t?"".concat(t,".").concat(n):n;"object"!==f(e[n])||null===e[n]||Array.isArray(e[n])?r[o]=e[n]:Object.assign(r,p(e[n],o))}return r},y=function(e){var t={};for(var r in e){for(var n=r.split("."),o=t,a=0;a<n.length-1;a++)o[n[a]]||(o[n[a]]={}),o=o[n[a]];o[n[n.length-1]]=e[r]}return t},v=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"",r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(r[t])return s({type:r[t].type},r[t]);if("boolean"==typeof e)return{type:"checkbox"};if("number"==typeof e)return{type:"number"};if(Array.isArray(e))return{type:"array",items:e};if("object"===f(e)&&null!==e)return{type:"object"};if("string"==typeof e){if(e.length>100)return{type:"textarea",rows:4};if(e.includes("@")||t.toLowerCase().includes("email"))return{type:"email"};if(e.startsWith("http")||t.toLowerCase().includes("url"))return{type:"url"};if(e.match(/^\d{4}-\d{2}-\d{2}$/)||t.toLowerCase().includes("date"))return{type:"date"};if(t.toLowerCase().includes("password"))return{type:"password"}}return{type:"text"}},h=function(e){try{return{success:!0,data:JSON.parse(e)}}catch(e){return{success:!1,error:e.message}}},x=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:2;return JSON.stringify(e,null,t)},w=function(e){return e.split(".").length-1},T=function(e){return e.split(".").pop().replace(/([A-Z])/g," $1").replace(/[_-]/g," ").replace(/\b\w/g,function(e){return e.toUpperCase()}).trim()},k=["uiLibrary","onSave","onCancel","onFieldChange","saveButtonText","cancelButtonText","initialJson","customStyles","showControls"],B=function(o){var a=o.uiLibrary,l=void 0===a?"chakra":a,i=o.onSave,m=o.onCancel,b=o.onFieldChange,p=o.saveButtonText,y=void 0===p?"Save Changes":p,v=o.cancelButtonText,h=void 0===v?"Reset Form":v,x=o.initialJson,w=void 0===x?"":x,B=o.customStyles,S=void 0===B?{}:B,N=o.showControls,C=void 0===N||N,O=c(o,k),L=u(e(w),2),j=L[0],A=L[1],I=u(e(null),2),H=I[0],J=I[1],P=u(e(""),2),F=P[0],V=P[1],G=u(e(null),2),W=G[0],E=G[1],D={Container:"div",Box:"div",Button:"button",Input:"input",Select:"select",Textarea:"textarea",Table:"table",Thead:"thead",Tbody:"tbody",Tr:"tr",Th:"th",Td:"td",Text:"span",Heading:"h2",Stack:"div",HStack:"div",VStack:"div",Card:"div",Alert:"div",Badge:"span",Grid:"div",GridItem:"div",Flex:"div",Label:"label"};t(function(){w?(A(w),M(w)):""===w&&(A(""),J(null),E(null),V(""))},[w]);var M=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:j;if(V(""),J(null),e.trim())try{var t=JSON.parse(e);if(Array.isArray(t)){if(0===t.length)return void V("The JSON array is empty");J(t),E(d(t))}else{if("object"!==f(t)||null===t)return void V("JSON must be an object or array of objects");var r=[t];J(r),E([].concat(r))}}catch(e){V("Invalid JSON: ".concat(e.message))}else V("Please enter some JSON data")};return r(D.Container,s(s({className:g(l,"Container"),style:S.container},O),{},{children:n(D.VStack,{className:g(l,"VStack"),style:s({gap:"1rem"},S.stack),children:[r(D.Box,{className:g(l,"Box"),style:s({width:"100%"},S.inputContainer),children:r(D.Textarea,{value:j,onChange:function(e){return A(e.target.value)},placeholder:"Paste your JSON data here...",className:g(l,"Textarea"),style:s({width:"100%",minHeight:"150px",fontFamily:"monospace"},S.textarea)})}),F&&r(D.Alert,{className:g(l,"Alert","error"),style:S.alert,children:r(D.Text,{style:S.errorText,children:F})}),function(){if(!W||0===W.length)return null;var e=function(){if(!H||0===H.length)return[];var e=new Set;return H.forEach(function(t){Object.keys(t).forEach(function(t){return e.add(t)})}),Array.from(e)}();return r(D.Box,{className:g(l,"Box"),style:s({overflowX:"auto"},S.tableContainer),children:n(D.Table,{className:g(l,"Table"),style:S.table,children:[r(D.Thead,{className:g(l,"Thead"),children:r(D.Tr,{className:g(l,"Tr"),children:e.map(function(e){return r(D.Th,{className:g(l,"Th"),style:s({textAlign:"center"},S.th),children:T(e)},e)})})}),r(D.Tbody,{className:g(l,"Tbody"),children:W.map(function(t,n){return r(D.Tr,{className:g(l,"Tr"),children:e.map(function(e){return r(D.Td,{className:g(l,"Td"),style:S.td,children:r(D.Input,{type:"text",value:t[e]||"",onChange:function(t){return function(e,t,r){var n=d(W);n[e][t]=r,E(n),b&&b(t,r,n)}(n,e,t.target.value)},className:g(l,"Input"),style:s({border:"none",background:"transparent"},S.input)})},e)})},n)})})]})})}(),C&&W&&n(D.HStack,{gap:"2",className:g(l,"HStack"),style:s({gap:"0.5rem",marginTop:"1rem"},S.controlButtons),children:[r(D.Button,{onClick:function(){if(i&&W){var e=W.map(function(e){return s({},e)});i(W,e)}},className:g(l,"Button","default"),style:S.saveButton,children:y}),r(D.Button,{onClick:function(){H&&E(d(H)),m&&m()},className:g(l,"Button","secondary"),style:S.cancelButton,children:h})]})]})}))},S=["uiLibrary","onSave","onCancel","onFieldChange","saveButtonText","cancelButtonText","initialJson","customStyles","showControls","showJsonInput","columns","fieldConfig"],N=function(a){var i=a.uiLibrary,f=void 0===i?"chakra":i,m=a.onSave,b=a.onCancel,x=a.onFieldChange,w=a.saveButtonText,k=void 0===w?"Save Changes":w,B=a.cancelButtonText,N=void 0===B?"Reset Form":B,C=a.initialJson,O=void 0===C?"":C,L=a.customStyles,j=void 0===L?{}:L,A=a.showControls,I=void 0===A||A,H=a.showJsonInput,J=void 0===H||H,P=a.columns,F=void 0===P?1:P,V=a.fieldConfig,G=void 0===V?{}:V,W=c(a,S),E=u(e(O),2),D=E[0],M=E[1],$=u(e({}),2),_=$[0],z=$[1],R=u(e({}),2),U=R[0],X=R[1],Z=u(e(null),2)[1],q=u(e(""),2),K=q[0],Q=q[1],Y={Container:"div",Box:"div",Button:"button",Input:"input",Select:"select",Textarea:"textarea",Table:"table",Thead:"thead",Tbody:"tbody",Tr:"tr",Th:"th",Td:"td",Text:"span",Heading:"h2",Stack:"div",HStack:"div",VStack:"div",Card:"div",Alert:"div",Badge:"span",Grid:"div",GridItem:"div",Flex:"div",Label:"label"};t(function(){O?(M(O),ee(O)):""===O&&(M(""),z({}),X({}),Z(null),Q(""))},[O]);var ee=function(){var e=h(arguments.length>0&&void 0!==arguments[0]?arguments[0]:D);if(e.success){Z(e.data);var t=p(e.data);z(t),X(s({},t)),Q("")}else Q(e.error),Z(null),z({}),X({})},te=function(e,t){var r=s(s({},_),{},l({},e,t));if(z(r),x){var n=y(r);x(e,t,n)}},re=function(e,t){var r=v(t,e,G),n=T(e);switch(r.type){case"checkbox":return ne(e,t,n);case"select":return oe(e,t,n,r);case"multi-select":return ae(e,t,n,r);case"textarea":return le(e,t,n,r);case"email":case"url":case"date":case"password":return ie(e,t,n,r);case"number":return se(e,t,n);case"array":return ce(e,t,n);case"object":return ue(e,t,n);default:return de(e,t,n)}},ne=function(e,t,o,a){return r(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:n(Y.Label,{className:g(f,"Label"),style:s({display:"flex",alignItems:"center",gap:"0.5rem",cursor:"pointer"},j.label),children:[r("input",{type:"checkbox",checked:_[e]||!1,onChange:function(t){return te(e,t.target.checked)},className:g(f,"Input","checkbox"),style:j.checkbox}),r(Y.Text,{className:g(f,"Text"),style:s({fontWeight:"500"},j.fieldLabel),children:o})]})},e)},oe=function(e,t,o,a){var l;return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[r(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:o}),n(Y.Select,{value:_[e]||"",onChange:function(t){return te(e,t.target.value)},className:g(f,"Select"),style:s({width:"100%"},j.select),children:[n("option",{value:"",children:["Select ",o]}),null===(l=a.options)||void 0===l?void 0:l.map(function(e){return r("option",{value:e,children:e},e)})]})]},e)},ae=function(e,t,o,a){var l,i=Array.isArray(_[e])?_[e]:[];return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[r(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:o}),r(Y.Box,{style:{display:"flex",flexDirection:"column",gap:"0.5rem"},children:null===(l=a.options)||void 0===l?void 0:l.map(function(t){return n(Y.Label,{style:{display:"flex",alignItems:"center",gap:"0.5rem",cursor:"pointer"},children:[r("input",{type:"checkbox",checked:i.includes(t),onChange:function(r){var n=r.target.checked?[].concat(d(i),[t]):i.filter(function(e){return e!==t});te(e,n)},style:j.checkbox}),r(Y.Text,{style:s({fontSize:"14px"},j.text),children:t})]},t)})})]},e)},le=function(e,t,o,a){return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[r(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:o}),r(Y.Textarea,{value:_[e]||"",onChange:function(t){return te(e,t.target.value)},className:g(f,"Textarea"),style:s({width:"100%",minHeight:"".concat(1.5*(a.rows||4),"rem")},j.textarea)})]},e)},ie=function(e,t,o,a){return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[r(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:o}),r(Y.Input,{type:a.type,value:_[e]||"",onChange:function(t){return te(e,t.target.value)},className:g(f,"Input"),style:s({width:"100%"},j.input)})]},e)},se=function(e,t,o,a){return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[r(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:o}),r(Y.Input,{type:"number",value:_[e]||"",onChange:function(t){var r=parseFloat(t.target.value)||0;te(e,r)},className:g(f,"Input"),style:s({width:"100%"},j.input)})]},e)},ce=function(e,t,o,a){return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[n(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:[o," (Array)"]}),r(Y.Textarea,{value:JSON.stringify(t,null,2),onChange:function(t){try{var r=JSON.parse(t.target.value);te(e,r)}catch(r){te(e,t.target.value)}},className:g(f,"Textarea"),style:s({fontFamily:"monospace",minHeight:"100px",width:"100%"},j.textarea)})]},e)},ue=function(e,t,o,a){return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[n(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:[o," (Object)"]}),r(Y.Textarea,{value:JSON.stringify(t,null,2),onChange:function(t){try{var r=JSON.parse(t.target.value);te(e,r)}catch(r){te(e,t.target.value)}},className:g(f,"Textarea"),style:s({fontFamily:"monospace",minHeight:"100px",width:"100%"},j.textarea)})]},e)},de=function(e,t,o,a){return n(Y.Box,{className:g(f,"Box"),style:s({marginBottom:"1rem"},j.fieldContainer),children:[r(Y.Label,{className:g(f,"Label"),style:s({display:"block",fontWeight:"600",marginBottom:"0.5rem"},j.fieldLabel),children:o}),r(Y.Input,{type:"text",value:_[e]||"",onChange:function(t){return te(e,t.target.value)},className:g(f,"Input"),style:s({width:"100%"},j.input)})]},e)};return r(Y.Container,s(s({className:g(f,"Container"),style:j.container},W),{},{children:n(Y.VStack,{className:g(f,"VStack"),style:s({gap:"1rem"},j.stack),children:[J&&r(o,{children:r(Y.Box,{className:g(f,"Box"),style:s({width:"100%"},j.inputContainer),children:r(Y.Textarea,{value:D,onChange:function(e){return M(e.target.value)},placeholder:"Paste your JSON data here...",className:g(f,"Textarea"),style:s({minHeight:"150px",fontFamily:"monospace"},j.textarea)})})}),K&&r(Y.Alert,{className:g(f,"Alert","error"),style:j.alert,children:r(Y.Text,{style:j.errorText,children:K})}),Object.keys(_).length>0&&r(Y.Card,{className:g(f,"Card"),style:s({width:"100%",padding:"1rem"},j.formCard),children:function(){var e=Object.entries(_);if(F<=1)return r(Y.VStack,{className:g(f,"VStack"),style:s({gap:"1rem"},j.formStack),children:e.map(function(e){var t=u(e,2),r=t[0],n=t[1];return re(r,n)})});for(var t=Math.ceil(e.length/F),n=[],o=0;o<F;o++){var a=o*t,l=Math.min(a+t,e.length);n.push(e.slice(a,l))}var i=s({display:"grid",gridTemplateColumns:"repeat(".concat(F,", 1fr)"),gap:"2rem",width:"100%"},j.formGrid);return r(Y.Box,{className:g(f,"Box"),style:i,children:n.map(function(e,t){return r(Y.VStack,{className:g(f,"VStack"),style:s({gap:"1rem"},j.formColumn),children:e.map(function(e){var t=u(e,2),r=t[0],n=t[1];return re(r,n)})},t)})})}()}),I&&Object.keys(_).length>0&&n(Y.HStack,{className:g(f,"HStack"),style:s({gap:"0.5rem",marginTop:"1rem"},j.controlButtons),children:[r(Y.Button,{onClick:function(){if(m){var e=y(_);m(e,_)}},className:g(f,"Button","default"),style:j.saveButton,children:k}),r(Y.Button,{onClick:function(){z(s({},U)),b&&b()},className:g(f,"Button","secondary"),style:j.cancelButton,children:N})]})]})}))};export{N as JsonToFields,B as JsonToTable,p as flattenObject,x as formatJson,T as getDisplayName,v as getInputType,w as getNestedLevel,g as getUIClasses,b as getUIComponents,h as parseJsonSafely,y as unflattenObject};
//# sourceMappingURL=index.esm.js.map