@object-ui/plugin-form 3.1.1 → 3.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +5 -5
- package/CHANGELOG.md +10 -0
- package/dist/index.js +6 -6
- package/dist/index.umd.cjs +2 -2
- package/dist/plugin-form/src/autoLayout.d.ts +3 -4
- package/package.json +7 -7
- package/src/ModalForm.tsx +12 -6
- package/src/__tests__/MobileUX.test.tsx +3 -3
- package/src/__tests__/autoLayout.test.ts +4 -7
- package/src/autoLayout.ts +4 -6
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
> @object-ui/plugin-form@3.1.
|
|
2
|
+
> @object-ui/plugin-form@3.1.2 build /home/runner/work/objectui/objectui/packages/plugin-form
|
|
3
3
|
> vite build
|
|
4
4
|
|
|
5
5
|
[36mvite v7.3.1 [32mbuilding client environment for production...[36m[39m
|
|
@@ -9,13 +9,13 @@ rendering chunks...
|
|
|
9
9
|
[32m
|
|
10
10
|
[36m[vite:dts][32m Start generate declaration files...[39m
|
|
11
11
|
computing gzip size...
|
|
12
|
-
[2mdist/[22m[36mindex.js [39m[1m[2m68.
|
|
13
|
-
[32m[36m[vite:dts][32m Declaration files built in
|
|
12
|
+
[2mdist/[22m[36mindex.js [39m[1m[2m68.68 kB[22m[1m[22m[2m │ gzip: 14.37 kB[22m
|
|
13
|
+
[32m[36m[vite:dts][32m Declaration files built in 29166ms.
|
|
14
14
|
[39m
|
|
15
15
|
[33mNo name was provided for external module "@object-ui/core" in "output.globals" – guessing "core".[39m
|
|
16
16
|
[33mNo name was provided for external module "@object-ui/react" in "output.globals" – guessing "react".[39m
|
|
17
17
|
[33mNo name was provided for external module "@object-ui/fields" in "output.globals" – guessing "fields".[39m
|
|
18
18
|
[33mNo name was provided for external module "@object-ui/components" in "output.globals" – guessing "components".[39m
|
|
19
19
|
[33mNo name was provided for external module "lucide-react" in "output.globals" – guessing "lucideReact".[39m
|
|
20
|
-
[2mdist/[22m[36mindex.umd.cjs [39m[1m[2m46.
|
|
21
|
-
[32m✓ built in
|
|
20
|
+
[2mdist/[22m[36mindex.umd.cjs [39m[1m[2m46.52 kB[22m[1m[22m[2m │ gzip: 12.08 kB[22m
|
|
21
|
+
[32m✓ built in 31.51s[39m
|
package/CHANGELOG.md
CHANGED
package/dist/index.js
CHANGED
|
@@ -857,7 +857,7 @@ function dt(e, r) {
|
|
|
857
857
|
}) : e;
|
|
858
858
|
}
|
|
859
859
|
function Ne(e) {
|
|
860
|
-
return e <= 1 ? "default" : e === 2 ? "
|
|
860
|
+
return e <= 1 ? "default" : e === 2 ? "xl" : "full";
|
|
861
861
|
}
|
|
862
862
|
function ce(e, r, i, b) {
|
|
863
863
|
let o = [...e];
|
|
@@ -1058,11 +1058,11 @@ const ve = {
|
|
|
1058
1058
|
}
|
|
1059
1059
|
) });
|
|
1060
1060
|
}, Se = {
|
|
1061
|
-
sm: "max-w-sm",
|
|
1062
|
-
default: "max-w-lg",
|
|
1063
|
-
lg: "max-w-2xl",
|
|
1064
|
-
xl: "max-w-
|
|
1065
|
-
full: "max-w-[95vw] w-full"
|
|
1061
|
+
sm: "sm:max-w-sm",
|
|
1062
|
+
default: "sm:max-w-lg",
|
|
1063
|
+
lg: "sm:max-w-2xl",
|
|
1064
|
+
xl: "sm:max-w-5xl",
|
|
1065
|
+
full: "sm:max-w-[95vw] sm:w-full"
|
|
1066
1066
|
}, Ce = {
|
|
1067
1067
|
1: void 0,
|
|
1068
1068
|
// let the form renderer use its default (space-y-4)
|
package/dist/index.umd.cjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
(function(_,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("react"),require("@object-ui/core"),require("@object-ui/react"),require("@object-ui/fields"),require("@object-ui/components"),require("lucide-react")):typeof define=="function"&&define.amd?define(["exports","react","@object-ui/core","@object-ui/react","@object-ui/fields","@object-ui/components","lucide-react"],i):(_=typeof globalThis<"u"?globalThis:_||self,i(_.ObjectUIPluginForm={},_.React,_.core,_.react,_.fields,_.components,_.lucideReact))})(this,(function(_,i,ee,H,W,u,J){"use strict";var te={exports:{}},Q={};var ae;function he(){if(ae)return Q;ae=1;var e=Symbol.for("react.transitional.element"),l=Symbol.for("react.fragment");function o(x,s,
|
|
1
|
+
(function(_,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("react"),require("@object-ui/core"),require("@object-ui/react"),require("@object-ui/fields"),require("@object-ui/components"),require("lucide-react")):typeof define=="function"&&define.amd?define(["exports","react","@object-ui/core","@object-ui/react","@object-ui/fields","@object-ui/components","lucide-react"],i):(_=typeof globalThis<"u"?globalThis:_||self,i(_.ObjectUIPluginForm={},_.React,_.core,_.react,_.fields,_.components,_.lucideReact))})(this,(function(_,i,ee,H,W,u,J){"use strict";var te={exports:{}},Q={};var ae;function he(){if(ae)return Q;ae=1;var e=Symbol.for("react.transitional.element"),l=Symbol.for("react.fragment");function o(x,s,p){var g=null;if(p!==void 0&&(g=""+p),s.key!==void 0&&(g=""+s.key),"key"in s){p={};for(var E in s)E!=="key"&&(p[E]=s[E])}else p=s;return s=p.ref,{$$typeof:e,type:x,key:g,ref:s!==void 0?s:null,props:p}}return Q.Fragment=l,Q.jsx=o,Q.jsxs=o,Q}var Z={};var de;function Fe(){return de||(de=1,process.env.NODE_ENV!=="production"&&(function(){function e(r){if(r==null)return null;if(typeof r=="function")return r.$$typeof===j?null:r.displayName||r.name||null;if(typeof r=="string")return r;switch(r){case V:return"Fragment";case L:return"Profiler";case z:return"StrictMode";case n:return"Suspense";case d:return"SuspenseList";case T:return"Activity"}if(typeof r=="object")switch(typeof r.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),r.$$typeof){case I:return"Portal";case q:return r.displayName||"Context";case G:return(r._context.displayName||"Context")+".Consumer";case m:var S=r.render;return r=r.displayName,r||(r=S.displayName||S.name||"",r=r!==""?"ForwardRef("+r+")":"ForwardRef"),r;case a:return S=r.displayName||null,S!==null?S:e(r.type)||"Memo";case f:S=r._payload,r=r._init;try{return e(r(S))}catch{}}return null}function l(r){return""+r}function o(r){try{l(r);var S=!1}catch{S=!0}if(S){S=console;var M=S.error,R=typeof Symbol=="function"&&Symbol.toStringTag&&r[Symbol.toStringTag]||r.constructor.name||"Object";return M.call(S,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",R),l(r)}}function x(r){if(r===V)return"<>";if(typeof r=="object"&&r!==null&&r.$$typeof===f)return"<...>";try{var S=e(r);return S?"<"+S+">":"<...>"}catch{return"<...>"}}function s(){var r=c.A;return r===null?null:r.getOwner()}function p(){return Error("react-stack-top-frame")}function g(r){if(P.call(r,"key")){var S=Object.getOwnPropertyDescriptor(r,"key").get;if(S&&S.isReactWarning)return!1}return r.key!==void 0}function E(r,S){function M(){w||(w=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",S))}M.isReactWarning=!0,Object.defineProperty(r,"key",{get:M,configurable:!0})}function A(){var r=e(this.type);return y[r]||(y[r]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),r=this.props.ref,r!==void 0?r:null}function k(r,S,M,R,le,oe){var Y=M.ref;return r={$$typeof:C,type:r,key:S,props:M,_owner:R},(Y!==void 0?Y:null)!==null?Object.defineProperty(r,"ref",{enumerable:!1,get:A}):Object.defineProperty(r,"ref",{enumerable:!1,value:null}),r._store={},Object.defineProperty(r._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(r,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(r,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:le}),Object.defineProperty(r,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:oe}),Object.freeze&&(Object.freeze(r.props),Object.freeze(r)),r}function O(r,S,M,R,le,oe){var Y=S.children;if(Y!==void 0)if(R)if(h(Y)){for(R=0;R<Y.length;R++)v(Y[R]);Object.freeze&&Object.freeze(Y)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else v(Y);if(P.call(S,"key")){Y=e(r);var X=Object.keys(S).filter(function(Pe){return Pe!=="key"});R=0<X.length?"{key: someKey, "+X.join(": ..., ")+": ...}":"{key: someKey}",D[Y+R]||(X=0<X.length?"{"+X.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
2
2
|
let props = %s;
|
|
3
3
|
<%s {...props} />
|
|
4
4
|
React keys must be passed directly to JSX without using spread:
|
|
5
5
|
let props = %s;
|
|
6
|
-
<%s key={someKey} {...props} />`,R,Y,X,Y),D[Y+R]=!0)}if(Y=null,M!==void 0&&(o(M),Y=""+M),g(S)&&(o(S.key),Y=""+S.key),"key"in S){M={};for(var se in S)se!=="key"&&(M[se]=S[se])}else M=S;return Y&&E(M,typeof r=="function"?r.displayName||r.name||"Unknown":r),k(r,Y,M,s(),le,oe)}function v(r){N(r)?r._store&&(r._store.validated=1):typeof r=="object"&&r!==null&&r.$$typeof===f&&(r._payload.status==="fulfilled"?N(r._payload.value)&&r._payload.value._store&&(r._payload.value._store.validated=1):r._store&&(r._store.validated=1))}function N(r){return typeof r=="object"&&r!==null&&r.$$typeof===C}var F=i,C=Symbol.for("react.transitional.element"),I=Symbol.for("react.portal"),V=Symbol.for("react.fragment"),z=Symbol.for("react.strict_mode"),L=Symbol.for("react.profiler"),G=Symbol.for("react.consumer"),q=Symbol.for("react.context"),p=Symbol.for("react.forward_ref"),n=Symbol.for("react.suspense"),d=Symbol.for("react.suspense_list"),a=Symbol.for("react.memo"),f=Symbol.for("react.lazy"),T=Symbol.for("react.activity"),j=Symbol.for("react.client.reference"),c=F.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,P=Object.prototype.hasOwnProperty,h=Array.isArray,b=console.createTask?console.createTask:function(){return null};F={react_stack_bottom_frame:function(r){return r()}};var w,y={},$=F.react_stack_bottom_frame.bind(F,m)(),U=b(x(m)),D={};Z.Fragment=V,Z.jsx=function(r,S,M){var R=1e4>c.recentlyCreatedOwnerStacks++;return O(r,S,M,!1,R?Error("react-stack-top-frame"):$,R?b(x(r)):U)},Z.jsxs=function(r,S,M){var R=1e4>c.recentlyCreatedOwnerStacks++;return O(r,S,M,!0,R?Error("react-stack-top-frame"):$,R?b(x(r)):U)}})()),Z}var ue;function Ee(){return ue||(ue=1,process.env.NODE_ENV==="production"?te.exports=he():te.exports=Fe()),te.exports}var t=Ee();const B=({label:e,description:l,collapsible:o=!1,collapsed:x=!1,columns:s=1,children:m,className:g,gridClassName:E})=>{const[A,k]=i.useState(x),O={1:"grid-cols-1",2:"grid-cols-1 md:grid-cols-2",3:"grid-cols-1 md:grid-cols-2 lg:grid-cols-3",4:"grid-cols-1 md:grid-cols-2 lg:grid-cols-4"},v=()=>{o&&k(!A)};return t.jsxs("div",{className:u.cn("form-section",g),children:[(e||l)&&t.jsxs("div",{className:u.cn("flex items-start gap-2 mb-4",o&&"cursor-pointer select-none"),onClick:v,role:o?"button":void 0,"aria-expanded":o?!A:void 0,children:[o&&t.jsx("span",{className:"mt-0.5 text-muted-foreground",children:A?t.jsx(J.ChevronRight,{className:"h-4 w-4"}):t.jsx(J.ChevronDown,{className:"h-4 w-4"})}),t.jsxs("div",{className:"flex-1",children:[e&&t.jsx("h3",{className:"text-base font-semibold text-foreground",children:e}),l&&t.jsx("p",{className:"text-sm text-muted-foreground mt-0.5",children:l})]})]}),!A&&t.jsx("div",{className:u.cn("grid gap-4",E||O[s]),children:m})]})},ce=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,m]=i.useState(null),[g,E]=i.useState({}),[A,k]=i.useState(!0),[O,v]=i.useState(null),[N,F]=i.useState(e.defaultTab||e.sections[0]?.name||e.sections[0]?.label||"tab-0");i.useEffect(()=>{(async()=>{if(!l){k(!1);return}try{const n=await l.getObjectSchema(e.objectName);m(n)}catch(n){v(n)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId||!l){E(e.initialData||e.initialValues||{}),k(!1);return}try{const n=await l.findOne(e.objectName,e.recordId);E(n||{})}catch(n){v(n)}finally{k(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const C=i.useCallback(p=>{const n=[];for(const d of p.fields){const a=typeof d=="string"?d:d.name;if(typeof d=="object")n.push(d);else if(s?.fields?.[a]){const f=s.fields[a];n.push({name:a,label:x(e.objectName,a,f.label||a),type:W.mapFieldTypeToFormType(f.type),required:f.required||!1,disabled:e.readOnly||e.mode==="view"||f.readonly,placeholder:f.placeholder,description:f.help||f.description,validation:W.buildValidationRules(f),field:f,options:f.options,multiple:f.multiple})}else n.push({name:a,label:a,type:"input"})}return n},[s,e.readOnly,e.mode]),I=i.useCallback(async p=>{if(!l)return e.onSuccess&&await e.onSuccess(p),p;try{let n;return e.mode==="create"?n=await l.create(e.objectName,p):e.mode==="edit"&&e.recordId&&(n=await l.update(e.objectName,e.recordId,p)),e.onSuccess&&await e.onSuccess(n),n}catch(n){throw e.onError&&e.onError(n),n}},[e,l]),V=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),z=(p,n)=>p.name||p.label||`tab-${n}`;if(O)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:O.message})]});if(A)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const G={type:"form",fields:e.sections.flatMap(p=>C(p)),layout:"vertical",defaultValues:g,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1,onSubmit:I,onCancel:V},q=e.tabPosition==="left"||e.tabPosition==="right";return t.jsx("div",{className:u.cn("w-full",o,e.className),children:t.jsxs(u.Tabs,{value:N,onValueChange:F,orientation:q?"vertical":"horizontal",className:u.cn(q&&"flex gap-4"),children:[t.jsx(u.TabsList,{className:u.cn(q?"flex-col h-auto":"",e.tabPosition==="bottom"&&"order-last",e.tabPosition==="right"&&"order-last"),children:e.sections.map((p,n)=>t.jsx(u.TabsTrigger,{value:z(p,n),className:q?"w-full justify-start":"",children:p.label||`Tab ${n+1}`},z(p,n)))}),t.jsx("div",{className:"flex-1",children:e.sections.map((p,n)=>t.jsx(u.TabsContent,{value:z(p,n),className:"mt-0",children:t.jsx(B,{description:p.description,columns:p.columns||1,children:t.jsx(H.SchemaRenderer,{schema:{...G,fields:C(p),showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1}})})},z(p,n)))})]})})},fe=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,m]=i.useState(null),[g,E]=i.useState({}),[A,k]=i.useState(!0),[O,v]=i.useState(null),[N,F]=i.useState(0),[C,I]=i.useState(new Set),[V,z]=i.useState(!1),L=e.sections.length,G=N===0,q=N===L-1;i.useEffect(()=>{(async()=>{if(!l){k(!1);return}try{const h=await l.getObjectSchema(e.objectName);m(h)}catch(h){v(h)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId||!l){E(e.initialData||e.initialValues||{}),k(!1);return}try{const h=await l.findOne(e.objectName,e.recordId);E(h||{})}catch(h){v(h)}finally{k(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const p=i.useCallback(P=>{const h=[];for(const b of P.fields){const w=typeof b=="string"?b:b.name;if(typeof b=="object")h.push(b);else if(s?.fields?.[w]){const y=s.fields[w];h.push({name:w,label:x(e.objectName,w,y.label||w),type:W.mapFieldTypeToFormType(y.type),required:y.required||!1,disabled:e.readOnly||e.mode==="view"||y.readonly,placeholder:y.placeholder,description:y.help||y.description,validation:W.buildValidationRules(y),field:y,options:y.options,multiple:y.multiple})}else h.push({name:w,label:w,type:"input"})}return h},[s,e.readOnly,e.mode]),n=i.useMemo(()=>N>=0&&N<L?p(e.sections[N]):[],[N,L,e.sections,p]),d=i.useCallback(async P=>{const h={...g,...P};if(E(h),I(b=>new Set(b).add(N)),q){z(!0);try{if(!l)return e.onSuccess&&await e.onSuccess(h),h;let b;return e.mode==="create"?b=await l.create(e.objectName,h):e.mode==="edit"&&e.recordId&&(b=await l.update(e.objectName,e.recordId,h)),e.onSuccess&&await e.onSuccess(b),b}catch(b){throw e.onError&&e.onError(b),b}finally{z(!1)}}else a(N+1)},[g,N,q,e,l]),a=i.useCallback(P=>{P>=0&&P<L&&(F(P),e.onStepChange&&e.onStepChange(P))},[L,e]),f=i.useCallback(()=>{a(N-1)},[N,a]),T=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),j=i.useCallback(P=>{(e.allowSkip||C.has(P)||P<=N)&&a(P)},[e.allowSkip,C,N,a]);if(O)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:O.message})]});if(A)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const c=e.sections[N];return t.jsxs("div",{className:u.cn("w-full",o,e.className),children:[e.showStepIndicator!==!1&&t.jsx("nav",{"aria-label":"Progress",className:"mb-8",children:t.jsx("ol",{className:"flex items-center",children:e.sections.map((P,h)=>{const b=h===N,w=C.has(h),y=e.allowSkip||w||h<=N;return t.jsxs("li",{className:u.cn("relative flex-1",h!==L-1&&"pr-8 sm:pr-12"),children:[h!==L-1&&t.jsx("div",{className:"absolute top-3 sm:top-4 left-6 -right-4 sm:left-10 sm:-right-2 h-0.5","aria-hidden":"true",children:t.jsx("div",{className:u.cn("h-full",w?"bg-primary":"bg-muted")})}),t.jsxs("button",{type:"button",className:u.cn("group relative flex items-center",y?"cursor-pointer":"cursor-not-allowed"),onClick:()=>j(h),disabled:!y,children:[t.jsx("span",{className:u.cn("flex h-6 w-6 sm:h-8 sm:w-8 items-center justify-center rounded-full text-xs sm:text-sm font-medium transition-colors",w&&"bg-primary text-primary-foreground",b&&!w&&"border-2 border-primary bg-background text-primary",!b&&!w&&"border-2 border-muted bg-background text-muted-foreground"),children:w?t.jsx(J.Check,{className:"h-3 w-3 sm:h-4 sm:w-4"}):h+1}),t.jsx("span",{className:"ml-2 sm:ml-3 text-xs sm:text-sm font-medium hidden sm:block",children:t.jsx("span",{className:u.cn(b?"text-foreground":"text-muted-foreground"),children:P.label||`Step ${h+1}`})})]})]},h)})})}),t.jsx("div",{className:"min-h-[200px]",children:c&&t.jsx(B,{label:c.label,description:c.description,columns:c.columns||1,children:n.length>0?t.jsx(H.SchemaRenderer,{schema:{type:"form",fields:n,layout:"vertical",defaultValues:g,showSubmit:!1,showCancel:!1,onSubmit:d}}):t.jsx("div",{className:"text-center py-8 text-muted-foreground",children:"No fields configured for this step"})})}),t.jsxs("div",{className:"flex items-center justify-between mt-6 pt-4 border-t",children:[t.jsx("div",{children:e.showCancel!==!1&&t.jsx(u.Button,{variant:"ghost",onClick:T,children:e.cancelText||"Cancel"})}),t.jsxs("div",{className:"flex items-center gap-2",children:[t.jsxs("span",{className:"text-sm text-muted-foreground mr-2",children:["Step ",N+1," of ",L]}),!G&&t.jsxs(u.Button,{variant:"outline",onClick:f,children:[t.jsx(J.ChevronLeft,{className:"h-4 w-4 mr-1"}),e.prevText||"Back"]}),q?t.jsx(u.Button,{onClick:()=>d(g),disabled:V||e.mode==="view",children:V?"Submitting...":e.submitText||(e.mode==="create"?"Create":"Update")}):t.jsxs(u.Button,{onClick:()=>d(g),children:[e.nextText||"Next",t.jsx(J.ChevronRight,{className:"h-4 w-4 ml-1"})]})]})]})]})},be=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,m]=i.useState(null),[g,E]=i.useState({}),[A,k]=i.useState(!0),[O,v]=i.useState(null);i.useEffect(()=>{(async()=>{if(!l){k(!1);return}try{const n=await l.getObjectSchema(e.objectName);m(n)}catch(n){v(n),k(!1)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId){E(e.initialData||e.initialValues||{}),k(!1);return}if(!l){E(e.initialData||e.initialValues||{}),k(!1);return}try{const n=await l.findOne(e.objectName,e.recordId);E(n||{})}catch(n){v(n)}finally{k(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const N=i.useCallback(p=>{const n=[];for(const d of p.fields){const a=typeof d=="string"?d:d.name;if(typeof d=="object")n.push(d);else if(s?.fields?.[a]){const f=s.fields[a];n.push({name:a,label:x(e.objectName,a,f.label||a),type:W.mapFieldTypeToFormType(f.type),required:f.required||!1,disabled:e.readOnly||e.mode==="view"||f.readonly,placeholder:f.placeholder,description:f.help||f.description,validation:W.buildValidationRules(f),field:f,options:f.options,multiple:f.multiple})}else n.push({name:a,label:a,type:"input"})}return n},[s,e.readOnly,e.mode]),F=i.useCallback(async p=>{if(!l)return e.onSuccess&&await e.onSuccess(p),p;try{let n;return e.mode==="create"?n=await l.create(e.objectName,p):e.mode==="edit"&&e.recordId&&(n=await l.update(e.objectName,e.recordId,p)),e.onSuccess&&await e.onSuccess(n),n}catch(n){throw e.onError&&e.onError(n),n}},[e,l]),C=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),I=i.useMemo(()=>e.sections.slice(0,1),[e.sections]),V=i.useMemo(()=>e.sections.slice(1),[e.sections]);i.useMemo(()=>e.sections.flatMap(p=>N(p)),[e.sections,N]);const z=e.splitDirection||"horizontal",L=e.splitSize||50;if(O)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:O.message})]});if(A)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const G={type:"form",layout:"vertical",defaultValues:g,onSubmit:F,onCancel:C},q=(p,n)=>t.jsx("div",{className:"space-y-4 p-4",children:p.map((d,a)=>t.jsx(B,{label:d.label,description:d.description,columns:d.columns||1,children:t.jsx(H.SchemaRenderer,{schema:{...G,fields:N(d),showSubmit:n&&e.showSubmit!==!1&&e.mode!=="view",showCancel:n&&e.showCancel!==!1,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText}})},d.name||d.label||a))});return t.jsx("div",{className:u.cn("w-full",o,e.className),children:t.jsxs(u.ResizablePanelGroup,{orientation:z,className:"min-h-[300px] rounded-lg border",children:[t.jsx(u.ResizablePanel,{defaultSize:L,minSize:20,children:q(I,V.length===0)}),V.length>0&&t.jsxs(t.Fragment,{children:[t.jsx(u.ResizableHandle,{withHandle:e.splitResizable!==!1}),t.jsx(u.ResizablePanel,{defaultSize:100-L,minSize:20,children:q(V,!0)})]})]})})},ke=new Set(["field:textarea","field:markdown","field:html","field:grid","field:rich-text","textarea","markdown","html","grid","rich-text"]),Oe=new Set(["formula","summary","auto_number","autonumber"]);function pe(e){return ke.has(e)}function me(e){return Oe.has(e)}function ye(e){return e<=3?1:2}function re(e,l){return l<=1?e:e.map(o=>o.colSpan!==void 0?o:o.type&&pe(o.type)?{...o,colSpan:l}:o)}function xe(e,l){return l?.fields?e.filter(o=>{const x=l.fields[o.name];return x?!me(x.type):!0}):e}function ie(e){return e<=1?"default":e===2?"lg":e===3?"xl":"full"}function K(e,l,o,x){let s=[...e];if(x==="create"&&(s=xe(s,l)),o!==void 0)return s=re(s,o),{fields:s,columns:o};const m=ye(s.length);return s=re(s,m),{fields:s,columns:m}}const ge={1:void 0,2:"grid gap-4 grid-cols-1 @md:grid-cols-2",3:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3",4:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3 @4xl:grid-cols-4"},je=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,m]=i.useState(null),[g,E]=i.useState([]),[A,k]=i.useState({}),[O,v]=i.useState(!0),[N,F]=i.useState(null),C=e.open!==!1,I=e.drawerSide||"right";i.useEffect(()=>{(async()=>{if(!l){v(!1);return}try{const a=await l.getObjectSchema(e.objectName);m(a)}catch(a){F(a),v(!1)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId){k(e.initialData||e.initialValues||{}),v(!1);return}if(!l){k(e.initialData||e.initialValues||{}),v(!1);return}try{const a=await l.findOne(e.objectName,e.recordId);k(a||{})}catch(a){F(a)}finally{v(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const V=i.useCallback(d=>{const a=[];for(const f of d.fields){const T=typeof f=="string"?f:f.name;if(typeof f=="object")a.push(f);else if(s?.fields?.[T]){const j=s.fields[T];a.push({name:T,label:x(e.objectName,T,j.label||T),type:W.mapFieldTypeToFormType(j.type),required:j.required||!1,disabled:e.readOnly||e.mode==="view"||j.readonly,placeholder:j.placeholder,description:j.help||j.description,validation:W.buildValidationRules(j),field:j,options:j.options,multiple:j.multiple})}else a.push({name:T,label:T,type:"input"})}return a},[s,e.readOnly,e.mode]);i.useEffect(()=>{if(!s&&l)return;if(e.customFields?.length){E(e.customFields),v(!1);return}if(e.sections?.length){v(!1);return}if(!s)return;const d=e.fields||Object.keys(s.fields||{}),a=[];for(const f of d){const T=typeof f=="string"?f:f.name;if(!T)continue;const j=s.fields?.[T];j&&a.push({name:T,label:x(e.objectName,T,j.label||T),type:W.mapFieldTypeToFormType(j.type),required:j.required||!1,disabled:e.readOnly||e.mode==="view"||j.readonly,placeholder:j.placeholder,description:j.help||j.description,validation:W.buildValidationRules(j),field:j,options:j.options,multiple:j.multiple})}E(a),v(!1)},[s,e.fields,e.customFields,e.sections,e.readOnly,e.mode,l]);const z=i.useCallback(async d=>{if(!l)return e.onSuccess&&await e.onSuccess(d),e.onOpenChange?.(!1),d;try{let a;return e.mode==="create"?a=await l.create(e.objectName,d):e.mode==="edit"&&e.recordId&&(a=await l.update(e.objectName,e.recordId,d)),e.onSuccess&&await e.onSuccess(a),e.onOpenChange?.(!1),a}catch(a){throw e.onError&&e.onError(a),a}},[e,l]),L=i.useCallback(()=>{e.onCancel&&e.onCancel(),e.onOpenChange?.(!1)},[e]),G=i.useMemo(()=>e.drawerWidth?I==="left"||I==="right"?{width:e.drawerWidth,maxWidth:e.drawerWidth}:{height:e.drawerWidth,maxHeight:e.drawerWidth}:void 0,[e.drawerWidth,I]),p={type:"form",layout:e.layout==="vertical"||e.layout==="horizontal"?e.layout:"vertical",defaultValues:A,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1,onSubmit:z,onCancel:L},n=()=>{if(N)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:N.message})]});if(O)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});if(e.sections?.length)return t.jsx("div",{className:"space-y-6",children:e.sections.map((f,T)=>{const j=f.columns||1;return t.jsx(B,{label:f.label,description:f.description,columns:j,gridClassName:ge[j],children:t.jsx(H.SchemaRenderer,{schema:{...p,fields:V(f),showSubmit:T===e.sections.length-1&&p.showSubmit,showCancel:T===e.sections.length-1&&p.showCancel}})},f.name||f.label||T)})});const d=K(g,s,e.columns,e.mode),a=ge[d.columns||1];return t.jsx(H.SchemaRenderer,{schema:{...p,fields:d.fields,columns:d.columns,...a?{fieldContainerClass:a}:{}}})};return t.jsx(u.Sheet,{open:C,onOpenChange:e.onOpenChange,children:t.jsxs(u.SheetContent,{side:I,className:u.cn("overflow-y-auto",o,e.className),style:G,children:[(e.title||e.description)&&t.jsxs(u.SheetHeader,{children:[e.title&&t.jsx(u.SheetTitle,{children:e.title}),e.description&&t.jsx(u.SheetDescription,{children:e.description})]}),t.jsx("div",{className:"@container py-4",children:n()})]})})},we={sm:"max-w-sm",default:"max-w-lg",lg:"max-w-2xl",xl:"max-w-4xl",full:"max-w-[95vw] w-full"},Ne={1:void 0,2:"grid gap-4 grid-cols-1 @md:grid-cols-2",3:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3",4:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3 @4xl:grid-cols-4"},Se=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,m]=i.useState(null),[g,E]=i.useState([]),[A,k]=i.useState({}),[O,v]=i.useState(!0),[N,F]=i.useState(null),[C,I]=i.useState(!1),V=e.open!==!1,z=i.useId(),L=i.useMemo(()=>e.sections?.length||e.customFields?.length?null:K(g,s,e.columns,e.mode),[g,s,e.columns,e.mode,e.sections,e.customFields]),G=i.useMemo(()=>{if(e.modalSize)return e.modalSize;if(L?.columns&&L.columns>1)return ie(L.columns);if(e.sections?.length){const w=Math.max(...e.sections.map(y=>Number(y.columns)||1));if(w>1)return ie(w)}return"default"},[e.modalSize,L,e.sections]),q=we[G]||we.default;i.useEffect(()=>{(async()=>{if(!l){v(!1);return}try{const y=await l.getObjectSchema(e.objectName);m(y)}catch(y){F(y),v(!1)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId){k(e.initialData||e.initialValues||{}),v(!1);return}if(!l){k(e.initialData||e.initialValues||{}),v(!1);return}try{const y=await l.findOne(e.objectName,e.recordId);k(y||{})}catch(y){F(y)}finally{v(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const p=i.useCallback(w=>{const y=[];for(const $ of w.fields){const U=typeof $=="string"?$:$.name;if(typeof $=="object")y.push($);else if(s?.fields?.[U]){const D=s.fields[U];y.push({name:U,label:x(e.objectName,U,D.label||U),type:W.mapFieldTypeToFormType(D.type),required:D.required||!1,disabled:e.readOnly||e.mode==="view"||D.readonly,placeholder:D.placeholder,description:D.help||D.description,validation:W.buildValidationRules(D),field:D,options:D.options,multiple:D.multiple})}else y.push({name:U,label:U,type:"input"})}return y},[s,e.readOnly,e.mode]);i.useEffect(()=>{if(!s&&l)return;if(e.customFields?.length){E(e.customFields),v(!1);return}if(e.sections?.length){v(!1);return}if(!s)return;const w=e.fields||Object.keys(s.fields||{}),y=[];for(const $ of w){const U=typeof $=="string"?$:$.name;if(!U)continue;const D=s.fields?.[U];D&&y.push({name:U,label:x(e.objectName,U,D.label||U),type:W.mapFieldTypeToFormType(D.type),required:D.required||!1,disabled:e.readOnly||e.mode==="view"||D.readonly,placeholder:D.placeholder,description:D.help||D.description,validation:W.buildValidationRules(D),field:D,options:D.options,multiple:D.multiple})}E(y),v(!1)},[s,e.fields,e.customFields,e.sections,e.readOnly,e.mode,l]);const n=i.useCallback(async w=>{I(!0);try{if(!l)return e.onSuccess&&await e.onSuccess(w),e.onOpenChange?.(!1),w;let y;return e.mode==="create"?y=await l.create(e.objectName,w):e.mode==="edit"&&e.recordId&&(y=await l.update(e.objectName,e.recordId,w)),e.onSuccess&&await e.onSuccess(y),e.onOpenChange?.(!1),y}catch(y){throw e.onError&&e.onError(y),y}finally{I(!1)}},[e,l]),d=i.useCallback(()=>{e.onCancel&&e.onCancel(),e.onOpenChange?.(!1)},[e]),a=e.layout==="vertical"||e.layout==="horizontal"?e.layout:"vertical",f=e.showSubmit!==!1&&e.mode!=="view",T=e.showCancel!==!1,j=e.submitText||(e.mode==="create"?"Create":"Update"),c=e.cancelText||"Cancel",P={type:"form",layout:a,defaultValues:A,submitLabel:j,cancelLabel:c,showSubmit:f,showCancel:T,onSubmit:n,onCancel:d,showActions:!1,id:z},h=()=>{if(N)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:N.message})]});if(O)return t.jsx("div",{className:"space-y-4","data-testid":"modal-form-skeleton",children:[1,2,3].map($=>t.jsxs("div",{className:"space-y-2",children:[t.jsx(u.Skeleton,{className:"h-4 w-24"}),t.jsx(u.Skeleton,{className:"h-10 w-full"})]},$))});if(e.sections?.length)return t.jsx("div",{className:"space-y-6",children:e.sections.map(($,U)=>{const D=$.columns||1;return t.jsx(B,{label:$.label,description:$.description,columns:D,gridClassName:Ne[D],children:t.jsx(H.SchemaRenderer,{schema:{...P,fields:p($)}})},$.name||$.label||U)})});const w=L??K(g,s,e.columns,e.mode),y=Ne[w.columns||1];return t.jsx(H.SchemaRenderer,{schema:{...P,fields:w.fields,columns:w.columns,...y?{fieldContainerClass:y}:{}}})},b=!O&&!N&&(f||T);return t.jsx(u.Dialog,{open:V,onOpenChange:e.onOpenChange,children:t.jsxs(u.MobileDialogContent,{className:u.cn(q,"flex flex-col h-[100dvh] sm:h-auto sm:max-h-[90vh] overflow-hidden p-0",o,e.className),children:[(e.title||e.description)&&t.jsxs(u.DialogHeader,{className:"shrink-0 px-4 pt-4 sm:px-6 sm:pt-6 pb-2 border-b",children:[e.title&&t.jsx(u.DialogTitle,{children:e.title}),e.description&&t.jsx(u.DialogDescription,{children:e.description})]}),t.jsx("div",{className:"@container flex-1 overflow-y-auto px-4 sm:px-6 py-4",children:h()}),b&&t.jsx("div",{className:"shrink-0 border-t px-4 sm:px-6 py-3 bg-background","data-testid":"modal-form-footer",children:t.jsxs("div",{className:"flex flex-col sm:flex-row gap-2 sm:justify-end",children:[T&&t.jsx(u.Button,{type:"button",variant:"outline",onClick:d,disabled:C,className:"w-full sm:w-auto",children:c}),f&&t.jsxs(u.Button,{type:"submit",form:z,disabled:C,className:"w-full sm:w-auto",children:[C&&t.jsx(J.Loader2,{className:"mr-2 h-4 w-4 animate-spin"}),j]})]})})]})})},ne=({schema:e,dataSource:l})=>{if(e.formType==="tabbed"&&e.sections?.length)return t.jsx(ce,{schema:{...e,formType:"tabbed",sections:e.sections.map(o=>({name:o.name,label:o.label,description:o.description,columns:o.columns,fields:o.fields})),defaultTab:e.defaultTab,tabPosition:e.tabPosition},dataSource:l,className:e.className});if(e.formType==="wizard"&&e.sections?.length)return t.jsx(fe,{schema:{...e,formType:"wizard",sections:e.sections.map(o=>({name:o.name,label:o.label,description:o.description,columns:o.columns,fields:o.fields})),allowSkip:e.allowSkip,showStepIndicator:e.showStepIndicator,nextText:e.nextText,prevText:e.prevText,onStepChange:e.onStepChange},dataSource:l,className:e.className});if(e.formType==="split"&&e.sections?.length)return t.jsx(be,{schema:{...e,formType:"split",sections:e.sections.map(o=>({name:o.name,label:o.label,description:o.description,columns:o.columns,fields:o.fields})),splitDirection:e.splitDirection,splitSize:e.splitSize,splitResizable:e.splitResizable},dataSource:l,className:e.className});if(e.formType==="drawer"){const{layout:o,...x}=e,s=e.layout==="vertical"||e.layout==="horizontal"?e.layout:void 0;return t.jsx(je,{schema:{...x,layout:s,formType:"drawer",sections:e.sections?.map(m=>({name:m.name,label:m.label,description:m.description,columns:m.columns,fields:m.fields})),open:e.open,onOpenChange:e.onOpenChange,drawerSide:e.drawerSide,drawerWidth:e.drawerWidth},dataSource:l,className:e.className})}if(e.formType==="modal"){const{layout:o,...x}=e,s=e.layout==="vertical"||e.layout==="horizontal"?e.layout:void 0;return t.jsx(Se,{schema:{...x,layout:s,formType:"modal",sections:e.sections?.map(m=>({name:m.name,label:m.label,description:m.description,columns:m.columns,fields:m.fields})),open:e.open,onOpenChange:e.onOpenChange,modalSize:e.modalSize,modalCloseButton:e.modalCloseButton},dataSource:l,className:e.className})}return t.jsx(De,{schema:e,dataSource:l})},De=({schema:e,dataSource:l})=>{const{fieldLabel:o}=H.useSafeFieldLabel(),[x,s]=i.useState(null),[m,g]=i.useState([]),[E,A]=i.useState(null),[k,O]=i.useState(!0),[v,N]=i.useState(null),F=e.customFields&&e.customFields.length>0;i.useEffect(()=>{F&&(A(e.initialData||e.initialValues||{}),O(!1))},[F,e.initialData,e.initialValues]),i.useEffect(()=>{const n=async()=>{try{if(!l)throw new Error("DataSource is required when using ObjectQL schema fetching (inline fields not provided)");const d=await l.getObjectSchema(e.objectName);if(!d)throw new Error(`No schema found for object "${e.objectName}"`);s(d)}catch(d){N(d),O(!1)}};F?s({name:e.objectName,fields:{}}):e.objectName&&l?n():F||O(!1)},[e.objectName,l,F]),i.useEffect(()=>{x&&!F&&(async()=>{if(!e.recordId||e.mode==="create"){A(e.initialData||e.initialValues||{}),O(!1);return}if(!F){if(!l){N(new Error("DataSource is required for fetching record data (inline data not provided)")),O(!1);return}O(!0);try{const d=await l.findOne(e.objectName,e.recordId);A(d)}catch(d){console.error("Failed to fetch record:",d),N(d)}finally{O(!1)}}})()},[e.objectName,e.recordId,e.mode,e.initialValues,e.initialData,l,x,F]),i.useEffect(()=>{if(F&&e.customFields){g(e.customFields),O(!1);return}if(!x)return;const n=[],d=e.fields||Object.keys(x.fields||{});(Array.isArray(d)?d:Object.keys(d)).forEach(T=>{const j=typeof T=="string"?T:T.name;if(!j)return;const c=x.fields?.[j];if(!c&&!F)return;const P=!c?.permissions||c?.permissions.write!==!1;if(e.mode!=="view"&&!P)return;const h=e.customFields?.find(b=>b.name===j);if(h)n.push(h);else if(c){const b={name:j,label:o(e.objectName,j,c.label||T),type:W.mapFieldTypeToFormType(c.type),required:c.required||!1,disabled:e.readOnly||e.mode==="view"||c.readonly,placeholder:c.placeholder,description:c.help||c.description,validation:W.buildValidationRules(c),field:c};if((c.type==="select"||c.type==="lookup"||c.type==="master_detail")&&(b.options=c.options||[],b.multiple=c.multiple),(c.type==="number"||c.type==="currency"||c.type==="percent")&&(b.inputType="number",b.min=c.min,b.max=c.max,b.step=c.precision?Math.pow(10,-c.precision):void 0),c.type==="date"&&(b.inputType="date"),c.type==="datetime"&&(b.inputType="datetime-local"),(c.type==="text"||c.type==="textarea"||c.type==="markdown"||c.type==="html")&&(b.maxLength=c.max_length,b.minLength=c.min_length),(c.type==="file"||c.type==="image")&&(b.inputType="file",b.multiple=c.multiple,b.accept=c.accept?c.accept.join(","):void 0,c.max_size)){const w=`Max size: ${W.formatFileSize(c.max_size)}`;b.description=b.description?`${b.description} (${w})`:w}c.type==="email"&&(b.inputType="email"),c.type==="phone"&&(b.inputType="tel"),c.type==="url"&&(b.inputType="url"),c.type==="password"&&(b.inputType="password"),c.type==="time"&&(b.inputType="time"),(c.type==="formula"||c.type==="summary"||c.type==="auto_number")&&(b.disabled=!0),c.visible_on&&(b.visible=w=>W.evaluateCondition(c.visible_on,w)),n.push(b)}}),g(n),!F&&e.recordId&&e.mode!=="create"&&l||O(!1)},[x,e.fields,e.customFields,e.readOnly,e.mode,F,e.recordId,l]);const C=i.useCallback(async(n,d)=>{if(n&&(n.nativeEvent||n._reactName==="onSubmit")&&(console.warn("ObjectForm: Received Event instead of data in handleSubmit! This suggests a Form renderer issue."),d===void 0&&(d=n,n={})),F&&!l)return e.onSuccess&&await e.onSuccess(n),n;if(!l)throw new Error("DataSource is required for form submission (inline mode not configured)");try{let a;if(e.mode==="create")a=await l.create(e.objectName,n);else if(e.mode==="edit"&&e.recordId)a=await l.update(e.objectName,e.recordId,n);else throw new Error("Invalid form mode or missing record ID");return e.onSuccess&&await e.onSuccess(a),a}catch(a){throw console.error("Failed to submit form:",a),e.onError&&e.onError(a),a}},[e,l,F]),I=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),z={...i.useMemo(()=>{if(!x?.fields)return{};const n={};return Object.keys(x.fields).forEach(d=>{const a=x.fields[d];a.defaultValue!==void 0&&(n[d]=a.defaultValue)}),n},[x]),...E};if(v)return t.jsxs("div",{className:"p-3 sm:p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:v.message})]});if(k)return t.jsxs("div",{className:"p-4 sm:p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const L=e.layout==="vertical"||e.layout==="horizontal"?e.layout:"vertical";if(e.sections?.length&&(!e.formType||e.formType==="simple"))return t.jsx("div",{className:"w-full space-y-6",children:e.sections.map((n,d)=>{const a=n.fields.map(T=>typeof T=="string"?T:T.name),f=m.filter(T=>a.includes(T.name));return t.jsx(B,{label:n.label,description:n.description,collapsible:n.collapsible,collapsed:n.collapsed,columns:n.columns,children:t.jsx(H.SchemaRenderer,{schema:{type:"form",fields:f,layout:L,defaultValues:z,showSubmit:d===e.sections.length-1&&e.showSubmit!==!1&&e.mode!=="view",showCancel:d===e.sections.length-1&&e.showCancel!==!1,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,onSubmit:C,onCancel:I}})},n.name||n.label||d)})});const q=e.sections?.length?{fields:m,columns:e.columns}:K(m,x,e.columns,e.mode),p={type:"form",fields:q.fields,layout:L,columns:q.columns,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1,resetOnSubmit:e.showReset,defaultValues:z,onSubmit:C,onCancel:I,className:e.className};return t.jsx("div",{className:"w-full",children:t.jsx(H.SchemaRenderer,{schema:p})})},ve=({config:e,dataSource:l,prefillParams:o,className:x})=>{const[s,m]=i.useState(!1),[g,E]=i.useState(!1),[A,k]=i.useState(null),O=i.useMemo(()=>{const C={};if(o)for(const[I,V]of Object.entries(o))C[I]=V;return typeof window<"u"&&new URLSearchParams(window.location.search).forEach((V,z)=>{z in C||(C[z]=V)}),Object.keys(C).length>0?C:void 0},[o]),v=i.useCallback(async C=>{E(!0),k(null);try{if(l&&await l.create(e.objectName,C),m(!0),e.thankYouPage?.redirectUrl){const I=e.thankYouPage.redirectDelay??3e3;setTimeout(()=>{window.location.href=e.thankYouPage.redirectUrl},I)}}catch(I){k(I instanceof Error?I.message:"Failed to submit form. Please try again.")}finally{E(!1)}},[l,e]),N=i.useCallback(()=>{m(!1),k(null)},[]),F=i.useMemo(()=>{const C={};return e.branding?.backgroundColor&&(C.backgroundColor=e.branding.backgroundColor),C},[e.branding]);if(s){const C=e.thankYouPage;return t.jsx("div",{className:`min-h-screen flex items-center justify-center p-4 ${x||""}`,style:F,children:t.jsxs("div",{className:"max-w-md w-full bg-card rounded-lg shadow-lg p-8 text-center space-y-4",children:[t.jsx("div",{className:"text-4xl",children:"✓"}),t.jsx("h2",{className:"text-xl font-semibold text-foreground",children:C?.title||"Thank You!"}),t.jsx("p",{className:"text-muted-foreground",children:C?.message||"Your submission has been received successfully."}),e.allowMultiple&&t.jsx("button",{onClick:N,className:"mt-4 px-4 py-2 text-sm font-medium rounded-md border border-input bg-background hover:bg-accent hover:text-accent-foreground transition-colors",children:"Submit Another Response"}),C?.redirectUrl&&t.jsxs("p",{className:"text-xs text-muted-foreground",children:["Redirecting in ",Math.ceil((C.redirectDelay??3e3)/1e3)," seconds..."]})]})})}return t.jsx("div",{className:`min-h-screen flex items-center justify-center p-4 ${x||""}`,style:F,children:t.jsxs("div",{className:"max-w-2xl w-full bg-card rounded-lg shadow-lg overflow-hidden",children:[t.jsxs("div",{className:"p-6 border-b",style:e.branding?.primaryColor?{borderBottomColor:e.branding.primaryColor}:void 0,children:[e.branding?.logo&&t.jsx("img",{src:e.branding.logo,alt:"Logo",className:"h-8 mb-4"}),e.title&&t.jsx("h1",{className:"text-xl font-semibold text-foreground",children:e.title}),e.description&&t.jsx("p",{className:"text-sm text-muted-foreground mt-1",children:e.description})]}),t.jsxs("div",{className:"p-6",children:[A&&t.jsx("div",{className:"mb-4 p-3 bg-destructive/10 border border-destructive/30 rounded-md text-sm text-destructive",children:A}),t.jsx(ne,{schema:{type:"object-form",objectName:e.objectName,mode:"create",fields:e.fields,customFields:e.customFields,initialData:O,onSuccess:v,submitLabel:g?"Submitting...":"Submit"},dataSource:l})]}),t.jsx("div",{className:"px-6 py-3 border-t bg-muted/20 text-center",children:t.jsx("p",{className:"text-xs text-muted-foreground",children:"Powered by ObjectStack"})})]})})};function _e(e){return e<60?`${Math.round(e)}s`:e<3600?`${Math.floor(e/60)}m ${Math.round(e%60)}s`:`${Math.floor(e/3600)}h ${Math.floor(e%3600/60)}m`}const Ce=({formId:e,formTitle:l,metrics:o,className:x})=>{const s=i.useMemo(()=>{if(!o.abandonedSubmissions)return 100;const g=o.totalSubmissions+o.abandonedSubmissions;return g===0?0:Math.round(o.totalSubmissions/g*100)},[o.totalSubmissions,o.abandonedSubmissions]),m=i.useMemo(()=>o.dailySubmissions?.length?Math.max(...o.dailySubmissions.map(g=>g.count),1):1,[o.dailySubmissions]);return t.jsxs("div",{className:`space-y-4 ${x||""}`,children:[t.jsxs("div",{children:[t.jsx("h2",{className:"text-lg font-semibold text-foreground",children:l||"Form Analytics"}),t.jsxs("p",{className:"text-sm text-muted-foreground",children:["Form ID: ",e]})]}),t.jsxs("div",{className:"grid grid-cols-1 sm:grid-cols-3 gap-4",children:[t.jsx(u.Card,{children:t.jsxs(u.CardHeader,{className:"pb-2",children:[t.jsx(u.CardDescription,{children:"Total Submissions"}),t.jsx(u.CardTitle,{className:"text-2xl",children:o.totalSubmissions.toLocaleString()})]})}),t.jsxs(u.Card,{children:[t.jsxs(u.CardHeader,{className:"pb-2",children:[t.jsx(u.CardDescription,{children:"Fill Rate"}),t.jsxs(u.CardTitle,{className:"text-2xl",children:[s,"%"]})]}),t.jsx(u.CardContent,{children:t.jsx("div",{className:"w-full bg-muted rounded-full h-2",children:t.jsx("div",{className:"bg-primary rounded-full h-2 transition-all",style:{width:`${s}%`}})})})]}),t.jsx(u.Card,{children:t.jsxs(u.CardHeader,{className:"pb-2",children:[t.jsx(u.CardDescription,{children:"Avg. Completion Time"}),t.jsx(u.CardTitle,{className:"text-2xl",children:o.avgCompletionTime?_e(o.avgCompletionTime):"—"})]})})]}),o.dailySubmissions&&o.dailySubmissions.length>0&&t.jsxs(u.Card,{children:[t.jsx(u.CardHeader,{children:t.jsx(u.CardTitle,{className:"text-sm font-medium",children:"Daily Submissions"})}),t.jsx(u.CardContent,{children:t.jsx("div",{className:"flex items-end gap-1 h-32",children:o.dailySubmissions.map((g,E)=>t.jsxs("div",{className:"flex-1 flex flex-col items-center gap-1",children:[t.jsx("div",{className:"w-full bg-primary/80 rounded-t transition-all hover:bg-primary",style:{height:`${g.count/m*100}%`,minHeight:g.count>0?"4px":"0"},title:`${g.date}: ${g.count} submissions`}),t.jsx("span",{className:"text-[10px] text-muted-foreground truncate w-full text-center",children:g.date.slice(-5)})]},E))})})]}),o.fieldDropOff&&o.fieldDropOff.length>0&&t.jsxs(u.Card,{children:[t.jsxs(u.CardHeader,{children:[t.jsx(u.CardTitle,{className:"text-sm font-medium",children:"Field Completion Rates"}),t.jsx(u.CardDescription,{children:"Percentage of users who completed each field"})]}),t.jsx(u.CardContent,{children:t.jsx("div",{className:"space-y-3",children:o.fieldDropOff.map((g,E)=>t.jsxs("div",{className:"space-y-1",children:[t.jsxs("div",{className:"flex justify-between text-sm",children:[t.jsx("span",{className:"text-foreground",children:g.label}),t.jsxs("span",{className:"text-muted-foreground",children:[g.completionRate,"%"]})]}),t.jsx("div",{className:"w-full bg-muted rounded-full h-1.5",children:t.jsx("div",{className:`rounded-full h-1.5 transition-all ${g.completionRate>=80?"bg-green-500":g.completionRate>=50?"bg-yellow-500":"bg-destructive"}`,style:{width:`${g.completionRate}%`}})})]},E))})})]})]})},Te=({schema:e})=>t.jsx(ne,{schema:e});ee.ComponentRegistry.register("object-form",Te,{namespace:"plugin-form",label:"Object Form",category:"plugin",inputs:[{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"fields",type:"array",label:"Fields"},{name:"mode",type:"enum",label:"Mode",enum:["create","edit","view"]},{name:"formType",type:"enum",label:"Form Type",enum:["simple","tabbed","wizard","split","drawer","modal"]},{name:"sections",type:"array",label:"Sections"},{name:"title",type:"string",label:"Title"},{name:"description",type:"string",label:"Description"},{name:"layout",type:"enum",label:"Layout",enum:["vertical","horizontal","inline","grid"]},{name:"columns",type:"number",label:"Columns"},{name:"defaultTab",type:"string",label:"Default Tab"},{name:"tabPosition",type:"enum",label:"Tab Position",enum:["top","bottom","left","right"]},{name:"allowSkip",type:"boolean",label:"Allow Skip Steps"},{name:"showStepIndicator",type:"boolean",label:"Show Step Indicator"},{name:"splitDirection",type:"enum",label:"Split Direction",enum:["horizontal","vertical"]},{name:"splitSize",type:"number",label:"Split Panel Size (%)"},{name:"splitResizable",type:"boolean",label:"Split Resizable"},{name:"drawerSide",type:"enum",label:"Drawer Side",enum:["top","bottom","left","right"]},{name:"drawerWidth",type:"string",label:"Drawer Width"},{name:"modalSize",type:"enum",label:"Modal Size",enum:["sm","default","lg","xl","full"]}]}),ee.ComponentRegistry.register("form",Te,{namespace:"view",skipFallback:!0,label:"Data Form View",category:"view",inputs:[{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"fields",type:"array",label:"Fields"},{name:"mode",type:"enum",label:"Mode",enum:["create","edit","view"]}]});const Ie=({schema:e})=>t.jsx(ve,{config:e});ee.ComponentRegistry.register("embeddable-form",Ie,{namespace:"plugin-form",label:"Embeddable Form",category:"plugin",inputs:[{name:"formId",type:"string",label:"Form ID",required:!0},{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"title",type:"string",label:"Form Title"},{name:"description",type:"string",label:"Description"},{name:"fields",type:"array",label:"Fields"},{name:"allowMultiple",type:"boolean",label:"Allow Multiple Submissions"}]});const Le=({schema:e})=>t.jsx(Ce,{formId:e.formId,formTitle:e.formTitle,metrics:e.metrics||{totalSubmissions:0}});ee.ComponentRegistry.register("form-analytics",Le,{namespace:"plugin-form",label:"Form Analytics",category:"plugin",inputs:[{name:"formId",type:"string",label:"Form ID",required:!0},{name:"formTitle",type:"string",label:"Form Title"},{name:"metrics",type:"object",label:"Submission Metrics"}]}),_.DrawerForm=je,_.EmbeddableForm=ve,_.FormAnalytics=Ce,_.FormSection=B,_.ModalForm=Se,_.ObjectForm=ne,_.SplitForm=be,_.TabbedForm=ce,_.WizardForm=fe,_.applyAutoColSpan=re,_.applyAutoLayout=K,_.filterCreateModeFields=xe,_.inferColumns=ye,_.inferModalSize=ie,_.isAutoGeneratedFieldType=me,_.isWideFieldType=pe,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})}));
|
|
6
|
+
<%s key={someKey} {...props} />`,R,Y,X,Y),D[Y+R]=!0)}if(Y=null,M!==void 0&&(o(M),Y=""+M),g(S)&&(o(S.key),Y=""+S.key),"key"in S){M={};for(var se in S)se!=="key"&&(M[se]=S[se])}else M=S;return Y&&E(M,typeof r=="function"?r.displayName||r.name||"Unknown":r),k(r,Y,M,s(),le,oe)}function v(r){N(r)?r._store&&(r._store.validated=1):typeof r=="object"&&r!==null&&r.$$typeof===f&&(r._payload.status==="fulfilled"?N(r._payload.value)&&r._payload.value._store&&(r._payload.value._store.validated=1):r._store&&(r._store.validated=1))}function N(r){return typeof r=="object"&&r!==null&&r.$$typeof===C}var F=i,C=Symbol.for("react.transitional.element"),I=Symbol.for("react.portal"),V=Symbol.for("react.fragment"),z=Symbol.for("react.strict_mode"),L=Symbol.for("react.profiler"),G=Symbol.for("react.consumer"),q=Symbol.for("react.context"),m=Symbol.for("react.forward_ref"),n=Symbol.for("react.suspense"),d=Symbol.for("react.suspense_list"),a=Symbol.for("react.memo"),f=Symbol.for("react.lazy"),T=Symbol.for("react.activity"),j=Symbol.for("react.client.reference"),c=F.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,P=Object.prototype.hasOwnProperty,h=Array.isArray,b=console.createTask?console.createTask:function(){return null};F={react_stack_bottom_frame:function(r){return r()}};var w,y={},$=F.react_stack_bottom_frame.bind(F,p)(),U=b(x(p)),D={};Z.Fragment=V,Z.jsx=function(r,S,M){var R=1e4>c.recentlyCreatedOwnerStacks++;return O(r,S,M,!1,R?Error("react-stack-top-frame"):$,R?b(x(r)):U)},Z.jsxs=function(r,S,M){var R=1e4>c.recentlyCreatedOwnerStacks++;return O(r,S,M,!0,R?Error("react-stack-top-frame"):$,R?b(x(r)):U)}})()),Z}var ue;function Ee(){return ue||(ue=1,process.env.NODE_ENV==="production"?te.exports=he():te.exports=Fe()),te.exports}var t=Ee();const B=({label:e,description:l,collapsible:o=!1,collapsed:x=!1,columns:s=1,children:p,className:g,gridClassName:E})=>{const[A,k]=i.useState(x),O={1:"grid-cols-1",2:"grid-cols-1 md:grid-cols-2",3:"grid-cols-1 md:grid-cols-2 lg:grid-cols-3",4:"grid-cols-1 md:grid-cols-2 lg:grid-cols-4"},v=()=>{o&&k(!A)};return t.jsxs("div",{className:u.cn("form-section",g),children:[(e||l)&&t.jsxs("div",{className:u.cn("flex items-start gap-2 mb-4",o&&"cursor-pointer select-none"),onClick:v,role:o?"button":void 0,"aria-expanded":o?!A:void 0,children:[o&&t.jsx("span",{className:"mt-0.5 text-muted-foreground",children:A?t.jsx(J.ChevronRight,{className:"h-4 w-4"}):t.jsx(J.ChevronDown,{className:"h-4 w-4"})}),t.jsxs("div",{className:"flex-1",children:[e&&t.jsx("h3",{className:"text-base font-semibold text-foreground",children:e}),l&&t.jsx("p",{className:"text-sm text-muted-foreground mt-0.5",children:l})]})]}),!A&&t.jsx("div",{className:u.cn("grid gap-4",E||O[s]),children:p})]})},ce=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,p]=i.useState(null),[g,E]=i.useState({}),[A,k]=i.useState(!0),[O,v]=i.useState(null),[N,F]=i.useState(e.defaultTab||e.sections[0]?.name||e.sections[0]?.label||"tab-0");i.useEffect(()=>{(async()=>{if(!l){k(!1);return}try{const n=await l.getObjectSchema(e.objectName);p(n)}catch(n){v(n)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId||!l){E(e.initialData||e.initialValues||{}),k(!1);return}try{const n=await l.findOne(e.objectName,e.recordId);E(n||{})}catch(n){v(n)}finally{k(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const C=i.useCallback(m=>{const n=[];for(const d of m.fields){const a=typeof d=="string"?d:d.name;if(typeof d=="object")n.push(d);else if(s?.fields?.[a]){const f=s.fields[a];n.push({name:a,label:x(e.objectName,a,f.label||a),type:W.mapFieldTypeToFormType(f.type),required:f.required||!1,disabled:e.readOnly||e.mode==="view"||f.readonly,placeholder:f.placeholder,description:f.help||f.description,validation:W.buildValidationRules(f),field:f,options:f.options,multiple:f.multiple})}else n.push({name:a,label:a,type:"input"})}return n},[s,e.readOnly,e.mode]),I=i.useCallback(async m=>{if(!l)return e.onSuccess&&await e.onSuccess(m),m;try{let n;return e.mode==="create"?n=await l.create(e.objectName,m):e.mode==="edit"&&e.recordId&&(n=await l.update(e.objectName,e.recordId,m)),e.onSuccess&&await e.onSuccess(n),n}catch(n){throw e.onError&&e.onError(n),n}},[e,l]),V=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),z=(m,n)=>m.name||m.label||`tab-${n}`;if(O)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:O.message})]});if(A)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const G={type:"form",fields:e.sections.flatMap(m=>C(m)),layout:"vertical",defaultValues:g,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1,onSubmit:I,onCancel:V},q=e.tabPosition==="left"||e.tabPosition==="right";return t.jsx("div",{className:u.cn("w-full",o,e.className),children:t.jsxs(u.Tabs,{value:N,onValueChange:F,orientation:q?"vertical":"horizontal",className:u.cn(q&&"flex gap-4"),children:[t.jsx(u.TabsList,{className:u.cn(q?"flex-col h-auto":"",e.tabPosition==="bottom"&&"order-last",e.tabPosition==="right"&&"order-last"),children:e.sections.map((m,n)=>t.jsx(u.TabsTrigger,{value:z(m,n),className:q?"w-full justify-start":"",children:m.label||`Tab ${n+1}`},z(m,n)))}),t.jsx("div",{className:"flex-1",children:e.sections.map((m,n)=>t.jsx(u.TabsContent,{value:z(m,n),className:"mt-0",children:t.jsx(B,{description:m.description,columns:m.columns||1,children:t.jsx(H.SchemaRenderer,{schema:{...G,fields:C(m),showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1}})})},z(m,n)))})]})})},fe=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,p]=i.useState(null),[g,E]=i.useState({}),[A,k]=i.useState(!0),[O,v]=i.useState(null),[N,F]=i.useState(0),[C,I]=i.useState(new Set),[V,z]=i.useState(!1),L=e.sections.length,G=N===0,q=N===L-1;i.useEffect(()=>{(async()=>{if(!l){k(!1);return}try{const h=await l.getObjectSchema(e.objectName);p(h)}catch(h){v(h)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId||!l){E(e.initialData||e.initialValues||{}),k(!1);return}try{const h=await l.findOne(e.objectName,e.recordId);E(h||{})}catch(h){v(h)}finally{k(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const m=i.useCallback(P=>{const h=[];for(const b of P.fields){const w=typeof b=="string"?b:b.name;if(typeof b=="object")h.push(b);else if(s?.fields?.[w]){const y=s.fields[w];h.push({name:w,label:x(e.objectName,w,y.label||w),type:W.mapFieldTypeToFormType(y.type),required:y.required||!1,disabled:e.readOnly||e.mode==="view"||y.readonly,placeholder:y.placeholder,description:y.help||y.description,validation:W.buildValidationRules(y),field:y,options:y.options,multiple:y.multiple})}else h.push({name:w,label:w,type:"input"})}return h},[s,e.readOnly,e.mode]),n=i.useMemo(()=>N>=0&&N<L?m(e.sections[N]):[],[N,L,e.sections,m]),d=i.useCallback(async P=>{const h={...g,...P};if(E(h),I(b=>new Set(b).add(N)),q){z(!0);try{if(!l)return e.onSuccess&&await e.onSuccess(h),h;let b;return e.mode==="create"?b=await l.create(e.objectName,h):e.mode==="edit"&&e.recordId&&(b=await l.update(e.objectName,e.recordId,h)),e.onSuccess&&await e.onSuccess(b),b}catch(b){throw e.onError&&e.onError(b),b}finally{z(!1)}}else a(N+1)},[g,N,q,e,l]),a=i.useCallback(P=>{P>=0&&P<L&&(F(P),e.onStepChange&&e.onStepChange(P))},[L,e]),f=i.useCallback(()=>{a(N-1)},[N,a]),T=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),j=i.useCallback(P=>{(e.allowSkip||C.has(P)||P<=N)&&a(P)},[e.allowSkip,C,N,a]);if(O)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:O.message})]});if(A)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const c=e.sections[N];return t.jsxs("div",{className:u.cn("w-full",o,e.className),children:[e.showStepIndicator!==!1&&t.jsx("nav",{"aria-label":"Progress",className:"mb-8",children:t.jsx("ol",{className:"flex items-center",children:e.sections.map((P,h)=>{const b=h===N,w=C.has(h),y=e.allowSkip||w||h<=N;return t.jsxs("li",{className:u.cn("relative flex-1",h!==L-1&&"pr-8 sm:pr-12"),children:[h!==L-1&&t.jsx("div",{className:"absolute top-3 sm:top-4 left-6 -right-4 sm:left-10 sm:-right-2 h-0.5","aria-hidden":"true",children:t.jsx("div",{className:u.cn("h-full",w?"bg-primary":"bg-muted")})}),t.jsxs("button",{type:"button",className:u.cn("group relative flex items-center",y?"cursor-pointer":"cursor-not-allowed"),onClick:()=>j(h),disabled:!y,children:[t.jsx("span",{className:u.cn("flex h-6 w-6 sm:h-8 sm:w-8 items-center justify-center rounded-full text-xs sm:text-sm font-medium transition-colors",w&&"bg-primary text-primary-foreground",b&&!w&&"border-2 border-primary bg-background text-primary",!b&&!w&&"border-2 border-muted bg-background text-muted-foreground"),children:w?t.jsx(J.Check,{className:"h-3 w-3 sm:h-4 sm:w-4"}):h+1}),t.jsx("span",{className:"ml-2 sm:ml-3 text-xs sm:text-sm font-medium hidden sm:block",children:t.jsx("span",{className:u.cn(b?"text-foreground":"text-muted-foreground"),children:P.label||`Step ${h+1}`})})]})]},h)})})}),t.jsx("div",{className:"min-h-[200px]",children:c&&t.jsx(B,{label:c.label,description:c.description,columns:c.columns||1,children:n.length>0?t.jsx(H.SchemaRenderer,{schema:{type:"form",fields:n,layout:"vertical",defaultValues:g,showSubmit:!1,showCancel:!1,onSubmit:d}}):t.jsx("div",{className:"text-center py-8 text-muted-foreground",children:"No fields configured for this step"})})}),t.jsxs("div",{className:"flex items-center justify-between mt-6 pt-4 border-t",children:[t.jsx("div",{children:e.showCancel!==!1&&t.jsx(u.Button,{variant:"ghost",onClick:T,children:e.cancelText||"Cancel"})}),t.jsxs("div",{className:"flex items-center gap-2",children:[t.jsxs("span",{className:"text-sm text-muted-foreground mr-2",children:["Step ",N+1," of ",L]}),!G&&t.jsxs(u.Button,{variant:"outline",onClick:f,children:[t.jsx(J.ChevronLeft,{className:"h-4 w-4 mr-1"}),e.prevText||"Back"]}),q?t.jsx(u.Button,{onClick:()=>d(g),disabled:V||e.mode==="view",children:V?"Submitting...":e.submitText||(e.mode==="create"?"Create":"Update")}):t.jsxs(u.Button,{onClick:()=>d(g),children:[e.nextText||"Next",t.jsx(J.ChevronRight,{className:"h-4 w-4 ml-1"})]})]})]})]})},be=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,p]=i.useState(null),[g,E]=i.useState({}),[A,k]=i.useState(!0),[O,v]=i.useState(null);i.useEffect(()=>{(async()=>{if(!l){k(!1);return}try{const n=await l.getObjectSchema(e.objectName);p(n)}catch(n){v(n),k(!1)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId){E(e.initialData||e.initialValues||{}),k(!1);return}if(!l){E(e.initialData||e.initialValues||{}),k(!1);return}try{const n=await l.findOne(e.objectName,e.recordId);E(n||{})}catch(n){v(n)}finally{k(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const N=i.useCallback(m=>{const n=[];for(const d of m.fields){const a=typeof d=="string"?d:d.name;if(typeof d=="object")n.push(d);else if(s?.fields?.[a]){const f=s.fields[a];n.push({name:a,label:x(e.objectName,a,f.label||a),type:W.mapFieldTypeToFormType(f.type),required:f.required||!1,disabled:e.readOnly||e.mode==="view"||f.readonly,placeholder:f.placeholder,description:f.help||f.description,validation:W.buildValidationRules(f),field:f,options:f.options,multiple:f.multiple})}else n.push({name:a,label:a,type:"input"})}return n},[s,e.readOnly,e.mode]),F=i.useCallback(async m=>{if(!l)return e.onSuccess&&await e.onSuccess(m),m;try{let n;return e.mode==="create"?n=await l.create(e.objectName,m):e.mode==="edit"&&e.recordId&&(n=await l.update(e.objectName,e.recordId,m)),e.onSuccess&&await e.onSuccess(n),n}catch(n){throw e.onError&&e.onError(n),n}},[e,l]),C=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),I=i.useMemo(()=>e.sections.slice(0,1),[e.sections]),V=i.useMemo(()=>e.sections.slice(1),[e.sections]);i.useMemo(()=>e.sections.flatMap(m=>N(m)),[e.sections,N]);const z=e.splitDirection||"horizontal",L=e.splitSize||50;if(O)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:O.message})]});if(A)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const G={type:"form",layout:"vertical",defaultValues:g,onSubmit:F,onCancel:C},q=(m,n)=>t.jsx("div",{className:"space-y-4 p-4",children:m.map((d,a)=>t.jsx(B,{label:d.label,description:d.description,columns:d.columns||1,children:t.jsx(H.SchemaRenderer,{schema:{...G,fields:N(d),showSubmit:n&&e.showSubmit!==!1&&e.mode!=="view",showCancel:n&&e.showCancel!==!1,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText}})},d.name||d.label||a))});return t.jsx("div",{className:u.cn("w-full",o,e.className),children:t.jsxs(u.ResizablePanelGroup,{orientation:z,className:"min-h-[300px] rounded-lg border",children:[t.jsx(u.ResizablePanel,{defaultSize:L,minSize:20,children:q(I,V.length===0)}),V.length>0&&t.jsxs(t.Fragment,{children:[t.jsx(u.ResizableHandle,{withHandle:e.splitResizable!==!1}),t.jsx(u.ResizablePanel,{defaultSize:100-L,minSize:20,children:q(V,!0)})]})]})})},ke=new Set(["field:textarea","field:markdown","field:html","field:grid","field:rich-text","textarea","markdown","html","grid","rich-text"]),Oe=new Set(["formula","summary","auto_number","autonumber"]);function me(e){return ke.has(e)}function pe(e){return Oe.has(e)}function ye(e){return e<=3?1:2}function re(e,l){return l<=1?e:e.map(o=>o.colSpan!==void 0?o:o.type&&me(o.type)?{...o,colSpan:l}:o)}function xe(e,l){return l?.fields?e.filter(o=>{const x=l.fields[o.name];return x?!pe(x.type):!0}):e}function ie(e){return e<=1?"default":e===2?"xl":"full"}function K(e,l,o,x){let s=[...e];if(x==="create"&&(s=xe(s,l)),o!==void 0)return s=re(s,o),{fields:s,columns:o};const p=ye(s.length);return s=re(s,p),{fields:s,columns:p}}const ge={1:void 0,2:"grid gap-4 grid-cols-1 @md:grid-cols-2",3:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3",4:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3 @4xl:grid-cols-4"},je=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,p]=i.useState(null),[g,E]=i.useState([]),[A,k]=i.useState({}),[O,v]=i.useState(!0),[N,F]=i.useState(null),C=e.open!==!1,I=e.drawerSide||"right";i.useEffect(()=>{(async()=>{if(!l){v(!1);return}try{const a=await l.getObjectSchema(e.objectName);p(a)}catch(a){F(a),v(!1)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId){k(e.initialData||e.initialValues||{}),v(!1);return}if(!l){k(e.initialData||e.initialValues||{}),v(!1);return}try{const a=await l.findOne(e.objectName,e.recordId);k(a||{})}catch(a){F(a)}finally{v(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const V=i.useCallback(d=>{const a=[];for(const f of d.fields){const T=typeof f=="string"?f:f.name;if(typeof f=="object")a.push(f);else if(s?.fields?.[T]){const j=s.fields[T];a.push({name:T,label:x(e.objectName,T,j.label||T),type:W.mapFieldTypeToFormType(j.type),required:j.required||!1,disabled:e.readOnly||e.mode==="view"||j.readonly,placeholder:j.placeholder,description:j.help||j.description,validation:W.buildValidationRules(j),field:j,options:j.options,multiple:j.multiple})}else a.push({name:T,label:T,type:"input"})}return a},[s,e.readOnly,e.mode]);i.useEffect(()=>{if(!s&&l)return;if(e.customFields?.length){E(e.customFields),v(!1);return}if(e.sections?.length){v(!1);return}if(!s)return;const d=e.fields||Object.keys(s.fields||{}),a=[];for(const f of d){const T=typeof f=="string"?f:f.name;if(!T)continue;const j=s.fields?.[T];j&&a.push({name:T,label:x(e.objectName,T,j.label||T),type:W.mapFieldTypeToFormType(j.type),required:j.required||!1,disabled:e.readOnly||e.mode==="view"||j.readonly,placeholder:j.placeholder,description:j.help||j.description,validation:W.buildValidationRules(j),field:j,options:j.options,multiple:j.multiple})}E(a),v(!1)},[s,e.fields,e.customFields,e.sections,e.readOnly,e.mode,l]);const z=i.useCallback(async d=>{if(!l)return e.onSuccess&&await e.onSuccess(d),e.onOpenChange?.(!1),d;try{let a;return e.mode==="create"?a=await l.create(e.objectName,d):e.mode==="edit"&&e.recordId&&(a=await l.update(e.objectName,e.recordId,d)),e.onSuccess&&await e.onSuccess(a),e.onOpenChange?.(!1),a}catch(a){throw e.onError&&e.onError(a),a}},[e,l]),L=i.useCallback(()=>{e.onCancel&&e.onCancel(),e.onOpenChange?.(!1)},[e]),G=i.useMemo(()=>e.drawerWidth?I==="left"||I==="right"?{width:e.drawerWidth,maxWidth:e.drawerWidth}:{height:e.drawerWidth,maxHeight:e.drawerWidth}:void 0,[e.drawerWidth,I]),m={type:"form",layout:e.layout==="vertical"||e.layout==="horizontal"?e.layout:"vertical",defaultValues:A,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1,onSubmit:z,onCancel:L},n=()=>{if(N)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:N.message})]});if(O)return t.jsxs("div",{className:"p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});if(e.sections?.length)return t.jsx("div",{className:"space-y-6",children:e.sections.map((f,T)=>{const j=f.columns||1;return t.jsx(B,{label:f.label,description:f.description,columns:j,gridClassName:ge[j],children:t.jsx(H.SchemaRenderer,{schema:{...m,fields:V(f),showSubmit:T===e.sections.length-1&&m.showSubmit,showCancel:T===e.sections.length-1&&m.showCancel}})},f.name||f.label||T)})});const d=K(g,s,e.columns,e.mode),a=ge[d.columns||1];return t.jsx(H.SchemaRenderer,{schema:{...m,fields:d.fields,columns:d.columns,...a?{fieldContainerClass:a}:{}}})};return t.jsx(u.Sheet,{open:C,onOpenChange:e.onOpenChange,children:t.jsxs(u.SheetContent,{side:I,className:u.cn("overflow-y-auto",o,e.className),style:G,children:[(e.title||e.description)&&t.jsxs(u.SheetHeader,{children:[e.title&&t.jsx(u.SheetTitle,{children:e.title}),e.description&&t.jsx(u.SheetDescription,{children:e.description})]}),t.jsx("div",{className:"@container py-4",children:n()})]})})},we={sm:"sm:max-w-sm",default:"sm:max-w-lg",lg:"sm:max-w-2xl",xl:"sm:max-w-5xl",full:"sm:max-w-[95vw] sm:w-full"},Ne={1:void 0,2:"grid gap-4 grid-cols-1 @md:grid-cols-2",3:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3",4:"grid gap-4 grid-cols-1 @md:grid-cols-2 @2xl:grid-cols-3 @4xl:grid-cols-4"},Se=({schema:e,dataSource:l,className:o})=>{const{fieldLabel:x}=H.useSafeFieldLabel(),[s,p]=i.useState(null),[g,E]=i.useState([]),[A,k]=i.useState({}),[O,v]=i.useState(!0),[N,F]=i.useState(null),[C,I]=i.useState(!1),V=e.open!==!1,z=i.useId(),L=i.useMemo(()=>e.sections?.length||e.customFields?.length?null:K(g,s,e.columns,e.mode),[g,s,e.columns,e.mode,e.sections,e.customFields]),G=i.useMemo(()=>{if(e.modalSize)return e.modalSize;if(L?.columns&&L.columns>1)return ie(L.columns);if(e.sections?.length){const w=Math.max(...e.sections.map(y=>Number(y.columns)||1));if(w>1)return ie(w)}return"default"},[e.modalSize,L,e.sections]),q=we[G]||we.default;i.useEffect(()=>{(async()=>{if(!l){v(!1);return}try{const y=await l.getObjectSchema(e.objectName);p(y)}catch(y){F(y),v(!1)}})()},[e.objectName,l]),i.useEffect(()=>{(s||!l)&&(async()=>{if(e.mode==="create"||!e.recordId){k(e.initialData||e.initialValues||{}),v(!1);return}if(!l){k(e.initialData||e.initialValues||{}),v(!1);return}try{const y=await l.findOne(e.objectName,e.recordId);k(y||{})}catch(y){F(y)}finally{v(!1)}})()},[s,e.mode,e.recordId,e.initialData,e.initialValues,l,e.objectName]);const m=i.useCallback(w=>{const y=[];for(const $ of w.fields){const U=typeof $=="string"?$:$.name;if(typeof $=="object")y.push($);else if(s?.fields?.[U]){const D=s.fields[U];y.push({name:U,label:x(e.objectName,U,D.label||U),type:W.mapFieldTypeToFormType(D.type),required:D.required||!1,disabled:e.readOnly||e.mode==="view"||D.readonly,placeholder:D.placeholder,description:D.help||D.description,validation:W.buildValidationRules(D),field:D,options:D.options,multiple:D.multiple})}else y.push({name:U,label:U,type:"input"})}return y},[s,e.readOnly,e.mode]);i.useEffect(()=>{if(!s&&l)return;if(e.customFields?.length){E(e.customFields),v(!1);return}if(e.sections?.length){v(!1);return}if(!s)return;const w=e.fields||Object.keys(s.fields||{}),y=[];for(const $ of w){const U=typeof $=="string"?$:$.name;if(!U)continue;const D=s.fields?.[U];D&&y.push({name:U,label:x(e.objectName,U,D.label||U),type:W.mapFieldTypeToFormType(D.type),required:D.required||!1,disabled:e.readOnly||e.mode==="view"||D.readonly,placeholder:D.placeholder,description:D.help||D.description,validation:W.buildValidationRules(D),field:D,options:D.options,multiple:D.multiple})}E(y),v(!1)},[s,e.fields,e.customFields,e.sections,e.readOnly,e.mode,l]);const n=i.useCallback(async w=>{I(!0);try{if(!l)return e.onSuccess&&await e.onSuccess(w),e.onOpenChange?.(!1),w;let y;return e.mode==="create"?y=await l.create(e.objectName,w):e.mode==="edit"&&e.recordId&&(y=await l.update(e.objectName,e.recordId,w)),e.onSuccess&&await e.onSuccess(y),e.onOpenChange?.(!1),y}catch(y){throw e.onError&&e.onError(y),y}finally{I(!1)}},[e,l]),d=i.useCallback(()=>{e.onCancel&&e.onCancel(),e.onOpenChange?.(!1)},[e]),a=e.layout==="vertical"||e.layout==="horizontal"?e.layout:"vertical",f=e.showSubmit!==!1&&e.mode!=="view",T=e.showCancel!==!1,j=e.submitText||(e.mode==="create"?"Create":"Update"),c=e.cancelText||"Cancel",P={type:"form",layout:a,defaultValues:A,submitLabel:j,cancelLabel:c,showSubmit:f,showCancel:T,onSubmit:n,onCancel:d,showActions:!1,id:z},h=()=>{if(N)return t.jsxs("div",{className:"p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:N.message})]});if(O)return t.jsx("div",{className:"space-y-4","data-testid":"modal-form-skeleton",children:[1,2,3].map($=>t.jsxs("div",{className:"space-y-2",children:[t.jsx(u.Skeleton,{className:"h-4 w-24"}),t.jsx(u.Skeleton,{className:"h-10 w-full"})]},$))});if(e.sections?.length)return t.jsx("div",{className:"space-y-6",children:e.sections.map(($,U)=>{const D=$.columns||1;return t.jsx(B,{label:$.label,description:$.description,columns:D,gridClassName:Ne[D],children:t.jsx(H.SchemaRenderer,{schema:{...P,fields:m($)}})},$.name||$.label||U)})});const w=L??K(g,s,e.columns,e.mode),y=Ne[w.columns||1];return t.jsx(H.SchemaRenderer,{schema:{...P,fields:w.fields,columns:w.columns,...y?{fieldContainerClass:y}:{}}})},b=!O&&!N&&(f||T);return t.jsx(u.Dialog,{open:V,onOpenChange:e.onOpenChange,children:t.jsxs(u.MobileDialogContent,{className:u.cn(q,"flex flex-col h-[100dvh] sm:h-auto sm:max-h-[90vh] overflow-hidden p-0",o,e.className),children:[(e.title||e.description)&&t.jsxs(u.DialogHeader,{className:"shrink-0 px-4 pt-4 sm:px-6 sm:pt-6 pb-2 border-b",children:[e.title&&t.jsx(u.DialogTitle,{children:e.title}),e.description&&t.jsx(u.DialogDescription,{children:e.description})]}),t.jsx("div",{className:"@container flex-1 overflow-y-auto px-4 sm:px-6 py-4",children:h()}),b&&t.jsx("div",{className:"shrink-0 border-t px-4 sm:px-6 py-3 bg-background","data-testid":"modal-form-footer",children:t.jsxs("div",{className:"flex flex-col sm:flex-row gap-2 sm:justify-end",children:[T&&t.jsx(u.Button,{type:"button",variant:"outline",onClick:d,disabled:C,className:"w-full sm:w-auto",children:c}),f&&t.jsxs(u.Button,{type:"submit",form:z,disabled:C,className:"w-full sm:w-auto",children:[C&&t.jsx(J.Loader2,{className:"mr-2 h-4 w-4 animate-spin"}),j]})]})})]})})},ne=({schema:e,dataSource:l})=>{if(e.formType==="tabbed"&&e.sections?.length)return t.jsx(ce,{schema:{...e,formType:"tabbed",sections:e.sections.map(o=>({name:o.name,label:o.label,description:o.description,columns:o.columns,fields:o.fields})),defaultTab:e.defaultTab,tabPosition:e.tabPosition},dataSource:l,className:e.className});if(e.formType==="wizard"&&e.sections?.length)return t.jsx(fe,{schema:{...e,formType:"wizard",sections:e.sections.map(o=>({name:o.name,label:o.label,description:o.description,columns:o.columns,fields:o.fields})),allowSkip:e.allowSkip,showStepIndicator:e.showStepIndicator,nextText:e.nextText,prevText:e.prevText,onStepChange:e.onStepChange},dataSource:l,className:e.className});if(e.formType==="split"&&e.sections?.length)return t.jsx(be,{schema:{...e,formType:"split",sections:e.sections.map(o=>({name:o.name,label:o.label,description:o.description,columns:o.columns,fields:o.fields})),splitDirection:e.splitDirection,splitSize:e.splitSize,splitResizable:e.splitResizable},dataSource:l,className:e.className});if(e.formType==="drawer"){const{layout:o,...x}=e,s=e.layout==="vertical"||e.layout==="horizontal"?e.layout:void 0;return t.jsx(je,{schema:{...x,layout:s,formType:"drawer",sections:e.sections?.map(p=>({name:p.name,label:p.label,description:p.description,columns:p.columns,fields:p.fields})),open:e.open,onOpenChange:e.onOpenChange,drawerSide:e.drawerSide,drawerWidth:e.drawerWidth},dataSource:l,className:e.className})}if(e.formType==="modal"){const{layout:o,...x}=e,s=e.layout==="vertical"||e.layout==="horizontal"?e.layout:void 0;return t.jsx(Se,{schema:{...x,layout:s,formType:"modal",sections:e.sections?.map(p=>({name:p.name,label:p.label,description:p.description,columns:p.columns,fields:p.fields})),open:e.open,onOpenChange:e.onOpenChange,modalSize:e.modalSize,modalCloseButton:e.modalCloseButton},dataSource:l,className:e.className})}return t.jsx(De,{schema:e,dataSource:l})},De=({schema:e,dataSource:l})=>{const{fieldLabel:o}=H.useSafeFieldLabel(),[x,s]=i.useState(null),[p,g]=i.useState([]),[E,A]=i.useState(null),[k,O]=i.useState(!0),[v,N]=i.useState(null),F=e.customFields&&e.customFields.length>0;i.useEffect(()=>{F&&(A(e.initialData||e.initialValues||{}),O(!1))},[F,e.initialData,e.initialValues]),i.useEffect(()=>{const n=async()=>{try{if(!l)throw new Error("DataSource is required when using ObjectQL schema fetching (inline fields not provided)");const d=await l.getObjectSchema(e.objectName);if(!d)throw new Error(`No schema found for object "${e.objectName}"`);s(d)}catch(d){N(d),O(!1)}};F?s({name:e.objectName,fields:{}}):e.objectName&&l?n():F||O(!1)},[e.objectName,l,F]),i.useEffect(()=>{x&&!F&&(async()=>{if(!e.recordId||e.mode==="create"){A(e.initialData||e.initialValues||{}),O(!1);return}if(!F){if(!l){N(new Error("DataSource is required for fetching record data (inline data not provided)")),O(!1);return}O(!0);try{const d=await l.findOne(e.objectName,e.recordId);A(d)}catch(d){console.error("Failed to fetch record:",d),N(d)}finally{O(!1)}}})()},[e.objectName,e.recordId,e.mode,e.initialValues,e.initialData,l,x,F]),i.useEffect(()=>{if(F&&e.customFields){g(e.customFields),O(!1);return}if(!x)return;const n=[],d=e.fields||Object.keys(x.fields||{});(Array.isArray(d)?d:Object.keys(d)).forEach(T=>{const j=typeof T=="string"?T:T.name;if(!j)return;const c=x.fields?.[j];if(!c&&!F)return;const P=!c?.permissions||c?.permissions.write!==!1;if(e.mode!=="view"&&!P)return;const h=e.customFields?.find(b=>b.name===j);if(h)n.push(h);else if(c){const b={name:j,label:o(e.objectName,j,c.label||T),type:W.mapFieldTypeToFormType(c.type),required:c.required||!1,disabled:e.readOnly||e.mode==="view"||c.readonly,placeholder:c.placeholder,description:c.help||c.description,validation:W.buildValidationRules(c),field:c};if((c.type==="select"||c.type==="lookup"||c.type==="master_detail")&&(b.options=c.options||[],b.multiple=c.multiple),(c.type==="number"||c.type==="currency"||c.type==="percent")&&(b.inputType="number",b.min=c.min,b.max=c.max,b.step=c.precision?Math.pow(10,-c.precision):void 0),c.type==="date"&&(b.inputType="date"),c.type==="datetime"&&(b.inputType="datetime-local"),(c.type==="text"||c.type==="textarea"||c.type==="markdown"||c.type==="html")&&(b.maxLength=c.max_length,b.minLength=c.min_length),(c.type==="file"||c.type==="image")&&(b.inputType="file",b.multiple=c.multiple,b.accept=c.accept?c.accept.join(","):void 0,c.max_size)){const w=`Max size: ${W.formatFileSize(c.max_size)}`;b.description=b.description?`${b.description} (${w})`:w}c.type==="email"&&(b.inputType="email"),c.type==="phone"&&(b.inputType="tel"),c.type==="url"&&(b.inputType="url"),c.type==="password"&&(b.inputType="password"),c.type==="time"&&(b.inputType="time"),(c.type==="formula"||c.type==="summary"||c.type==="auto_number")&&(b.disabled=!0),c.visible_on&&(b.visible=w=>W.evaluateCondition(c.visible_on,w)),n.push(b)}}),g(n),!F&&e.recordId&&e.mode!=="create"&&l||O(!1)},[x,e.fields,e.customFields,e.readOnly,e.mode,F,e.recordId,l]);const C=i.useCallback(async(n,d)=>{if(n&&(n.nativeEvent||n._reactName==="onSubmit")&&(console.warn("ObjectForm: Received Event instead of data in handleSubmit! This suggests a Form renderer issue."),d===void 0&&(d=n,n={})),F&&!l)return e.onSuccess&&await e.onSuccess(n),n;if(!l)throw new Error("DataSource is required for form submission (inline mode not configured)");try{let a;if(e.mode==="create")a=await l.create(e.objectName,n);else if(e.mode==="edit"&&e.recordId)a=await l.update(e.objectName,e.recordId,n);else throw new Error("Invalid form mode or missing record ID");return e.onSuccess&&await e.onSuccess(a),a}catch(a){throw console.error("Failed to submit form:",a),e.onError&&e.onError(a),a}},[e,l,F]),I=i.useCallback(()=>{e.onCancel&&e.onCancel()},[e]),z={...i.useMemo(()=>{if(!x?.fields)return{};const n={};return Object.keys(x.fields).forEach(d=>{const a=x.fields[d];a.defaultValue!==void 0&&(n[d]=a.defaultValue)}),n},[x]),...E};if(v)return t.jsxs("div",{className:"p-3 sm:p-4 border border-red-300 bg-red-50 rounded-md",children:[t.jsx("h3",{className:"text-red-800 font-semibold",children:"Error loading form"}),t.jsx("p",{className:"text-red-600 text-sm mt-1",children:v.message})]});if(k)return t.jsxs("div",{className:"p-4 sm:p-8 text-center",children:[t.jsx("div",{className:"inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900"}),t.jsx("p",{className:"mt-2 text-sm text-gray-600",children:"Loading form..."})]});const L=e.layout==="vertical"||e.layout==="horizontal"?e.layout:"vertical";if(e.sections?.length&&(!e.formType||e.formType==="simple"))return t.jsx("div",{className:"w-full space-y-6",children:e.sections.map((n,d)=>{const a=n.fields.map(T=>typeof T=="string"?T:T.name),f=p.filter(T=>a.includes(T.name));return t.jsx(B,{label:n.label,description:n.description,collapsible:n.collapsible,collapsed:n.collapsed,columns:n.columns,children:t.jsx(H.SchemaRenderer,{schema:{type:"form",fields:f,layout:L,defaultValues:z,showSubmit:d===e.sections.length-1&&e.showSubmit!==!1&&e.mode!=="view",showCancel:d===e.sections.length-1&&e.showCancel!==!1,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,onSubmit:C,onCancel:I}})},n.name||n.label||d)})});const q=e.sections?.length?{fields:p,columns:e.columns}:K(p,x,e.columns,e.mode),m={type:"form",fields:q.fields,layout:L,columns:q.columns,submitLabel:e.submitText||(e.mode==="create"?"Create":"Update"),cancelLabel:e.cancelText,showSubmit:e.showSubmit!==!1&&e.mode!=="view",showCancel:e.showCancel!==!1,resetOnSubmit:e.showReset,defaultValues:z,onSubmit:C,onCancel:I,className:e.className};return t.jsx("div",{className:"w-full",children:t.jsx(H.SchemaRenderer,{schema:m})})},ve=({config:e,dataSource:l,prefillParams:o,className:x})=>{const[s,p]=i.useState(!1),[g,E]=i.useState(!1),[A,k]=i.useState(null),O=i.useMemo(()=>{const C={};if(o)for(const[I,V]of Object.entries(o))C[I]=V;return typeof window<"u"&&new URLSearchParams(window.location.search).forEach((V,z)=>{z in C||(C[z]=V)}),Object.keys(C).length>0?C:void 0},[o]),v=i.useCallback(async C=>{E(!0),k(null);try{if(l&&await l.create(e.objectName,C),p(!0),e.thankYouPage?.redirectUrl){const I=e.thankYouPage.redirectDelay??3e3;setTimeout(()=>{window.location.href=e.thankYouPage.redirectUrl},I)}}catch(I){k(I instanceof Error?I.message:"Failed to submit form. Please try again.")}finally{E(!1)}},[l,e]),N=i.useCallback(()=>{p(!1),k(null)},[]),F=i.useMemo(()=>{const C={};return e.branding?.backgroundColor&&(C.backgroundColor=e.branding.backgroundColor),C},[e.branding]);if(s){const C=e.thankYouPage;return t.jsx("div",{className:`min-h-screen flex items-center justify-center p-4 ${x||""}`,style:F,children:t.jsxs("div",{className:"max-w-md w-full bg-card rounded-lg shadow-lg p-8 text-center space-y-4",children:[t.jsx("div",{className:"text-4xl",children:"✓"}),t.jsx("h2",{className:"text-xl font-semibold text-foreground",children:C?.title||"Thank You!"}),t.jsx("p",{className:"text-muted-foreground",children:C?.message||"Your submission has been received successfully."}),e.allowMultiple&&t.jsx("button",{onClick:N,className:"mt-4 px-4 py-2 text-sm font-medium rounded-md border border-input bg-background hover:bg-accent hover:text-accent-foreground transition-colors",children:"Submit Another Response"}),C?.redirectUrl&&t.jsxs("p",{className:"text-xs text-muted-foreground",children:["Redirecting in ",Math.ceil((C.redirectDelay??3e3)/1e3)," seconds..."]})]})})}return t.jsx("div",{className:`min-h-screen flex items-center justify-center p-4 ${x||""}`,style:F,children:t.jsxs("div",{className:"max-w-2xl w-full bg-card rounded-lg shadow-lg overflow-hidden",children:[t.jsxs("div",{className:"p-6 border-b",style:e.branding?.primaryColor?{borderBottomColor:e.branding.primaryColor}:void 0,children:[e.branding?.logo&&t.jsx("img",{src:e.branding.logo,alt:"Logo",className:"h-8 mb-4"}),e.title&&t.jsx("h1",{className:"text-xl font-semibold text-foreground",children:e.title}),e.description&&t.jsx("p",{className:"text-sm text-muted-foreground mt-1",children:e.description})]}),t.jsxs("div",{className:"p-6",children:[A&&t.jsx("div",{className:"mb-4 p-3 bg-destructive/10 border border-destructive/30 rounded-md text-sm text-destructive",children:A}),t.jsx(ne,{schema:{type:"object-form",objectName:e.objectName,mode:"create",fields:e.fields,customFields:e.customFields,initialData:O,onSuccess:v,submitLabel:g?"Submitting...":"Submit"},dataSource:l})]}),t.jsx("div",{className:"px-6 py-3 border-t bg-muted/20 text-center",children:t.jsx("p",{className:"text-xs text-muted-foreground",children:"Powered by ObjectStack"})})]})})};function _e(e){return e<60?`${Math.round(e)}s`:e<3600?`${Math.floor(e/60)}m ${Math.round(e%60)}s`:`${Math.floor(e/3600)}h ${Math.floor(e%3600/60)}m`}const Ce=({formId:e,formTitle:l,metrics:o,className:x})=>{const s=i.useMemo(()=>{if(!o.abandonedSubmissions)return 100;const g=o.totalSubmissions+o.abandonedSubmissions;return g===0?0:Math.round(o.totalSubmissions/g*100)},[o.totalSubmissions,o.abandonedSubmissions]),p=i.useMemo(()=>o.dailySubmissions?.length?Math.max(...o.dailySubmissions.map(g=>g.count),1):1,[o.dailySubmissions]);return t.jsxs("div",{className:`space-y-4 ${x||""}`,children:[t.jsxs("div",{children:[t.jsx("h2",{className:"text-lg font-semibold text-foreground",children:l||"Form Analytics"}),t.jsxs("p",{className:"text-sm text-muted-foreground",children:["Form ID: ",e]})]}),t.jsxs("div",{className:"grid grid-cols-1 sm:grid-cols-3 gap-4",children:[t.jsx(u.Card,{children:t.jsxs(u.CardHeader,{className:"pb-2",children:[t.jsx(u.CardDescription,{children:"Total Submissions"}),t.jsx(u.CardTitle,{className:"text-2xl",children:o.totalSubmissions.toLocaleString()})]})}),t.jsxs(u.Card,{children:[t.jsxs(u.CardHeader,{className:"pb-2",children:[t.jsx(u.CardDescription,{children:"Fill Rate"}),t.jsxs(u.CardTitle,{className:"text-2xl",children:[s,"%"]})]}),t.jsx(u.CardContent,{children:t.jsx("div",{className:"w-full bg-muted rounded-full h-2",children:t.jsx("div",{className:"bg-primary rounded-full h-2 transition-all",style:{width:`${s}%`}})})})]}),t.jsx(u.Card,{children:t.jsxs(u.CardHeader,{className:"pb-2",children:[t.jsx(u.CardDescription,{children:"Avg. Completion Time"}),t.jsx(u.CardTitle,{className:"text-2xl",children:o.avgCompletionTime?_e(o.avgCompletionTime):"—"})]})})]}),o.dailySubmissions&&o.dailySubmissions.length>0&&t.jsxs(u.Card,{children:[t.jsx(u.CardHeader,{children:t.jsx(u.CardTitle,{className:"text-sm font-medium",children:"Daily Submissions"})}),t.jsx(u.CardContent,{children:t.jsx("div",{className:"flex items-end gap-1 h-32",children:o.dailySubmissions.map((g,E)=>t.jsxs("div",{className:"flex-1 flex flex-col items-center gap-1",children:[t.jsx("div",{className:"w-full bg-primary/80 rounded-t transition-all hover:bg-primary",style:{height:`${g.count/p*100}%`,minHeight:g.count>0?"4px":"0"},title:`${g.date}: ${g.count} submissions`}),t.jsx("span",{className:"text-[10px] text-muted-foreground truncate w-full text-center",children:g.date.slice(-5)})]},E))})})]}),o.fieldDropOff&&o.fieldDropOff.length>0&&t.jsxs(u.Card,{children:[t.jsxs(u.CardHeader,{children:[t.jsx(u.CardTitle,{className:"text-sm font-medium",children:"Field Completion Rates"}),t.jsx(u.CardDescription,{children:"Percentage of users who completed each field"})]}),t.jsx(u.CardContent,{children:t.jsx("div",{className:"space-y-3",children:o.fieldDropOff.map((g,E)=>t.jsxs("div",{className:"space-y-1",children:[t.jsxs("div",{className:"flex justify-between text-sm",children:[t.jsx("span",{className:"text-foreground",children:g.label}),t.jsxs("span",{className:"text-muted-foreground",children:[g.completionRate,"%"]})]}),t.jsx("div",{className:"w-full bg-muted rounded-full h-1.5",children:t.jsx("div",{className:`rounded-full h-1.5 transition-all ${g.completionRate>=80?"bg-green-500":g.completionRate>=50?"bg-yellow-500":"bg-destructive"}`,style:{width:`${g.completionRate}%`}})})]},E))})})]})]})},Te=({schema:e})=>t.jsx(ne,{schema:e});ee.ComponentRegistry.register("object-form",Te,{namespace:"plugin-form",label:"Object Form",category:"plugin",inputs:[{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"fields",type:"array",label:"Fields"},{name:"mode",type:"enum",label:"Mode",enum:["create","edit","view"]},{name:"formType",type:"enum",label:"Form Type",enum:["simple","tabbed","wizard","split","drawer","modal"]},{name:"sections",type:"array",label:"Sections"},{name:"title",type:"string",label:"Title"},{name:"description",type:"string",label:"Description"},{name:"layout",type:"enum",label:"Layout",enum:["vertical","horizontal","inline","grid"]},{name:"columns",type:"number",label:"Columns"},{name:"defaultTab",type:"string",label:"Default Tab"},{name:"tabPosition",type:"enum",label:"Tab Position",enum:["top","bottom","left","right"]},{name:"allowSkip",type:"boolean",label:"Allow Skip Steps"},{name:"showStepIndicator",type:"boolean",label:"Show Step Indicator"},{name:"splitDirection",type:"enum",label:"Split Direction",enum:["horizontal","vertical"]},{name:"splitSize",type:"number",label:"Split Panel Size (%)"},{name:"splitResizable",type:"boolean",label:"Split Resizable"},{name:"drawerSide",type:"enum",label:"Drawer Side",enum:["top","bottom","left","right"]},{name:"drawerWidth",type:"string",label:"Drawer Width"},{name:"modalSize",type:"enum",label:"Modal Size",enum:["sm","default","lg","xl","full"]}]}),ee.ComponentRegistry.register("form",Te,{namespace:"view",skipFallback:!0,label:"Data Form View",category:"view",inputs:[{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"fields",type:"array",label:"Fields"},{name:"mode",type:"enum",label:"Mode",enum:["create","edit","view"]}]});const Ie=({schema:e})=>t.jsx(ve,{config:e});ee.ComponentRegistry.register("embeddable-form",Ie,{namespace:"plugin-form",label:"Embeddable Form",category:"plugin",inputs:[{name:"formId",type:"string",label:"Form ID",required:!0},{name:"objectName",type:"string",label:"Object Name",required:!0},{name:"title",type:"string",label:"Form Title"},{name:"description",type:"string",label:"Description"},{name:"fields",type:"array",label:"Fields"},{name:"allowMultiple",type:"boolean",label:"Allow Multiple Submissions"}]});const Le=({schema:e})=>t.jsx(Ce,{formId:e.formId,formTitle:e.formTitle,metrics:e.metrics||{totalSubmissions:0}});ee.ComponentRegistry.register("form-analytics",Le,{namespace:"plugin-form",label:"Form Analytics",category:"plugin",inputs:[{name:"formId",type:"string",label:"Form ID",required:!0},{name:"formTitle",type:"string",label:"Form Title"},{name:"metrics",type:"object",label:"Submission Metrics"}]}),_.DrawerForm=je,_.EmbeddableForm=ve,_.FormAnalytics=Ce,_.FormSection=B,_.ModalForm=Se,_.ObjectForm=ne,_.SplitForm=be,_.TabbedForm=ce,_.WizardForm=fe,_.applyAutoColSpan=re,_.applyAutoLayout=K,_.filterCreateModeFields=xe,_.inferColumns=ye,_.inferModalSize=ie,_.isAutoGeneratedFieldType=pe,_.isWideFieldType=me,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})}));
|
|
@@ -38,10 +38,9 @@ export declare function filterCreateModeFields(fields: FormField[], objectSchema
|
|
|
38
38
|
* Used to auto-upgrade the modal width when auto-layout detects multi-column forms.
|
|
39
39
|
*
|
|
40
40
|
* Mapping:
|
|
41
|
-
* - 1 column
|
|
42
|
-
* - 2 columns
|
|
43
|
-
* - 3 columns → '
|
|
44
|
-
* - 4+ columns → 'full' (max-w-[95vw])
|
|
41
|
+
* - 1 column → 'default' (max-w-lg)
|
|
42
|
+
* - 2 columns → 'xl' (max-w-5xl)
|
|
43
|
+
* - 3+ columns → 'full' (max-w-[95vw])
|
|
45
44
|
*/
|
|
46
45
|
export declare function inferModalSize(columns: number): 'sm' | 'default' | 'lg' | 'xl' | 'full';
|
|
47
46
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@object-ui/plugin-form",
|
|
3
|
-
"version": "3.1.
|
|
3
|
+
"version": "3.1.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"description": "Form plugin for Object UI",
|
|
@@ -16,11 +16,11 @@
|
|
|
16
16
|
},
|
|
17
17
|
"dependencies": {
|
|
18
18
|
"lucide-react": "^0.576.0",
|
|
19
|
-
"@object-ui/components": "3.1.
|
|
20
|
-
"@object-ui/core": "3.1.
|
|
21
|
-
"@object-ui/fields": "3.1.
|
|
22
|
-
"@object-ui/react": "3.1.
|
|
23
|
-
"@object-ui/types": "3.1.
|
|
19
|
+
"@object-ui/components": "3.1.2",
|
|
20
|
+
"@object-ui/core": "3.1.2",
|
|
21
|
+
"@object-ui/fields": "3.1.2",
|
|
22
|
+
"@object-ui/react": "3.1.2",
|
|
23
|
+
"@object-ui/types": "3.1.2"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
26
|
"react": "^18.0.0 || ^19.0.0",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"typescript": "^5.9.3",
|
|
33
33
|
"vite": "^7.3.1",
|
|
34
34
|
"vite-plugin-dts": "^4.5.4",
|
|
35
|
-
"@object-ui/data-objectstack": "3.1.
|
|
35
|
+
"@object-ui/data-objectstack": "3.1.2"
|
|
36
36
|
},
|
|
37
37
|
"scripts": {
|
|
38
38
|
"build": "vite build",
|
package/src/ModalForm.tsx
CHANGED
|
@@ -96,13 +96,19 @@ export interface ModalFormProps {
|
|
|
96
96
|
className?: string;
|
|
97
97
|
}
|
|
98
98
|
|
|
99
|
-
/**
|
|
99
|
+
/**
|
|
100
|
+
* Size class map for the dialog content.
|
|
101
|
+
*
|
|
102
|
+
* Uses `sm:` prefix so that `tailwind-merge` correctly resolves the conflict
|
|
103
|
+
* with MobileDialogContent's base `sm:max-w-lg` class. On mobile (< sm) the
|
|
104
|
+
* dialog is already full-screen, so max-width only matters at sm+ breakpoints.
|
|
105
|
+
*/
|
|
100
106
|
const modalSizeClasses: Record<string, string> = {
|
|
101
|
-
sm: 'max-w-sm',
|
|
102
|
-
default: 'max-w-lg',
|
|
103
|
-
lg: 'max-w-2xl',
|
|
104
|
-
xl: 'max-w-
|
|
105
|
-
full: 'max-w-[95vw] w-full',
|
|
107
|
+
sm: 'sm:max-w-sm',
|
|
108
|
+
default: 'sm:max-w-lg',
|
|
109
|
+
lg: 'sm:max-w-2xl',
|
|
110
|
+
xl: 'sm:max-w-5xl',
|
|
111
|
+
full: 'sm:max-w-[95vw] sm:w-full',
|
|
106
112
|
};
|
|
107
113
|
|
|
108
114
|
/**
|
|
@@ -323,7 +323,7 @@ describe('ModalForm Container Query Layout', () => {
|
|
|
323
323
|
});
|
|
324
324
|
|
|
325
325
|
describe('ModalForm Sections — Modal Size Auto-Upgrade', () => {
|
|
326
|
-
it('auto-upgrades modal to
|
|
326
|
+
it('auto-upgrades modal to xl when sections use 2-column layout', async () => {
|
|
327
327
|
const mockDataSource = createMockDataSource();
|
|
328
328
|
|
|
329
329
|
render(
|
|
@@ -356,10 +356,10 @@ describe('ModalForm Sections — Modal Size Auto-Upgrade', () => {
|
|
|
356
356
|
expect(screen.getByText('Create Task')).toBeInTheDocument();
|
|
357
357
|
});
|
|
358
358
|
|
|
359
|
-
// Dialog should auto-upgrade to
|
|
359
|
+
// Dialog should auto-upgrade to xl (max-w-5xl) because sections have columns: 2
|
|
360
360
|
const dialogContent = document.querySelector('[role="dialog"]');
|
|
361
361
|
expect(dialogContent).not.toBeNull();
|
|
362
|
-
expect(dialogContent!.className).toContain('max-w-
|
|
362
|
+
expect(dialogContent!.className).toContain('max-w-5xl');
|
|
363
363
|
});
|
|
364
364
|
|
|
365
365
|
it('keeps default size when all sections use 1-column layout', async () => {
|
|
@@ -76,15 +76,12 @@ describe('autoLayout', () => {
|
|
|
76
76
|
expect(inferModalSize(1)).toBe('default');
|
|
77
77
|
});
|
|
78
78
|
|
|
79
|
-
it('returns
|
|
80
|
-
expect(inferModalSize(2)).toBe('
|
|
79
|
+
it('returns xl for 2 columns', () => {
|
|
80
|
+
expect(inferModalSize(2)).toBe('xl');
|
|
81
81
|
});
|
|
82
82
|
|
|
83
|
-
it('returns
|
|
84
|
-
expect(inferModalSize(3)).toBe('
|
|
85
|
-
});
|
|
86
|
-
|
|
87
|
-
it('returns full for 4+ columns', () => {
|
|
83
|
+
it('returns full for 3+ columns', () => {
|
|
84
|
+
expect(inferModalSize(3)).toBe('full');
|
|
88
85
|
expect(inferModalSize(4)).toBe('full');
|
|
89
86
|
expect(inferModalSize(5)).toBe('full');
|
|
90
87
|
});
|
package/src/autoLayout.ts
CHANGED
|
@@ -117,15 +117,13 @@ export function filterCreateModeFields(
|
|
|
117
117
|
* Used to auto-upgrade the modal width when auto-layout detects multi-column forms.
|
|
118
118
|
*
|
|
119
119
|
* Mapping:
|
|
120
|
-
* - 1 column
|
|
121
|
-
* - 2 columns
|
|
122
|
-
* - 3 columns → '
|
|
123
|
-
* - 4+ columns → 'full' (max-w-[95vw])
|
|
120
|
+
* - 1 column → 'default' (max-w-lg)
|
|
121
|
+
* - 2 columns → 'xl' (max-w-5xl)
|
|
122
|
+
* - 3+ columns → 'full' (max-w-[95vw])
|
|
124
123
|
*/
|
|
125
124
|
export function inferModalSize(columns: number): 'sm' | 'default' | 'lg' | 'xl' | 'full' {
|
|
126
125
|
if (columns <= 1) return 'default';
|
|
127
|
-
if (columns === 2) return '
|
|
128
|
-
if (columns === 3) return 'xl';
|
|
126
|
+
if (columns === 2) return 'xl';
|
|
129
127
|
return 'full';
|
|
130
128
|
}
|
|
131
129
|
|