UNPKG

@baseplate-dev/project-builder-web

Version:

Web interface for constructing project builder JSON

4 lines (3 loc) 24.3 kB
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/index-DiAhmW9l.js","assets/_virtual___federation_fn_import-DOo8C-zl.js","assets/jsx-runtime-D_zvdyIk.js","assets/index-c0qeY2gs.js","assets/index-DqHVrEeL.js","assets/_commonjsHelpers-CqkleIqs.js","assets/index-G5ZRloOW.js","assets/index.esm-DImnoN58.js","assets/sortBy-C9bvycg5.js","assets/immer-B7fdkLVi.js","assets/registries-DdLT7oXj.js","assets/isEqual-C420KeG-.js","assets/index-DSDzUvBX.css","assets/index-tePTxbwc.js","assets/index-D3dgHqIA.js"])))=>i.map(i=>d[i]); import{i as p}from"./_virtual___federation_fn_import-DOo8C-zl.js";import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{b as N,S as q,l as me,n as be,_ as R,o as k}from"./index-DiAhmW9l.js";import{g as Z,s as ee,f as _,e as A,i as G}from"./index.esm-DImnoN58.js";import{H as Y,L as J,c as Q,A as X}from"./index-G5ZRloOW.js";var je=class F{constructor(t,s,i){this.control=t,this.path=s,this.cache=i}static create(t,s){return new F(t,"",s)}focus(t){var s,i,o,r,l,h;const d=t.toString(),m=this.path?`${this.path}.${d}`:d,f=(s=this.cache)==null?void 0:s.get(m,this.reflectedKey);if(f)return f;if(Array.isArray(this.override)){const[b]=this.override,u=new F(this.control,m,this.cache);return u.isArrayItemReflection=!0,u.override=b,(i=this.cache)==null||i.set(u,m),u}else if(this.override){const b=Z(this.override,d);if(!b){const u=new F(this.control,m,this.cache);return(o=this.cache)==null||o.set(u,m),u}if(this.isArrayItemReflection){const u=`${this.path}.${b.path}`,x=new F(this.control,u,this.cache);return(r=this.cache)==null||r.set(x,u),x}else return(l=this.cache)==null||l.set(b,m),b}const j=new F(this.control,m,this.cache);return(h=this.cache)==null||h.set(j,m),j}reflect(t){var s,i,o;const r=(s=this.cache)==null?void 0:s.get(this.path,t);if(r)return r;const l=new F(this.control,this.path,this.cache),h=new Proxy({},{get:(m,f)=>typeof f=="string"?l.focus(f):m}),d=t(h,l);if(Array.isArray(d)){const m=new F(this.control,this.path,this.cache);return l.path="",m.override=t(h,l),m.reflectedKey=t,(i=this.cache)==null||i.set(m,this.path,t),m}else return l.override=d,l.path=this.path,l.reflectedKey=t,(o=this.cache)==null||o.set(l,this.path,t),l}map(t,s){return t.map((i,o,r)=>{const l=this.focus(o.toString());return s(i,l,o,r,this)})}interop(t){var s;return t?t(this.control,this.path):((s=this.interopCache)!=null||(this.interopCache={control:this.control,name:this.path||void 0,...this.override?{getTransformer:this.getTransformer.bind(this),setTransformer:this.setTransformer.bind(this)}:{}}),this.interopCache)}narrow(){return this}assert(){return this}defined(){return this}cast(){return this}getTransformer(t){const[s]=Array.isArray(this.override)?this.override:[this.override];if(!t||!s)return t;const i={};return Object.entries(s).forEach(([o,r])=>{const l=r;if(!l)return;const h=Z(t,l.path);ee(i,o,h)}),i}setTransformer(t){const[s]=Array.isArray(this.override)?this.override:[this.override];if(!t||!s)return t;const i={};return Object.entries(t).forEach(([o,r])=>{const l=s[o];l&&ee(i,l.path,r)}),i}},ge=class{constructor(n){this.cache=new Map,n._subscribe({formState:{values:!0},exact:!0,callback:()=>{n._names.unMount.forEach(t=>{this.delete(t)})}})}get(n,t){const s=this.cache.get(n);if(s)return t?s.complex.get(t):s.plain}set(n,t,s){let i=this.cache.get(t);i||(i={complex:new WeakMap},this.cache.set(t,i)),s?i.complex.set(s,n):i.plain=n}has(n,t){var s,i;return t?(i=(s=this.cache.get(n))==null?void 0:s.complex.has(t))!=null?i:!1:this.cache.has(n)}delete(n){for(const t of this.cache.keys())t.startsWith(n)&&this.cache.delete(t)}clear(){this.cache.clear()}};const{useMemo:ve}=await p("react");function ue(n,t=[]){return ve(()=>{const s=new ge(n.control);return je.create(n.control,s)},[n.control,...t])}const{createAdminCrudInputSchema:Ce,ModelUtils:ye}=await p("@baseplate-dev/project-builder-lib"),{adminCrudInputWebSpec:we,useDefinitionSchema:De,useProjectDefinition:Se}=await p("@baseplate-dev/project-builder-lib/web"),{Button:te,Dialog:Ae,DialogContent:Fe,DialogDescription:Ie,DialogFooter:$e,DialogHeader:Te,DialogTitle:Ee,InputFieldController:Le,SelectFieldController:Ne}=await p("@baseplate-dev/ui-components"),{useEffect:Re,useId:Pe}=await p("react");function Ve({open:n,onOpenChange:t,field:s,modelRef:i,embeddedFormOptions:o,isNew:r=!1,onSave:l}){const{definition:h,pluginContainer:d}=Se(),m=De(Ce),f=i?ye.byIdOrThrow(h,i):void 0,j=d.use(we),b=[...j.inputs.values()].map(y=>({label:y.label,value:y.name})),u=_({resolver:N(m),values:s??{type:"text",label:""}}),{control:x,handleSubmit:D,formState:{isDirty:g},reset:v}=u;Re(()=>{n&&!s&&v({type:"text",label:""})},[n,s,v]);const C=A({control:x,name:"type"}),S=C?j.inputs.get(C):void 0,w=S?.Form,c=D(y=>{l(y),t(!1)}),a=Pe();return e.jsx(Ae,{open:n,onOpenChange:t,children:e.jsx(Fe,{className:"sm:max-w-[500px]",children:e.jsxs("form",{id:a,onSubmit:y=>(y.stopPropagation(),c(y)),children:[e.jsxs(Te,{children:[e.jsx(Ee,{children:r?"Add Field":"Edit Field"}),e.jsx(Ie,{children:r?"Configure the new form field settings.":"Update the field settings below."})]}),e.jsxs("div",{className:"space-y-4 py-4",children:[e.jsx(Ne,{label:"Type",control:x,options:b,name:"type"}),e.jsx(Le,{label:"Label",control:x,name:"label",placeholder:"Enter field label"}),w&&f&&e.jsx(w,{formProps:u,name:"",model:f,embeddedFormOptions:o,pluginKey:S.pluginKey})]}),e.jsxs($e,{children:[e.jsx(te,{type:"button",variant:"outline",onClick:()=>{t(!1)},children:"Cancel"}),e.jsxs(te,{form:a,type:"submit",disabled:!g,children:[r?"Add":"Update"," Field"]})]})]})})})}const{Button:M,RecordView:_e,RecordViewActions:ke,RecordViewItem:ie,RecordViewItemList:Me,useConfirmDialog:Oe}=await p("@baseplate-dev/ui-components"),{useState:O}=await p("react");function he({className:n,formProps:t,embeddedFormOptions:s}){const{control:i}=t,{requestConfirm:o}=Oe(),{fields:r,append:l,remove:h,update:d,move:m}=G({control:i,name:"form.fields"}),[f,j]=O(void 0),[b,u]=O(!1),[x,D]=O(!1),g=A({control:i,name:"form.fields"});function v(a){const y=g[a];o({title:"Delete Field",content:`Are you sure you want to delete the field "${y.label||"Untitled"}"?`,onConfirm:()=>{h(a)}})}function C(a){j(g[a]),u(!0)}function S(){j(void 0),D(!0)}function w(a){if(f){const y=g.findIndex(xe=>xe.id===f.id);y!==-1&&d(y,a)}else l(a)}const c=r.map((a,y)=>({id:a.id,element:e.jsxs(_e,{children:[e.jsxs(Me,{children:[e.jsx(ie,{title:"Label",children:e.jsx("div",{className:"flex items-center gap-2",children:a.label})}),e.jsx(ie,{title:"Type",children:a.type})]}),e.jsxs(ke,{children:[e.jsx(M,{variant:"ghost",size:"icon",title:"Edit","aria-label":"Edit field",onClick:()=>{C(y)},children:e.jsx(Y,{})}),e.jsx(M,{variant:"ghostDestructive",size:"icon",title:"Delete","aria-label":"Delete field",onClick:()=>{v(y)},children:e.jsx(J,{})})]})]},a.id)}));return e.jsxs("div",{className:Q("space-y-4",n),children:[r.length===0?e.jsx("p",{className:"pt-4 text-style-muted",children:"No fields configured. Add fields to create your form."}):e.jsx("div",{className:"flex w-full flex-col gap-2",children:e.jsx(q,{listItems:c,sortItems:m})}),e.jsx(Ve,{open:b||x,onOpenChange:a=>{a||(u(!1),D(!1),j(void 0))},field:f,modelRef:A({control:i,name:"modelRef"})||"",embeddedFormOptions:s,isNew:x,onSave:w}),e.jsxs(M,{variant:"secondary",size:"sm",onClick:S,children:[e.jsx(X,{}),"Add Field"]})]})}const{useMemo:Be}=await p("react");function We(n){const t=G(n);return{fields:Be(()=>n.getTransformer?t.fields.map(n.getTransformer):t.fields,[t.fields,n.getTransformer]),move:t.move,remove:t.remove,swap:t.swap,prepend:(i,o)=>{if(!n.setTransformer)return t.prepend(i,o);const r=Array.isArray(i)?i.map(n.setTransformer):n.setTransformer(i);t.prepend(r,o)},append:(i,o)=>{if(!n.setTransformer)return t.append(i,o);const r=Array.isArray(i)?i.map(n.setTransformer):n.setTransformer(i);t.append(r,o)},insert:(i,o,r)=>{if(!n.setTransformer)return t.insert(i,o,r);const l=Array.isArray(o)?o.map(n.setTransformer):n.setTransformer(o);t.insert(i,l,r)},update:(i,o)=>{if(!n.setTransformer)return t.update(i,o);const r=n.setTransformer(o);t.update(i,r)},replace:i=>{if(!n.setTransformer)return t.replace(i);const o=n.setTransformer(i);t.replace(o)}}}const{createAdminCrudColumnSchema:Ue,ModelUtils:ze}=await p("@baseplate-dev/project-builder-lib"),{adminCrudColumnWebSpec:He,useDefinitionSchema:Ke,useProjectDefinition:qe}=await p("@baseplate-dev/project-builder-lib/web"),{Button:ne,Dialog:Ge,DialogContent:Ye,DialogDescription:Je,DialogFooter:Qe,DialogHeader:Xe,DialogTitle:Ze,InputFieldController:et,SelectFieldController:tt}=await p("@baseplate-dev/ui-components"),{useEffect:it,useId:nt}=await p("react");function st({open:n,onOpenChange:t,column:s,modelRef:i,isNew:o=!1,onSave:r}){const{definition:l,pluginContainer:h}=qe(),d=Ke(Ue),m=i?ze.byIdOrThrow(l,i):void 0,f=h.use(He),j=[...f.columns.values()].filter(a=>i&&a.isAvailableForModel(l,i)).map(a=>({label:a.label,value:a.name})),b=_({resolver:N(d),values:s??{type:"text",label:""}}),{control:u,handleSubmit:x,formState:{isDirty:D},reset:g}=b;it(()=>{n&&!s&&g({type:"text",label:""})},[n,s,g]);const v=A({control:u,name:"type"}),C=v?f.columns.get(v):void 0,S=C?.Form,w=x(a=>{r(a),t(!1)}),c=nt();return e.jsx(Ge,{open:n,onOpenChange:t,children:e.jsx(Ye,{className:"sm:max-w-[425px]",children:e.jsxs("form",{id:c,onSubmit:a=>(a.stopPropagation(),w(a)),children:[e.jsxs(Xe,{children:[e.jsx(Ze,{children:o?"Add Column":"Edit Column"}),e.jsx(Je,{children:o?"Configure the new table column settings.":"Update the column settings below."})]}),e.jsxs("div",{className:"space-y-4 py-4",children:[e.jsx(tt,{label:"Type",control:u,options:j,name:"type"}),e.jsx(et,{label:"Label",control:u,name:"label",placeholder:"Enter column label"}),S&&m&&e.jsx(S,{formProps:b,model:m,pluginKey:C.pluginKey})]}),e.jsxs(Qe,{children:[e.jsx(ne,{type:"button",variant:"outline",onClick:()=>{t(!1)},children:"Cancel"}),e.jsxs(ne,{form:c,type:"submit",disabled:!D,children:[o?"Add":"Update"," Column"]})]})]})})})}const{Button:B,RecordView:ot,RecordViewActions:at,RecordViewItem:se,RecordViewItemList:rt,useConfirmDialog:lt}=await p("@baseplate-dev/ui-components"),{useState:W}=await p("react");function fe({className:n,lens:t,modelRef:s}){const{requestConfirm:i}=lt(),{fields:o,append:r,remove:l,update:h,move:d}=We(t.interop()),[m,f]=W(void 0),[j,b]=W(!1),[u,x]=W(!1);function D(c){const a=o[c];i({title:"Delete Column",content:`Are you sure you want to delete the column "${a.label||"Untitled"}"?`,onConfirm:()=>{l(c)}})}const g=A(t.interop());function v(c){f(g[c]),b(!0)}function C(){f(void 0),x(!0)}function S(c){if(m){const a=g.findIndex(y=>y.id===m.id);a!==-1&&h(a,c)}else r(c)}const w=o.map((c,a)=>({id:c.id,element:e.jsxs(ot,{children:[e.jsxs(rt,{children:[e.jsx(se,{title:"Label",children:e.jsx("div",{className:"flex items-center gap-2",children:e.jsx("span",{children:c.label||e.jsx("span",{className:"text-muted-foreground",children:"Untitled Column"})})})}),e.jsx(se,{title:"Type",children:c.type})]}),e.jsxs(at,{children:[e.jsx(B,{variant:"ghost",size:"icon",title:"Edit","aria-label":"Edit column",onClick:()=>{v(a)},children:e.jsx(Y,{})}),e.jsx(B,{variant:"ghostDestructive",size:"icon",title:"Delete","aria-label":"Delete column",onClick:()=>{D(a)},children:e.jsx(J,{})})]})]},c.id)}));return e.jsxs("div",{className:Q("space-y-4",n),children:[o.length===0?e.jsx("p",{className:"pt-4 text-style-muted",children:"No columns configured. Add columns to display data in your table."}):e.jsx("div",{className:"flex w-full flex-col gap-2",children:e.jsx(q,{listItems:w,sortItems:d})}),e.jsx(st,{open:j||u,onOpenChange:c=>{c||(b(!1),x(!1),f(void 0))},column:m,modelRef:s,isNew:u,onSave:S}),e.jsxs(B,{variant:"secondary",size:"sm",onClick:C,children:[e.jsx(X,{}),"Add Column"]})]})}const{createAdminCrudEmbeddedFormSchema:ct}=await p("@baseplate-dev/project-builder-lib"),{useDefinitionSchema:dt,useProjectDefinition:pe}=await p("@baseplate-dev/project-builder-lib/web"),{Button:K,CheckboxFieldController:mt,InputFieldController:ut,SelectFieldController:oe,Table:ht,TableBody:ft,TableCell:P,TableHead:V,TableHeader:pt,TableRow:ae,toast:xt}=await p("@baseplate-dev/ui-components"),{useId:bt}=await p("react");function jt({items:n,edit:t,remove:s}){const{definitionContainer:i}=pe();return e.jsxs(ht,{className:"max-w-6xl",children:[e.jsx(pt,{children:e.jsxs(ae,{children:[e.jsx(V,{children:"Form Name"}),e.jsx(V,{children:"Model Name"}),e.jsx(V,{children:"Type"}),e.jsx(V,{children:"Actions"})]})}),e.jsx(ft,{children:n.map((o,r)=>e.jsxs(ae,{children:[e.jsx(P,{children:o.name}),e.jsx(P,{children:i.nameFromId(o.modelRef)}),e.jsx(P,{children:o.type}),e.jsxs(P,{className:"space-x-4",children:[e.jsx(K,{variant:"link",size:"none",onClick:()=>{t(r)},children:"Edit"}),e.jsx(K,{variant:"linkDestructive",size:"none",onClick:()=>{s(r)},children:"Remove"})]})]},o.id))})]})}const gt=[{label:"Object",value:"object"},{label:"List",value:"list"}];function vt({initialData:n,onSubmit:t,embeddedFormOptions:s}){const{definition:i}=pe(),o=dt(ct),r=_({resolver:N(o),defaultValues:n}),{handleSubmit:l,control:h,watch:d}=r,m=i.models.map(x=>({label:x.name,value:x.id})),f=d("type"),j=d("modelRef"),b=ue({control:h}),u=bt();return e.jsxs("form",{onSubmit:x=>{x.stopPropagation(),l(t)(x).catch(D=>{xt.error(me(D))})},id:u,className:"space-y-4",children:[e.jsx(ut,{label:"Name",control:h,name:"name"}),e.jsx(oe,{label:"Type",control:h,name:"type",options:gt}),e.jsx(mt,{label:"Include ID Field? (useful for list types)",control:h,name:"includeIdField"}),e.jsx(oe,{label:"Model",control:h,options:m,name:"modelRef"}),f==="list"&&e.jsxs(e.Fragment,{children:[e.jsx("h2",{children:"Table"}),e.jsx(fe,{lens:b.focus("table.columns"),modelRef:j})]}),e.jsx("h2",{children:"Form"}),e.jsx(he,{formProps:r,embeddedFormOptions:s}),e.jsx(K,{type:"submit",form:u,children:"Save"})]})}const{createAdminCrudActionSchema:Ct,ModelUtils:yt}=await p("@baseplate-dev/project-builder-lib"),{adminCrudActionWebSpec:wt,useDefinitionSchema:Dt,useProjectDefinition:St}=await p("@baseplate-dev/project-builder-lib/web"),{Button:re,Dialog:At,DialogContent:Ft,DialogDescription:It,DialogFooter:$t,DialogHeader:Tt,DialogTitle:Et,SelectFieldController:le}=await p("@baseplate-dev/ui-components"),{useEffect:Lt,useId:Nt}=await p("react");function Rt({open:n,onOpenChange:t,action:s,modelRef:i,isNew:o=!1,onSave:r}){const{definition:l,pluginContainer:h}=St(),d=Dt(Ct),m=i?yt.byIdOrThrow(l,i):void 0,f=h.use(wt),j=[...f.actions.values()].filter(a=>i&&a.isAvailableForModel(l,i)).map(a=>({label:a.label,value:a.name})),b=_({resolver:N(d),values:s??{type:"edit",position:"inline"}}),{control:u,handleSubmit:x,formState:{isDirty:D},reset:g}=b;Lt(()=>{n&&!s&&g({type:"edit",position:"inline"})},[n,s,g]);const v=A({control:u,name:"type"}),C=v?f.actions.get(v):void 0,S=C?.Form,w=x(a=>{r(a),t(!1)}),c=Nt();return e.jsx(At,{open:n,onOpenChange:t,children:e.jsx(Ft,{className:"sm:max-w-[500px]",children:e.jsxs("form",{id:c,onSubmit:a=>(a.stopPropagation(),w(a)),children:[e.jsxs(Tt,{children:[e.jsx(Et,{children:o?"Add Action":"Edit Action"}),e.jsx(It,{children:o?"Configure the new table action settings.":"Update the action settings below."})]}),e.jsxs("div",{className:"space-y-4 py-4",children:[e.jsx(le,{label:"Type",control:u,options:j,name:"type"}),e.jsx(le,{label:"Position",control:u,options:[{label:"Inline",value:"inline"},{label:"Dropdown",value:"dropdown"}],name:"position"}),S&&m&&e.jsx(S,{formProps:b,model:m,pluginKey:C.pluginKey})]}),e.jsxs($t,{children:[e.jsx(re,{type:"button",variant:"outline",onClick:()=>{t(!1)},children:"Cancel"}),e.jsxs(re,{form:c,type:"submit",disabled:!D,children:[o?"Add":"Update"," Action"]})]})]})})})}const{Button:U,RecordView:Pt,RecordViewActions:Vt,RecordViewItem:ce,RecordViewItemList:_t,useConfirmDialog:kt}=await p("@baseplate-dev/ui-components"),{useState:z}=await p("react");function Mt({className:n,control:t,modelRef:s}){const{requestConfirm:i}=kt(),{fields:o,append:r,remove:l,update:h,move:d}=G({control:t,name:"table.actions"}),[m,f]=z(void 0),[j,b]=z(!1),[u,x]=z(!1);function D(c){const a=o[c];i({title:"Delete Action",content:`Are you sure you want to delete the "${a.type}" action?`,onConfirm:()=>{l(c)}})}const g=A({control:t,name:"table.actions"});function v(c){f(g?.[c]),b(!0)}function C(){f(void 0),x(!0)}function S(c){if(m){const a=(g??[]).findIndex(y=>y.id===m.id);a!==-1&&h(a,c)}else r(c)}const w=o.map((c,a)=>({id:c.id,element:e.jsxs(Pt,{children:[e.jsxs(_t,{children:[e.jsx(ce,{title:"Type",children:e.jsx("div",{className:"flex items-center gap-2",children:e.jsx("span",{className:"capitalize",children:c.type})})}),e.jsx(ce,{title:"Position",children:c.position})]}),e.jsxs(Vt,{children:[e.jsx(U,{variant:"ghost",size:"icon",title:"Edit","aria-label":"Edit action",onClick:()=>{v(a)},children:e.jsx(Y,{})}),e.jsx(U,{variant:"ghostDestructive",size:"icon",title:"Delete","aria-label":"Delete action",onClick:()=>{D(a)},children:e.jsx(J,{})})]})]},c.id)}));return e.jsxs("div",{className:Q("space-y-4",n),children:[o.length===0?e.jsx("p",{className:"pt-4 text-style-muted",children:"No actions configured. Add actions to enable row operations."}):e.jsx("div",{className:"flex w-full flex-col gap-2",children:e.jsx(q,{listItems:w,sortItems:d})}),e.jsx(Rt,{open:j||u,onOpenChange:c=>{c||(b(!1),x(!1),f(void 0))},action:m,modelRef:s??"",isNew:u,onSave:S}),e.jsxs(U,{variant:"secondary",size:"sm",onClick:C,children:[e.jsx(X,{}),"Add Action"]})]})}const{useProjectDefinition:Ot}=await p("@baseplate-dev/project-builder-lib/web"),{CheckboxFieldController:Bt,ComboboxFieldController:de,SectionListSection:I,SectionListSectionContent:$,SectionListSectionDescription:T,SectionListSectionHeader:E,SectionListSectionTitle:L}=await p("@baseplate-dev/ui-components");function Wt({formProps:n}){const{control:t}=n,{definition:s}=Ot(),i=ue({control:t}),o=s.models.map(d=>({label:d.name,value:d.id})),r=A({control:t,name:"modelRef"}),l=s.models.find(d=>d.id===r)?.model.fields.map(d=>({label:d.name,value:d.id}))??[],h=A({control:t,name:"embeddedForms"})?.map(d=>({label:d.name,value:d.id}))??[];return e.jsxs(e.Fragment,{children:[e.jsxs(I,{children:[e.jsxs(E,{children:[e.jsx(L,{children:"Model Configuration"}),e.jsx(T,{children:"Configure the data model and basic settings for this CRUD section."})]}),e.jsxs($,{className:"space-y-6",children:[e.jsx(de,{label:"Model",control:t,options:o,name:"modelRef"}),e.jsx(de,{label:"Name Field",control:t,options:l,description:"The field to use as the name of the record (used in breadcrumbs/title of edit page)",name:"nameFieldRef"}),e.jsx(Bt,{label:"Disable Create?",control:t,name:"disableCreate"})]})]}),e.jsxs(I,{children:[e.jsxs(E,{children:[e.jsx(L,{children:"Table Configuration"}),e.jsx(T,{children:"Configure which columns to display in the data table."})]}),e.jsx($,{children:e.jsx(fe,{lens:i.focus("table.columns"),modelRef:r})})]}),e.jsxs(I,{children:[e.jsxs(E,{children:[e.jsx(L,{children:"Table Actions"}),e.jsx(T,{children:"Configure actions available for each row in the table. Drag to reorder."})]}),e.jsx($,{children:e.jsx(Mt,{control:t,modelRef:r})})]}),e.jsxs(I,{children:[e.jsxs(E,{children:[e.jsx(L,{children:"Form Configuration"}),e.jsx(T,{children:"Configure the form fields for creating and editing records."})]}),e.jsx($,{children:e.jsx(he,{formProps:n,embeddedFormOptions:h})})]}),e.jsxs(I,{children:[e.jsxs(E,{children:[e.jsx(L,{children:"Embedded Forms"}),e.jsx(T,{children:"Configure embedded forms for related data objects."})]}),e.jsx($,{children:e.jsx(be.LabelledController,{control:t,name:"embeddedForms",renderForm:d=>e.jsx(vt,{...d,embeddedFormOptions:h}),renderTable:d=>e.jsx(jt,{...d}),defaultValue:{type:"object"}})})]})]})}const{AsyncComboboxField:Ut,useControllerMerged:zt}=await p("@baseplate-dev/ui-components"),{compareStrings:Ht}=await p("@baseplate-dev/utils");async function Kt(){const n=await R(()=>import("./index-DiAhmW9l.js").then(r=>r.F),__vite__mapDeps([0,1,2,3,4,5,6,7,8,9,10,11,12])),t=await R(()=>import("./index-tePTxbwc.js"),__vite__mapDeps([13,6,1])),s=await R(()=>import("./index-G5ZRloOW.js").then(r=>r.R),__vite__mapDeps([6,1])),i=await R(()=>import("./index-D3dgHqIA.js"),__vite__mapDeps([14,6,1]));return[n,t,s,i].map(r=>Object.entries(r).filter(([,l])=>typeof l=="function").map(([l,h])=>({label:l,value:l,icon:h}))).flat()}function qt({...n}){return e.jsx(Ut,{placeholder:"Select an icon",...n,loadOptions:t=>Kt().then(s=>s.filter(i=>!t||i.label.toLowerCase().includes(t.toLowerCase())).sort((i,o)=>Ht(i.label,o.label)).slice(0,20)),renderItemLabel:t=>e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(t.icon,{className:"size-4"}),t.label]})})}function Gt({name:n,control:t,...s}){const{field:i,fieldState:{error:o}}=zt({name:n,control:t},s),r=s;return e.jsx(qt,{error:o?.message,...r,...i,value:i.value??null})}const{adminSectionEntityType:Yt,createWebAdminSectionSchema:Jt}=await p("@baseplate-dev/project-builder-lib"),{useBlockUnsavedChangesNavigate:Qt,useDefinitionSchema:Xt,useProjectDefinition:Zt,useResettableForm:ei}=await p("@baseplate-dev/project-builder-lib/web"),{Button:H,ComboboxFieldController:ti,Dialog:ii,DialogClose:ni,DialogContent:si,DialogDescription:oi,DialogFooter:ai,DialogHeader:ri,DialogTitle:li,DialogTrigger:ci,FormActionBar:di,InputFieldController:mi,SectionList:ui,SectionListSection:hi,SectionListSectionContent:fi,SectionListSectionDescription:pi,SectionListSectionHeader:xi,SectionListSectionTitle:bi}=await p("@baseplate-dev/ui-components"),{useNavigate:ji}=await p("@tanstack/react-router");function Di(){const{app:n,section:t}=k.useLoaderData(),{appKey:s,sectionKey:i}=k.useParams(),o=ji({from:k.fullPath}),{definition:r,saveDefinitionWithFeedback:l,isSavingDefinition:h}=Zt(),d=Xt(Jt),m=r.features.map(g=>({label:g.name,value:g.id})),f=ei({resolver:N(d),values:t}),{control:j,handleSubmit:b,reset:u}=f,x=b(g=>{const{id:v,...C}=g;return l(S=>{const w=S.apps.find(a=>a.id===n.id);if(w?.type!=="web"||!w.adminApp)return;const c=w.adminApp.sections?.findIndex(a=>a.id===Yt.idFromKey(i));c!==void 0&&c>=0&&w.adminApp.sections&&(w.adminApp.sections[c]={...C,id:t.id})})}),D=()=>{l(g=>{const v=g.apps.find(C=>C.id===n.id);v?.type!=="web"||!v.adminApp||(v.adminApp.sections=v.adminApp.sections?.filter(C=>C.id!==t.id))},{successMessage:`Successfully deleted section "${t.name}"!`,onSuccess:()=>{o({to:"/admin-sections/$appKey",params:{appKey:s}}).catch(me)}})};return Qt({control:j,reset:u,onSubmit:x}),e.jsxs("div",{className:"relative flex h-full flex-1 flex-col overflow-hidden",children:[e.jsx("div",{className:"max-w-7xl space-y-4 border-b p-4",children:e.jsxs("div",{className:"flex items-center justify-between space-x-4",children:[e.jsxs("div",{children:[e.jsx("h2",{children:t.name}),e.jsxs("p",{className:"text-base text-muted-foreground",children:[t.type," section"]})]}),e.jsxs(ii,{children:[e.jsx(ci,{asChild:!0,children:e.jsx(H,{variant:"secondary",children:"Delete"})}),e.jsxs(si,{children:[e.jsxs(ri,{children:[e.jsxs(li,{children:["Delete ",t.name]}),e.jsxs(oi,{className:"sr-only",children:["Are you sure you want to delete"," ",e.jsx("strong",{children:t.name}),"?"]})]}),e.jsxs("p",{children:["Are you sure you want to delete ",e.jsx("strong",{children:t.name}),"?"]}),e.jsx("p",{className:"text-style-muted",children:"This action will permanently remove the admin section from your application. This cannot be undone."}),e.jsxs(ai,{children:[e.jsx(ni,{asChild:!0,children:e.jsx(H,{variant:"secondary",children:"Cancel"})}),e.jsx(H,{variant:"destructive",onClick:D,disabled:h,children:"Delete Section"})]})]})]})]})}),e.jsx("div",{className:"mb-(--action-bar-height) flex flex-1 overflow-y-auto",style:{"--action-bar-height":"52px"},children:e.jsxs("form",{onSubmit:x,className:"w-full max-w-7xl space-y-4 p-4",children:[e.jsxs(ui,{children:[e.jsxs(hi,{children:[e.jsxs(xi,{children:[e.jsx(bi,{children:"General"}),e.jsx(pi,{children:"Basic configuration for your admin section."})]}),e.jsxs(fi,{className:"space-y-6",children:[e.jsx(mi,{label:"Name",control:j,name:"name",autoComplete:"off"}),e.jsx(ti,{label:"Feature",control:j,options:m,name:"featureRef"}),e.jsx(Gt,{label:"Icon",control:j,name:"icon",description:"Choose an icon to represent this section"})]})]}),e.jsx(Wt,{formProps:f})]}),e.jsx(di,{form:f})]})})]},t.id)}export{Di as component}; //# sourceMappingURL=edit._sectionKey-ch_erDUA.js.map