@firecms/user_management 3.2.0 → 3.3.0-canary.451aa49

package/dist/index.umd.js

@@ -2111,7 +2111,7 @@
     return true;
   }
   function UserDetailsForm(t0) {
-    const $ = reactCompilerRuntime.c(112);
+    const $ = reactCompilerRuntime.c(114);
     const {
       open,
       user: userProp,
@@ -2253,7 +2253,7 @@
     }
     let t9;
     if ($[25] !== t8) {
-      t9 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogTitle, { variant: "h4", gutterBottom: false, children: t8 });
+      t9 = /* @__PURE__ */ jsxRuntime.jsx("div", { children: t8 });
       $[25] = t8;
       $[26] = t9;
     } else {
@@ -2261,17 +2261,16 @@
     }
     let t10;
     if ($[27] !== isNewUser || $[28] !== snackbarController || $[29] !== t || $[30] !== userProp) {
-      t10 = !isNewUser && userProp?.uid && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-surface-accent-600 dark:text-surface-accent-400", children: t("user_id") }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Chip, { size: "small", children: userProp.uid }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: t("copy"), children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "small", onClick: () => {
+      t10 = !isNewUser && userProp?.uid && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-mono text-surface-accent-500 dark:text-surface-accent-400 font-normal", children: userProp.uid }),
+        /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { title: t("copy"), children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "smallest", onClick: () => {
           navigator.clipboard.writeText(userProp.uid);
           snackbarController.open({
             type: "success",
             message: t("copied")
           });
-        }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CopyIcon, { size: "small" }) }) })
-      ] }) });
+        }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CopyIcon, { size: "smallest" }) }) })
+      ] });
       $[27] = isNewUser;
       $[28] = snackbarController;
       $[29] = t;
@@ -2280,262 +2279,272 @@
     } else {
       t10 = $[31];
     }
-    const t11 = submitCount > 0 && Boolean(errors.displayName);
-    const t12 = values_0.displayName ?? "";
-    let t13;
-    if ($[32] !== t) {
-      t13 = t("name");
-      $[32] = t;
-      $[33] = t13;
+    let t11;
+    if ($[32] !== t10 || $[33] !== t9) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogTitle, { variant: "h4", gutterBottom: false, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+        t9,
+        t10
+      ] }) });
+      $[32] = t10;
+      $[33] = t9;
+      $[34] = t11;
     } else {
-      t13 = $[33];
+      t11 = $[34];
     }
+    const t12 = submitCount > 0 && Boolean(errors.displayName);
+    const t13 = values_0.displayName ?? "";
     let t14;
-    if ($[34] !== handleChange || $[35] !== t11 || $[36] !== t12 || $[37] !== t13) {
-      t14 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { name: "displayName", required: true, error: t11, value: t12, onChange: handleChange, "aria-describedby": "name-helper-text", label: t13 });
-      $[34] = handleChange;
-      $[35] = t11;
-      $[36] = t12;
-      $[37] = t13;
-      $[38] = t14;
+    if ($[35] !== t) {
+      t14 = t("name");
+      $[35] = t;
+      $[36] = t14;
     } else {
-      t14 = $[38];
+      t14 = $[36];
     }
     let t15;
-    if ($[39] !== errors || $[40] !== submitCount || $[41] !== t) {
-      t15 = submitCount > 0 && Boolean(errors.displayName) ? errors.displayName : t("name_of_this_user");
-      $[39] = errors;
-      $[40] = submitCount;
-      $[41] = t;
-      $[42] = t15;
+    if ($[37] !== handleChange || $[38] !== t12 || $[39] !== t13 || $[40] !== t14) {
+      t15 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { name: "displayName", required: true, error: t12, value: t13, onChange: handleChange, "aria-describedby": "name-helper-text", label: t14 });
+      $[37] = handleChange;
+      $[38] = t12;
+      $[39] = t13;
+      $[40] = t14;
+      $[41] = t15;
     } else {
-      t15 = $[42];
+      t15 = $[41];
     }
     let t16;
-    if ($[43] !== t15) {
-      t16 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t15 });
-      $[43] = t15;
-      $[44] = t16;
+    if ($[42] !== errors || $[43] !== submitCount || $[44] !== t) {
+      t16 = submitCount > 0 && Boolean(errors.displayName) ? errors.displayName : t("name_of_this_user");
+      $[42] = errors;
+      $[43] = submitCount;
+      $[44] = t;
+      $[45] = t16;
     } else {
-      t16 = $[44];
+      t16 = $[45];
     }
     let t17;
