@workos-inc/widgets 1.3.1 → 1.4.1

package/dist/esm/lib/invite-user-dialog.js

@@ -1,139 +1,258 @@
 "use client";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Callout, Dialog, Flex, Select, Text, VisuallyHidden, } from "@radix-ui/themes";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import {
+  Callout,
+  Dialog,
+  Flex,
+  Select,
+  Text,
+  VisuallyHidden
+} from "@radix-ui/themes";
 import * as React from "react";
-import { DialogContent, PrimaryButton, SecondaryButton, SelectContent, SelectItem, SelectTrigger, TextField, } from "./elements.js";
+import {
+  DialogContent,
+  PrimaryButton,
+  SecondaryButton,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  TextField
+} from "./elements.js";
 import { Label } from "./elements.js";
 import { isErrorLike } from "./utils.js";
 import { useInviteUser } from "./api/user.js";
 import { useRoles } from "../api/endpoint.js";
-/**
- * Used to stub a fake value for the role select. It will be selected by default
- * before the role query resolves, or if the query results in an error. We do
- * this because we need to provide _any_ value to the select to avoid
- * controlled/uncontrolled bugs.
- */
 const PLACEHOLDER_ROLE = "_rolePlaceholder";
-export function InviteUserDialog({ children }) {
-    const [open, setOpen] = React.useState(false);
-    const dialogId = toId("invite-user", React.useId());
-    const formId = toId(dialogId, "form");
-    const inviteUser = useInviteUser();
-    const rolesQuery = useRoles({
-        query: { initialData: [] },
+function InviteUserDialog({ children }) {
+  const [open, setOpen] = React.useState(false);
+  const dialogId = toId("invite-user", React.useId());
+  const formId = toId(dialogId, "form");
+  const inviteUser = useInviteUser();
+  const rolesQuery = useRoles({
+    query: { initialData: [] }
+  });
+  const roles = rolesQuery.data;
+  const [selectedRole, setSelectedRole] = React.useState(
+    () => getDefaultRole(roles)?.slug || PLACEHOLDER_ROLE
+  );
+  React.useEffect(() => {
+    setSelectedRole((selectedRole2) => {
+      if (roles.find((role) => role.slug === selectedRole2)) {
+        return selectedRole2;
+      }
+      return getDefaultRole(roles)?.slug || PLACEHOLDER_ROLE;
     });
-    const roles = rolesQuery.data;
-    const [selectedRole, setSelectedRole] = React.useState(() => getDefaultRole(roles)?.slug || PLACEHOLDER_ROLE);
-    React.useEffect(() => {
-        // Update the selected role if it's not in the list (eg if the list was
-        // previously empty and the query resolved)
-        setSelectedRole((selectedRole) => {
-            if (roles.find((role) => role.slug === selectedRole)) {
-                // if current selected role is in the new list, don't change it
-                return selectedRole;
-            }
-            return getDefaultRole(roles)?.slug || PLACEHOLDER_ROLE;
-        });
-    }, [roles]);
-    const onSubmitForm = (data) => {
-        if (inviteUser.isPending || rolesQuery.status !== "success") {
-            return;
+  }, [roles]);
+  const onSubmitForm = (data) => {
+    if (inviteUser.isPending || rolesQuery.status !== "success") {
+      return;
+    }
+    inviteUser.mutate(
+      { data },
+      {
+        onSuccess: () => {
+          setOpen(false);
+        }
+      }
+    );
+  };
+  const formErrors = getFormErrors(inviteUser.error);
+  useFormFieldFocusOnError(dialogId, inviteUser.error);
+  return /* @__PURE__ */ jsxs(Dialog.Root, { open, onOpenChange: setOpen, children: [
+    children && /* @__PURE__ */ jsx(Dialog.Trigger, { children }),
+    /* @__PURE__ */ jsxs(DialogContent, { maxWidth: "480px", children: [
+      /* @__PURE__ */ jsx(Dialog.Title, { children: "Invite user" }),
+      /* @__PURE__ */ jsx(Dialog.Description, { children: "An invitation will be sent to this email address with a link to complete their account." }),
+      /* @__PURE__ */ jsx(Flex, { direction: "column", gap: "4", mt: "5", asChild: true, children: /* @__PURE__ */ jsxs(
+        "form",
+        {
+          id: formId,
+          onSubmit: async (event) => {
+            event.preventDefault();
+            onSubmitForm({
+              email: event.currentTarget.email.value,
+              roles: [selectedRole]
+            });
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              FormField,
+              {
+                rootId: dialogId,
+                name: "email",
+                label: "Email address",
+                error: formErrors.fields.email,
+                required: true,
+                control: (props) => /* @__PURE__ */ jsx(
+                  TextField,
+                  {
+                    ...props,
+                    "data-1p-ignore": "true",
+                    "data-lpignore": "true",
+                    type: "email",
+                    autoComplete: "off",
+                    placeholder: "Enter an email address"
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              FormField,
+              {
+                rootId: dialogId,
+                name: "role",
+                label: "Role",
+                error: formErrors.fields.role,
+                disabled: rolesQuery.isPending || roles.length <= 1,
+                info: roles.length === 1 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                  "New users will be invited with the",
+                  " ",
+                  /* @__PURE__ */ jsx(Text, { weight: "bold", children: roles[0].name }),
+                  " role, as it is the only one available."
+                ] }) : void 0,
+                control: ({
+                  id,
+                  "aria-invalid": ariaInvalid,
+                  "aria-describedby": ariaDescribedBy,
+                  ...props
+                }) => /* @__PURE__ */ jsxs(
+                  Select.Root,
+                  {
+                    ...props,
+                    value: selectedRole,
+                    onValueChange: setSelectedRole,
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        SelectTrigger,
+                        {
+                          id,
+                          "aria-invalid": ariaInvalid,
+                          "aria-describedby": ariaDescribedBy
+                        }
+                      ),
+                      /* @__PURE__ */ jsxs(SelectContent, { children: [
+                        /* @__PURE__ */ jsx(SelectItem, { value: PLACEHOLDER_ROLE, disabled: true, children: "Select a role" }),
+                        roles.map((role) => /* @__PURE__ */ jsx(SelectItem, { value: role.slug, children: role.name }, role.slug))
+                      ] })
+                    ]
+                  }
+                )
+              }
+            )
+          ]
         }
-        inviteUser.mutate({ data }, {
-            onSuccess: () => {
-                setOpen(false);
-            },
-        });
-    };
-    const formErrors = getFormErrors(inviteUser.error);
-    useFormFieldFocusOnError(dialogId, inviteUser.error);
-    return (_jsxs(Dialog.Root, { open: open, onOpenChange: setOpen, children: [children && _jsx(Dialog.Trigger, { children: children }), _jsxs(DialogContent, { maxWidth: "480px", children: [_jsx(Dialog.Title, { children: "Invite user" }), _jsx(Dialog.Description, { children: "An invitation will be sent to this email address with a link to complete their account." }), _jsx(Flex, { direction: "column", gap: "4", mt: "5", asChild: true, children: _jsxs("form", { id: formId, onSubmit: async (event) => {
-                                event.preventDefault();
-                                onSubmitForm({
-                                    email: event.currentTarget.email.value,
-                                    roles: [selectedRole],
-                                });
-                            }, children: [_jsx(FormField, { rootId: dialogId, name: "email", label: "Email address", error: formErrors.fields.email, required: true, control: (props) => (_jsx(TextField, { ...props, "data-1p-ignore": "true", "data-lpignore": "true", type: "email", autoComplete: "off", placeholder: "Enter an email address" })) }), _jsx(FormField, { rootId: dialogId, name: "role", label: "Role", error: formErrors.fields.role, disabled: rolesQuery.isPending || roles.length <= 1, info: roles.length === 1 ? (_jsxs(_Fragment, { children: ["New users will be invited with the", " ", _jsx(Text, { weight: "bold", children: roles[0].name }), " role, as it is the only one available."] })) : undefined, control: ({ id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedBy, ...props }) => (_jsxs(Select.Root, { ...props, value: selectedRole, onValueChange: setSelectedRole, children: [_jsx(SelectTrigger, { id: id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedBy }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: PLACEHOLDER_ROLE, disabled: true, children: "Select a role" }), roles.map((role) => (_jsx(SelectItem, { value: role.slug, children: role.name }, role.slug)))] })] })) })] }) }), formErrors.form ? (_jsx(Callout.Root, { color: "red", mt: "4", mb: "-2", children: _jsx(Callout.Text, { children: formErrors.form }) })) : null, _jsxs(Flex, { mt: "5", gap: "3", justify: "end", children: [_jsx(Dialog.Close, { children: _jsx(SecondaryButton, { disabled: inviteUser.isPending, children: "Cancel" }) }), _jsx(PrimaryButton, { form: formId, loading: inviteUser.isPending, disabled: rolesQuery.isPending || undefined, children: "Invite" })] }), _jsx(VisuallyHidden, { asChild: true, children: _jsx("section", { "aria-live": "polite", children: formErrors.form }) })] }, String(open))] }));
+      ) }),
+      formErrors.form ? /* @__PURE__ */ jsx(Callout.Root, { color: "red", mt: "4", mb: "-2", children: /* @__PURE__ */ jsx(Callout.Text, { children: formErrors.form }) }) : null,
+      /* @__PURE__ */ jsxs(Flex, { mt: "5", gap: "3", justify: "end", children: [
+        /* @__PURE__ */ jsx(Dialog.Close, { children: /* @__PURE__ */ jsx(SecondaryButton, { disabled: inviteUser.isPending, children: "Cancel" }) }),
+        /* @__PURE__ */ jsx(
+          PrimaryButton,
+          {
+            form: formId,
+            loading: inviteUser.isPending,
+            disabled: rolesQuery.isPending || void 0,
+            children: "Invite"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(VisuallyHidden, { asChild: true, children: /* @__PURE__ */ jsx("section", { "aria-live": "polite", children: formErrors.form }) })
+    ] }, String(open))
+  ] });
 }
-function FormField({ rootId, name, label, error, info, control, required, disabled, }) {
-    const fieldId = toId(rootId, name);
-    const errorId = toId(rootId, name, "error");
-    const infoId = toId(rootId, name, "info");
-    return (_jsxs(Flex, { direction: "column", gap: "1", children: [_jsx(Label, { htmlFor: fieldId, children: label }), control({
-                id: fieldId,
-                name,
-                "aria-describedby": (() => {
-                    const tags = [];
-                    if (error) {
-                        tags.push(errorId);
-                    }
-                    if (info) {
-                        tags.push(infoId);
-                    }
-                    if (tags.length === 0) {
-                        return undefined;
-                    }
-                    return tags.join(" ");
-                })(),
-                "aria-invalid": !!error || undefined,
-                required: required || undefined,
-                disabled: disabled || undefined,
-            }), error ? (_jsx(Text, { color: "red", size: "2", id: errorId, children: error })) : null, info ? (_jsx(Text, { color: "gray", size: "2", id: infoId, mt: "1", children: info })) : null] }));
+function FormField({
+  rootId,
+  name,
+  label,
+  error,
+  info,
+  control,
+  required,
+  disabled
+}) {
+  const fieldId = toId(rootId, name);
+  const errorId = toId(rootId, name, "error");
+  const infoId = toId(rootId, name, "info");
+  return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", children: [
+    /* @__PURE__ */ jsx(Label, { htmlFor: fieldId, children: label }),
+    control({
+      id: fieldId,
+      name,
+      "aria-describedby": (() => {
+        const tags = [];
+        if (error) {
+          tags.push(errorId);
+        }
+        if (info) {
+          tags.push(infoId);
+        }
+        if (tags.length === 0) {
+          return void 0;
+        }
+        return tags.join(" ");
+      })(),
+      "aria-invalid": !!error || void 0,
+      required: required || void 0,
+      disabled: disabled || void 0
+    }),
+    error ? /* @__PURE__ */ jsx(Text, { color: "red", size: "2", id: errorId, children: error }) : null,
+    info ? /* @__PURE__ */ jsx(Text, { color: "gray", size: "2", id: infoId, mt: "1", children: info }) : null
+  ] });
 }
 function toId(...parts) {
-    return parts.join("-");
+  return parts.join("-");
 }
 function getFormErrors(queryError) {
-    const formErrors = {
-        form: null,
-        fields: {
-            email: null,
-            role: null,
-        },
-    };
-    if (queryError) {
-        if (!isErrorLike(queryError)) {
-            return {
-                ...formErrors,
-                form: "An unexpected error occurred. Please try again.",
-            };
-        }
-        switch (queryError.message.toLowerCase()) {
-            case "user already exists":
-            case "user already invited":
-            case "invalid email":
-                formErrors.fields.email = queryError.message;
-                break;
-            case "invalid role":
-                formErrors.fields.role = queryError.message;
-                break;
-            default:
-                // TODO handle more cases for various server errors
-                formErrors.form =
-                    "There was an error inviting this user. Please refresh the page and try again.";
-                break;
-        }
+  const formErrors = {
+    form: null,
+    fields: {
+      email: null,
+      role: null
+    }
+  };
+  if (queryError) {
+    if (!isErrorLike(queryError)) {
+      return {
+        ...formErrors,
+        form: "An unexpected error occurred. Please try again."
+      };
     }
-    return formErrors;
+    switch (queryError.message.toLowerCase()) {
+      case "user already exists":
+      case "user already invited":
+      case "invalid email":
+        formErrors.fields.email = queryError.message;
+        break;
+      case "invalid role":
+        formErrors.fields.role = queryError.message;
+        break;
+      default:
+        formErrors.form = "There was an error inviting this user. Please refresh the page and try again.";
+        break;
+    }
+  }
+  return formErrors;
 }
 function useFormFieldFocusOnError(dialogId, queryError) {
-    React.useEffect(() => {
-        const fieldErrors = getFormErrors(queryError).fields;
-        for (const [name, error] of Object.entries(fieldErrors)) {
-            if (error) {
-                const fieldElement = document.getElementById(toId(dialogId, name));
-                if (fieldElement) {
-                    fieldElement?.focus();
-                    if ("select" in fieldElement) {
-                        fieldElement.select();
-                    }
-                }
-                break;
-            }
+  React.useEffect(() => {
+    const fieldErrors = getFormErrors(queryError).fields;
+    for (const [name, error] of Object.entries(fieldErrors)) {
+      if (error) {
+        const fieldElement = document.getElementById(toId(dialogId, name));
+        if (fieldElement) {
+          fieldElement?.focus();
+          if ("select" in fieldElement) {
+            fieldElement.select();
+          }
         }
-    }, [dialogId, queryError]);
+        break;
+      }
+    }
+  }, [dialogId, queryError]);
 }
 function getDefaultRole(roles) {
-    return roles.find((role) => role.default) || roles[0];
+  return roles.find((role) => role.default) || roles[0];
 }
+export {
+  InviteUserDialog
+};
 //# sourceMappingURL=invite-user-dialog.js.map

package/dist/esm/lib/invite-user-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"invite-user-dialog.js","sourceRoot":"","sources":["../../../src/lib/invite-user-dialog.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../src/lib/invite-user-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Callout,\n  Dialog,\n  Flex,\n  Select,\n  Text,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport * as React from \"react\";\nimport {\n  DialogContent,\n  PrimaryButton,\n  SecondaryButton,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  TextField,\n} from \"./elements.js\";\nimport { Label } from \"./elements.js\";\nimport { isErrorLike } from \"./utils.js\";\nimport { useInviteUser } from \"./api/user.js\";\nimport { InviteMemberInput, MemberRole, useRoles } from \"../api/endpoint.js\";\n\n/**\n * Used to stub a fake value for the role select. It will be selected by default\n * before the role query resolves, or if the query results in an error. We do\n * this because we need to provide _any_ value to the select to avoid\n * controlled/uncontrolled bugs.\n */\nconst PLACEHOLDER_ROLE = \"_rolePlaceholder\";\n\ninterface InviteUserDialogProps {\n  children?: React.ReactNode;\n}\n\nexport function InviteUserDialog({ children }: InviteUserDialogProps) {\n  const [open, setOpen] = React.useState(false);\n  const dialogId = toId(\"invite-user\", React.useId());\n  const formId = toId(dialogId, \"form\");\n\n  const inviteUser = useInviteUser();\n  const rolesQuery = useRoles({\n    query: { initialData: [] },\n  });\n  const roles = rolesQuery.data;\n  const [selectedRole, setSelectedRole] = React.useState(\n    () => getDefaultRole(roles)?.slug || PLACEHOLDER_ROLE,\n  );\n  React.useEffect(() => {\n    // Update the selected role if it's not in the list (eg if the list was\n    // previously empty and the query resolved)\n    setSelectedRole((selectedRole) => {\n      if (roles.find((role) => role.slug === selectedRole)) {\n        // if current selected role is in the new list, don't change it\n        return selectedRole;\n      }\n      return getDefaultRole(roles)?.slug || PLACEHOLDER_ROLE;\n    });\n  }, [roles]);\n\n  const onSubmitForm = (data: InviteMemberInput) => {\n    if (inviteUser.isPending || rolesQuery.status !== \"success\") {\n      return;\n    }\n    inviteUser.mutate(\n      { data },\n      {\n        onSuccess: () => {\n          setOpen(false);\n        },\n      },\n    );\n  };\n\n  const formErrors = getFormErrors(inviteUser.error);\n  useFormFieldFocusOnError(dialogId, inviteUser.error);\n\n  return (\n    <Dialog.Root open={open} onOpenChange={setOpen}>\n      {children && <Dialog.Trigger>{children}</Dialog.Trigger>}\n      <DialogContent maxWidth=\"480px\" key={String(open)}>\n        <Dialog.Title>Invite user</Dialog.Title>\n        <Dialog.Description>\n          An invitation will be sent to this email address with a link to\n          complete their account.\n        </Dialog.Description>\n        <Flex direction=\"column\" gap=\"4\" mt=\"5\" asChild>\n          <form\n            id={formId}\n            onSubmit={async (event) => {\n              event.preventDefault();\n              onSubmitForm({\n                email: event.currentTarget.email.value,\n                roles: [selectedRole],\n              });\n            }}\n          >\n            <FormField\n              rootId={dialogId}\n              name=\"email\"\n              label=\"Email address\"\n              error={formErrors.fields.email}\n              required\n              control={(props) => (\n                <TextField\n                  {...props}\n                  data-1p-ignore=\"true\"\n                  data-lpignore=\"true\"\n                  type=\"email\"\n                  autoComplete=\"off\"\n                  placeholder=\"Enter an email address\"\n                />\n              )}\n            />\n\n            <FormField\n              rootId={dialogId}\n              name=\"role\"\n              label=\"Role\"\n              error={formErrors.fields.role}\n              disabled={rolesQuery.isPending || roles.length <= 1}\n              info={\n                roles.length === 1 ? (\n                  <>\n                    New users will be invited with the{\" \"}\n                    <Text weight=\"bold\">{roles[0].name}</Text> role, as it is\n                    the only one available.\n                  </>\n                ) : undefined\n              }\n              control={({\n                id,\n                \"aria-invalid\": ariaInvalid,\n                \"aria-describedby\": ariaDescribedBy,\n                ...props\n              }) => (\n                <Select.Root\n                  {...props}\n                  value={selectedRole}\n                  onValueChange={setSelectedRole}\n                >\n                  <SelectTrigger\n                    id={id}\n                    aria-invalid={ariaInvalid}\n                    aria-describedby={ariaDescribedBy}\n                  />\n                  <SelectContent>\n                    <SelectItem value={PLACEHOLDER_ROLE} disabled>\n                      Select a role\n                    </SelectItem>\n                    {roles.map((role) => (\n                      <SelectItem key={role.slug} value={role.slug}>\n                        {role.name}\n                      </SelectItem>\n                    ))}\n                  </SelectContent>\n                </Select.Root>\n              )}\n            />\n          </form>\n        </Flex>\n\n        {formErrors.form ? (\n          <Callout.Root color=\"red\" mt=\"4\" mb=\"-2\">\n            <Callout.Text>{formErrors.form}</Callout.Text>\n          </Callout.Root>\n        ) : null}\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <SecondaryButton disabled={inviteUser.isPending}>\n              Cancel\n            </SecondaryButton>\n          </Dialog.Close>\n          <PrimaryButton\n            form={formId}\n            loading={inviteUser.isPending}\n            disabled={rolesQuery.isPending || undefined}\n          >\n            Invite\n          </PrimaryButton>\n        </Flex>\n        {/* mirror errors in a live region */}\n        <VisuallyHidden asChild>\n          <section aria-live=\"polite\">{formErrors.form}</section>\n        </VisuallyHidden>\n      </DialogContent>\n    </Dialog.Root>\n  );\n}\n\ninterface FormControlRenderProps {\n  id: string;\n  name: string;\n  \"aria-describedby\": string | undefined;\n  \"aria-invalid\"?: boolean;\n  required: boolean | undefined;\n  disabled: boolean | undefined;\n}\n\nfunction FormField({\n  rootId,\n  name,\n  label,\n  error,\n  info,\n  control,\n  required,\n  disabled,\n}: {\n  rootId: string;\n  name: string;\n  label: string;\n  error?: React.ReactNode;\n  info?: React.ReactNode;\n  control: (props: FormControlRenderProps) => React.ReactNode;\n  required?: boolean;\n  disabled?: boolean;\n}) {\n  const fieldId = toId(rootId, name);\n  const errorId = toId(rootId, name, \"error\");\n  const infoId = toId(rootId, name, \"info\");\n  return (\n    <Flex direction=\"column\" gap=\"1\">\n      <Label htmlFor={fieldId}>{label}</Label>\n      {control({\n        id: fieldId,\n        name,\n        \"aria-describedby\": (() => {\n          const tags: string[] = [];\n          if (error) {\n            tags.push(errorId);\n          }\n          if (info) {\n            tags.push(infoId);\n          }\n          if (tags.length === 0) {\n            return undefined;\n          }\n          return tags.join(\" \");\n        })(),\n        \"aria-invalid\": !!error || undefined,\n        required: required || undefined,\n        disabled: disabled || undefined,\n      })}\n\n      {error ? (\n        <Text color=\"red\" size=\"2\" id={errorId}>\n          {error}\n        </Text>\n      ) : null}\n      {info ? (\n        <Text color=\"gray\" size=\"2\" id={infoId} mt=\"1\">\n          {info}\n        </Text>\n      ) : null}\n    </Flex>\n  );\n}\n\nfunction toId(...parts: string[]) {\n  return parts.join(\"-\");\n}\n\nfunction getFormErrors(queryError: unknown) {\n  const formErrors = {\n    form: null as string | null,\n    fields: {\n      email: null as string | null,\n      role: null as string | null,\n    },\n  };\n\n  if (queryError) {\n    if (!isErrorLike(queryError)) {\n      return {\n        ...formErrors,\n        form: \"An unexpected error occurred. Please try again.\",\n      };\n    }\n\n    switch (queryError.message.toLowerCase()) {\n      case \"user already exists\":\n      case \"user already invited\":\n      case \"invalid email\":\n        formErrors.fields.email = queryError.message;\n        break;\n      case \"invalid role\":\n        formErrors.fields.role = queryError.message;\n        break;\n      default:\n        // TODO handle more cases for various server errors\n        formErrors.form =\n          \"There was an error inviting this user. Please refresh the page and try again.\";\n        break;\n    }\n  }\n\n  return formErrors;\n}\n\nfunction useFormFieldFocusOnError(dialogId: string, queryError: unknown) {\n  React.useEffect(() => {\n    const fieldErrors = getFormErrors(queryError).fields;\n    for (const [name, error] of Object.entries(fieldErrors)) {\n      if (error) {\n        const fieldElement = document.getElementById(toId(dialogId, name)) as\n          | HTMLInputElement\n          | HTMLButtonElement\n          | null;\n        if (fieldElement) {\n          fieldElement?.focus();\n          if (\"select\" in fieldElement) {\n            fieldElement.select();\n          }\n        }\n        break;\n      }\n    }\n  }, [dialogId, queryError]);\n}\n\nfunction getDefaultRole(roles: MemberRole[]) {\n  return roles.find((role) => role.default) || roles[0];\n}\n"],"mappings":"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","names":["selectedRole"]}

package/dist/esm/lib/logout-all-sessions-dialog.d.ts

@@ -1,9 +1,11 @@
-import { AlertDialog } from "@radix-ui/themes";
-import { type ReactNode } from "react";
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { AlertDialog } from '@radix-ui/themes';
+import { ReactNode } from 'react';
+
 interface LogoutAllSessionsDialogProps extends AlertDialog.RootProps {
     children?: ReactNode;
     currentSessionId: string;
 }
-export declare function LogoutAllSessionsDialog({ open, onOpenChange, children, currentSessionId, ...props }: LogoutAllSessionsDialogProps): import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=logout-all-sessions-dialog.d.ts.map
+declare function LogoutAllSessionsDialog({ open, onOpenChange, children, currentSessionId, ...props }: LogoutAllSessionsDialogProps): react_jsx_runtime.JSX.Element;
+
+export { LogoutAllSessionsDialog };

package/dist/esm/lib/logout-all-sessions-dialog.js

@@ -1,26 +1,67 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { AlertDialog, Flex } from "@radix-ui/themes";
-import { AlertDialogContent, DestructiveButton, SecondaryButton, } from "./elements.js";
+import {
+  AlertDialogContent,
+  DestructiveButton,
+  SecondaryButton
+} from "./elements.js";
 import { getSessionsQueryKey, useRevokeAllSessions } from "../api/endpoint.js";
 import { useQueryClient } from "@tanstack/react-query";
 import { SaveButton } from "./save-button.js";
-export function LogoutAllSessionsDialog({ open, onOpenChange, children, currentSessionId, ...props }) {
-    const client = useQueryClient();
-    const revokeAllSessions = useRevokeAllSessions();
-    const onSubmitForm = () => {
-        revokeAllSessions.mutate({ data: { currentSessionId } });
-    };
-    const handleDone = React.useCallback(() => {
-        onOpenChange?.(false);
-        client.invalidateQueries({
-            queryKey: getSessionsQueryKey(),
-        });
-    }, [client, onOpenChange]);
-    return (_jsx(AlertDialog.Root, { open: open, onOpenChange: onOpenChange, ...props, children: _jsxs(AlertDialogContent, { maxWidth: "480px", children: [_jsx(AlertDialog.Title, { children: "Sign out of all other devices?" }), _jsx(AlertDialog.Description, { children: "You will be logged out of all other active sessions on other devices, except this one." }), _jsx(Flex, { gap: "3", justify: "end", mt: "5", asChild: true, children: _jsxs("form", { onSubmit: (event) => {
-                            event.preventDefault();
-                            onSubmitForm();
-                        }, children: [_jsx(AlertDialog.Cancel, { children: _jsx(SecondaryButton, { disabled: revokeAllSessions.isPending || revokeAllSessions.isSuccess, children: "Cancel" }) }), _jsx(SaveButton, { asChild: true, loading: revokeAllSessions.isPending, done: revokeAllSessions.isSuccess, onDone: handleDone, children: _jsx(DestructiveButton, { type: "submit", children: "Sign out" }) })] }) })] }) }));
+function LogoutAllSessionsDialog({
+  open,
+  onOpenChange,
+  children,
+  currentSessionId,
+  ...props
+}) {
+  const client = useQueryClient();
+  const revokeAllSessions = useRevokeAllSessions();
+  const onSubmitForm = () => {
+    revokeAllSessions.mutate({ data: { currentSessionId } });
+  };
+  const handleDone = React.useCallback(() => {
+    onOpenChange?.(false);
+    client.invalidateQueries({
+      queryKey: getSessionsQueryKey()
+    });
+  }, [client, onOpenChange]);
+  return /* @__PURE__ */ jsx(AlertDialog.Root, { open, onOpenChange, ...props, children: /* @__PURE__ */ jsxs(AlertDialogContent, { maxWidth: "480px", children: [
+    /* @__PURE__ */ jsx(AlertDialog.Title, { children: "Sign out of all other devices?" }),
+    /* @__PURE__ */ jsx(AlertDialog.Description, { children: "You will be logged out of all other active sessions on other devices, except this one." }),
+    /* @__PURE__ */ jsx(Flex, { gap: "3", justify: "end", mt: "5", asChild: true, children: /* @__PURE__ */ jsxs(
+      "form",
+      {
+        onSubmit: (event) => {
+          event.preventDefault();
+          onSubmitForm();
+        },
+        children: [
+          /* @__PURE__ */ jsx(AlertDialog.Cancel, { children: /* @__PURE__ */ jsx(
+            SecondaryButton,
+            {
+              disabled: revokeAllSessions.isPending || revokeAllSessions.isSuccess,
+              children: "Cancel"
+            }
+          ) }),
+          /* @__PURE__ */ jsx(
+            SaveButton,
+            {
+              asChild: true,
+              loading: revokeAllSessions.isPending,
+              done: revokeAllSessions.isSuccess,
+              onDone: handleDone,
+              children: /* @__PURE__ */ jsx(DestructiveButton, { type: "submit", children: "Sign out" })
+            }
+          )
+        ]
+      }
+    ) })
+  ] }) });
 }
+export {
+  LogoutAllSessionsDialog
+};
 //# sourceMappingURL=logout-all-sessions-dialog.js.map

package/dist/esm/lib/logout-all-sessions-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"logout-all-sessions-dialog.js","sourceRoot":"","sources":["../../../src/lib/logout-all-sessions-dialog.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAErD,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,eAAe,GAChB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAC/E,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAO9C,MAAM,UAAU,uBAAuB,CAAC,EACtC,IAAI,EACJ,YAAY,EACZ,QAAQ,EACR,gBAAgB,EAChB,GAAG,KAAK,EACqB;IAC7B,MAAM,MAAM,GAAG,cAAc,EAAE,CAAC;IAEhC,MAAM,iBAAiB,GAAG,oBAAoB,EAAE,CAAC;IAEjD,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,iBAAiB,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,EAAE,gBAAgB,EAAE,EAAE,CAAC,CAAC;IAC3D,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACxC,YAAY,EAAE,CAAC,KAAK,CAAC,CAAC;QAEtB,MAAM,CAAC,iBAAiB,CAAC;YACvB,QAAQ,EAAE,mBAAmB,EAAE;SAChC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC;IAE3B,OAAO,CACL,KAAC,WAAW,CAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY,KAAM,KAAK,YACjE,MAAC,kBAAkB,IAAC,QAAQ,EAAC,OAAO,aAClC,KAAC,WAAW,CAAC,KAAK,iDAAmD,EACrE,KAAC,WAAW,CAAC,WAAW,yGAGE,EAE1B,KAAC,IAAI,IAAC,GAAG,EAAC,GAAG,EAAC,OAAO,EAAC,KAAK,EAAC,EAAE,EAAC,GAAG,EAAC,OAAO,kBACxC,gBACE,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;4BAClB,KAAK,CAAC,cAAc,EAAE,CAAC;4BACvB,YAAY,EAAE,CAAC;wBACjB,CAAC,aAED,KAAC,WAAW,CAAC,MAAM,cACjB,KAAC,eAAe,IACd,QAAQ,EACN,iBAAiB,CAAC,SAAS,IAAI,iBAAiB,CAAC,SAAS,uBAI5C,GACC,EAErB,KAAC,UAAU,IACT,OAAO,QACP,OAAO,EAAE,iBAAiB,CAAC,SAAS,EACpC,IAAI,EAAE,iBAAiB,CAAC,SAAS,EACjC,MAAM,EAAE,UAAU,YAElB,KAAC,iBAAiB,IAAC,IAAI,EAAC,QAAQ,yBAA6B,GAClD,IACR,GACF,IACY,GACJ,CACpB,CAAC;AACJ,CAAC"}
+{"version":3,"sources":["../../../src/lib/logout-all-sessions-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { AlertDialog, Flex } from \"@radix-ui/themes\";\nimport { type ReactNode } from \"react\";\nimport {\n  AlertDialogContent,\n  DestructiveButton,\n  SecondaryButton,\n} from \"./elements.js\";\nimport { getSessionsQueryKey, useRevokeAllSessions } from \"../api/endpoint.js\";\nimport { useQueryClient } from \"@tanstack/react-query\";\nimport { SaveButton } from \"./save-button.js\";\n\ninterface LogoutAllSessionsDialogProps extends AlertDialog.RootProps {\n  children?: ReactNode;\n  currentSessionId: string;\n}\n\nexport function LogoutAllSessionsDialog({\n  open,\n  onOpenChange,\n  children,\n  currentSessionId,\n  ...props\n}: LogoutAllSessionsDialogProps) {\n  const client = useQueryClient();\n\n  const revokeAllSessions = useRevokeAllSessions();\n\n  const onSubmitForm = () => {\n    revokeAllSessions.mutate({ data: { currentSessionId } });\n  };\n\n  const handleDone = React.useCallback(() => {\n    onOpenChange?.(false);\n\n    client.invalidateQueries({\n      queryKey: getSessionsQueryKey(),\n    });\n  }, [client, onOpenChange]);\n\n  return (\n    <AlertDialog.Root open={open} onOpenChange={onOpenChange} {...props}>\n      <AlertDialogContent maxWidth=\"480px\">\n        <AlertDialog.Title>Sign out of all other devices?</AlertDialog.Title>\n        <AlertDialog.Description>\n          You will be logged out of all other active sessions on other devices,\n          except this one.\n        </AlertDialog.Description>\n\n        <Flex gap=\"3\" justify=\"end\" mt=\"5\" asChild>\n          <form\n            onSubmit={(event) => {\n              event.preventDefault();\n              onSubmitForm();\n            }}\n          >\n            <AlertDialog.Cancel>\n              <SecondaryButton\n                disabled={\n                  revokeAllSessions.isPending || revokeAllSessions.isSuccess\n                }\n              >\n                Cancel\n              </SecondaryButton>\n            </AlertDialog.Cancel>\n\n            <SaveButton\n              asChild\n              loading={revokeAllSessions.isPending}\n              done={revokeAllSessions.isSuccess}\n              onDone={handleDone}\n            >\n              <DestructiveButton type=\"submit\">Sign out</DestructiveButton>\n            </SaveButton>\n          </form>\n        </Flex>\n      </AlertDialogContent>\n    </AlertDialog.Root>\n  );\n}\n"],"mappings":";AA6CQ,cAOE,YAPF;AA3CR,YAAY,WAAW;AACvB,SAAS,aAAa,YAAY;AAElC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,qBAAqB,4BAA4B;AAC1D,SAAS,sBAAsB;AAC/B,SAAS,kBAAkB;AAOpB,SAAS,wBAAwB;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiC;AAC/B,QAAM,SAAS,eAAe;AAE9B,QAAM,oBAAoB,qBAAqB;AAE/C,QAAM,eAAe,MAAM;AACzB,sBAAkB,OAAO,EAAE,MAAM,EAAE,iBAAiB,EAAE,CAAC;AAAA,EACzD;AAEA,QAAM,aAAa,MAAM,YAAY,MAAM;AACzC,mBAAe,KAAK;AAEpB,WAAO,kBAAkB;AAAA,MACvB,UAAU,oBAAoB;AAAA,IAChC,CAAC;AAAA,EACH,GAAG,CAAC,QAAQ,YAAY,CAAC;AAEzB,SACE,oBAAC,YAAY,MAAZ,EAAiB,MAAY,cAA6B,GAAG,OAC5D,+BAAC,sBAAmB,UAAS,SAC3B;AAAA,wBAAC,YAAY,OAAZ,EAAkB,4CAA8B;AAAA,IACjD,oBAAC,YAAY,aAAZ,EAAwB,oGAGzB;AAAA,IAEA,oBAAC,QAAK,KAAI,KAAI,SAAQ,OAAM,IAAG,KAAI,SAAO,MACxC;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,CAAC,UAAU;AACnB,gBAAM,eAAe;AACrB,uBAAa;AAAA,QACf;AAAA,QAEA;AAAA,8BAAC,YAAY,QAAZ,EACC;AAAA,YAAC;AAAA;AAAA,cACC,UACE,kBAAkB,aAAa,kBAAkB;AAAA,cAEpD;AAAA;AAAA,UAED,GACF;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC,SAAO;AAAA,cACP,SAAS,kBAAkB;AAAA,cAC3B,MAAM,kBAAkB;AAAA,cACxB,QAAQ;AAAA,cAER,8BAAC,qBAAkB,MAAK,UAAS,sBAAQ;AAAA;AAAA,UAC3C;AAAA;AAAA;AAAA,IACF,GACF;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/esm/lib/logout-dialog.d.ts

@@ -1,10 +1,14 @@
-import { AlertDialog } from "@radix-ui/themes";
-import { type ReactNode } from "react";
-import { ActiveSession } from "../api/endpoint.js";
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { AlertDialog } from '@radix-ui/themes';
+import { ReactNode } from 'react';
+import { ActiveSession } from '../api/endpoint.js';
+import '@tanstack/react-query';
+import '../api/widgets-api-client.js';
+
 interface LogoutDialogProps extends AlertDialog.RootProps {
     children?: ReactNode;
     session: ActiveSession;
 }
-export declare function LogoutDialog({ children, session, open, onOpenChange, ...props }: LogoutDialogProps): import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=logout-dialog.d.ts.map
+declare function LogoutDialog({ children, session, open, onOpenChange, ...props }: LogoutDialogProps): react_jsx_runtime.JSX.Element;
+
+export { LogoutDialog };