@firecms/user_management 3.0.0-canary.16 → 3.0.0-canary.161

package/dist/index.umd.js

@@ -1,2 +1,2314 @@
-(function(i,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("react"),require("firebase/firestore"),require("react/jsx-runtime"),require("@firecms/ui"),require("yup"),require("@firecms/core"),require("@firecms/formex"),require("date-fns"),require("date-fns/locale")):typeof define=="function"&&define.amd?define(["exports","react","firebase/firestore","react/jsx-runtime","@firecms/ui","yup","@firecms/core","@firecms/formex","date-fns","date-fns/locale"],c):(i=typeof globalThis<"u"?globalThis:i||self,c(i.FireCMS={},i.React,i.firestore,i.jsxRuntime,i.ui,i.Yup,i.core,i.formex,i.dateFns,i.locales))})(this,function(i,c,N,e,l,se,S,P,re,ne){"use strict";function z(s){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const o in s)if(o!=="default"){const d=Object.getOwnPropertyDescriptor(s,o);Object.defineProperty(r,o,d.get?d:{enumerable:!0,get:()=>s[o]})}}return r.default=s,Object.freeze(r)}const B=z(se),ae=z(ne),te=["Admin"],ie={read:!1,edit:!1,create:!1,delete:!1};function J({collection:s,user:r}){const o=r?.roles;if(o){if(s.ownerId===r?.uid)return{read:!0,create:!0,edit:!0,delete:!0};{const d={read:!1,create:!1,edit:!1,delete:!1};return o.map(n=>ce(n,s.id)).reduce(Y,d)}}else return ie}function ce(s,r){const o={read:s.isAdmin||s.defaultPermissions?.read,create:s.isAdmin||s.defaultPermissions?.create,edit:s.isAdmin||s.defaultPermissions?.edit,delete:s.isAdmin||s.defaultPermissions?.delete};return s.collectionPermissions&&s.collectionPermissions[r]?Y(s.collectionPermissions[r],o):s.defaultPermissions?Y(s.defaultPermissions,o):o}const Y=(s,r)=>({read:s.read||r.read,create:s.create||r.create,edit:s.edit||r.edit,delete:s.delete||r.delete});function de(s,r){return s?r.roles?r.roles.map(o=>s.find(d=>d.id===o.id)).filter(Boolean):[]:void 0}const H=(s,r)=>{const o=s.map(n=>n.id),d=r.map(n=>n.id);return o.length===r.length&&o.every(n=>d.includes(n))};function he(s,r){if(!r)return;const o=Ce(r),d=new Date(o.exp*1e3);localStorage.setItem(`auth_token::${s}`,JSON.stringify({token:r,expiry:d}))}function fe(s){const r=localStorage.getItem(`auth_token::${s}`);if(r){const o=JSON.parse(r);if(o.expiry=new Date(o.expiry),o.expiry>new Date)return o.token}}function ge(){for(let s=0;s<localStorage.length;s++){const r=localStorage.key(s);r?.startsWith("auth_token::")&&localStorage.removeItem(r)}}function Ce(s){if(!s)throw new Error("No JWT token");const o=s.split(".")[1].replace(/-/g,"+").replace(/_/g,"/"),d=decodeURIComponent(window.atob(o).split("").map(function(n){return"%"+("00"+n.charCodeAt(0).toString(16)).slice(-2)}).join(""));return JSON.parse(d)}function pe(s,r=10){if(!/^#([0-9A-Fa-f]{3}){1,2}$/.test(s))throw new Error("Invalid color format");let o=s.substring(1).split("");o.length===3&&(o=[o[0],o[0],o[1],o[1],o[2],o[2]]);let d=parseInt(o[0]+o[1],16),n=parseInt(o[2]+o[3],16),g=parseInt(o[4]+o[5],16);return d=Math.floor(d*(1-r/100)),n=Math.floor(n*(1-r/100)),g=Math.floor(g*(1-r/100)),"#"+(d<16?"0":"")+d.toString(16)+(n<16?"0":"")+n.toString(16)+(g<16?"0":"")+g.toString(16)}function me(s,r=10){if(!/^#([0-9A-Fa-f]{3}){1,2}$/.test(s))throw new Error("Invalid color format");let o=s.substring(1).split("");o.length===3&&(o=[o[0],o[0],o[1],o[1],o[2],o[2]]);const d=parseInt(o[0]+o[1],16),n=parseInt(o[2]+o[3],16),g=parseInt(o[4]+o[5],16),u=r/100;return`rgba(${d}, ${n}, ${g}, ${u})`}function be({firebaseApp:s,usersPath:r="__FIRECMS/config/users",rolesPath:o="__FIRECMS/config/roles",usersLimit:d,canEditRoles:n=!0,allowDefaultRolesCreation:g,includeCollectionConfigPermissions:u}){const C=c.useRef(),[U,v]=c.useState(!0),[h,x]=c.useState(!0),[T,t]=c.useState([]),[m,I]=c.useState([]),w=m.map(b=>({...b,roles:T.filter(y=>b.roles?.includes(y.id))})),[q,V]=c.useState(),[p,f]=c.useState(),D=U||h;c.useEffect(()=>{s&&(C.current=N.getFirestore(s))},[s]),c.useEffect(()=>{if(!s||!o)return;const b=N.getFirestore(s);return N.onSnapshot(N.collection(b,o),{next:y=>{V(void 0);try{const k=ve(y.docs);t(k)}catch(k){V(k)}v(!1)},error:y=>{V(y),v(!1)}})},[s,o]),c.useEffect(()=>{if(!s||!r)return;const b=N.getFirestore(s);return N.onSnapshot(N.collection(b,r),{next:y=>{f(void 0);try{const k=ue(y.docs);I(k)}catch(k){f(k)}x(!1)},error:y=>{f(y),x(!1)}})},[s,r]);const F=c.useCallback(async b=>{const y=C.current;if(!y||!r)throw Error("useFirestoreConfigurationPersistence Firestore not initialised");console.debug("Persisting user",b);const k=b.roles?.map(ke=>ke.id),{uid:$,...W}=b;return N.setDoc(N.doc(y,r,$),{...W,roles:k},{merge:!0}).then(()=>b)},[r]),A=c.useCallback(b=>{const y=C.current;if(!y||!o)throw Error("useFirestoreConfigurationPersistence Firestore not initialised");console.debug("Persisting role",b);const{id:k,...$}=b,W=N.doc(y,o,k);return N.setDoc(W,$,{merge:!0})},[o]),a=c.useCallback(async b=>{const y=C.current;if(!y||!r)throw Error("useFirestoreConfigurationPersistence Firestore not initialised");console.debug("Deleting",b);const{uid:k}=b;return N.deleteDoc(N.doc(y,r,k))},[r]),E=c.useCallback(b=>{const y=C.current;if(!y||!o)throw Error("useFirestoreConfigurationPersistence Firestore not initialised");console.debug("Deleting",b);const{id:k}=b,$=N.doc(y,o,k);return N.deleteDoc($)},[o]),L=c.useCallback(({collection:b,user:y})=>J({collection:b,user:y}),[]),M=w.map(b=>b.uid),De=c.useCallback(b=>{if(!w)throw Error("Users not loaded");return w.find(k=>k.email?.toLowerCase()===b?.email?.toLowerCase())?.roles},[M]);return{loading:D,roles:T,users:w,saveUser:F,saveRole:A,deleteUser:a,deleteRole:E,usersLimit:d,canEditRoles:n===void 0?!0:n,allowDefaultRolesCreation:g===void 0?!0:g,includeCollectionConfigPermissions:!!u,collectionPermissions:L,defineRolesFor:De}}const ue=s=>s.map(r=>{const o=r.data();return{uid:r.id,...o,created_on:o?.created_on?.toDate(),updated_on:o?.updated_on?.toDate()}}),ve=s=>s.map(r=>({id:r.id,...r.data()})),j=c.createContext({});function G({children:s,userManagement:r}){return e.jsx(j.Provider,{value:r,children:s})}const _=()=>c.useContext(j);function O({role:s}){let r;return s.isAdmin?r="blueDarker":s.id==="editor"?r="yellowLight":s.id==="viewer"?r="grayLight":r=l.getColorSchemeForSeed(s.id),e.jsx(l.Chip,{colorScheme:r,children:s.name},s.id)}const K=B.object().shape({id:B.string().required("Required"),name:B.string().required("Required")});function Q({open:s,role:r,editable:o,handleClose:d,collections:n}){const{saveRole:g}=_(),u=!r,[C,U]=c.useState(),v=c.useCallback(a=>(U(void 0),g(a)),[g]),h=P.useCreateFormex({initialValues:r??{name:""},onSubmit:(a,E)=>v(a).then(()=>{E.resetForm({values:a}),d()}).catch(L=>U(L)),validation:a=>K.validate(a,{abortEarly:!1}).then(()=>({})).catch(E=>{const L={};return E.inner.forEach(M=>{L[M.path]=M.message}),L})}),{isSubmitting:x,touched:T,values:t,errors:m,handleChange:I,setFieldValue:w,dirty:q,setFieldTouched:V}=h,p=t.isAdmin??!1,f=t.defaultPermissions?.create??!1,D=t.defaultPermissions?.read??!1,F=t.defaultPermissions?.edit??!1,A=t.defaultPermissions?.delete??!1;return c.useEffect(()=>{!P.getIn(T,"id")&&t.name&&w("id",S.toSnakeCase(t.name))},[T,t.name]),e.jsx(l.Dialog,{open:s,maxWidth:"4xl",children:e.jsx(P.Formex,{value:h,children:e.jsxs("form",{noValidate:!0,autoComplete:"off",onSubmit:h.handleSubmit,style:{display:"flex",flexDirection:"column",position:"relative",height:"100%"},children:[e.jsxs(l.DialogContent,{className:"flex-grow",children:[e.jsx("div",{className:"flex flex-row pt-12 pb-8",children:e.jsx(l.Typography,{variant:"h4",className:"flex-grow",children:"Role"})}),e.jsxs("div",{className:"grid grid-cols-12 gap-8",children:[e.jsxs("div",{className:"col-span-12 md:col-span-8",children:[e.jsx(l.TextField,{name:"name",required:!0,error:T.name&&!!m.name,value:t.name,disabled:p||!o,onChange:I,"aria-describedby":"name-helper-text",label:"Name"}),e.jsx(S.FieldCaption,{children:T.name&&m.name?m.name:"Name of this role"})]}),e.jsxs("div",{className:"col-span-12 md:col-span-4",children:[e.jsx(l.TextField,{name:"id",required:!0,error:T.id&&!!m.id,value:t.id,disabled:!u||!o,onChange:a=>{I(a),V("id",!0)},"aria-describedby":"id-helper-text",label:"ID"}),e.jsx(S.FieldCaption,{children:T.id&&m.id?m.id:"ID of this role"})]}),e.jsxs("div",{className:"col-span-12",children:[e.jsx(l.Paper,{className:"bg-inherit",children:e.jsxs(l.Table,{children:[e.jsxs(l.TableHeader,{children:[e.jsx(l.TableCell,{}),e.jsx(l.TableCell,{align:"center",children:"Create entities"}),e.jsx(l.TableCell,{align:"center",children:"Read entities"}),e.jsx(l.TableCell,{align:"center",children:"Update entities"}),e.jsx(l.TableCell,{align:"center",children:"Delete entities"})]}),e.jsxs(l.TableBody,{children:[e.jsxs(l.TableRow,{children:[e.jsx(l.TableCell,{scope:"row",children:e.jsx("strong",{children:"All collections"})}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Tooltip,{title:"Create entities in collections",children:e.jsx(l.Checkbox,{disabled:p||!o,checked:(p||f)??!1,onCheckedChange:a=>w("defaultPermissions.create",a)})})}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Tooltip,{title:"Access all data in every collection",children:e.jsx(l.Checkbox,{disabled:p||!o,checked:(p||D)??!1,onCheckedChange:a=>w("defaultPermissions.read",a)})})}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Tooltip,{title:"Update data in any collection",children:e.jsx(l.Checkbox,{disabled:p||!o,checked:(p||F)??!1,onCheckedChange:a=>w("defaultPermissions.edit",a)})})}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Tooltip,{title:"Delete data in any collection",children:e.jsx(l.Checkbox,{disabled:p||!o,checked:(p||A)??!1,onCheckedChange:a=>w("defaultPermissions.delete",a)})})})]}),n&&n.map(a=>e.jsxs(l.TableRow,{children:[e.jsx(l.TableCell,{scope:"row",children:a.name}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Checkbox,{disabled:p||f||!o,checked:(p||f||P.getIn(t,`collectionPermissions.${a.path}.create`))??!1,onCheckedChange:E=>w(`collectionPermissions.${a.path}.create`,E)})}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Checkbox,{disabled:p||D||!o,checked:(p||D||P.getIn(t,`collectionPermissions.${a.path}.read`))??!1,onCheckedChange:E=>w(`collectionPermissions.${a.path}.read`,E)})}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Checkbox,{disabled:p||F||!o,checked:(p||F||P.getIn(t,`collectionPermissions.${a.path}.edit`))??!1,onCheckedChange:E=>w(`collectionPermissions.${a.path}.edit`,E)})}),e.jsx(l.TableCell,{align:"center",children:e.jsx(l.Checkbox,{disabled:p||A||!o,checked:(p||A||P.getIn(t,`collectionPermissions.${a.path}.delete`))??!1,onCheckedChange:E=>w(`collectionPermissions.${a.path}.delete`,E)})})]},a.name))]})]})}),e.jsx(S.FieldCaption,{children:"You can customise the permissions that the users related to this role can perform in the entities of each collection"})]}),e.jsxs("div",{className:"col-span-12 md:col-span-4",children:[e.jsxs(l.Select,{error:T.config&&!!m.config,id:"createCollections",name:"createCollections",label:"Create collections",position:"item-aligned",disabled:p||!o,onChange:a=>w("config.createCollections",a.target.value==="true"),value:p||t.config?.createCollections?"true":"false",renderValue:a=>a==="true"?"Yes":"No",children:[e.jsx(l.SelectItem,{value:"true",children:" Yes "}),e.jsx(l.SelectItem,{value:"false",children:" No "})]}),e.jsx(S.FieldCaption,{children:T.config&&m.config?m.config:"Can the user create collections"})]}),e.jsxs("div",{className:"col-span-12 md:col-span-4",children:[e.jsxs(l.Select,{error:T.config&&!!m.config,id:"editCollections",name:"editCollections",label:"Edit collections",disabled:p||!o,position:"item-aligned",onChange:a=>w("config.editCollections",a.target.value==="own"?"own":a.target.value==="true"),value:p?"true":t.config?.editCollections==="own"?"own":t.config?.editCollections?"true":"false",renderValue:a=>a==="own"?"Own":a==="true"?"Yes":"No",children:[e.jsx(l.SelectItem,{value:"true",children:" Yes "}),e.jsx(l.SelectItem,{value:"false",children:" No "}),e.jsx(l.SelectItem,{value:"own",children:" Only his/her own "})]}),e.jsx(S.FieldCaption,{children:T.config&&m.config?m.config:"Can the user edit collections"})]}),e.jsxs("div",{className:"col-span-12 md:col-span-4",children:[e.jsxs(l.Select,{error:T.config&&!!m.config,id:"deleteCollections",name:"deleteCollections",label:"Delete collections",disabled:p||!o,position:"item-aligned",onChange:a=>w("config.deleteCollections",a.target.value==="own"?"own":a.target.value==="true"),value:p?"true":t.config?.deleteCollections==="own"?"own":t.config?.deleteCollections?"true":"false",renderValue:a=>a==="own"?"Own":a==="true"?"Yes":"No",children:[e.jsx(l.SelectItem,{value:"true",children:" Yes "}),e.jsx(l.SelectItem,{value:"false",children:" No "}),e.jsx(l.SelectItem,{value:"own",children:" Only his/her own "})]}),e.jsx(S.FieldCaption,{children:T.config&&m.config?m.config:"Can the user delete collections"})]})]})]}),e.jsxs(l.DialogActions,{position:"sticky",children:[C&&e.jsx(l.Typography,{className:"text-red-500",children:"There was an error saving this role"}),e.jsx(l.Button,{variant:"text",onClick:()=>{d()},children:"Cancel"}),e.jsx(l.LoadingButton,{variant:"filled",color:"primary",type:"submit",disabled:!q,loading:x,startIcon:e.jsx(l.DoneIcon,{}),children:u?"Create role":"Update"})]})]})})})}const we=[{id:"admin",name:"Admin",isAdmin:!0},{id:"editor",name:"Editor",isAdmin:!1,defaultPermissions:{read:!0,create:!0,edit:!0,delete:!0},config:{createCollections:!0,editCollections:"own",deleteCollections:"own"}},{id:"viewer",name:"Viewer",isAdmin:!1,defaultPermissions:{read:!0,create:!1,edit:!1,delete:!1}}];function X({onRoleClicked:s,editable:r}){const{roles:o,saveRole:d,deleteRole:n,allowDefaultRolesCreation:g}=_(),[u,C]=c.useState(void 0),[U,v]=c.useState(!1);return e.jsxs("div",{className:"w-full overflow-auto",children:[e.jsxs(l.Table,{children:[e.jsxs(l.TableHeader,{children:[e.jsx(l.TableCell,{header:!0,className:"w-16"}),e.jsx(l.TableCell,{header:!0,children:"Role"}),e.jsx(l.TableCell,{header:!0,className:"items-center",children:"Is Admin"}),e.jsx(l.TableCell,{header:!0,children:"Default permissions"})]}),e.jsxs(l.TableBody,{children:[o&&o.map(h=>{const x=h.isAdmin||h.defaultPermissions?.create,T=h.isAdmin||h.defaultPermissions?.read,t=h.isAdmin||h.defaultPermissions?.edit,m=h.isAdmin||h.defaultPermissions?.delete;return e.jsxs(l.TableRow,{onClick:()=>{s(h)},children:[e.jsx(l.TableCell,{style:{width:"64px"},children:!h.isAdmin&&e.jsx(l.Tooltip,{title:"Delete this role",children:e.jsx(l.IconButton,{size:"small",disabled:!r,onClick:I=>(I.stopPropagation(),C(h)),children:e.jsx(l.DeleteIcon,{})})})}),e.jsx(l.TableCell,{children:e.jsx(O,{role:h})}),e.jsx(l.TableCell,{className:"items-center",children:e.jsx(l.Checkbox,{checked:h.isAdmin??!1})}),e.jsx(l.TableCell,{children:e.jsxs("ul",{children:[x&&e.jsx("li",{children:"Create"}),T&&e.jsx("li",{children:"Read"}),t&&e.jsx("li",{children:"Update"}),m&&e.jsx("li",{children:"Delete"})]})})]},h.name)}),(!o||o.length===0)&&e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colspan:4,children:e.jsxs(l.CenteredView,{className:"flex flex-col gap-4 my-8 items-center",children:[e.jsx(l.Typography,{variant:"label",children:"You don't have any roles yet."}),g&&e.jsx(l.Button,{variant:"outlined",onClick:()=>{we.forEach(h=>{d(h)})},children:"Create default roles"})]})})})]})]}),e.jsx(S.DeleteConfirmationDialog,{open:!!u,loading:U,onAccept:()=>{u&&(v(!0),n(u).then(()=>{C(void 0)}).finally(()=>{v(!1)}))},onCancel:()=>{C(void 0)},title:e.jsx(e.Fragment,{children:"Delete?"}),body:e.jsx(e.Fragment,{children:"Are you sure you want to delete this role?"})})]})}const Z=c.memo(function({children:r}){const{collections:o}=S.useNavigationController(),[d,n]=c.useState(!1),[g,u]=c.useState(),{canEditRoles:C}=_(),U=c.useCallback(h=>{n(!0),u(h)},[]),v=()=>{u(void 0),n(!1)};return e.jsxs(l.Container,{className:"w-full flex flex-col py-4 gap-4",maxWidth:"6xl",children:[r,e.jsxs("div",{className:"flex items-center mt-12",children:[e.jsx(l.Typography,{gutterBottom:!0,variant:"h4",className:"flex-grow",component:"h4",children:"Roles"}),e.jsx(l.Tooltip,{title:C?void 0:"Update plans to customise roles",children:e.jsx(l.Button,{size:"large",disabled:!C,startIcon:e.jsx(l.AddIcon,{}),onClick:()=>n(!0),children:"Add role"})})]}),e.jsx(X,{onRoleClicked:U,editable:!!C}),e.jsx(Q,{open:d,role:g,editable:C,collections:o,handleClose:v},g?.id??"new")]})}),R=B.object().shape({displayName:B.string().required("Required"),email:B.string().email().required("Required"),roles:B.array().min(1)});function ye(s,r,o,d,n){const g=o.filter(v=>v.roles?.map(h=>h.id).includes("admin")),u=s.roles?.map(v=>v.id).includes("admin");if((!n||!H(n.roles??[],r.roles??[]))&&!u)throw new Error("Only admins can change roles");if(n&&n.roles?.map(v=>v.id).includes("admin")&&!r.roles?.map(v=>v.id).includes("admin")&&g.length===1)throw new Error("There must be at least one admin");return!0}function ee({open:s,user:r,handleClose:o}){const d=S.useSnackbarController(),{user:n}=S.useAuthController(),{saveUser:g,users:u,roles:C}=_(),U=!r,v=c.useCallback(f=>{if(!n)throw new Error("Logged user not found");try{return ye(n,f,u,C,r),g(f)}catch(D){return Promise.reject(D)}},[C,g,r,u,n]),h=P.useCreateFormex({initialValues:r??{displayName:"",email:"",roles:C.filter(f=>f.id==="editor")},validation:f=>R.validate(f,{abortEarly:!1}).then(()=>({})).catch(D=>D.inner.reduce((F,A)=>(F[A.path]=A.message,F),{})),onSubmit:(f,D)=>v(f).then(()=>{o(),D.resetForm({values:f})}).catch(F=>{d.open({type:"error",message:F.message})})}),{isSubmitting:x,touched:T,handleChange:t,values:m,errors:I,setFieldValue:w,dirty:q,handleSubmit:V,submitCount:p}=h;return e.jsx(l.Dialog,{open:s,onOpenChange:f=>f?void 0:o(),maxWidth:"4xl",children:e.jsx(P.Formex,{value:h,children:e.jsxs("form",{onSubmit:V,autoComplete:"off",noValidate:!0,style:{display:"flex",flexDirection:"column",position:"relative",height:"100%"},children:[e.jsxs(l.DialogContent,{className:"h-full flex-grow",children:[e.jsx("div",{className:"flex flex-row pt-4 pb-4",children:e.jsx(l.Typography,{variant:"h4",className:"flex-grow",children:"User"})}),e.jsxs("div",{className:"grid grid-cols-12 gap-8",children:[e.jsxs("div",{className:"col-span-12",children:[e.jsx(l.TextField,{name:"displayName",required:!0,error:p>0&&!!I.displayName,value:m.displayName??"",onChange:t,"aria-describedby":"name-helper-text",label:"Name"}),e.jsx(S.FieldCaption,{children:p>0&&I.displayName?I.displayName:"Name of this user"})]}),e.jsxs("div",{className:"col-span-12",children:[e.jsx(l.TextField,{required:!0,error:p>0&&!!I.email,name:"email",value:m.email??"",onChange:t,"aria-describedby":"email-helper-text",label:"Email"}),e.jsx(S.FieldCaption,{children:p>0&&I.email?I.email:"Email of this user"})]}),e.jsx("div",{className:"col-span-12",children:e.jsx(l.MultiSelect,{label:"Roles",value:m.roles?.map(f=>f.id)??[],onMultiValueChange:f=>w("roles",f.map(D=>C.find(F=>F.id===D))),renderValue:f=>{const D=C.find(F=>F.id===f);return D?e.jsx("div",{className:"flex flex-wrap space-x-2 space-y-2",children:e.jsx(O,{role:D},D?.id)}):null},children:C.map(f=>e.jsx(l.MultiSelectItem,{value:f.id,children:e.jsx(O,{role:f},f?.id)},f.id))})})]})]}),e.jsxs(l.DialogActions,{children:[e.jsx(l.Button,{variant:"text",onClick:()=>{o()},children:"Cancel"}),e.jsx(l.LoadingButton,{variant:"filled",color:"primary",type:"submit",disabled:!q,loading:x,startIcon:e.jsx(l.DoneIcon,{}),children:U?"Create user":"Update"})]})]})})})}function le({onUserClicked:s}){const{users:r,saveUser:o,deleteUser:d}=_(),n=S.useAuthController(),g=S.useSnackbarController(),u=S.useCustomizationController(),C=u?.locale?ae[u?.locale]:void 0,U=u?.dateTimeFormat??S.defaultDateFormat,[v,h]=c.useState(void 0),[x,T]=c.useState(!1);return e.jsxs("div",{className:"overflow-auto",children:[e.jsxs(l.Table,{children:[e.jsxs(l.TableHeader,{children:[e.jsx(l.TableCell,{className:"truncate w-16"}),e.jsx(l.TableCell,{children:"ID"}),e.jsx(l.TableCell,{children:"Email"}),e.jsx(l.TableCell,{children:"Name"}),e.jsx(l.TableCell,{children:"Roles"}),e.jsx(l.TableCell,{children:"Created on"})]}),e.jsxs(l.TableBody,{children:[r&&r.map(t=>{const m=t.roles,I=t.created_on?re.format(t.created_on,U,{locale:C}):"";return e.jsxs(l.TableRow,{onClick:()=>{s(t)},children:[e.jsx(l.TableCell,{className:"w-10",children:e.jsx(l.Tooltip,{title:"Delete this user",children:e.jsx(l.IconButton,{size:"small",onClick:w=>(w.stopPropagation(),h(t)),children:e.jsx(l.DeleteIcon,{})})})}),e.jsx(l.TableCell,{children:t.uid}),e.jsx(l.TableCell,{children:t.email}),e.jsx(l.TableCell,{className:"font-medium align-left",children:t.displayName}),e.jsx(l.TableCell,{className:"align-left",children:m?e.jsx("div",{className:"flex flex-wrap gap-2",children:m.map(w=>e.jsx(O,{role:w},w?.id))}):null}),e.jsx(l.TableCell,{children:I})]},"row_"+t.uid)}),(!r||r.length===0)&&e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colspan:6,children:e.jsxs(l.CenteredView,{className:"flex flex-col gap-4 my-8 items-center",children:[e.jsx(l.Typography,{variant:"label",children:"There are no users yet"}),e.jsx(l.Button,{variant:"outlined",onClick:()=>{if(!n.user?.uid)throw Error("UsersTable, authController misconfiguration");o({uid:n.user?.uid,email:n.user?.email,displayName:n.user?.displayName,photoURL:n.user?.photoURL,providerId:n.user?.providerId,isAnonymous:n.user?.isAnonymous,roles:[{id:"admin",name:"Admin"}],created_on:new Date}).then(()=>{g.open({type:"success",message:"User added successfully"})}).catch(t=>{g.open({type:"error",message:"Error adding user: "+t.message})})},children:"Add the logged user as an admin"})]})})})]})]}),e.jsx(S.DeleteConfirmationDialog,{open:!!v,loading:x,onAccept:()=>{v&&(T(!0),d(v).then(()=>{h(void 0)}).catch(t=>{g.open({type:"error",message:"Error deleting user: "+t.message})}).finally(()=>{T(!1)}))},onCancel:()=>{h(void 0)},title:e.jsx(e.Fragment,{children:"Delete?"}),body:e.jsx(e.Fragment,{children:"Are you sure you want to delete this user?"})})]})}const oe=function({children:r}){const[o,d]=c.useState(),[n,g]=c.useState(),{users:u,usersLimit:C}=_(),U=C!==void 0&&u&&u.length>=C,v=c.useCallback(x=>{g(x),d(!0)},[]),h=c.useCallback(()=>{d(!1),g(void 0)},[]);return e.jsxs(l.Container,{className:"w-full flex flex-col py-4 gap-4",maxWidth:"6xl",children:[r,e.jsxs("div",{className:"flex items-center mt-12",children:[e.jsx(l.Typography,{gutterBottom:!0,variant:"h4",className:"flex-grow",component:"h4",children:"Users"}),e.jsx(l.Button,{size:"large",disabled:U,startIcon:e.jsx(l.AddIcon,{}),onClick:()=>d(!0),children:"Add user"})]}),e.jsx(le,{onUserClicked:v}),e.jsx(ee,{open:o??!1,user:n,handleClose:h},n?.uid??"new")]})};function Te({userManagement:s}){return{key:"user_management",loading:s.loading,provider:{Component:G,props:{userManagement:s}}}}const Se=[{path:"users",name:"CMS Users",group:"Admin",icon:"face",view:e.jsx(oe,{})},{path:"roles",name:"Roles",group:"Admin",icon:"gpp_good",view:e.jsx(Z,{})}];i.RESERVED_GROUPS=te,i.RoleChip=O,i.RoleYupSchema=K,i.RolesDetailsForm=Q,i.RolesTable=X,i.RolesView=Z,i.UserDetailsForm=ee,i.UserManagementContext=j,i.UserManagementProvider=G,i.UserYupSchema=R,i.UsersTable=le,i.UsersView=oe,i.areRolesEqual=H,i.cacheDelegatedLoginToken=he,i.clearDelegatedLoginTokensCache=ge,i.darkenColor=pe,i.getDelegatedLoginTokenFromCache=fe,i.getUserRoles=de,i.hexToRgbaWithOpacity=me,i.resolveUserRolePermissions=J,i.useBuildFirestoreUserManagement=be,i.useUserManagement=_,i.useUserManagementPlugin=Te,i.userManagementAdminViews=Se,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});
+(function(global, factory) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("react-fast-compare"), require("@firecms/core"), require("react/jsx-runtime"), require("react-compiler-runtime"), require("@firecms/ui"), require("yup"), require("@firecms/formex"), require("date-fns"), require("date-fns/locale")) : typeof define === "function" && define.amd ? define(["exports", "react", "react-fast-compare", "@firecms/core", "react/jsx-runtime", "react-compiler-runtime", "@firecms/ui", "yup", "@firecms/formex", "date-fns", "date-fns/locale"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, factory(global.FireCMS = {}, global.React, global.equal, global.core, global.jsxRuntime, global.reactCompilerRuntime, global.ui, global.Yup, global.formex, global.dateFns, global.locales));
+})(this, function(exports2, React, equal, core, jsxRuntime, reactCompilerRuntime, ui, Yup, formex, dateFns, locales) {
+  "use strict";
+  function _interopNamespaceDefault(e) {
+    const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+    if (e) {
+      for (const k in e) {
+        if (k !== "default") {
+          const d = Object.getOwnPropertyDescriptor(e, k);
+          Object.defineProperty(n, k, d.get ? d : {
+            enumerable: true,
+            get: () => e[k]
+          });
+        }
+      }
+    }
+    n.default = e;
+    return Object.freeze(n);
+  }
+  const Yup__namespace = /* @__PURE__ */ _interopNamespaceDefault(Yup);
+  const locales__namespace = /* @__PURE__ */ _interopNamespaceDefault(locales);
+  const RESERVED_GROUPS = ["Admin"];
+  const DEFAULT_PERMISSIONS = {
+    read: false,
+    edit: false,
+    create: false,
+    delete: false
+  };
+  function resolveUserRolePermissions({
+    collection,
+    user
+  }) {
+    const roles = user?.roles;
+    if (!roles) {
+      return DEFAULT_PERMISSIONS;
+    } else if (collection.ownerId === user?.uid) {
+      return {
+        read: true,
+        create: true,
+        edit: true,
+        delete: true
+      };
+    } else {
+      const basePermissions = {
+        read: false,
+        create: false,
+        edit: false,
+        delete: false
+      };
+      return roles.map((role) => resolveCollectionRole(role, collection.id)).reduce(mergePermissions, basePermissions);
+    }
+  }
+  function resolveCollectionRole(role, id) {
+    const basePermissions = {
+      read: (role.isAdmin || role.defaultPermissions?.read) ?? false,
+      create: (role.isAdmin || role.defaultPermissions?.create) ?? false,
+      edit: (role.isAdmin || role.defaultPermissions?.edit) ?? false,
+      delete: (role.isAdmin || role.defaultPermissions?.delete) ?? false
+    };
+    const thisCollectionPermissions = role.collectionPermissions?.[id];
+    if (thisCollectionPermissions) {
+      return mergePermissions(thisCollectionPermissions, basePermissions);
+    } else if (role.defaultPermissions) {
+      return mergePermissions(role.defaultPermissions, basePermissions);
+    } else {
+      return basePermissions;
+    }
+  }
+  const mergePermissions = (permA, permB) => {
+    return {
+      read: permA.read || permB.read,
+      create: permA.create || permB.create,
+      edit: permA.edit || permB.edit,
+      delete: permA.delete || permB.delete
+    };
+  };
+  function getUserRoles(roles, fireCMSUser) {
+    return !roles ? void 0 : fireCMSUser.roles ? fireCMSUser.roles.map((role) => roles.find((r) => r.id === role.id)).filter(Boolean) : [];
+  }
+  const areRolesEqual = (rolesA, rolesB) => {
+    const rolesAIds = rolesA.map((r) => r.id);
+    const rolesBIds = rolesB.map((r) => r.id);
+    return rolesAIds.length === rolesB.length && rolesAIds.every((role) => rolesBIds.includes(role));
+  };
+  function cacheDelegatedLoginToken(projectId, delegatedToken) {
+    if (!delegatedToken) {
+      return;
+    }
+    const data = parseJwt(delegatedToken);
+    const expiry = new Date(data.exp * 1e3);
+    localStorage.setItem(`auth_token::${projectId}`, JSON.stringify({
+      token: delegatedToken,
+      expiry
+    }));
+  }
+  function getDelegatedLoginTokenFromCache(projectId) {
+    const entry = localStorage.getItem(`auth_token::${projectId}`);
+    if (entry) {
+      const data = JSON.parse(entry);
+      data.expiry = new Date(data.expiry);
+      if (data.expiry > /* @__PURE__ */ new Date()) {
+        return data.token;
+      }
+    }
+    return void 0;
+  }
+  function clearDelegatedLoginTokensCache() {
+    for (let i = 0; i < localStorage.length; i++) {
+      const key = localStorage.key(i);
+      if (key?.startsWith("auth_token::")) {
+        localStorage.removeItem(key);
+      }
+    }
+  }
+  function parseJwt(token) {
+    if (!token) {
+      throw new Error("No JWT token");
+    }
+    const base64Url = token.split(".")[1];
+    const base64 = base64Url.replace(/-/g, "+").replace(/_/g, "/");
+    const jsonPayload = decodeURIComponent(window.atob(base64).split("").map(function(c) {
+      return "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2);
+    }).join(""));
+    return JSON.parse(jsonPayload);
+  }
+  function darkenColor(hexColor, darkenBy = 10) {
+    if (!/^#([0-9A-Fa-f]{3}){1,2}$/.test(hexColor)) {
+      throw new Error("Invalid color format");
+    }
+    let color = hexColor.substring(1).split("");
+    if (color.length === 3) {
+      color = [color[0], color[0], color[1], color[1], color[2], color[2]];
+    }
+    let r = parseInt(color[0] + color[1], 16);
+    let g = parseInt(color[2] + color[3], 16);
+    let b = parseInt(color[4] + color[5], 16);
+    r = Math.floor(r * (1 - darkenBy / 100));
+    g = Math.floor(g * (1 - darkenBy / 100));
+    b = Math.floor(b * (1 - darkenBy / 100));
+    return "#" + (r < 16 ? "0" : "") + r.toString(16) + (g < 16 ? "0" : "") + g.toString(16) + (b < 16 ? "0" : "") + b.toString(16);
+  }
+  function hexToRgbaWithOpacity(hexColor, opacity = 10) {
+    if (!/^#([0-9A-Fa-f]{3}){1,2}$/.test(hexColor)) {
+      throw new Error("Invalid color format");
+    }
+    let color = hexColor.substring(1).split("");
+    if (color.length === 3) {
+      color = [color[0], color[0], color[1], color[1], color[2], color[2]];
+    }
+    const r = parseInt(color[0] + color[1], 16);
+    const g = parseInt(color[2] + color[3], 16);
+    const b = parseInt(color[4] + color[5], 16);
+    const alpha = opacity / 100;
+    return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+  }
+  function useBuildUserManagement({
+    authController,
+    dataSourceDelegate,
+    usersPath = "__FIRECMS/config/users",
+    rolesPath = "__FIRECMS/config/roles",
+    usersLimit,
+    canEditRoles = true,
+    allowDefaultRolesCreation,
+    includeCollectionConfigPermissions
+  }) {
+    if (!authController) {
+      throw Error("useBuildUserManagement: You need to provide an authController since version 3.0.0-beta.11. Check https://firecms.co/docs/pro/migrating_from_v3_beta");
+    }
+    const [rolesLoading, setRolesLoading] = React.useState(true);
+    const [usersLoading, setUsersLoading] = React.useState(true);
+    const [roles, setRoles] = React.useState([]);
+    const [usersWithRoleIds, setUsersWithRoleIds] = React.useState([]);
+    const users = usersWithRoleIds.map((u) => ({
+      ...u,
+      roles: roles.filter((r) => u.roles?.includes(r.id))
+    }));
+    const [rolesError, setRolesError] = React.useState();
+    const [usersError, setUsersError] = React.useState();
+    const _usersLoading = usersLoading;
+    const _rolesLoading = rolesLoading;
+    const loading = _rolesLoading || _usersLoading;
+    React.useEffect(() => {
+      if (!dataSourceDelegate || !rolesPath) return;
+      if (dataSourceDelegate.initialised !== void 0 && !dataSourceDelegate.initialised) return;
+      if (authController?.initialLoading) return;
+      setRolesLoading(true);
+      return dataSourceDelegate.listenCollection?.({
+        path: rolesPath,
+        onUpdate(entities) {
+          setRolesError(void 0);
+          try {
+            const newRoles = entityToRoles(entities);
+            if (!equal(newRoles, roles)) {
+              setRoles(newRoles);
+            }
+          } catch (e) {
+            setRoles([]);
+            console.error("Error loading roles", e);
+            setRolesError(e);
+          }
+          setRolesLoading(false);
+        },
+        onError(e_0) {
+          setRoles([]);
+          console.error("Error loading roles", e_0);
+          setRolesError(e_0);
+          setRolesLoading(false);
+        }
+      });
+    }, [dataSourceDelegate?.initialised, authController?.initialLoading, authController?.user?.uid, rolesPath]);
+    React.useEffect(() => {
+      if (!dataSourceDelegate || !usersPath) return;
+      if (dataSourceDelegate.initialised !== void 0 && !dataSourceDelegate.initialised) {
+        return;
+      }
+      if (authController?.initialLoading) {
+        return;
+      }
+      setUsersLoading(true);
+      return dataSourceDelegate.listenCollection?.({
+        path: usersPath,
+        onUpdate(entities_0) {
+          console.debug("Updating users", entities_0);
+          setUsersError(void 0);
+          try {
+            const newUsers = entitiesToUsers(entities_0);
+            setUsersWithRoleIds(newUsers);
+          } catch (e_1) {
+            setUsersWithRoleIds([]);
+            console.error("Error loading users", e_1);
+            setUsersError(e_1);
+          }
+          setUsersLoading(false);
+        },
+        onError(e_2) {
+          console.error("Error loading users", e_2);
+          setUsersWithRoleIds([]);
+          setUsersError(e_2);
+          setUsersLoading(false);
+        }
+      });
+    }, [dataSourceDelegate?.initialised, authController?.initialLoading, authController?.user?.uid, usersPath]);
+    const saveUser = React.useCallback(async (user) => {
+      if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+      if (!usersPath) throw Error("useBuildUserManagement Firestore not initialised");
+      console.debug("Persisting user", user);
+      const roleIds = user.roles?.map((r_0) => r_0.id);
+      const email = user.email?.toLowerCase().trim();
+      if (!email) throw Error("Email is required");
+      const userExists = users.find((u_0) => u_0.email?.toLowerCase() === email);
+      const data = {
+        ...user,
+        roles: roleIds ?? []
+      };
+      if (!userExists) {
+        data.created_on = /* @__PURE__ */ new Date();
+      }
+      return dataSourceDelegate.saveEntity({
+        status: "existing",
+        path: usersPath,
+        entityId: email,
+        values: core.removeUndefined(data)
+      }).then(() => user);
+    }, [usersPath, dataSourceDelegate?.initialised]);
+    const saveRole = React.useCallback((role) => {
+      if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+      if (!rolesPath) throw Error("useBuildUserManagement Firestore not initialised");
+      console.debug("Persisting role", role);
+      const {
+        id,
+        ...roleData
+      } = role;
+      return dataSourceDelegate.saveEntity({
+        status: "existing",
+        path: rolesPath,
+        entityId: id,
+        values: core.removeUndefined(roleData)
+      }).then(() => {
+        return;
+      });
+    }, [rolesPath, dataSourceDelegate?.initialised]);
+    const deleteUser = React.useCallback(async (user_0) => {
+      if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+      if (!usersPath) throw Error("useBuildUserManagement Firestore not initialised");
+      console.debug("Deleting", user_0);
+      const {
+        uid
+      } = user_0;
+      const entity = {
+        path: usersPath,
+        id: uid,
+        values: {}
+      };
+      await dataSourceDelegate.deleteEntity({
+        entity
+      });
+    }, [usersPath, dataSourceDelegate?.initialised]);
+    const deleteRole = React.useCallback(async (role_0) => {
+      if (!dataSourceDelegate) throw Error("useBuildUserManagement Firebase not initialised");
+      if (!rolesPath) throw Error("useBuildUserManagement Firestore not initialised");
+      console.debug("Deleting", role_0);
+      const {
+        id: id_0
+      } = role_0;
+      const entity_0 = {
+        path: rolesPath,
+        id: id_0,
+        values: {}
+      };
+      await dataSourceDelegate.deleteEntity({
+        entity: entity_0
+      });
+    }, [rolesPath, dataSourceDelegate?.initialised]);
+    const collectionPermissions = React.useCallback(({
+      collection,
+      user: user_1
+    }) => resolveUserRolePermissions({
+      collection,
+      user: user_1
+    }), []);
+    const defineRolesFor = React.useCallback((user_2) => {
+      if (!usersWithRoleIds) throw Error("Users not loaded");
+      const users_0 = usersWithRoleIds.map((u_1) => ({
+        ...u_1,
+        roles: roles.filter((r_1) => u_1.roles?.includes(r_1.id))
+      }));
+      const mgmtUser = users_0.find((u_2) => u_2.email?.toLowerCase() === user_2?.email?.toLowerCase());
+      return mgmtUser?.roles;
+    }, [roles, usersWithRoleIds]);
+    const authenticator = React.useCallback(({
+      user: user_3
+    }) => {
+      if (loading) {
+        return false;
+      }
+      if (users.length === 0) {
+        console.warn("No users created yet");
+        return true;
+      }
+      const mgmtUser_0 = users.find((u_3) => u_3.email?.toLowerCase() === user_3?.email?.toLowerCase());
+      if (mgmtUser_0) {
+        console.debug("User found in user management system", mgmtUser_0);
+        return true;
+      }
+      throw Error("Could not find a user with the provided email in the user management system.");
+    }, [loading, users]);
+    const userRoles = authController.user ? defineRolesFor(authController.user) : void 0;
+    const isAdmin = (userRoles ?? []).some((r_2) => r_2.id === "admin");
+    const userRoleIds = userRoles?.map((r_3) => r_3.id);
+    React.useEffect(() => {
+      console.debug("Setting roles", userRoles);
+      authController.setUserRoles?.(userRoles ?? []);
+    }, [userRoleIds]);
+    return {
+      loading,
+      roles,
+      users,
+      saveUser,
+      saveRole,
+      rolesError,
+      deleteUser,
+      deleteRole,
+      usersLimit,
+      usersError,
+      isAdmin,
+      canEditRoles: canEditRoles === void 0 ? true : canEditRoles,
+      allowDefaultRolesCreation: allowDefaultRolesCreation === void 0 ? true : allowDefaultRolesCreation,
+      includeCollectionConfigPermissions: Boolean(includeCollectionConfigPermissions),
+      collectionPermissions,
+      defineRolesFor,
+      authenticator,
+      ...authController,
+      initialLoading: authController.initialLoading || loading,
+      userRoles,
+      user: authController.user ? {
+        ...authController.user,
+        roles: userRoles
+      } : null
+    };
+  }
+  const entitiesToUsers = (docs) => {
+    return docs.map((doc) => {
+      const data = doc.values;
+      const newVar = {
+        uid: doc.id,
+        ...data,
+        created_on: data?.created_on,
+        updated_on: data?.updated_on
+      };
+      return newVar;
+    });
+  };
+  const entityToRoles = (entities) => {
+    return entities.map((doc) => ({
+      id: doc.id,
+      ...doc.values
+    }));
+  };
+  const UserManagementContext = React.createContext({});
+  function UserManagementProvider(t0) {
+    const $ = reactCompilerRuntime.c(3);
+    const {
+      children,
+      userManagement
+    } = t0;
+    let t1;
+    if ($[0] !== children || $[1] !== userManagement) {
+      t1 = /* @__PURE__ */ jsxRuntime.jsx(UserManagementContext.Provider, { value: userManagement, children });
+      $[0] = children;
+      $[1] = userManagement;
+      $[2] = t1;
+    } else {
+      t1 = $[2];
+    }
+    return t1;
+  }
+  const useUserManagement = () => {
+    return React.useContext(UserManagementContext);
+  };
+  function RoleChip(t0) {
+    const $ = reactCompilerRuntime.c(6);
+    const {
+      role
+    } = t0;
+    let colorScheme;
+    if (role.isAdmin) {
+      colorScheme = "blueDarker";
+    } else {
+      if (role.id === "editor") {
+        colorScheme = "yellowLight";
+      } else {
+        if (role.id === "viewer") {
+          colorScheme = "grayLight";
+        } else {
+          let t12;
+          if ($[0] !== role.id) {
+            t12 = ui.getColorSchemeForSeed(role.id);
+            $[0] = role.id;
+            $[1] = t12;
+          } else {
+            t12 = $[1];
+          }
+          colorScheme = t12;
+        }
+      }
+    }
+    let t1;
+    if ($[2] !== colorScheme || $[3] !== role.id || $[4] !== role.name) {
+      t1 = /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { colorScheme, children: role.name }, role.id);
+      $[2] = colorScheme;
+      $[3] = role.id;
+      $[4] = role.name;
+      $[5] = t1;
+    } else {
+      t1 = $[5];
+    }
+    return t1;
+  }
+  const RoleYupSchema = Yup__namespace.object().shape({
+    id: Yup__namespace.string().required("Required"),
+    name: Yup__namespace.string().required("Required")
+  });
+  function canRoleBeEdited(loggedUser) {
+    const loggedUserIsAdmin = loggedUser.roles?.map((r) => r.id).includes("admin");
+    console.log("loggedUserIsAdmin", loggedUser);
+    if (!loggedUserIsAdmin) {
+      throw new Error("Only admins can edit roles");
+    }
+    return true;
+  }
+  function RolesDetailsForm(t0) {
+    const $ = reactCompilerRuntime.c(165);
+    const {
+      open,
+      role,
+      editable,
+      handleClose,
+      collections
+    } = t0;
+    const {
+      saveRole
+    } = useUserManagement();
+    const isNewRole = !role;
+    const {
+      user: loggedInUser
+    } = core.useAuthController();
+    const [savingError, setSavingError] = React.useState();
+    let t1;
+    if ($[0] !== loggedInUser || $[1] !== saveRole) {
+      t1 = (role_0) => {
+        setSavingError(void 0);
+        if (!loggedInUser) {
+          throw new Error("User not found");
+        }
+        canRoleBeEdited(loggedInUser);
+        return saveRole(role_0);
+      };
+      $[0] = loggedInUser;
+      $[1] = saveRole;
+      $[2] = t1;
+    } else {
+      t1 = $[2];
+    }
+    const onRoleUpdated = t1;
+    let t2;
+    if ($[3] !== role) {
+      t2 = role ?? {
+        name: ""
+      };
+      $[3] = role;
+      $[4] = t2;
+    } else {
+      t2 = $[4];
+    }
+    let t3;
+    if ($[5] !== handleClose || $[6] !== onRoleUpdated) {
+      t3 = (role_1, formexController) => {
+        try {
+          return onRoleUpdated(role_1).then(() => {
+            formexController.resetForm({
+              values: role_1
+            });
+            handleClose();
+          }).catch((e_0) => {
+            setSavingError(e_0);
+          });
+        } catch (t410) {
+          const e = t410;
+          setSavingError(e);
+          return Promise.resolve();
+        }
+      };
+      $[5] = handleClose;
+      $[6] = onRoleUpdated;
+      $[7] = t3;
+    } else {
+      t3 = $[7];
+    }
+    let t4;
+    if ($[8] !== t2 || $[9] !== t3) {
+      t4 = {
+        initialValues: t2,
+        onSubmit: t3,
+        validation: _temp3$1
+      };
+      $[8] = t2;
+      $[9] = t3;
+      $[10] = t4;
+    } else {
+      t4 = $[10];
+    }
+    const formex$1 = formex.useCreateFormex(t4);
+    const {
+      isSubmitting,
+      touched,
+      values: values_0,
+      errors: errors_0,
+      handleChange,
+      setFieldValue,
+      dirty,
+      setFieldTouched
+    } = formex$1;
+    const isAdmin = values_0.isAdmin ?? false;
+    const defaultCreate = values_0.defaultPermissions?.create ?? false;
+    const defaultRead = values_0.defaultPermissions?.read ?? false;
+    const defaultEdit = values_0.defaultPermissions?.edit ?? false;
+    const defaultDelete = values_0.defaultPermissions?.delete ?? false;
+    let t5;
+    if ($[11] !== setFieldValue || $[12] !== touched || $[13] !== values_0.name) {
+      t5 = () => {
+        const idTouched = formex.getIn(touched, "id");
+        if (!idTouched && values_0.name) {
+          setFieldValue("id", core.toSnakeCase(values_0.name));
+        }
+      };
+      $[11] = setFieldValue;
+      $[12] = touched;
+      $[13] = values_0.name;
+      $[14] = t5;
+    } else {
+      t5 = $[14];
+    }
+    let t6;
+    if ($[15] !== touched || $[16] !== values_0.name) {
+      t6 = [touched, values_0.name];
+      $[15] = touched;
+      $[16] = values_0.name;
+      $[17] = t6;
+    } else {
+      t6 = $[17];
+    }
+    React.useEffect(t5, t6);
+    let t7;
+    let t8;
+    if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+      t7 = {
+        display: "flex",
+        flexDirection: "column",
+        position: "relative",
+        height: "100%"
+      };
+      t8 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogTitle, { variant: "h4", gutterBottom: false, children: "Role" });
+      $[18] = t7;
+      $[19] = t8;
+    } else {
+      t7 = $[18];
+      t8 = $[19];
+    }
+    const t9 = touched.name && Boolean(errors_0.name);
+    const t10 = isAdmin || !editable;
+    let t11;
+    if ($[20] !== handleChange || $[21] !== t10 || $[22] !== t9 || $[23] !== values_0.name) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { name: "name", required: true, error: t9, value: values_0.name, disabled: t10, onChange: handleChange, "aria-describedby": "name-helper-text", label: "Name" });
+      $[20] = handleChange;
+      $[21] = t10;
+      $[22] = t9;
+      $[23] = values_0.name;
+      $[24] = t11;
+    } else {
+      t11 = $[24];
+    }
+    const t12 = touched.name && Boolean(errors_0.name) ? errors_0.name : "Name of this role";
+    let t13;
+    if ($[25] !== t12) {
+      t13 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t12 });
+      $[25] = t12;
+      $[26] = t13;
+    } else {
+      t13 = $[26];
+    }
+    let t14;
+    if ($[27] !== t11 || $[28] !== t13) {
+      t14 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12 md:col-span-8", children: [
+        t11,
+        t13
+      ] });
+      $[27] = t11;
+      $[28] = t13;
+      $[29] = t14;
+    } else {
+      t14 = $[29];
+    }
+    const t15 = touched.id && Boolean(errors_0.id);
+    const t16 = !isNewRole || !editable;
+    let t17;
+    if ($[30] !== handleChange || $[31] !== setFieldTouched) {
+      t17 = (e_2) => {
+        handleChange(e_2);
+        setFieldTouched("id", true);
+      };
+      $[30] = handleChange;
+      $[31] = setFieldTouched;
+      $[32] = t17;
+    } else {
+      t17 = $[32];
+    }
+    let t18;
+    if ($[33] !== t15 || $[34] !== t16 || $[35] !== t17 || $[36] !== values_0.id) {
+      t18 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { name: "id", required: true, error: t15, value: values_0.id, disabled: t16, onChange: t17, "aria-describedby": "id-helper-text", label: "ID" });
+      $[33] = t15;
+      $[34] = t16;
+      $[35] = t17;
+      $[36] = values_0.id;
+      $[37] = t18;
+    } else {
+      t18 = $[37];
+    }
+    const t19 = touched.id && Boolean(errors_0.id) ? errors_0.id : "ID of this role";
+    let t20;
+    if ($[38] !== t19) {
+      t20 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t19 });
+      $[38] = t19;
+      $[39] = t20;
+    } else {
+      t20 = $[39];
+    }
+    let t21;
+    if ($[40] !== t18 || $[41] !== t20) {
+      t21 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+        t18,
+        t20
+      ] });
+      $[40] = t18;
+      $[41] = t20;
+      $[42] = t21;
+    } else {
+      t21 = $[42];
+    }
+    let t22;
+    if ($[43] === Symbol.for("react.memo_cache_sentinel")) {
+      t22 = /* @__PURE__ */ jsxRuntime.jsxs(ui.TableHeader, { className: "rounded-md", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: "Create entities" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: "Read entities" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: "Update entities" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: "Delete entities" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center" })
+      ] });
+      $[43] = t22;
+    } else {
+      t22 = $[43];
+    }
+    let t23;
+    if ($[44] === Symbol.for("react.memo_cache_sentinel")) {
+      t23 = /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { scope: "row", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { children: "All collections" }) });
+      $[44] = t23;
+    } else {
+      t23 = $[44];
+    }
+    const t24 = isAdmin || !editable;
+    const t25 = (isAdmin || defaultCreate) ?? false;
+    let t26;
+    if ($[45] !== setFieldValue) {
+      t26 = (checked) => setFieldValue("defaultPermissions.create", checked);
+      $[45] = setFieldValue;
+      $[46] = t26;
+    } else {
+      t26 = $[46];
+    }
+    let t27;
+    if ($[47] !== t24 || $[48] !== t25 || $[49] !== t26) {
+      t27 = /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "Create entities in collections", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: t24, checked: t25, onCheckedChange: t26 }) }) });
+      $[47] = t24;
+      $[48] = t25;
+      $[49] = t26;
+      $[50] = t27;
+    } else {
+      t27 = $[50];
+    }
+    const t28 = isAdmin || !editable;
+    const t29 = (isAdmin || defaultRead) ?? false;
+    let t30;
+    if ($[51] !== setFieldValue) {
+      t30 = (checked_0) => setFieldValue("defaultPermissions.read", checked_0);
+      $[51] = setFieldValue;
+      $[52] = t30;
+    } else {
+      t30 = $[52];
+    }
+    let t31;
+    if ($[53] !== t28 || $[54] !== t29 || $[55] !== t30) {
+      t31 = /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "Access all data in every collection", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: t28, checked: t29, onCheckedChange: t30 }) }) });
+      $[53] = t28;
+      $[54] = t29;
+      $[55] = t30;
+      $[56] = t31;
+    } else {
+      t31 = $[56];
+    }
+    const t32 = isAdmin || !editable;
+    const t33 = (isAdmin || defaultEdit) ?? false;
+    let t34;
+    if ($[57] !== setFieldValue) {
+      t34 = (checked_1) => setFieldValue("defaultPermissions.edit", checked_1);
+      $[57] = setFieldValue;
+      $[58] = t34;
+    } else {
+      t34 = $[58];
+    }
+    let t35;
+    if ($[59] !== t32 || $[60] !== t33 || $[61] !== t34) {
+      t35 = /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "Update data in any collection", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: t32, checked: t33, onCheckedChange: t34 }) }) });
+      $[59] = t32;
+      $[60] = t33;
+      $[61] = t34;
+      $[62] = t35;
+    } else {
+      t35 = $[62];
+    }
+    const t36 = isAdmin || !editable;
+    const t37 = (isAdmin || defaultDelete) ?? false;
+    let t38;
+    if ($[63] !== setFieldValue) {
+      t38 = (checked_2) => setFieldValue("defaultPermissions.delete", checked_2);
+      $[63] = setFieldValue;
+      $[64] = t38;
+    } else {
+      t38 = $[64];
+    }
+    let t39;
+    if ($[65] !== t36 || $[66] !== t37 || $[67] !== t38) {
+      t39 = /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "Delete data in any collection", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: t36, checked: t37, onCheckedChange: t38 }) }) });
+      $[65] = t36;
+      $[66] = t37;
+      $[67] = t38;
+      $[68] = t39;
+    } else {
+      t39 = $[68];
+    }
+    let t40;
+    if ($[69] === Symbol.for("react.memo_cache_sentinel")) {
+      t40 = /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center" });
+      $[69] = t40;
+    } else {
+      t40 = $[69];
+    }
+    let t41;
+    if ($[70] !== t27 || $[71] !== t31 || $[72] !== t35 || $[73] !== t39) {
+      t41 = /* @__PURE__ */ jsxRuntime.jsxs(ui.TableRow, { children: [
+        t23,
+        t27,
+        t31,
+        t35,
+        t39,
+        t40
+      ] });
+      $[70] = t27;
+      $[71] = t31;
+      $[72] = t35;
+      $[73] = t39;
+      $[74] = t41;
+    } else {
+      t41 = $[74];
+    }
+    let t42;
+    if ($[75] !== collections || $[76] !== defaultCreate || $[77] !== defaultDelete || $[78] !== defaultEdit || $[79] !== defaultRead || $[80] !== editable || $[81] !== isAdmin || $[82] !== setFieldValue || $[83] !== values_0) {
+      t42 = collections && collections.map((col) => /* @__PURE__ */ jsxRuntime.jsxs(ui.TableRow, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { scope: "row", children: col.name }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: isAdmin || defaultCreate || !editable, checked: (isAdmin || defaultCreate || formex.getIn(values_0, `collectionPermissions.${col.id}.create`)) ?? false, onCheckedChange: (checked_3) => setFieldValue(`collectionPermissions.${col.id}.create`, checked_3) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: isAdmin || defaultRead || !editable, checked: (isAdmin || defaultRead || formex.getIn(values_0, `collectionPermissions.${col.id}.read`)) ?? false, onCheckedChange: (checked_4) => setFieldValue(`collectionPermissions.${col.id}.read`, checked_4) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: isAdmin || defaultEdit || !editable, checked: (isAdmin || defaultEdit || formex.getIn(values_0, `collectionPermissions.${col.id}.edit`)) ?? false, onCheckedChange: (checked_5) => setFieldValue(`collectionPermissions.${col.id}.edit`, checked_5) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { disabled: isAdmin || defaultDelete || !editable, checked: (isAdmin || defaultDelete || formex.getIn(values_0, `collectionPermissions.${col.id}.delete`)) ?? false, onCheckedChange: (checked_6) => setFieldValue(`collectionPermissions.${col.id}.delete`, checked_6) }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: "Allow all permissions in this collections", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { className: "color-inherit", onClick: () => {
+          setFieldValue(`collectionPermissions.${col.id}.create`, true);
+          setFieldValue(`collectionPermissions.${col.id}.read`, true);
+          setFieldValue(`collectionPermissions.${col.id}.edit`, true);
+          setFieldValue(`collectionPermissions.${col.id}.delete`, true);
+        }, disabled: isAdmin || !editable, variant: "text", children: "All" }) }) })
+      ] }, col.name));
+      $[75] = collections;
+      $[76] = defaultCreate;
+      $[77] = defaultDelete;
+      $[78] = defaultEdit;
+      $[79] = defaultRead;
+      $[80] = editable;
+      $[81] = isAdmin;
+      $[82] = setFieldValue;
+      $[83] = values_0;
+      $[84] = t42;
+    } else {
+      t42 = $[84];
+    }
+    let t43;
+    if ($[85] !== t41 || $[86] !== t42) {
+      t43 = /* @__PURE__ */ jsxRuntime.jsx(ui.Paper, { className: "bg-inherit overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { className: "w-full rounded-md", children: [
+        t22,
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.TableBody, { children: [
+          t41,
+          t42
+        ] })
+      ] }) });
+      $[85] = t41;
+      $[86] = t42;
+      $[87] = t43;
+    } else {
+      t43 = $[87];
+    }
+    let t44;
+    if ($[88] === Symbol.for("react.memo_cache_sentinel")) {
+      t44 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: "You can customise the permissions that the users related to this role can perform in the entities of each collection" });
+      $[88] = t44;
+    } else {
+      t44 = $[88];
+    }
+    let t45;
+    if ($[89] !== t43) {
+      t45 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12", children: [
+        t43,
+        t44
+      ] });
+      $[89] = t43;
+      $[90] = t45;
+    } else {
+      t45 = $[90];
+    }
+    const t46 = touched.config && Boolean(errors_0.config);
+    const t47 = isAdmin || !editable;
+    let t48;
+    if ($[91] !== setFieldValue) {
+      t48 = (event) => setFieldValue("config.createCollections", event.target.value === "true");
+      $[91] = setFieldValue;
+      $[92] = t48;
+    } else {
+      t48 = $[92];
+    }
+    const t49 = isAdmin || values_0.config?.createCollections ? "true" : "false";
+    let t50;
+    let t51;
+    if ($[93] === Symbol.for("react.memo_cache_sentinel")) {
+      t50 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "true", children: " Yes " });
+      t51 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "false", children: " No " });
+      $[93] = t50;
+      $[94] = t51;
+    } else {
+      t50 = $[93];
+      t51 = $[94];
+    }
+    let t52;
+    if ($[95] !== t46 || $[96] !== t47 || $[97] !== t48 || $[98] !== t49) {
+      t52 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { error: t46, size: "large", fullWidth: true, id: "createCollections", name: "createCollections", label: "Create collections", position: "item-aligned", disabled: t47, onChange: t48, value: t49, renderValue: _temp4$1, children: [
+        t50,
+        t51
+      ] });
+      $[95] = t46;
+      $[96] = t47;
+      $[97] = t48;
+      $[98] = t49;
+      $[99] = t52;
+    } else {
+      t52 = $[99];
+    }
+    const t53 = touched.config && Boolean(errors_0.config) ? errors_0.config : "Can the user create collections";
+    let t54;
+    if ($[100] !== t53) {
+      t54 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t53 });
+      $[100] = t53;
+      $[101] = t54;
+    } else {
+      t54 = $[101];
+    }
+    let t55;
+    if ($[102] !== t52 || $[103] !== t54) {
+      t55 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+        t52,
+        t54
+      ] });
+      $[102] = t52;
+      $[103] = t54;
+      $[104] = t55;
+    } else {
+      t55 = $[104];
+    }
+    const t56 = touched.config && Boolean(errors_0.config);
+    const t57 = isAdmin || !editable;
+    let t58;
+    if ($[105] !== setFieldValue) {
+      t58 = (event_0) => setFieldValue("config.editCollections", event_0.target.value === "own" ? "own" : event_0.target.value === "true");
+      $[105] = setFieldValue;
+      $[106] = t58;
+    } else {
+      t58 = $[106];
+    }
+    const t59 = isAdmin ? "true" : values_0.config?.editCollections === "own" ? "own" : values_0.config?.editCollections ? "true" : "false";
+    let t60;
+    let t61;
+    let t62;
+    if ($[107] === Symbol.for("react.memo_cache_sentinel")) {
+      t60 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "true", children: " Yes " });
+      t61 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "false", children: " No " });
+      t62 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "own", children: " Only his/her own " });
+      $[107] = t60;
+      $[108] = t61;
+      $[109] = t62;
+    } else {
+      t60 = $[107];
+      t61 = $[108];
+      t62 = $[109];
+    }
+    let t63;
+    if ($[110] !== t56 || $[111] !== t57 || $[112] !== t58 || $[113] !== t59) {
+      t63 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { size: "large", fullWidth: true, error: t56, id: "editCollections", name: "editCollections", label: "Edit collections", disabled: t57, position: "item-aligned", onChange: t58, value: t59, renderValue: _temp5$1, children: [
+        t60,
+        t61,
+        t62
+      ] });
+      $[110] = t56;
+      $[111] = t57;
+      $[112] = t58;
+      $[113] = t59;
+      $[114] = t63;
+    } else {
+      t63 = $[114];
+    }
+    const t64 = touched.config && Boolean(errors_0.config) ? errors_0.config : "Can the user edit collections";
+    let t65;
+    if ($[115] !== t64) {
+      t65 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t64 });
+      $[115] = t64;
+      $[116] = t65;
+    } else {
+      t65 = $[116];
+    }
+    let t66;
+    if ($[117] !== t63 || $[118] !== t65) {
+      t66 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+        t63,
+        t65
+      ] });
+      $[117] = t63;
+      $[118] = t65;
+      $[119] = t66;
+    } else {
+      t66 = $[119];
+    }
+    const t67 = touched.config && Boolean(errors_0.config);
+    const t68 = isAdmin || !editable;
+    let t69;
+    if ($[120] !== setFieldValue) {
+      t69 = (event_1) => setFieldValue("config.deleteCollections", event_1.target.value === "own" ? "own" : event_1.target.value === "true");
+      $[120] = setFieldValue;
+      $[121] = t69;
+    } else {
+      t69 = $[121];
+    }
+    const t70 = isAdmin ? "true" : values_0.config?.deleteCollections === "own" ? "own" : values_0.config?.deleteCollections ? "true" : "false";
+    let t71;
+    let t72;
+    let t73;
+    if ($[122] === Symbol.for("react.memo_cache_sentinel")) {
+      t71 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "true", children: " Yes " });
+      t72 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "false", children: " No " });
+      t73 = /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: "own", children: " Only his/her own " });
+      $[122] = t71;
+      $[123] = t72;
+      $[124] = t73;
+    } else {
+      t71 = $[122];
+      t72 = $[123];
+      t73 = $[124];
+    }
+    let t74;
+    if ($[125] !== t67 || $[126] !== t68 || $[127] !== t69 || $[128] !== t70) {
+      t74 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Select, { size: "large", fullWidth: true, error: t67, id: "deleteCollections", name: "deleteCollections", label: "Delete collections", disabled: t68, position: "item-aligned", onChange: t69, value: t70, renderValue: _temp6$1, children: [
+        t71,
+        t72,
+        t73
+      ] });
+      $[125] = t67;
+      $[126] = t68;
+      $[127] = t69;
+      $[128] = t70;
+      $[129] = t74;
+    } else {
+      t74 = $[129];
+    }
+    const t75 = touched.config && Boolean(errors_0.config) ? errors_0.config : "Can the user delete collections";
+    let t76;
+    if ($[130] !== t75) {
+      t76 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t75 });
+      $[130] = t75;
+      $[131] = t76;
+    } else {
+      t76 = $[131];
+    }
+    let t77;
+    if ($[132] !== t74 || $[133] !== t76) {
+      t77 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12 md:col-span-4", children: [
+        t74,
+        t76
+      ] });
+      $[132] = t74;
+      $[133] = t76;
+      $[134] = t77;
+    } else {
+      t77 = $[134];
+    }
+    let t78;
+    if ($[135] !== t14 || $[136] !== t21 || $[137] !== t45 || $[138] !== t55 || $[139] !== t66 || $[140] !== t77) {
+      t78 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogContent, { className: "flex-grow", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-12 gap-8", children: [
+        t14,
+        t21,
+        t45,
+        t55,
+        t66,
+        t77
+      ] }) });
+      $[135] = t14;
+      $[136] = t21;
+      $[137] = t45;
+      $[138] = t55;
+      $[139] = t66;
+      $[140] = t77;
+      $[141] = t78;
+    } else {
+      t78 = $[141];
+    }
+    let t79;
+    if ($[142] !== savingError) {
+      t79 = savingError && /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { className: "text-red-500 dark:text-red-500", children: savingError.message ?? "There was an error saving this role" });
+      $[142] = savingError;
+      $[143] = t79;
+    } else {
+      t79 = $[143];
+    }
+    let t80;
+    if ($[144] !== handleClose) {
+      t80 = /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "text", onClick: () => {
+        handleClose();
+      }, children: "Cancel" });
+      $[144] = handleClose;
+      $[145] = t80;
+    } else {
+      t80 = $[145];
+    }
+    const t81 = !dirty;
+    let t82;
+    if ($[146] === Symbol.for("react.memo_cache_sentinel")) {
+      t82 = /* @__PURE__ */ jsxRuntime.jsx(ui.CheckIcon, {});
+      $[146] = t82;
+    } else {
+      t82 = $[146];
+    }
+    const t83 = isNewRole ? "Create role" : "Update";
+    let t84;
+    if ($[147] !== isSubmitting || $[148] !== t81 || $[149] !== t83) {
+      t84 = /* @__PURE__ */ jsxRuntime.jsx(ui.LoadingButton, { variant: "filled", color: "primary", type: "submit", disabled: t81, loading: isSubmitting, startIcon: t82, children: t83 });
+      $[147] = isSubmitting;
+      $[148] = t81;
+      $[149] = t83;
+      $[150] = t84;
+    } else {
+      t84 = $[150];
+    }
+    let t85;
+    if ($[151] !== t79 || $[152] !== t80 || $[153] !== t84) {
+      t85 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogActions, { position: "sticky", children: [
+        t79,
+        t80,
+        t84
+      ] });
+      $[151] = t79;
+      $[152] = t80;
+      $[153] = t84;
+      $[154] = t85;
+    } else {
+      t85 = $[154];
+    }
+    let t86;
+    if ($[155] !== formex$1.handleSubmit || $[156] !== t78 || $[157] !== t85) {
+      t86 = /* @__PURE__ */ jsxRuntime.jsxs("form", { noValidate: true, autoComplete: "off", onSubmit: formex$1.handleSubmit, style: t7, children: [
+        t8,
+        t78,
+        t85
+      ] });
+      $[155] = formex$1.handleSubmit;
+      $[156] = t78;
+      $[157] = t85;
+      $[158] = t86;
+    } else {
+      t86 = $[158];
+    }
+    let t87;
+    if ($[159] !== formex$1 || $[160] !== t86) {
+      t87 = /* @__PURE__ */ jsxRuntime.jsx(formex.Formex, { value: formex$1, children: t86 });
+      $[159] = formex$1;
+      $[160] = t86;
+      $[161] = t87;
+    } else {
+      t87 = $[161];
+    }
+    let t88;
+    if ($[162] !== open || $[163] !== t87) {
+      t88 = /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, { open, maxWidth: "4xl", children: t87 });
+      $[162] = open;
+      $[163] = t87;
+      $[164] = t88;
+    } else {
+      t88 = $[164];
+    }
+    return t88;
+  }
+  function _temp6$1(value_1) {
+    return value_1 === "own" ? "Own" : value_1 === "true" ? "Yes" : "No";
+  }
+  function _temp5$1(value_0) {
+    return value_0 === "own" ? "Own" : value_0 === "true" ? "Yes" : "No";
+  }
+  function _temp4$1(value) {
+    return value === "true" ? "Yes" : "No";
+  }
+  function _temp3$1(values) {
+    return RoleYupSchema.validate(values, {
+      abortEarly: false
+    }).then(_temp$2).catch(_temp2$1);
+  }
+  function _temp2$1(e_1) {
+    const errors = {};
+    e_1.inner.forEach((error) => {
+      errors[error.path] = error.message;
+    });
+    return errors;
+  }
+  function _temp$2() {
+    return {};
+  }
+  const DEFAULT_ROLES = [{
+    id: "admin",
+    name: "Admin",
+    isAdmin: true
+  }, {
+    id: "editor",
+    name: "Editor",
+    isAdmin: false,
+    defaultPermissions: {
+      read: true,
+      create: true,
+      edit: true,
+      delete: true
+    },
+    config: {
+      createCollections: true,
+      editCollections: "own",
+      deleteCollections: "own"
+    }
+  }, {
+    id: "viewer",
+    name: "Viewer",
+    isAdmin: false,
+    defaultPermissions: {
+      read: true,
+      create: false,
+      edit: false,
+      delete: false
+    }
+  }];
+  function RolesTable(t0) {
+    const $ = reactCompilerRuntime.c(25);
+    const {
+      onRoleClicked,
+      editable
+    } = t0;
+    const {
+      roles,
+      saveRole,
+      deleteRole,
+      allowDefaultRolesCreation
+    } = useUserManagement();
+    const [roleToBeDeleted, setRoleToBeDeleted] = React.useState(void 0);
+    const [deleteInProgress, setDeleteInProgress] = React.useState(false);
+    let t1;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+      t1 = /* @__PURE__ */ jsxRuntime.jsxs(ui.TableHeader, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { header: true, className: "w-16" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { header: true, children: "Role" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { header: true, className: "items-center", children: "Is Admin" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { header: true, children: "Default permissions" })
+      ] });
+      $[0] = t1;
+    } else {
+      t1 = $[0];
+    }
+    let t2;
+    if ($[1] !== editable || $[2] !== onRoleClicked || $[3] !== roles) {
+      t2 = roles && roles.map((role) => {
+        const canCreateAll = role.isAdmin || role.defaultPermissions?.create;
+        const canReadAll = role.isAdmin || role.defaultPermissions?.read;
+        const canUpdateAll = role.isAdmin || role.defaultPermissions?.edit;
+        const canDeleteAll = role.isAdmin || role.defaultPermissions?.delete;
+        return /* @__PURE__ */ jsxRuntime.jsxs(ui.TableRow, { onClick: () => {
+          onRoleClicked(role);
+        }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { style: {
+            width: "64px"
+          }, children: !role.isAdmin && /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { asChild: true, title: "Delete this role", children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "small", disabled: !editable, onClick: (event) => {
+            event.stopPropagation();
+            return setRoleToBeDeleted(role);
+          }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.DeleteIcon, {}) }) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsx(RoleChip, { role }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "items-center", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { checked: role.isAdmin ?? false }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("ul", { children: [
+            canCreateAll && /* @__PURE__ */ jsxRuntime.jsx("li", { children: "Create" }),
+            canReadAll && /* @__PURE__ */ jsxRuntime.jsx("li", { children: "Read" }),
+            canUpdateAll && /* @__PURE__ */ jsxRuntime.jsx("li", { children: "Update" }),
+            canDeleteAll && /* @__PURE__ */ jsxRuntime.jsx("li", { children: "Delete" })
+          ] }) })
+        ] }, role.name);
+      });
+      $[1] = editable;
+      $[2] = onRoleClicked;
+      $[3] = roles;
+      $[4] = t2;
+    } else {
+      t2 = $[4];
+    }
+    let t3;
+    if ($[5] !== allowDefaultRolesCreation || $[6] !== roles || $[7] !== saveRole) {
+      t3 = (!roles || roles.length === 0) && /* @__PURE__ */ jsxRuntime.jsx(ui.TableRow, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { colspan: 4, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.CenteredView, { className: "flex flex-col gap-4 my-8 items-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "label", children: "You don't have any roles yet." }),
+        allowDefaultRolesCreation && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "outlined", onClick: () => {
+          DEFAULT_ROLES.forEach((role_0) => {
+            saveRole(role_0);
+          });
+        }, children: "Create default roles" })
+      ] }) }) });
+      $[5] = allowDefaultRolesCreation;
+      $[6] = roles;
+      $[7] = saveRole;
+      $[8] = t3;
+    } else {
+      t3 = $[8];
+    }
+    let t4;
+    if ($[9] !== t2 || $[10] !== t3) {
+      t4 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { className: "w-full", children: [
+        t1,
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.TableBody, { children: [
+          t2,
+          t3
+        ] })
+      ] });
+      $[9] = t2;
+      $[10] = t3;
+      $[11] = t4;
+    } else {
+      t4 = $[11];
+    }
+    const t5 = Boolean(roleToBeDeleted);
+    let t6;
+    if ($[12] !== deleteRole || $[13] !== roleToBeDeleted) {
+      t6 = () => {
+        if (roleToBeDeleted) {
+          setDeleteInProgress(true);
+          deleteRole(roleToBeDeleted).then(() => {
+            setRoleToBeDeleted(void 0);
+          }).finally(() => {
+            setDeleteInProgress(false);
+          });
+        }
+      };
+      $[12] = deleteRole;
+      $[13] = roleToBeDeleted;
+      $[14] = t6;
+    } else {
+      t6 = $[14];
+    }
+    let t7;
+    let t8;
+    let t9;
+    if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+      t7 = () => {
+        setRoleToBeDeleted(void 0);
+      };
+      t8 = /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "Delete?" });
+      t9 = /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "Are you sure you want to delete this role?" });
+      $[15] = t7;
+      $[16] = t8;
+      $[17] = t9;
+    } else {
+      t7 = $[15];
+      t8 = $[16];
+      t9 = $[17];
+    }
+    let t10;
+    if ($[18] !== deleteInProgress || $[19] !== t5 || $[20] !== t6) {
+      t10 = /* @__PURE__ */ jsxRuntime.jsx(core.ConfirmationDialog, { open: t5, loading: deleteInProgress, onAccept: t6, onCancel: t7, title: t8, body: t9 });
+      $[18] = deleteInProgress;
+      $[19] = t5;
+      $[20] = t6;
+      $[21] = t10;
+    } else {
+      t10 = $[21];
+    }
+    let t11;
+    if ($[22] !== t10 || $[23] !== t4) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full overflow-auto", children: [
+        t4,
+        t10
+      ] });
+      $[22] = t10;
+      $[23] = t4;
+      $[24] = t11;
+    } else {
+      t11 = $[24];
+    }
+    return t11;
+  }
+  const RolesView = React.memo(function RolesView2(t0) {
+    const $ = reactCompilerRuntime.c(23);
+    const {
+      children
+    } = t0;
+    const {
+      collections
+    } = core.useNavigationController();
+    const [dialogOpen, setDialogOpen] = React.useState(false);
+    const [selectedRole, setSelectedRole] = React.useState();
+    const {
+      canEditRoles
+    } = useUserManagement();
+    let t1;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+      t1 = (user) => {
+        setDialogOpen(true);
+        setSelectedRole(user);
+      };
+      $[0] = t1;
+    } else {
+      t1 = $[0];
+    }
+    const onRoleClicked = t1;
+    let t2;
+    if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+      t2 = () => {
+        setSelectedRole(void 0);
+        setDialogOpen(false);
+      };
+      $[1] = t2;
+    } else {
+      t2 = $[1];
+    }
+    const handleClose = t2;
+    let t3;
+    if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+      t3 = /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { gutterBottom: true, variant: "h4", className: "flex-grow", component: "h4", children: "Roles" });
+      $[2] = t3;
+    } else {
+      t3 = $[2];
+    }
+    const t4 = !canEditRoles ? "Update plans to customise roles" : void 0;
+    const t5 = !canEditRoles;
+    let t6;
+    let t7;
+    if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+      t6 = /* @__PURE__ */ jsxRuntime.jsx(ui.AddIcon, {});
+      t7 = () => setDialogOpen(true);
+      $[3] = t6;
+      $[4] = t7;
+    } else {
+      t6 = $[3];
+      t7 = $[4];
+    }
+    let t8;
+    if ($[5] !== t5) {
+      t8 = /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "large", disabled: t5, startIcon: t6, onClick: t7, children: "Add role" });
+      $[5] = t5;
+      $[6] = t8;
+    } else {
+      t8 = $[6];
+    }
+    let t9;
+    if ($[7] !== t4 || $[8] !== t8) {
+      t9 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center mt-12", children: [
+        t3,
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { asChild: true, title: t4, children: t8 })
+      ] });
+      $[7] = t4;
+      $[8] = t8;
+      $[9] = t9;
+    } else {
+      t9 = $[9];
+    }
+    const t10 = Boolean(canEditRoles);
+    let t11;
+    if ($[10] !== t10) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsx(RolesTable, { onRoleClicked, editable: t10 });
+      $[10] = t10;
+      $[11] = t11;
+    } else {
+      t11 = $[11];
+    }
+    const t12 = selectedRole?.id ?? "new";
+    let t13;
+    if ($[12] !== canEditRoles || $[13] !== collections || $[14] !== dialogOpen || $[15] !== selectedRole || $[16] !== t12) {
+      t13 = /* @__PURE__ */ jsxRuntime.jsx(RolesDetailsForm, { open: dialogOpen, role: selectedRole, editable: canEditRoles, collections, handleClose }, t12);
+      $[12] = canEditRoles;
+      $[13] = collections;
+      $[14] = dialogOpen;
+      $[15] = selectedRole;
+      $[16] = t12;
+      $[17] = t13;
+    } else {
+      t13 = $[17];
+    }
+    let t14;
+    if ($[18] !== children || $[19] !== t11 || $[20] !== t13 || $[21] !== t9) {
+      t14 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "w-full flex flex-col py-4 gap-4", maxWidth: "6xl", children: [
+        children,
+        t9,
+        t11,
+        t13
+      ] });
+      $[18] = children;
+      $[19] = t11;
+      $[20] = t13;
+      $[21] = t9;
+      $[22] = t14;
+    } else {
+      t14 = $[22];
+    }
+    return t14;
+  });
+  const UserYupSchema = Yup__namespace.object().shape({
+    displayName: Yup__namespace.string().required("Required"),
+    email: Yup__namespace.string().email().required("Required"),
+    roles: Yup__namespace.array().min(1)
+  });
+  function canUserBeEdited(loggedUser, user, users, roles, prevUser) {
+    const admins = users.filter((u) => u.roles?.map((r) => r.id).includes("admin"));
+    const loggedUserIsAdmin = loggedUser.roles?.map((r) => r.id).includes("admin");
+    const didRolesChange = !prevUser || !areRolesEqual(prevUser.roles ?? [], user.roles ?? []);
+    if (didRolesChange && !loggedUserIsAdmin) {
+      throw new Error("Only admins can change roles");
+    }
+    const adminRoleRemoved = prevUser && prevUser.roles?.map((r) => r.id).includes("admin") && !user.roles?.map((r) => r.id).includes("admin");
+    if (adminRoleRemoved && admins.length === 1) {
+      throw new Error("There must be at least one admin");
+    }
+    return true;
+  }
+  function UserDetailsForm(t0) {
+    const $ = reactCompilerRuntime.c(74);
+    const {
+      open,
+      user: userProp,
+      handleClose
+    } = t0;
+    const snackbarController = core.useSnackbarController();
+    const {
+      user: loggedInUser
+    } = core.useAuthController();
+    const {
+      saveUser,
+      users,
+      roles
+    } = useUserManagement();
+    const isNewUser = !userProp;
+    let t1;
+    if ($[0] !== loggedInUser || $[1] !== roles || $[2] !== saveUser || $[3] !== userProp || $[4] !== users) {
+      t1 = (savedUser) => {
+        if (!loggedInUser) {
+          throw new Error("Logged user not found");
+        }
+        try {
+          canUserBeEdited(loggedInUser, savedUser, users, roles, userProp);
+          return saveUser(savedUser);
+        } catch (t210) {
+          const e = t210;
+          return Promise.reject(e);
+        }
+      };
+      $[0] = loggedInUser;
+      $[1] = roles;
+      $[2] = saveUser;
+      $[3] = userProp;
+      $[4] = users;
+      $[5] = t1;
+    } else {
+      t1 = $[5];
+    }
+    const onUserUpdated = t1;
+    let t2;
+    if ($[6] !== roles || $[7] !== userProp) {
+      t2 = userProp ?? {
+        displayName: "",
+        email: "",
+        roles: roles.filter(_temp$1)
+      };
+      $[6] = roles;
+      $[7] = userProp;
+      $[8] = t2;
+    } else {
+      t2 = $[8];
+    }
+    let t3;
+    if ($[9] !== handleClose || $[10] !== onUserUpdated || $[11] !== snackbarController) {
+      t3 = (user, formexController) => onUserUpdated(user).then(() => {
+        handleClose();
+        formexController.resetForm({
+          values: user
+        });
+      }).catch((e_1) => {
+        snackbarController.open({
+          type: "error",
+          message: e_1.message
+        });
+      });
+      $[9] = handleClose;
+      $[10] = onUserUpdated;
+      $[11] = snackbarController;
+      $[12] = t3;
+    } else {
+      t3 = $[12];
+    }
+    let t4;
+    if ($[13] !== t2 || $[14] !== t3) {
+      t4 = {
+        initialValues: t2,
+        validation: _temp5,
+        onSubmit: t3
+      };
+      $[13] = t2;
+      $[14] = t3;
+      $[15] = t4;
+    } else {
+      t4 = $[15];
+    }
+    const formex$1 = formex.useCreateFormex(t4);
+    const {
+      isSubmitting,
+      handleChange,
+      values: values_0,
+      errors,
+      setFieldValue,
+      dirty,
+      handleSubmit,
+      submitCount
+    } = formex$1;
+    let t5;
+    if ($[16] !== handleClose) {
+      t5 = (open_0) => !open_0 ? handleClose() : void 0;
+      $[16] = handleClose;
+      $[17] = t5;
+    } else {
+      t5 = $[17];
+    }
+    let t6;
+    let t7;
+    if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+      t6 = {
+        display: "flex",
+        flexDirection: "column",
+        position: "relative",
+        height: "100%"
+      };
+      t7 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogTitle, { variant: "h4", gutterBottom: false, children: "User" });
+      $[18] = t6;
+      $[19] = t7;
+    } else {
+      t6 = $[18];
+      t7 = $[19];
+    }
+    const t8 = submitCount > 0 && Boolean(errors.displayName);
+    const t9 = values_0.displayName ?? "";
+    let t10;
+    if ($[20] !== handleChange || $[21] !== t8 || $[22] !== t9) {
+      t10 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { name: "displayName", required: true, error: t8, value: t9, onChange: handleChange, "aria-describedby": "name-helper-text", label: "Name" });
+      $[20] = handleChange;
+      $[21] = t8;
+      $[22] = t9;
+      $[23] = t10;
+    } else {
+      t10 = $[23];
+    }
+    const t11 = submitCount > 0 && Boolean(errors.displayName) ? errors.displayName : "Name of this user";
+    let t12;
+    if ($[24] !== t11) {
+      t12 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t11 });
+      $[24] = t11;
+      $[25] = t12;
+    } else {
+      t12 = $[25];
+    }
+    let t13;
+    if ($[26] !== t10 || $[27] !== t12) {
+      t13 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12", children: [
+        t10,
+        t12
+      ] });
+      $[26] = t10;
+      $[27] = t12;
+      $[28] = t13;
+    } else {
+      t13 = $[28];
+    }
+    const t14 = submitCount > 0 && Boolean(errors.email);
+    const t15 = values_0.email ?? "";
+    let t16;
+    if ($[29] !== handleChange || $[30] !== t14 || $[31] !== t15) {
+      t16 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { required: true, error: t14, name: "email", value: t15, onChange: handleChange, "aria-describedby": "email-helper-text", label: "Email" });
+      $[29] = handleChange;
+      $[30] = t14;
+      $[31] = t15;
+      $[32] = t16;
+    } else {
+      t16 = $[32];
+    }
+    const t17 = submitCount > 0 && Boolean(errors.email) ? errors.email : "Email of this user";
+    let t18;
+    if ($[33] !== t17) {
+      t18 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t17 });
+      $[33] = t17;
+      $[34] = t18;
+    } else {
+      t18 = $[34];
+    }
+    let t19;
+    if ($[35] !== t16 || $[36] !== t18) {
+      t19 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12", children: [
+        t16,
+        t18
+      ] });
+      $[35] = t16;
+      $[36] = t18;
+      $[37] = t19;
+    } else {
+      t19 = $[37];
+    }
+    let t20;
+    if ($[38] !== values_0.roles) {
+      t20 = values_0.roles?.map(_temp6) ?? [];
+      $[38] = values_0.roles;
+      $[39] = t20;
+    } else {
+      t20 = $[39];
+    }
+    let t21;
+    if ($[40] !== roles || $[41] !== setFieldValue) {
+      t21 = (value) => setFieldValue("roles", value.map((id) => roles.find((r_1) => r_1.id === id)));
+      $[40] = roles;
+      $[41] = setFieldValue;
+      $[42] = t21;
+    } else {
+      t21 = $[42];
+    }
+    let t22;
+    if ($[43] !== roles) {
+      t22 = roles.map(_temp7);
+      $[43] = roles;
+      $[44] = t22;
+    } else {
+      t22 = $[44];
+    }
+    let t23;
+    if ($[45] !== t20 || $[46] !== t21 || $[47] !== t22) {
+      t23 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelect, { className: "w-full", label: "Roles", value: t20, onValueChange: t21, children: t22 }) });
+      $[45] = t20;
+      $[46] = t21;
+      $[47] = t22;
+      $[48] = t23;
+    } else {
+      t23 = $[48];
+    }
+    let t24;
+    if ($[49] !== t13 || $[50] !== t19 || $[51] !== t23) {
+      t24 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogContent, { className: "h-full flex-grow", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-12 gap-8", children: [
+        t13,
+        t19,
+        t23
+      ] }) });
+      $[49] = t13;
+      $[50] = t19;
+      $[51] = t23;
+      $[52] = t24;
+    } else {
+      t24 = $[52];
+    }
+    let t25;
+    if ($[53] !== handleClose) {
+      t25 = /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "text", onClick: () => {
+        handleClose();
+      }, children: "Cancel" });
+      $[53] = handleClose;
+      $[54] = t25;
+    } else {
+      t25 = $[54];
+    }
+    const t26 = !dirty;
+    let t27;
+    if ($[55] === Symbol.for("react.memo_cache_sentinel")) {
+      t27 = /* @__PURE__ */ jsxRuntime.jsx(ui.CheckIcon, {});
+      $[55] = t27;
+    } else {
+      t27 = $[55];
+    }
+    const t28 = isNewUser ? "Create user" : "Update";
+    let t29;
+    if ($[56] !== isSubmitting || $[57] !== t26 || $[58] !== t28) {
+      t29 = /* @__PURE__ */ jsxRuntime.jsx(ui.LoadingButton, { variant: "filled", color: "primary", type: "submit", disabled: t26, loading: isSubmitting, startIcon: t27, children: t28 });
+      $[56] = isSubmitting;
+      $[57] = t26;
+      $[58] = t28;
+      $[59] = t29;
+    } else {
+      t29 = $[59];
+    }
+    let t30;
+    if ($[60] !== t25 || $[61] !== t29) {
+      t30 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogActions, { children: [
+        t25,
+        t29
+      ] });
+      $[60] = t25;
+      $[61] = t29;
+      $[62] = t30;
+    } else {
+      t30 = $[62];
+    }
+    let t31;
+    if ($[63] !== handleSubmit || $[64] !== t24 || $[65] !== t30) {
+      t31 = /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, autoComplete: "off", noValidate: true, style: t6, children: [
+        t7,
+        t24,
+        t30
+      ] });
+      $[63] = handleSubmit;
+      $[64] = t24;
+      $[65] = t30;
+      $[66] = t31;
+    } else {
+      t31 = $[66];
+    }
+    let t32;
+    if ($[67] !== formex$1 || $[68] !== t31) {
+      t32 = /* @__PURE__ */ jsxRuntime.jsx(formex.Formex, { value: formex$1, children: t31 });
+      $[67] = formex$1;
+      $[68] = t31;
+      $[69] = t32;
+    } else {
+      t32 = $[69];
+    }
+    let t33;
+    if ($[70] !== open || $[71] !== t32 || $[72] !== t5) {
+      t33 = /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, { open, onOpenChange: t5, maxWidth: "4xl", children: t32 });
+      $[70] = open;
+      $[71] = t32;
+      $[72] = t5;
+      $[73] = t33;
+    } else {
+      t33 = $[73];
+    }
+    return t33;
+  }
+  function _temp7(userRole) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelectItem, { value: userRole.id, children: /* @__PURE__ */ jsxRuntime.jsx(RoleChip, { role: userRole }, userRole?.id) }, userRole.id);
+  }
+  function _temp6(r_0) {
+    return r_0.id;
+  }
+  function _temp5(values) {
+    return UserYupSchema.validate(values, {
+      abortEarly: false
+    }).then(_temp2).catch(_temp4);
+  }
+  function _temp4(e_0) {
+    return e_0.inner.reduce(_temp3, {});
+  }
+  function _temp3(acc, error) {
+    acc[error.path] = error.message;
+    return acc;
+  }
+  function _temp2() {
+    return {};
+  }
+  function _temp$1(r) {
+    return r.id === "editor";
+  }
+  function UsersTable(t0) {
+    const $ = reactCompilerRuntime.c(28);
+    const {
+      onUserClicked
+    } = t0;
+    const {
+      users,
+      saveUser,
+      deleteUser
+    } = useUserManagement();
+    const authController = core.useAuthController();
+    const snackbarController = core.useSnackbarController();
+    const customizationController = core.useCustomizationController();
+    const dateUtilsLocale = customizationController?.locale ? locales__namespace[customizationController?.locale] : void 0;
+    const dateFormat = customizationController?.dateTimeFormat ?? core.defaultDateFormat;
+    const [userToBeDeleted, setUserToBeDeleted] = React.useState(void 0);
+    const [deleteInProgress, setDeleteInProgress] = React.useState(false);
+    let t1;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+      t1 = /* @__PURE__ */ jsxRuntime.jsxs(ui.TableHeader, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "truncate w-16" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "Email" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "Name" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "Roles" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: "Created on" })
+      ] });
+      $[0] = t1;
+    } else {
+      t1 = $[0];
+    }
+    let t2;
+    if ($[1] !== dateFormat || $[2] !== dateUtilsLocale || $[3] !== onUserClicked || $[4] !== users) {
+      t2 = users && users.map((user) => {
+        const userRoles = user.roles;
+        const formattedDate = user.created_on ? dateFns.format(user.created_on, dateFormat, {
+          locale: dateUtilsLocale
+        }) : "";
+        return /* @__PURE__ */ jsxRuntime.jsxs(ui.TableRow, { onClick: () => {
+          onUserClicked(user);
+        }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "w-10", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { asChild: true, title: "Delete this user", children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "small", onClick: (event) => {
+            event.stopPropagation();
+            return setUserToBeDeleted(user);
+          }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.DeleteIcon, {}) }) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: user.email }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "font-medium align-left", children: user.displayName }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "align-left", children: userRoles ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: userRoles.map(_temp) }) : null }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: formattedDate })
+        ] }, "row_" + user.uid);
+      });
+      $[1] = dateFormat;
+      $[2] = dateUtilsLocale;
+      $[3] = onUserClicked;
+      $[4] = users;
+      $[5] = t2;
+    } else {
+      t2 = $[5];
+    }
+    let t3;
+    if ($[6] !== authController || $[7] !== saveUser || $[8] !== snackbarController || $[9] !== users) {
+      t3 = (!users || users.length === 0) && /* @__PURE__ */ jsxRuntime.jsx(ui.TableRow, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { colspan: 6, children: /* @__PURE__ */ jsxRuntime.jsxs(ui.CenteredView, { className: "flex flex-col gap-4 my-8 items-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "label", children: "There are no users yet" }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "outlined", onClick: () => {
+          if (!authController.user?.uid) {
+            throw Error("UsersTable, authController misconfiguration");
+          }
+          saveUser({
+            uid: authController.user?.uid,
+            email: authController.user?.email,
+            displayName: authController.user?.displayName,
+            photoURL: authController.user?.photoURL,
+            providerId: authController.user?.providerId,
+            isAnonymous: authController.user?.isAnonymous,
+            roles: [{
+              id: "admin",
+              name: "Admin"
+            }],
+            created_on: /* @__PURE__ */ new Date()
+          }).then(() => {
+            snackbarController.open({
+              type: "success",
+              message: "User added successfully"
+            });
+          }).catch((error) => {
+            snackbarController.open({
+              type: "error",
+              message: "Error adding user: " + error.message
+            });
+          });
+        }, children: "Add the logged user as an admin" })
+      ] }) }) });
+      $[6] = authController;
+      $[7] = saveUser;
+      $[8] = snackbarController;
+      $[9] = users;
+      $[10] = t3;
+    } else {
+      t3 = $[10];
+    }
+    let t4;
+    if ($[11] !== t2 || $[12] !== t3) {
+      t4 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Table, { className: "w-full", children: [
+        t1,
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.TableBody, { children: [
+          t2,
+          t3
+        ] })
+      ] });
+      $[11] = t2;
+      $[12] = t3;
+      $[13] = t4;
+    } else {
+      t4 = $[13];
+    }
+    const t5 = Boolean(userToBeDeleted);
+    let t6;
+    if ($[14] !== deleteUser || $[15] !== snackbarController || $[16] !== userToBeDeleted) {
+      t6 = () => {
+        if (userToBeDeleted) {
+          setDeleteInProgress(true);
+          deleteUser(userToBeDeleted).then(() => {
+            setUserToBeDeleted(void 0);
+          }).catch((error_0) => {
+            snackbarController.open({
+              type: "error",
+              message: "Error deleting user: " + error_0.message
+            });
+          }).finally(() => {
+            setDeleteInProgress(false);
+          });
+        }
+      };
+      $[14] = deleteUser;
+      $[15] = snackbarController;
+      $[16] = userToBeDeleted;
+      $[17] = t6;
+    } else {
+      t6 = $[17];
+    }
+    let t7;
+    let t8;
+    let t9;
+    if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
+      t7 = () => {
+        setUserToBeDeleted(void 0);
+      };
+      t8 = /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "Delete?" });
+      t9 = /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "Are you sure you want to delete this user?" });
+      $[18] = t7;
+      $[19] = t8;
+      $[20] = t9;
+    } else {
+      t7 = $[18];
+      t8 = $[19];
+      t9 = $[20];
+    }
+    let t10;
+    if ($[21] !== deleteInProgress || $[22] !== t5 || $[23] !== t6) {
+      t10 = /* @__PURE__ */ jsxRuntime.jsx(core.ConfirmationDialog, { open: t5, loading: deleteInProgress, onAccept: t6, onCancel: t7, title: t8, body: t9 });
+      $[21] = deleteInProgress;
+      $[22] = t5;
+      $[23] = t6;
+      $[24] = t10;
+    } else {
+      t10 = $[24];
+    }
+    let t11;
+    if ($[25] !== t10 || $[26] !== t4) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "overflow-auto", children: [
+        t4,
+        t10
+      ] });
+      $[25] = t10;
+      $[26] = t4;
+      $[27] = t11;
+    } else {
+      t11 = $[27];
+    }
+    return t11;
+  }
+  function _temp(userRole) {
+    return /* @__PURE__ */ jsxRuntime.jsx(RoleChip, { role: userRole }, userRole?.id);
+  }
+  const UsersView = function UsersView2(t0) {
+    const $ = reactCompilerRuntime.c(16);
+    const {
+      children
+    } = t0;
+    const [dialogOpen, setDialogOpen] = React.useState();
+    const [selectedUser, setSelectedUser] = React.useState();
+    const {
+      users,
+      usersLimit
+    } = useUserManagement();
+    const reachedUsersLimit = usersLimit !== void 0 && users && users.length >= usersLimit;
+    let t1;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+      t1 = (user) => {
+        setSelectedUser(user);
+        setDialogOpen(true);
+      };
+      $[0] = t1;
+    } else {
+      t1 = $[0];
+    }
+    const onUserClicked = t1;
+    let t2;
+    if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+      t2 = () => {
+        setDialogOpen(false);
+        setSelectedUser(void 0);
+      };
+      $[1] = t2;
+    } else {
+      t2 = $[1];
+    }
+    const handleClose = t2;
+    let t3;
+    if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+      t3 = /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { gutterBottom: true, variant: "h4", className: "flex-grow", component: "h4", children: "Users" });
+      $[2] = t3;
+    } else {
+      t3 = $[2];
+    }
+    let t4;
+    let t5;
+    if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+      t4 = /* @__PURE__ */ jsxRuntime.jsx(ui.AddIcon, {});
+      t5 = () => setDialogOpen(true);
+      $[3] = t4;
+      $[4] = t5;
+    } else {
+      t4 = $[3];
+      t5 = $[4];
+    }
+    let t6;
+    if ($[5] !== reachedUsersLimit) {
+      t6 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center mt-12", children: [
+        t3,
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "large", disabled: reachedUsersLimit, startIcon: t4, onClick: t5, children: "Add user" })
+      ] });
+      $[5] = reachedUsersLimit;
+      $[6] = t6;
+    } else {
+      t6 = $[6];
+    }
+    let t7;
+    if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+      t7 = /* @__PURE__ */ jsxRuntime.jsx(UsersTable, { onUserClicked });
+      $[7] = t7;
+    } else {
+      t7 = $[7];
+    }
+    const t8 = selectedUser?.uid ?? "new";
+    const t9 = dialogOpen ?? false;
+    let t10;
+    if ($[8] !== selectedUser || $[9] !== t8 || $[10] !== t9) {
+      t10 = /* @__PURE__ */ jsxRuntime.jsx(UserDetailsForm, { open: t9, user: selectedUser, handleClose }, t8);
+      $[8] = selectedUser;
+      $[9] = t8;
+      $[10] = t9;
+      $[11] = t10;
+    } else {
+      t10 = $[11];
+    }
+    let t11;
+    if ($[12] !== children || $[13] !== t10 || $[14] !== t6) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Container, { className: "w-full flex flex-col py-4 gap-4", maxWidth: "6xl", children: [
+        children,
+        t6,
+        t7,
+        t10
+      ] });
+      $[12] = children;
+      $[13] = t10;
+      $[14] = t6;
+      $[15] = t11;
+    } else {
+      t11 = $[15];
+    }
+    return t11;
+  };
+  function useUserManagementPlugin(t0) {
+    const $ = reactCompilerRuntime.c(12);
+    const {
+      userManagement
+    } = t0;
+    const noUsers = userManagement.users.length === 0;
+    const noRoles = userManagement.roles.length === 0;
+    let t1;
+    if ($[0] !== noRoles || $[1] !== noUsers || $[2] !== userManagement) {
+      t1 = noUsers || noRoles ? /* @__PURE__ */ jsxRuntime.jsx(IntroWidget, { noUsers, noRoles, userManagement }) : void 0;
+      $[0] = noRoles;
+      $[1] = noUsers;
+      $[2] = userManagement;
+      $[3] = t1;
+    } else {
+      t1 = $[3];
+    }
+    let t2;
+    if ($[4] !== t1) {
+      t2 = {
+        additionalChildrenStart: t1
+      };
+      $[4] = t1;
+      $[5] = t2;
+    } else {
+      t2 = $[5];
+    }
+    let t3;
+    if ($[6] !== userManagement) {
+      t3 = {
+        Component: UserManagementProvider,
+        props: {
+          userManagement
+        }
+      };
+      $[6] = userManagement;
+      $[7] = t3;
+    } else {
+      t3 = $[7];
+    }
+    let t4;
+    if ($[8] !== t2 || $[9] !== t3 || $[10] !== userManagement.loading) {
+      t4 = {
+        key: "user_management",
+        loading: userManagement.loading,
+        homePage: t2,
+        provider: t3
+      };
+      $[8] = t2;
+      $[9] = t3;
+      $[10] = userManagement.loading;
+      $[11] = t4;
+    } else {
+      t4 = $[11];
+    }
+    return t4;
+  }
+  function IntroWidget(t0) {
+    const $ = reactCompilerRuntime.c(17);
+    const {
+      noUsers,
+      noRoles,
+      userManagement
+    } = t0;
+    const authController = core.useAuthController();
+    const snackbarController = core.useSnackbarController();
+    const buttonLabel = noUsers && noRoles ? "Create default roles and add current user as admin" : noUsers ? "Add current user as admin" : noRoles ? "Create default roles" : void 0;
+    let t1;
+    let t2;
+    if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+      t1 = /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "subtitle2", className: "uppercase", children: "Create your users and roles" });
+      t2 = /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { children: "You have no users or roles defined. You can create default roles and add the current user as admin." });
+      $[0] = t1;
+      $[1] = t2;
+    } else {
+      t1 = $[0];
+      t2 = $[1];
+    }
+    let t3;
+    if ($[2] !== authController.user?.displayName || $[3] !== authController.user?.email || $[4] !== authController.user?.isAnonymous || $[5] !== authController.user?.photoURL || $[6] !== authController.user?.providerId || $[7] !== authController.user?.uid || $[8] !== noRoles || $[9] !== noUsers || $[10] !== snackbarController || $[11] !== userManagement) {
+      t3 = () => {
+        if (!authController.user?.uid) {
+          throw Error("UsersTable, authController misconfiguration");
+        }
+        if (noUsers) {
+          userManagement.saveUser({
+            uid: authController.user?.uid,
+            email: authController.user?.email,
+            displayName: authController.user?.displayName,
+            photoURL: authController.user?.photoURL,
+            providerId: authController.user?.providerId,
+            isAnonymous: authController.user?.isAnonymous,
+            roles: [{
+              id: "admin",
+              name: "Admin"
+            }],
+            created_on: /* @__PURE__ */ new Date()
+          }).then(() => {
+            snackbarController.open({
+              type: "success",
+              message: "User added successfully"
+            });
+          }).catch((error) => {
+            snackbarController.open({
+              type: "error",
+              message: "Error adding user: " + error.message
+            });
+          });
+        }
+        if (noRoles) {
+          DEFAULT_ROLES.forEach((role) => {
+            userManagement.saveRole(role);
+          });
+        }
+      };
+      $[2] = authController.user?.displayName;
+      $[3] = authController.user?.email;
+      $[4] = authController.user?.isAnonymous;
+      $[5] = authController.user?.photoURL;
+      $[6] = authController.user?.providerId;
+      $[7] = authController.user?.uid;
+      $[8] = noRoles;
+      $[9] = noUsers;
+      $[10] = snackbarController;
+      $[11] = userManagement;
+      $[12] = t3;
+    } else {
+      t3 = $[12];
+    }
+    let t4;
+    if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
+      t4 = /* @__PURE__ */ jsxRuntime.jsx(ui.AddIcon, {});
+      $[13] = t4;
+    } else {
+      t4 = $[13];
+    }
+    let t5;
+    if ($[14] !== buttonLabel || $[15] !== t3) {
+      t5 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Paper, { className: "my-4 flex flex-col px-4 py-6 bg-white dark:bg-surface-accent-800 gap-2", children: [
+        t1,
+        t2,
+        /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { onClick: t3, children: [
+          t4,
+          buttonLabel
+        ] })
+      ] });
+      $[14] = buttonLabel;
+      $[15] = t3;
+      $[16] = t5;
+    } else {
+      t5 = $[16];
+    }
+    return t5;
+  }
+  const userManagementAdminViews = [{
+    path: "users",
+    name: "CMS Users",
+    group: "Admin",
+    icon: "face",
+    view: /* @__PURE__ */ jsxRuntime.jsx(UsersView, {})
+  }, {
+    path: "roles",
+    name: "Roles",
+    group: "Admin",
+    icon: "gpp_good",
+    view: /* @__PURE__ */ jsxRuntime.jsx(RolesView, {})
+  }];
+  exports2.IntroWidget = IntroWidget;
+  exports2.RESERVED_GROUPS = RESERVED_GROUPS;
+  exports2.RoleChip = RoleChip;
+  exports2.RoleYupSchema = RoleYupSchema;
+  exports2.RolesDetailsForm = RolesDetailsForm;
+  exports2.RolesTable = RolesTable;
+  exports2.RolesView = RolesView;
+  exports2.UserDetailsForm = UserDetailsForm;
+  exports2.UserManagementContext = UserManagementContext;
+  exports2.UserManagementProvider = UserManagementProvider;
+  exports2.UserYupSchema = UserYupSchema;
+  exports2.UsersTable = UsersTable;
+  exports2.UsersView = UsersView;
+  exports2.areRolesEqual = areRolesEqual;
+  exports2.cacheDelegatedLoginToken = cacheDelegatedLoginToken;
+  exports2.clearDelegatedLoginTokensCache = clearDelegatedLoginTokensCache;
+  exports2.darkenColor = darkenColor;
+  exports2.getDelegatedLoginTokenFromCache = getDelegatedLoginTokenFromCache;
+  exports2.getUserRoles = getUserRoles;
+  exports2.hexToRgbaWithOpacity = hexToRgbaWithOpacity;
+  exports2.resolveUserRolePermissions = resolveUserRolePermissions;
+  exports2.useBuildUserManagement = useBuildUserManagement;
+  exports2.useUserManagement = useUserManagement;
+  exports2.useUserManagementPlugin = useUserManagementPlugin;
+  exports2.userManagementAdminViews = userManagementAdminViews;
+  Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
+});
 //# sourceMappingURL=index.umd.js.map