-    if ($[45] !== t14 || $[46] !== t16) {
-      t17 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12", children: [
-        t14,
-        t16
-      ] });
-      $[45] = t14;
+    if ($[46] !== t16) {
+      t17 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t16 });
       $[46] = t16;
       $[47] = t17;
     } else {
       t17 = $[47];
     }
-    const t18 = submitCount > 0 && Boolean(errors.email);
-    const t19 = values_0.email ?? "";
-    let t20;
-    if ($[48] !== t) {
-      t20 = t("email");
-      $[48] = t;
-      $[49] = t20;
+    let t18;
+    if ($[48] !== t15 || $[49] !== t17) {
+      t18 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12", children: [
+        t15,
+        t17
+      ] });
+      $[48] = t15;
+      $[49] = t17;
+      $[50] = t18;
     } else {
-      t20 = $[49];
+      t18 = $[50];
     }
+    const t19 = submitCount > 0 && Boolean(errors.email);
+    const t20 = values_0.email ?? "";
     let t21;
-    if ($[50] !== handleChange || $[51] !== t18 || $[52] !== t19 || $[53] !== t20) {
-      t21 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { required: true, error: t18, name: "email", value: t19, onChange: handleChange, "aria-describedby": "email-helper-text", label: t20 });
-      $[50] = handleChange;
-      $[51] = t18;
-      $[52] = t19;
-      $[53] = t20;
-      $[54] = t21;
+    if ($[51] !== t) {
+      t21 = t("email");
+      $[51] = t;
+      $[52] = t21;
     } else {
-      t21 = $[54];
+      t21 = $[52];
     }
     let t22;
-    if ($[55] !== errors || $[56] !== submitCount || $[57] !== t) {
-      t22 = submitCount > 0 && Boolean(errors.email) ? errors.email : t("email_of_this_user");
-      $[55] = errors;
-      $[56] = submitCount;
-      $[57] = t;
-      $[58] = t22;
+    if ($[53] !== handleChange || $[54] !== t19 || $[55] !== t20 || $[56] !== t21) {
+      t22 = /* @__PURE__ */ jsxRuntime.jsx(ui.TextField, { required: true, error: t19, name: "email", value: t20, onChange: handleChange, "aria-describedby": "email-helper-text", label: t21 });
+      $[53] = handleChange;
+      $[54] = t19;
+      $[55] = t20;
+      $[56] = t21;
+      $[57] = t22;
     } else {
-      t22 = $[58];
+      t22 = $[57];
     }
     let t23;
-    if ($[59] !== t22) {
-      t23 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t22 });
-      $[59] = t22;
-      $[60] = t23;
+    if ($[58] !== errors || $[59] !== submitCount || $[60] !== t) {
+      t23 = submitCount > 0 && Boolean(errors.email) ? errors.email : t("email_of_this_user");
+      $[58] = errors;
+      $[59] = submitCount;
+      $[60] = t;
+      $[61] = t23;
     } else {
-      t23 = $[60];
+      t23 = $[61];
     }
     let t24;
-    if ($[61] !== t21 || $[62] !== t23) {
-      t24 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12", children: [
-        t21,
-        t23
-      ] });
-      $[61] = t21;
+    if ($[62] !== t23) {
+      t24 = /* @__PURE__ */ jsxRuntime.jsx(core.FieldCaption, { children: t23 });
       $[62] = t23;
       $[63] = t24;
     } else {
       t24 = $[63];
     }
     let t25;
-    if ($[64] !== t) {
-      t25 = t("roles");
-      $[64] = t;
-      $[65] = t25;
+    if ($[64] !== t22 || $[65] !== t24) {
+      t25 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-12", children: [
+        t22,
+        t24
+      ] });
+      $[64] = t22;
+      $[65] = t24;
+      $[66] = t25;
     } else {
-      t25 = $[65];
+      t25 = $[66];
     }
     let t26;
-    if ($[66] !== values_0.roles) {
-      t26 = values_0.roles?.map(_temp5) ?? [];
-      $[66] = values_0.roles;
-      $[67] = t26;
+    if ($[67] !== t) {
+      t26 = t("roles");
+      $[67] = t;
+      $[68] = t26;
     } else {
-      t26 = $[67];
+      t26 = $[68];
     }
     let t27;
-    if ($[68] !== roles || $[69] !== setFieldValue) {
-      t27 = (value) => setFieldValue("roles", value.map((id) => roles.find((r_1) => r_1.id === id)));
-      $[68] = roles;
-      $[69] = setFieldValue;
+    if ($[69] !== values_0.roles) {
+      t27 = values_0.roles?.map(_temp5) ?? [];
+      $[69] = values_0.roles;
       $[70] = t27;
     } else {
       t27 = $[70];
     }
     let t28;
-    if ($[71] !== roles) {
-      t28 = roles.map(_temp6);
+    if ($[71] !== roles || $[72] !== setFieldValue) {
+      t28 = (value) => setFieldValue("roles", value.map((id) => roles.find((r_1) => r_1.id === id)));
       $[71] = roles;
-      $[72] = t28;
+      $[72] = setFieldValue;
+      $[73] = t28;
     } else {
-      t28 = $[72];
+      t28 = $[73];
     }
     let t29;
-    if ($[73] !== t25 || $[74] !== t26 || $[75] !== t27 || $[76] !== t28) {
-      t29 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelect, { className: "w-full", label: t25, value: t26, onValueChange: t27, children: t28 }) });
-      $[73] = t25;
-      $[74] = t26;
-      $[75] = t27;
-      $[76] = t28;
-      $[77] = t29;
+    if ($[74] !== roles) {
+      t29 = roles.map(_temp6);
+      $[74] = roles;
+      $[75] = t29;
     } else {
-      t29 = $[77];
+      t29 = $[75];
     }
     let t30;
-    if ($[78] !== t10 || $[79] !== t17 || $[80] !== t24 || $[81] !== t29) {
-      t30 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogContent, { className: "h-full flex-grow", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-12 gap-4", children: [
-        t10,
-        t17,
-        t24,
-        t29
-      ] }) });
-      $[78] = t10;
-      $[79] = t17;
-      $[80] = t24;
-      $[81] = t29;
-      $[82] = t30;
+    if ($[76] !== t26 || $[77] !== t27 || $[78] !== t28 || $[79] !== t29) {
+      t30 = /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-12", children: /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelect, { className: "w-full", label: t26, value: t27, onValueChange: t28, children: t29 }) });
+      $[76] = t26;
+      $[77] = t27;
+      $[78] = t28;
+      $[79] = t29;
+      $[80] = t30;
     } else {
-      t30 = $[82];
+      t30 = $[80];
     }
     let t31;
-    if ($[83] !== handleClose) {
-      t31 = () => {
-        handleClose();
-      };
-      $[83] = handleClose;
+    if ($[81] !== t18 || $[82] !== t25 || $[83] !== t30) {
+      t31 = /* @__PURE__ */ jsxRuntime.jsx(ui.DialogContent, { className: "h-full flex-grow", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-12 gap-4", children: [
+        t18,
+        t25,
+        t30
+      ] }) });
+      $[81] = t18;
+      $[82] = t25;
+      $[83] = t30;
       $[84] = t31;
     } else {
       t31 = $[84];
     }
     let t32;
-    if ($[85] !== t) {
-      t32 = t("cancel");
-      $[85] = t;
+    if ($[85] !== handleClose) {
+      t32 = () => {
+        handleClose();
+      };
+      $[85] = handleClose;
       $[86] = t32;
     } else {
       t32 = $[86];
     }
     let t33;
-    if ($[87] !== t31 || $[88] !== t32) {
-      t33 = /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "text", onClick: t31, children: t32 });
-      $[87] = t31;
-      $[88] = t32;
-      $[89] = t33;
+    if ($[87] !== t) {
+      t33 = t("cancel");
+      $[87] = t;
+      $[88] = t33;
     } else {
-      t33 = $[89];
+      t33 = $[88];
     }
-    const t34 = !dirty;
-    let t35;
-    if ($[90] !== isNewUser || $[91] !== t) {
-      t35 = isNewUser ? t("create_user") : t("update");
-      $[90] = isNewUser;
-      $[91] = t;
-      $[92] = t35;
+    let t34;
+    if ($[89] !== t32 || $[90] !== t33) {
+      t34 = /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { variant: "text", onClick: t32, children: t33 });
+      $[89] = t32;
+      $[90] = t33;
+      $[91] = t34;
     } else {
-      t35 = $[92];
+      t34 = $[91];
     }
+    const t35 = !dirty;
     let t36;
-    if ($[93] !== isSubmitting || $[94] !== t34 || $[95] !== t35) {
-      t36 = /* @__PURE__ */ jsxRuntime.jsx(ui.LoadingButton, { variant: "filled", type: "submit", disabled: t34, loading: isSubmitting, children: t35 });
-      $[93] = isSubmitting;
-      $[94] = t34;
-      $[95] = t35;
-      $[96] = t36;
+    if ($[92] !== isNewUser || $[93] !== t) {
+      t36 = isNewUser ? t("create_user") : t("update");
+      $[92] = isNewUser;
+      $[93] = t;
+      $[94] = t36;
     } else {
-      t36 = $[96];
+      t36 = $[94];
     }
     let t37;
-    if ($[97] !== t33 || $[98] !== t36) {
-      t37 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogActions, { children: [
-        t33,
-        t36
-      ] });
-      $[97] = t33;
-      $[98] = t36;
-      $[99] = t37;
+    if ($[95] !== isSubmitting || $[96] !== t35 || $[97] !== t36) {
+      t37 = /* @__PURE__ */ jsxRuntime.jsx(ui.LoadingButton, { variant: "filled", type: "submit", disabled: t35, loading: isSubmitting, children: t36 });
+      $[95] = isSubmitting;
+      $[96] = t35;
+      $[97] = t36;
+      $[98] = t37;
     } else {
-      t37 = $[99];
+      t37 = $[98];
     }
     let t38;
-    if ($[100] !== handleSubmit || $[101] !== t30 || $[102] !== t37 || $[103] !== t9) {
-      t38 = /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, autoComplete: "off", noValidate: true, style: t7, children: [
-        t9,
-        t30,
+    if ($[99] !== t34 || $[100] !== t37) {
+      t38 = /* @__PURE__ */ jsxRuntime.jsxs(ui.DialogActions, { children: [
+        t34,
         t37
       ] });
-      $[100] = handleSubmit;
-      $[101] = t30;
-      $[102] = t37;
-      $[103] = t9;
-      $[104] = t38;
+      $[99] = t34;
+      $[100] = t37;
+      $[101] = t38;
     } else {
-      t38 = $[104];
+      t38 = $[101];
     }
     let t39;
-    if ($[105] !== formex$1 || $[106] !== t38) {
-      t39 = /* @__PURE__ */ jsxRuntime.jsx(formex.Formex, { value: formex$1, children: t38 });
-      $[105] = formex$1;
-      $[106] = t38;
-      $[107] = t39;
+    if ($[102] !== handleSubmit || $[103] !== t11 || $[104] !== t31 || $[105] !== t38) {
+      t39 = /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, autoComplete: "off", noValidate: true, style: t7, children: [
+        t11,
+        t31,
+        t38
+      ] });
+      $[102] = handleSubmit;
+      $[103] = t11;
+      $[104] = t31;
+      $[105] = t38;
+      $[106] = t39;
     } else {
-      t39 = $[107];
+      t39 = $[106];
     }
     let t40;
-    if ($[108] !== open || $[109] !== t39 || $[110] !== t6) {
-      t40 = /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, { open, onOpenChange: t6, maxWidth: "4xl", children: t39 });
-      $[108] = open;
-      $[109] = t39;
-      $[110] = t6;
+    if ($[107] !== formex$1 || $[108] !== t39) {
+      t40 = /* @__PURE__ */ jsxRuntime.jsx(formex.Formex, { value: formex$1, children: t39 });
+      $[107] = formex$1;
+      $[108] = t39;
+      $[109] = t40;
+    } else {
+      t40 = $[109];
+    }
+    let t41;
+    if ($[110] !== open || $[111] !== t40 || $[112] !== t6) {
+      t41 = /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, { open, onOpenChange: t6, maxWidth: "4xl", children: t40 });
+      $[110] = open;
       $[111] = t40;
+      $[112] = t6;
+      $[113] = t41;
     } else {
-      t40 = $[111];
+      t41 = $[113];
     }
-    return t40;
+    return t41;
   }
   function _temp6(userRole) {
     return /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelectItem, { value: userRole.id, children: /* @__PURE__ */ jsxRuntime.jsx(RoleChip, { role: userRole }, userRole?.id) }, userRole.id);
@@ -2683,7 +2692,10 @@
           onUserClicked(user);
         }, children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { className: "w-12", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Avatar, { src: user.photoURL ?? void 0, outerClassName: "w-8 h-8 min-w-8 min-h-8 p-0", className: "text-sm", hover: false, children: user.displayName ? user.displayName[0].toUpperCase() : user.email ? user.email[0].toUpperCase() : "U" }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: user.email }),
+          /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { children: user.email }),
+            user.uid && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-surface-accent-500 dark:text-surface-accent-400 font-mono mt-1", children: user.uid })
+          ] }) }),
           /* @__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$1) }) : null }),
           /* @__PURE__ */ jsxRuntime.jsx(ui.TableCell, { children: formattedDate }),