@workos-inc/widgets 1.8.0 → 1.8.2

package/dist/cjs/lib/add-mfa-dialog.cjs

@@ -39,7 +39,7 @@ var Otp = __toESM(require("./otp-input.js"), 1);
 var import_elements = require("./elements.js");
 var import_endpoint = require("../api/endpoint.js");
 var import_api_provider = require("../api/api-provider.js");
-var Form = __toESM(require("@radix-ui/react-form"), 1);
+var import_radix_ui = require("radix-ui");
 var import_marker = require("./marker.js");
 var import_copy_button = require("./copy-button.js");
 var import_use_security_settings = require("./use-security-settings.js");
@@ -136,7 +136,7 @@ function Content({ onClose, totpFactor }) {
         description: "Title for setting up two-factor authentication"
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Form.Root, { onSubmit: handleSubmit, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_radix_ui.Form.Root, { onSubmit: handleSubmit, children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Grid, { columns: "auto 1fr", rows: "repeat(4, auto)", gapX: "3", gapY: "1", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
           import_themes.Grid,

package/dist/cjs/lib/add-mfa-dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/add-mfa-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Box,\n  Code,\n  Flex,\n  Grid,\n  Link,\n  Separator,\n  Text,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport * as Otp from \"./otp-input.js\";\nimport { Dialog, Button } from \"./elements.js\";\nimport {\n  CreateTotpFactorResponse,\n  CreateTotpFactorResponseAuthenticationFactorAllOfTotpAnyOf,\n  useCreateTotpFactor,\n  useVerifyTotpFactor,\n} from \"../api/endpoint.js\";\nimport { useElevatedAccessToken } from \"../api/api-provider.js\";\nimport * as Form from \"@radix-ui/react-form\";\nimport { Marker } from \"./marker.js\";\nimport { CopyButton } from \"./copy-button.js\";\nimport { useSecuritySettings } from \"./use-security-settings.js\";\nimport { ElevatedAccess } from \"./elevated-access.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { useDialogClose } from \"./use-dialog-close.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface AddMfaDialogProps extends Dialog.RootProps {\n  children?: ReactNode;\n  onSuccess?: () => void;\n}\n\nexport function AddMfaDialog({\n  children,\n  onSuccess,\n  ...props\n}: AddMfaDialogProps) {\n  const [open, setOpen] = React.useState(false);\n  const [manuallyTriggered, setManuallyTriggered] = React.useState(false);\n  const { elevatedAccess } = useElevatedAccessToken();\n  const createAuthFactor = useCreateTotpFactor();\n\n  const handleVerified = async () => {\n    await createAuthFactor.mutateAsync(undefined);\n  };\n\n  const onTriggerClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    if (elevatedAccess && !createAuthFactor.data) {\n      event.preventDefault();\n      setManuallyTriggered(true);\n      createAuthFactor.mutate(undefined, {\n        onSuccess: () => {\n          setOpen(true);\n        },\n      });\n    } else {\n      setManuallyTriggered(false);\n    }\n  };\n\n  const handleClose = React.useCallback(() => {\n    setOpen(false);\n  }, []);\n\n  return (\n    <Dialog.Root\n      {...props}\n      open={props.open || open}\n      onOpenChange={props.onOpenChange || setOpen}\n    >\n      <Dialog.Trigger\n        onClick={onTriggerClick}\n        // @ts-ignore I've to find a way to pass the loading state to the trigger\n        loading={manuallyTriggered && createAuthFactor.isPending}\n      >\n        {children}\n      </Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <ElevatedAccess onVerified={handleVerified}>\n          <Content onClose={handleClose} totpFactor={createAuthFactor.data} />\n        </ElevatedAccess>\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps {\n  totpFactor?: CreateTotpFactorResponse;\n  onClose?: () => void;\n}\n\nfunction Content({ onClose, totpFactor }: ContentProps) {\n  const securitySettings = useSecuritySettings();\n  const translate = useTranslation();\n\n  const [customError, setCustomError] = React.useState<string | null>(null);\n  const totp = hasQrCode(totpFactor)\n    ? totpFactor.authenticationFactor.totp\n    : undefined;\n\n  const verifyTotp = useVerifyTotpFactor({\n    mutation: {\n      onSuccess: ({ success }) => {\n        if (!success) {\n          setCustomError(\"Invalid passcode\");\n        }\n      },\n    },\n  });\n\n  const serverError = verifyTotp.error || customError;\n  const isSuccess = verifyTotp.isSuccess && !serverError;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n    setCustomError(null);\n\n    const formData = new FormData(event.currentTarget);\n    const otpCode = formData.get(\"otp-code\")?.toString();\n\n    verifyTotp.mutate({\n      data: {\n        authenticationChallengeId: totpFactor?.authenticationChallenge.id ?? \"\",\n        code: otpCode ?? \"\",\n      },\n    });\n  };\n\n  useDialogClose(isSuccess, () => {\n    securitySettings.update(\"Mfa\", true);\n  });\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Set up an authenticator app\"\n          id=\"Eu+kuO\"\n          description=\"Title for setting up two-factor authentication\"\n        />\n      </Dialog.Title>\n\n      <Form.Root onSubmit={handleSubmit}>\n        <Grid columns=\"auto 1fr\" rows=\"repeat(4, auto)\" gapX=\"3\" gapY=\"1\">\n          <Grid\n            rows=\"subgrid\"\n            gridRow=\"span 4\"\n            style={{ placeItems: \"center\" }}\n          >\n            {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n            <Marker>1</Marker>\n            <Separator\n              orientation=\"vertical\"\n              size=\"4\"\n              style={{ width: \"2px\" }}\n            />\n            {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n            <Marker>2</Marker>\n            <div />\n          </Grid>\n\n          <Grid rows=\"subgrid\" gridRow=\"span 4\">\n            <Text as=\"p\" size=\"3\" weight=\"bold\">\n              <Translation\n                defaultMessage=\"Scan the QR code\"\n                id=\"fTSp5u\"\n                description=\"Heading for the QR code scanning step in MFA setup\"\n              />\n            </Text>\n            <Flex direction=\"column\" gap=\"1\">\n              <Text as=\"p\" size=\"2\">\n                <Translation\n                  defaultMessage=\"Use an authenticator app like {onep}, {google}, {authy}, or {microsoft} to scan the QR code below.\"\n                  id=\"8xwdwI\"\n                  description=\"Instructions for scanning the QR code with authenticator apps\"\n                  values={{\n                    onep: (\n                      <Link\n                        href=\"https://1password.com/\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        1Password\n                      </Link>\n                    ),\n                    google: (\n                      <Link\n                        href=\"https://apps.apple.com/us/app/google-authenticator/id388497605\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        Google Authenticator\n                      </Link>\n                    ),\n                    authy: (\n                      <Link\n                        href=\"https://authy.com/\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        Authy\n                      </Link>\n                    ),\n                    microsoft: (\n                      <Link\n                        href=\"https://www.microsoft.com/en-gb/security/mobile-authenticator-app\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        Microsoft Authenticator\n                      </Link>\n                    ),\n                  }}\n                />\n              </Text>\n              <Flex align=\"center\" gap=\"5\" my=\"5\">\n                <Grid\n                  position=\"relative\"\n                  width=\"160px\"\n                  height=\"160px\"\n                  p=\"2\"\n                  style={{\n                    border: \"1px solid var(--gray-7)\",\n                    borderRadius: \"var(--radius-4)\",\n                    background: \"var(--gray-2)\",\n                    overflow: \"hidden\",\n                  }}\n                >\n                  {totp?.qr_code && (\n                    <Box asChild width=\"100%\" height=\"auto\">\n                      <img\n                        alt={translate({\n                          defaultMessage: \"Scan this QR code to enroll\",\n                          description: \"Alt text for QR code image\",\n                          id: \"wpbqFJ\",\n                        })}\n                        aria-describedby=\"secret-note\"\n                        height=\"160\"\n                        src={totp.qr_code}\n                        style={{ userSelect: \"none\", background: \"white\" }}\n                        width=\"160\"\n                      />\n                    </Box>\n                  )}\n                </Grid>\n\n                <Flex direction=\"column\" gap=\"1\" align=\"start\">\n                  <Text color=\"gray\" id=\"secret-note\" size=\"2\">\n                    <Translation\n                      defaultMessage=\"Can't scan the code?\"\n                      id=\"6/cdcS\"\n                      description=\"Question asking if user is unable to scan the QR code\"\n                    />\n                  </Text>\n\n                  <SecretDialog setupKey={totp?.secret ?? \"\"}>\n                    <Button\n                      variant=\"secondary\"\n                      size=\"1\"\n                      disabled={verifyTotp.isPending || isSuccess}\n                    >\n                      <Translation\n                        defaultMessage=\"View setup key\"\n                        id=\"q3eZjH\"\n                        description=\"Button text to view the manual setup key\"\n                      />\n                    </Button>\n                  </SecretDialog>\n                </Flex>\n              </Flex>\n            </Flex>\n            <Text as=\"p\" size=\"3\" weight=\"bold\">\n              <Translation\n                defaultMessage=\"Get verification passcode\"\n                id=\"1kRd2b\"\n                description=\"Heading for entering the verification code step\"\n              />\n            </Text>\n            <Flex direction=\"column\" gap=\"4\">\n              <Text as=\"p\" size=\"2\">\n                <Translation\n                  defaultMessage=\"Enter the 6-digit passcode from your authenticator app.\"\n                  id=\"4/66bS\"\n                  description=\"Instructions for entering the verification passcode\"\n                />\n              </Text>\n\n              <Flex direction=\"column\" gap=\"2\">\n                <Otp.Root\n                  autoSubmit\n                  gap=\"3\"\n                  justify=\"start\"\n                  name=\"otp-code\"\n                  rows=\"48px\"\n                  columns=\"repeat(6, 48px)\"\n                  readOnly={verifyTotp.isPending || isSuccess}\n                >\n                  <Otp.Input required autoFocus autoComplete=\"off\" />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                </Otp.Root>\n\n                {serverError && (\n                  <Text size=\"2\" color=\"red\">\n                    {getMutationErrorMessage(serverError)}\n                  </Text>\n                )}\n              </Flex>\n            </Flex>\n          </Grid>\n        </Grid>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              disabled={verifyTotp.isPending || isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"84pAvU\"\n                description=\"Button text to cancel MFA setup\"\n              />\n            </Button>\n          </Dialog.Close>\n\n          <SaveButton\n            type=\"submit\"\n            loading={verifyTotp.isPending}\n            done={isSuccess}\n            onDone={onClose}\n          >\n            <Translation\n              defaultMessage=\"Confirm\"\n              id=\"WHthZi\"\n              description=\"Button text to confirm MFA setup\"\n            />\n          </SaveButton>\n        </Flex>\n      </Form.Root>\n\n      {/* mirror errors in a live region */}\n      <VisuallyHidden asChild>\n        <section aria-live=\"polite\">\n          {getMutationErrorMessage(serverError)}\n        </section>\n      </VisuallyHidden>\n    </>\n  );\n}\n\ninterface SecretDialogProps extends React.PropsWithChildren {\n  setupKey: string;\n}\n\nfunction SecretDialog({ children, setupKey }: SecretDialogProps) {\n  return (\n    <Dialog.Root>\n      <Dialog.Trigger>{children}</Dialog.Trigger>\n      <Dialog.Content\n        maxWidth=\"90vw\"\n        size={{ initial: \"3\", sm: \"4\" }}\n        minWidth=\"300px\"\n        width=\"fit-content\"\n      >\n        <Dialog.Title size=\"2\" weight=\"regular\">\n          <Translation\n            defaultMessage=\"Your setup key\"\n            id=\"LleqNP\"\n            description=\"Title for dialog showing the manual setup key\"\n          />\n        </Dialog.Title>\n        <Dialog.Description>\n          <Text size=\"6\">\n            <Code variant=\"ghost\" style={{ letterSpacing: \"0.15rem\" }}>\n              {setupKey}\n            </Code>\n          </Text>\n        </Dialog.Description>\n\n        <Flex align=\"center\" gap=\"3\" justify=\"end\" mt=\"5\">\n          <Dialog.Close>\n            <CopyButton value={setupKey}>\n              <Translation\n                defaultMessage=\"Copy and close\"\n                id=\"EyjGir\"\n                description=\"Button text to copy setup key and close dialog\"\n              />\n            </CopyButton>\n          </Dialog.Close>\n        </Flex>\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  let message = \"Something went wrong, please try again\";\n\n  if (typeof error === \"string\") {\n    message = error;\n  }\n\n  if (error instanceof Error) {\n    message = error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    message = error.message;\n  }\n\n  if (message === \"Invalid passcode\") {\n    message = \"Invalid passcode, please try again\";\n  }\n\n  return message;\n}\n\nfunction hasQrCode(\n  response?: CreateTotpFactorResponse,\n): response is CreateTotpFactorResponse & {\n  authenticationFactor: {\n    totp: NonNullable<CreateTotpFactorResponseAuthenticationFactorAllOfTotpAnyOf>;\n  };\n} {\n  const totp = response?.authenticationFactor.totp;\n  return totp != null && \"qr_code\" in totp;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/add-mfa-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Box,\n  Code,\n  Flex,\n  Grid,\n  Link,\n  Separator,\n  Text,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport * as Otp from \"./otp-input.js\";\nimport { Dialog, Button } from \"./elements.js\";\nimport {\n  CreateTotpFactorResponse,\n  CreateTotpFactorResponseAuthenticationFactorAllOfTotpAnyOf,\n  useCreateTotpFactor,\n  useVerifyTotpFactor,\n} from \"../api/endpoint.js\";\nimport { useElevatedAccessToken } from \"../api/api-provider.js\";\nimport { Form } from \"radix-ui\";\nimport { Marker } from \"./marker.js\";\nimport { CopyButton } from \"./copy-button.js\";\nimport { useSecuritySettings } from \"./use-security-settings.js\";\nimport { ElevatedAccess } from \"./elevated-access.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { useDialogClose } from \"./use-dialog-close.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface AddMfaDialogProps extends Dialog.RootProps {\n  children?: ReactNode;\n  onSuccess?: () => void;\n}\n\nexport function AddMfaDialog({\n  children,\n  onSuccess,\n  ...props\n}: AddMfaDialogProps) {\n  const [open, setOpen] = React.useState(false);\n  const [manuallyTriggered, setManuallyTriggered] = React.useState(false);\n  const { elevatedAccess } = useElevatedAccessToken();\n  const createAuthFactor = useCreateTotpFactor();\n\n  const handleVerified = async () => {\n    await createAuthFactor.mutateAsync(undefined);\n  };\n\n  const onTriggerClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    if (elevatedAccess && !createAuthFactor.data) {\n      event.preventDefault();\n      setManuallyTriggered(true);\n      createAuthFactor.mutate(undefined, {\n        onSuccess: () => {\n          setOpen(true);\n        },\n      });\n    } else {\n      setManuallyTriggered(false);\n    }\n  };\n\n  const handleClose = React.useCallback(() => {\n    setOpen(false);\n  }, []);\n\n  return (\n    <Dialog.Root\n      {...props}\n      open={props.open || open}\n      onOpenChange={props.onOpenChange || setOpen}\n    >\n      <Dialog.Trigger\n        onClick={onTriggerClick}\n        // @ts-ignore I've to find a way to pass the loading state to the trigger\n        loading={manuallyTriggered && createAuthFactor.isPending}\n      >\n        {children}\n      </Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <ElevatedAccess onVerified={handleVerified}>\n          <Content onClose={handleClose} totpFactor={createAuthFactor.data} />\n        </ElevatedAccess>\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps {\n  totpFactor?: CreateTotpFactorResponse;\n  onClose?: () => void;\n}\n\nfunction Content({ onClose, totpFactor }: ContentProps) {\n  const securitySettings = useSecuritySettings();\n  const translate = useTranslation();\n\n  const [customError, setCustomError] = React.useState<string | null>(null);\n  const totp = hasQrCode(totpFactor)\n    ? totpFactor.authenticationFactor.totp\n    : undefined;\n\n  const verifyTotp = useVerifyTotpFactor({\n    mutation: {\n      onSuccess: ({ success }) => {\n        if (!success) {\n          setCustomError(\"Invalid passcode\");\n        }\n      },\n    },\n  });\n\n  const serverError = verifyTotp.error || customError;\n  const isSuccess = verifyTotp.isSuccess && !serverError;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n    setCustomError(null);\n\n    const formData = new FormData(event.currentTarget);\n    const otpCode = formData.get(\"otp-code\")?.toString();\n\n    verifyTotp.mutate({\n      data: {\n        authenticationChallengeId: totpFactor?.authenticationChallenge.id ?? \"\",\n        code: otpCode ?? \"\",\n      },\n    });\n  };\n\n  useDialogClose(isSuccess, () => {\n    securitySettings.update(\"Mfa\", true);\n  });\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Set up an authenticator app\"\n          id=\"Eu+kuO\"\n          description=\"Title for setting up two-factor authentication\"\n        />\n      </Dialog.Title>\n\n      <Form.Root onSubmit={handleSubmit}>\n        <Grid columns=\"auto 1fr\" rows=\"repeat(4, auto)\" gapX=\"3\" gapY=\"1\">\n          <Grid\n            rows=\"subgrid\"\n            gridRow=\"span 4\"\n            style={{ placeItems: \"center\" }}\n          >\n            {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n            <Marker>1</Marker>\n            <Separator\n              orientation=\"vertical\"\n              size=\"4\"\n              style={{ width: \"2px\" }}\n            />\n            {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n            <Marker>2</Marker>\n            <div />\n          </Grid>\n\n          <Grid rows=\"subgrid\" gridRow=\"span 4\">\n            <Text as=\"p\" size=\"3\" weight=\"bold\">\n              <Translation\n                defaultMessage=\"Scan the QR code\"\n                id=\"fTSp5u\"\n                description=\"Heading for the QR code scanning step in MFA setup\"\n              />\n            </Text>\n            <Flex direction=\"column\" gap=\"1\">\n              <Text as=\"p\" size=\"2\">\n                <Translation\n                  defaultMessage=\"Use an authenticator app like {onep}, {google}, {authy}, or {microsoft} to scan the QR code below.\"\n                  id=\"8xwdwI\"\n                  description=\"Instructions for scanning the QR code with authenticator apps\"\n                  values={{\n                    onep: (\n                      <Link\n                        href=\"https://1password.com/\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        1Password\n                      </Link>\n                    ),\n                    google: (\n                      <Link\n                        href=\"https://apps.apple.com/us/app/google-authenticator/id388497605\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        Google Authenticator\n                      </Link>\n                    ),\n                    authy: (\n                      <Link\n                        href=\"https://authy.com/\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        Authy\n                      </Link>\n                    ),\n                    microsoft: (\n                      <Link\n                        href=\"https://www.microsoft.com/en-gb/security/mobile-authenticator-app\"\n                        rel=\"noopener noreferrer\"\n                        target=\"_blank\"\n                        // eslint-disable-next-line formatjs/no-literal-string-in-jsx\n                      >\n                        Microsoft Authenticator\n                      </Link>\n                    ),\n                  }}\n                />\n              </Text>\n              <Flex align=\"center\" gap=\"5\" my=\"5\">\n                <Grid\n                  position=\"relative\"\n                  width=\"160px\"\n                  height=\"160px\"\n                  p=\"2\"\n                  style={{\n                    border: \"1px solid var(--gray-7)\",\n                    borderRadius: \"var(--radius-4)\",\n                    background: \"var(--gray-2)\",\n                    overflow: \"hidden\",\n                  }}\n                >\n                  {totp?.qr_code && (\n                    <Box asChild width=\"100%\" height=\"auto\">\n                      <img\n                        alt={translate({\n                          defaultMessage: \"Scan this QR code to enroll\",\n                          description: \"Alt text for QR code image\",\n                          id: \"wpbqFJ\",\n                        })}\n                        aria-describedby=\"secret-note\"\n                        height=\"160\"\n                        src={totp.qr_code}\n                        style={{ userSelect: \"none\", background: \"white\" }}\n                        width=\"160\"\n                      />\n                    </Box>\n                  )}\n                </Grid>\n\n                <Flex direction=\"column\" gap=\"1\" align=\"start\">\n                  <Text color=\"gray\" id=\"secret-note\" size=\"2\">\n                    <Translation\n                      defaultMessage=\"Can't scan the code?\"\n                      id=\"6/cdcS\"\n                      description=\"Question asking if user is unable to scan the QR code\"\n                    />\n                  </Text>\n\n                  <SecretDialog setupKey={totp?.secret ?? \"\"}>\n                    <Button\n                      variant=\"secondary\"\n                      size=\"1\"\n                      disabled={verifyTotp.isPending || isSuccess}\n                    >\n                      <Translation\n                        defaultMessage=\"View setup key\"\n                        id=\"q3eZjH\"\n                        description=\"Button text to view the manual setup key\"\n                      />\n                    </Button>\n                  </SecretDialog>\n                </Flex>\n              </Flex>\n            </Flex>\n            <Text as=\"p\" size=\"3\" weight=\"bold\">\n              <Translation\n                defaultMessage=\"Get verification passcode\"\n                id=\"1kRd2b\"\n                description=\"Heading for entering the verification code step\"\n              />\n            </Text>\n            <Flex direction=\"column\" gap=\"4\">\n              <Text as=\"p\" size=\"2\">\n                <Translation\n                  defaultMessage=\"Enter the 6-digit passcode from your authenticator app.\"\n                  id=\"4/66bS\"\n                  description=\"Instructions for entering the verification passcode\"\n                />\n              </Text>\n\n              <Flex direction=\"column\" gap=\"2\">\n                <Otp.Root\n                  autoSubmit\n                  gap=\"3\"\n                  justify=\"start\"\n                  name=\"otp-code\"\n                  rows=\"48px\"\n                  columns=\"repeat(6, 48px)\"\n                  readOnly={verifyTotp.isPending || isSuccess}\n                >\n                  <Otp.Input required autoFocus autoComplete=\"off\" />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                  <Otp.Input required />\n                </Otp.Root>\n\n                {serverError && (\n                  <Text size=\"2\" color=\"red\">\n                    {getMutationErrorMessage(serverError)}\n                  </Text>\n                )}\n              </Flex>\n            </Flex>\n          </Grid>\n        </Grid>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              disabled={verifyTotp.isPending || isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"84pAvU\"\n                description=\"Button text to cancel MFA setup\"\n              />\n            </Button>\n          </Dialog.Close>\n\n          <SaveButton\n            type=\"submit\"\n            loading={verifyTotp.isPending}\n            done={isSuccess}\n            onDone={onClose}\n          >\n            <Translation\n              defaultMessage=\"Confirm\"\n              id=\"WHthZi\"\n              description=\"Button text to confirm MFA setup\"\n            />\n          </SaveButton>\n        </Flex>\n      </Form.Root>\n\n      {/* mirror errors in a live region */}\n      <VisuallyHidden asChild>\n        <section aria-live=\"polite\">\n          {getMutationErrorMessage(serverError)}\n        </section>\n      </VisuallyHidden>\n    </>\n  );\n}\n\ninterface SecretDialogProps extends React.PropsWithChildren {\n  setupKey: string;\n}\n\nfunction SecretDialog({ children, setupKey }: SecretDialogProps) {\n  return (\n    <Dialog.Root>\n      <Dialog.Trigger>{children}</Dialog.Trigger>\n      <Dialog.Content\n        maxWidth=\"90vw\"\n        size={{ initial: \"3\", sm: \"4\" }}\n        minWidth=\"300px\"\n        width=\"fit-content\"\n      >\n        <Dialog.Title size=\"2\" weight=\"regular\">\n          <Translation\n            defaultMessage=\"Your setup key\"\n            id=\"LleqNP\"\n            description=\"Title for dialog showing the manual setup key\"\n          />\n        </Dialog.Title>\n        <Dialog.Description>\n          <Text size=\"6\">\n            <Code variant=\"ghost\" style={{ letterSpacing: \"0.15rem\" }}>\n              {setupKey}\n            </Code>\n          </Text>\n        </Dialog.Description>\n\n        <Flex align=\"center\" gap=\"3\" justify=\"end\" mt=\"5\">\n          <Dialog.Close>\n            <CopyButton value={setupKey}>\n              <Translation\n                defaultMessage=\"Copy and close\"\n                id=\"EyjGir\"\n                description=\"Button text to copy setup key and close dialog\"\n              />\n            </CopyButton>\n          </Dialog.Close>\n        </Flex>\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  let message = \"Something went wrong, please try again\";\n\n  if (typeof error === \"string\") {\n    message = error;\n  }\n\n  if (error instanceof Error) {\n    message = error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    message = error.message;\n  }\n\n  if (message === \"Invalid passcode\") {\n    message = \"Invalid passcode, please try again\";\n  }\n\n  return message;\n}\n\nfunction hasQrCode(\n  response?: CreateTotpFactorResponse,\n): response is CreateTotpFactorResponse & {\n  authenticationFactor: {\n    totp: NonNullable<CreateTotpFactorResponseAuthenticationFactorAllOfTotpAnyOf>;\n  };\n} {\n  const totp = response?.authenticationFactor.totp;\n  return totp != null && \"qr_code\" in totp;\n}\n"],"mappings":"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","names":[]}

package/dist/cjs/lib/admin-portal-domain-verification.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/admin-portal-domain-verification.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Box, Card, Flex, Text } from \"@radix-ui/themes\";\nimport { Skeleton, Button } from \"./elements.js\";\nimport { IconPanel } from \"./icon-panel.js\";\nimport { GenericError } from \"./generic-error.js\";\nimport { ExternalLinkIcon } from \"@radix-ui/react-icons\";\nimport * as CardList from \"./card-list.js\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { DomainItem } from \"./domain-item.js\";\nimport { getDomProps } from \"./utils.js\";\nimport type { WidgetRootDomProps, WidgetRootState } from \"./utils.js\";\nimport { Translation } from \"./i18n/translation.js\";\n\ninterface AdminPortalDomainVerificationProps extends WidgetRootDomProps {\n  organizationDomains: OrganizationDomain[];\n  onAddDomain: () => void;\n  onDeleteDomain: (domainId: string) => void;\n  onReverifyDomain: (domainId: string) => void;\n  isPending?: boolean;\n}\n\nconst AdminPortalDomainVerification = ({\n  organizationDomains,\n  onAddDomain,\n  onDeleteDomain,\n  onReverifyDomain,\n  isPending = false,\n  ...domProps\n}: AdminPortalDomainVerificationProps) => {\n  if (organizationDomains.length === 0) {\n    return (\n      <Card size=\"2\" {...getWidgetRootDomProps(\"resolved\", domProps)}>\n        <Flex direction=\"row\" justify=\"between\" align=\"center\">\n          <Text size=\"2\" color=\"gray\">\n            <Translation\n              defaultMessage=\"You haven't added any verified domains yet.\"\n              id=\"t/D0Sf\"\n              description=\"Empty state message when no domains have been added\"\n            />\n          </Text>\n          <Button\n            variant=\"secondary\"\n            loading={isPending}\n            disabled={isPending}\n            onClick={onAddDomain}\n          >\n            <Translation\n              defaultMessage=\"Add domain\"\n              id=\"APksY2\"\n              description=\"Button text to add a new domain\"\n            />\n            <ExternalLinkIcon aria-hidden />\n          </Button>\n        </Flex>\n      </Card>\n    );\n  }\n\n  return (\n    <Flex\n      direction=\"column\"\n      gap=\"4\"\n      {...getWidgetRootDomProps(\"resolved\", domProps)}\n    >\n      <CardList.Root>\n        {organizationDomains.map((domain) => (\n          <CardList.Item key={domain.id}>\n            <DomainItem\n              domain={domain}\n              onDeleteDomain={onDeleteDomain}\n              onReverifyDomain={onReverifyDomain}\n            />\n          </CardList.Item>\n        ))}\n      </CardList.Root>\n\n      <Box>\n        <Button\n          variant=\"secondary\"\n          loading={isPending}\n          disabled={isPending}\n          onClick={onAddDomain}\n        >\n          <Translation\n            defaultMessage=\"Add domain\"\n            id=\"APksY2\"\n            description=\"Button text to add a new domain\"\n          />\n          <ExternalLinkIcon aria-hidden />\n        </Button>\n      </Box>\n    </Flex>\n  );\n};\n\ninterface AdminPortalDomainVerificationLoadingProps\n  extends WidgetRootDomProps {}\n\nconst AdminPortalDomainVerificationLoading: React.FC<\n  AdminPortalDomainVerificationLoadingProps\n> = (domProps) => {\n  return (\n    <Card size=\"2\" {...getWidgetRootDomProps(\"loading\", domProps)}>\n      <Flex gap=\"4\" align=\"center\">\n        <Skeleton>\n          <IconPanel />\n        </Skeleton>\n\n        <Flex direction=\"column\">\n          <Text size=\"2\" highContrast weight=\"bold\" as=\"p\" mb=\"-2px\">\n            <Skeleton>\n              <Translation\n                defaultMessage=\"Domain name\"\n                id=\"O2vxRJ\"\n                description=\"Placeholder text for domain name loading state\"\n              />\n            </Skeleton>\n          </Text>\n\n          <Text size=\"2\" color=\"gray\" as=\"p\">\n            <Skeleton>\n              <Translation\n                defaultMessage=\"Added recently\"\n                id=\"w3A6MN\"\n                description=\"Placeholder text for domain added date loading state\"\n              />\n            </Skeleton>\n          </Text>\n        </Flex>\n      </Flex>\n    </Card>\n  );\n};\n\ninterface AdminPortalDomainVerificationErrorProps extends WidgetRootDomProps {\n  error: unknown;\n}\n\nconst AdminPortalDomainVerificationError: React.FC<\n  AdminPortalDomainVerificationErrorProps\n> = ({ error, ...domProps }) => {\n  return (\n    <Card size=\"2\" {...getWidgetRootDomProps(\"error\", domProps)}>\n      <GenericError error={error} />\n    </Card>\n  );\n};\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"admin-portal-domain-verification\",\n    widgetState: state,\n  });\n}\n\nexport type {\n  AdminPortalDomainVerificationProps,\n  AdminPortalDomainVerificationLoadingProps,\n  AdminPortalDomainVerificationErrorProps,\n};\nexport {\n  AdminPortalDomainVerification,\n  AdminPortalDomainVerificationLoading,\n  AdminPortalDomainVerificationError,\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/admin-portal-domain-verification.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Box, Card, Flex, Text } from \"@radix-ui/themes\";\nimport { Skeleton, Button } from \"./elements.js\";\nimport { IconPanel } from \"./icon-panel.js\";\nimport { GenericError } from \"./generic-error.js\";\nimport { ExternalLinkIcon } from \"@radix-ui/react-icons\";\nimport * as CardList from \"./card-list.js\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { DomainItem } from \"./domain-item.js\";\nimport { getDomProps } from \"./utils.js\";\nimport type { WidgetRootDomProps, WidgetRootState } from \"./utils.js\";\nimport { Translation } from \"./i18n/translation.js\";\n\ninterface AdminPortalDomainVerificationProps extends WidgetRootDomProps {\n  organizationDomains: OrganizationDomain[];\n  onAddDomain: () => void;\n  onDeleteDomain: (domainId: string) => void;\n  onReverifyDomain: (domainId: string) => void;\n  isPending?: boolean;\n}\n\nconst AdminPortalDomainVerification = ({\n  organizationDomains,\n  onAddDomain,\n  onDeleteDomain,\n  onReverifyDomain,\n  isPending = false,\n  ...domProps\n}: AdminPortalDomainVerificationProps) => {\n  if (organizationDomains.length === 0) {\n    return (\n      <Card size=\"2\" {...getWidgetRootDomProps(\"resolved\", domProps)}>\n        <Flex direction=\"row\" justify=\"between\" align=\"center\">\n          <Text size=\"2\" color=\"gray\">\n            <Translation\n              defaultMessage=\"You haven't added any verified domains yet.\"\n              id=\"t/D0Sf\"\n              description=\"Empty state message when no domains have been added\"\n            />\n          </Text>\n          <Button\n            variant=\"secondary\"\n            loading={isPending}\n            disabled={isPending}\n            onClick={onAddDomain}\n          >\n            <Translation\n              defaultMessage=\"Add domain\"\n              id=\"APksY2\"\n              description=\"Button text to add a new domain\"\n            />\n            <ExternalLinkIcon aria-hidden />\n          </Button>\n        </Flex>\n      </Card>\n    );\n  }\n\n  return (\n    <Flex\n      direction=\"column\"\n      gap=\"4\"\n      {...getWidgetRootDomProps(\"resolved\", domProps)}\n    >\n      <CardList.Root>\n        {organizationDomains.map((domain) => (\n          <CardList.Item key={domain.id}>\n            <DomainItem\n              domain={domain}\n              onDeleteDomain={onDeleteDomain}\n              onReverifyDomain={onReverifyDomain}\n            />\n          </CardList.Item>\n        ))}\n      </CardList.Root>\n\n      <Box>\n        <Button\n          variant=\"secondary\"\n          loading={isPending}\n          disabled={isPending}\n          onClick={onAddDomain}\n        >\n          <Translation\n            defaultMessage=\"Add domain\"\n            id=\"APksY2\"\n            description=\"Button text to add a new domain\"\n          />\n          <ExternalLinkIcon aria-hidden />\n        </Button>\n      </Box>\n    </Flex>\n  );\n};\n\ninterface AdminPortalDomainVerificationLoadingProps extends WidgetRootDomProps {}\n\nconst AdminPortalDomainVerificationLoading: React.FC<\n  AdminPortalDomainVerificationLoadingProps\n> = (domProps) => {\n  return (\n    <Card size=\"2\" {...getWidgetRootDomProps(\"loading\", domProps)}>\n      <Flex gap=\"4\" align=\"center\">\n        <Skeleton>\n          <IconPanel />\n        </Skeleton>\n\n        <Flex direction=\"column\">\n          <Text size=\"2\" highContrast weight=\"bold\" as=\"p\" mb=\"-2px\">\n            <Skeleton>\n              <Translation\n                defaultMessage=\"Domain name\"\n                id=\"O2vxRJ\"\n                description=\"Placeholder text for domain name loading state\"\n              />\n            </Skeleton>\n          </Text>\n\n          <Text size=\"2\" color=\"gray\" as=\"p\">\n            <Skeleton>\n              <Translation\n                defaultMessage=\"Added recently\"\n                id=\"w3A6MN\"\n                description=\"Placeholder text for domain added date loading state\"\n              />\n            </Skeleton>\n          </Text>\n        </Flex>\n      </Flex>\n    </Card>\n  );\n};\n\ninterface AdminPortalDomainVerificationErrorProps extends WidgetRootDomProps {\n  error: unknown;\n}\n\nconst AdminPortalDomainVerificationError: React.FC<\n  AdminPortalDomainVerificationErrorProps\n> = ({ error, ...domProps }) => {\n  return (\n    <Card size=\"2\" {...getWidgetRootDomProps(\"error\", domProps)}>\n      <GenericError error={error} />\n    </Card>\n  );\n};\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"admin-portal-domain-verification\",\n    widgetState: state,\n  });\n}\n\nexport type {\n  AdminPortalDomainVerificationProps,\n  AdminPortalDomainVerificationLoadingProps,\n  AdminPortalDomainVerificationErrorProps,\n};\nexport {\n  AdminPortalDomainVerification,\n  AdminPortalDomainVerificationLoading,\n  AdminPortalDomainVerificationError,\n};\n"],"mappings":"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","names":[]}

package/dist/cjs/lib/api/user.d.cts

@@ -1,5 +1,5 @@
 import * as _tanstack_react_query from '@tanstack/react-query';
-import { Members200, Members403, Members404, useUpdateMember, useInviteMember, RemoveMember200, RemoveMember400, RemoveMember403, RemoveMember404, RevokeInvite200, RevokeInvite400, RevokeInvite403, RevokeInvite404, ResendInvite201, ResendInvite400, ResendInvite403, ResendInvite404 } from '../../api/endpoint.cjs';
+import { Members200, Members403, Members404, useUpdateMember, useInviteMember, RemoveMember200, RemoveMember400, RemoveMember403, RemoveMember404, RevokeInvite200, RevokeInvite400, RevokeInvite403, RevokeInvite404, ResendInvite201, ResendInvite400, ResendInvite403, ResendInvite404, ResendInvite422 } from '../../api/endpoint.cjs';
 import { UsersManagementContextType } from '../users-management-context.cjs';
 import '../../api/widgets-api-client.cjs';
 import 'react';
@@ -19,7 +19,7 @@ declare const useDeleteUser: () => _tanstack_react_query.UseMutationResult<Remov
 declare const useRevokeUserInvite: () => _tanstack_react_query.UseMutationResult<RevokeInvite200, RevokeInvite400 | RevokeInvite403 | RevokeInvite404, {
     userId: string;
 }, unknown>;
-declare const useResendUserInvite: () => _tanstack_react_query.UseMutationResult<ResendInvite201, ResendInvite400 | ResendInvite403 | ResendInvite404, {
+declare const useResendUserInvite: () => _tanstack_react_query.UseMutationResult<ResendInvite201, ResendInvite400 | ResendInvite403 | ResendInvite404 | ResendInvite422, {
     userId: string;
 }, unknown>;
 

package/dist/cjs/lib/api-keys/api-keys-search.cjs

@@ -33,7 +33,7 @@ __export(api_keys_search_exports, {
 });
 module.exports = __toCommonJS(api_keys_search_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react_compose_refs = require("@radix-ui/react-compose-refs");
+var import_internal = require("radix-ui/internal");
 var import_react_icons = require("@radix-ui/react-icons");
 var import_clsx = __toESM(require("clsx"), 1);
 var React = __toESM(require("react"), 1);
@@ -57,7 +57,7 @@ const ApiKeysSearch = React.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     import_elements.TextField,
     {
-      ref: (0, import_react_compose_refs.useComposedRefs)(inputRef, ref),
+      ref: (0, import_internal.useComposedRefs)(inputRef, ref),
       className: (0, import_clsx.default)((0, import_utils.namespaceClassNames)("api-keys-search"), className),
       autoComplete: "off",
       placeholder: translate({

package/dist/cjs/lib/api-keys/api-keys-search.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/lib/api-keys/api-keys-search.tsx"],"sourcesContent":["\"use client\";\n\nimport { useComposedRefs } from \"@radix-ui/react-compose-refs\";\nimport { Cross2Icon, MagnifyingGlassIcon } from \"@radix-ui/react-icons\";\nimport cx from \"clsx\";\nimport * as React from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\nimport { IconButton, TextField, TextFieldSlot } from \"../elements.js\";\nimport { useApiKeysSearchContext } from \"./api-keys-search-provider.js\";\nimport { useApiKeysContext } from \"./api-keys-context.js\";\nimport { namespaceClassNames } from \"../utils.js\";\nimport { useTranslation } from \"../i18n/use-translation.js\";\n\ntype ApiKeysSearchProps = React.ComponentPropsWithoutRef<typeof TextField>;\n\nexport const ApiKeysSearch = React.forwardRef<\n  HTMLInputElement,\n  ApiKeysSearchProps\n>(({ className, ...props }, ref) => {\n  const { inputRef, clearSearch, searchValue, setSearchValue } =\n    useApiKeysSearchContext();\n  const { dispatch } = useApiKeysContext();\n  const translate = useTranslation();\n\n  const filter = useDebouncedCallback((value) => {\n    dispatch({ type: \"FILTER_BY_SEARCH\", searchQuery: value });\n  }, 200);\n\n  const resetSearch = () => {\n    clearSearch();\n    filter.cancel();\n  };\n\n  return (\n    <TextField\n      ref={useComposedRefs(inputRef, ref)}\n      className={cx(namespaceClassNames(\"api-keys-search\"), className)}\n      autoComplete=\"off\"\n      placeholder={translate({\n        defaultMessage: \"Search by name\",\n        id: \"GC8aGI\",\n        description: \"Placeholder for API key search input\",\n      })}\n      value={searchValue}\n      onChange={(event) => {\n        const value = event.target.value;\n        setSearchValue(value);\n        filter(value);\n      }}\n      onKeyDown={(event) => {\n        if (event.key === \"Escape\") {\n          event.preventDefault();\n          resetSearch();\n        }\n      }}\n      {...props}\n    >\n      <TextFieldSlot side=\"left\">\n        <MagnifyingGlassIcon aria-hidden=\"true\" height=\"16\" width=\"16\" />\n      </TextFieldSlot>\n\n      <TextFieldSlot side=\"right\">\n        {!!searchValue && (\n          <IconButton\n            size=\"1\"\n            onClick={resetSearch}\n            title={translate({\n              defaultMessage: \"Clear search\",\n              id: \"7enwzK\",\n              description: \"Title tooltip for clear search button\",\n            })}\n          >\n            <Cross2Icon aria-hidden=\"true\" />\n          </IconButton>\n        )}\n      </TextFieldSlot>\n    </TextField>\n  );\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkCI;AAhCJ,gCAAgC;AAChC,yBAAgD;AAChD,kBAAe;AACf,YAAuB;AACvB,0BAAqC;AACrC,sBAAqD;AACrD,sCAAwC;AACxC,8BAAkC;AAClC,mBAAoC;AACpC,6BAA+B;AAIxB,MAAM,gBAAgB,MAAM,WAGjC,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAAQ;AAClC,QAAM,EAAE,UAAU,aAAa,aAAa,eAAe,QACzD,yDAAwB;AAC1B,QAAM,EAAE,SAAS,QAAI,2CAAkB;AACvC,QAAM,gBAAY,uCAAe;AAEjC,QAAM,aAAS,0CAAqB,CAAC,UAAU;AAC7C,aAAS,EAAE,MAAM,oBAAoB,aAAa,MAAM,CAAC;AAAA,EAC3D,GAAG,GAAG;AAEN,QAAM,cAAc,MAAM;AACxB,gBAAY;AACZ,WAAO,OAAO;AAAA,EAChB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAK,2CAAgB,UAAU,GAAG;AAAA,MAClC,eAAW,YAAAA,aAAG,kCAAoB,iBAAiB,GAAG,SAAS;AAAA,MAC/D,cAAa;AAAA,MACb,aAAa,UAAU;AAAA,QACrB,gBAAgB;AAAA,QAChB,IAAI;AAAA,QACJ,aAAa;AAAA,MACf,CAAC;AAAA,MACD,OAAO;AAAA,MACP,UAAU,CAAC,UAAU;AACnB,cAAM,QAAQ,MAAM,OAAO;AAC3B,uBAAe,KAAK;AACpB,eAAO,KAAK;AAAA,MACd;AAAA,MACA,WAAW,CAAC,UAAU;AACpB,YAAI,MAAM,QAAQ,UAAU;AAC1B,gBAAM,eAAe;AACrB,sBAAY;AAAA,QACd;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,oDAAC,iCAAc,MAAK,QAClB,sDAAC,0CAAoB,eAAY,QAAO,QAAO,MAAK,OAAM,MAAK,GACjE;AAAA,QAEA,4CAAC,iCAAc,MAAK,SACjB,WAAC,CAAC,eACD;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS;AAAA,YACT,OAAO,UAAU;AAAA,cACf,gBAAgB;AAAA,cAChB,IAAI;AAAA,cACJ,aAAa;AAAA,YACf,CAAC;AAAA,YAED,sDAAC,iCAAW,eAAY,QAAO;AAAA;AAAA,QACjC,GAEJ;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["cx"]}
+{"version":3,"sources":["../../../../src/lib/api-keys/api-keys-search.tsx"],"sourcesContent":["\"use client\";\n\nimport { useComposedRefs } from \"radix-ui/internal\";\nimport { Cross2Icon, MagnifyingGlassIcon } from \"@radix-ui/react-icons\";\nimport cx from \"clsx\";\nimport * as React from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\nimport { IconButton, TextField, TextFieldSlot } from \"../elements.js\";\nimport { useApiKeysSearchContext } from \"./api-keys-search-provider.js\";\nimport { useApiKeysContext } from \"./api-keys-context.js\";\nimport { namespaceClassNames } from \"../utils.js\";\nimport { useTranslation } from \"../i18n/use-translation.js\";\n\ntype ApiKeysSearchProps = React.ComponentPropsWithoutRef<typeof TextField>;\n\nexport const ApiKeysSearch = React.forwardRef<\n  HTMLInputElement,\n  ApiKeysSearchProps\n>(({ className, ...props }, ref) => {\n  const { inputRef, clearSearch, searchValue, setSearchValue } =\n    useApiKeysSearchContext();\n  const { dispatch } = useApiKeysContext();\n  const translate = useTranslation();\n\n  const filter = useDebouncedCallback((value) => {\n    dispatch({ type: \"FILTER_BY_SEARCH\", searchQuery: value });\n  }, 200);\n\n  const resetSearch = () => {\n    clearSearch();\n    filter.cancel();\n  };\n\n  return (\n    <TextField\n      ref={useComposedRefs(inputRef, ref)}\n      className={cx(namespaceClassNames(\"api-keys-search\"), className)}\n      autoComplete=\"off\"\n      placeholder={translate({\n        defaultMessage: \"Search by name\",\n        id: \"GC8aGI\",\n        description: \"Placeholder for API key search input\",\n      })}\n      value={searchValue}\n      onChange={(event) => {\n        const value = event.target.value;\n        setSearchValue(value);\n        filter(value);\n      }}\n      onKeyDown={(event) => {\n        if (event.key === \"Escape\") {\n          event.preventDefault();\n          resetSearch();\n        }\n      }}\n      {...props}\n    >\n      <TextFieldSlot side=\"left\">\n        <MagnifyingGlassIcon aria-hidden=\"true\" height=\"16\" width=\"16\" />\n      </TextFieldSlot>\n\n      <TextFieldSlot side=\"right\">\n        {!!searchValue && (\n          <IconButton\n            size=\"1\"\n            onClick={resetSearch}\n            title={translate({\n              defaultMessage: \"Clear search\",\n              id: \"7enwzK\",\n              description: \"Title tooltip for clear search button\",\n            })}\n          >\n            <Cross2Icon aria-hidden=\"true\" />\n          </IconButton>\n        )}\n      </TextFieldSlot>\n    </TextField>\n  );\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkCI;AAhCJ,sBAAgC;AAChC,yBAAgD;AAChD,kBAAe;AACf,YAAuB;AACvB,0BAAqC;AACrC,sBAAqD;AACrD,sCAAwC;AACxC,8BAAkC;AAClC,mBAAoC;AACpC,6BAA+B;AAIxB,MAAM,gBAAgB,MAAM,WAGjC,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAAQ;AAClC,QAAM,EAAE,UAAU,aAAa,aAAa,eAAe,QACzD,yDAAwB;AAC1B,QAAM,EAAE,SAAS,QAAI,2CAAkB;AACvC,QAAM,gBAAY,uCAAe;AAEjC,QAAM,aAAS,0CAAqB,CAAC,UAAU;AAC7C,aAAS,EAAE,MAAM,oBAAoB,aAAa,MAAM,CAAC;AAAA,EAC3D,GAAG,GAAG;AAEN,QAAM,cAAc,MAAM;AACxB,gBAAY;AACZ,WAAO,OAAO;AAAA,EAChB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAK,iCAAgB,UAAU,GAAG;AAAA,MAClC,eAAW,YAAAA,aAAG,kCAAoB,iBAAiB,GAAG,SAAS;AAAA,MAC/D,cAAa;AAAA,MACb,aAAa,UAAU;AAAA,QACrB,gBAAgB;AAAA,QAChB,IAAI;AAAA,QACJ,aAAa;AAAA,MACf,CAAC;AAAA,MACD,OAAO;AAAA,MACP,UAAU,CAAC,UAAU;AACnB,cAAM,QAAQ,MAAM,OAAO;AAC3B,uBAAe,KAAK;AACpB,eAAO,KAAK;AAAA,MACd;AAAA,MACA,WAAW,CAAC,UAAU;AACpB,YAAI,MAAM,QAAQ,UAAU;AAC1B,gBAAM,eAAe;AACrB,sBAAY;AAAA,QACd;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,oDAAC,iCAAc,MAAK,QAClB,sDAAC,0CAAoB,eAAY,QAAO,QAAO,MAAK,OAAM,MAAK,GACjE;AAAA,QAEA,4CAAC,iCAAc,MAAK,SACjB,WAAC,CAAC,eACD;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS;AAAA,YACT,OAAO,UAAU;AAAA,cACf,gBAAgB;AAAA,cAChB,IAAI;AAAA,cACJ,aAAa;AAAA,YACf,CAAC;AAAA,YAED,sDAAC,iCAAW,eAAY,QAAO;AAAA;AAAA,QACjC,GAEJ;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["cx"]}

package/dist/cjs/lib/api-keys/create-api-key.cjs

@@ -35,7 +35,7 @@ module.exports = __toCommonJS(create_api_key_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_themes = require("@radix-ui/themes");
 var import_elements = require("../elements.js");
-var Form = __toESM(require("@radix-ui/react-form"), 1);
+var import_radix_ui = require("radix-ui");
 var import_react_icons = require("@radix-ui/react-icons");
 var import_copy_button = require("../copy-button.js");
 var React = __toESM(require("react"), 1);
@@ -94,7 +94,7 @@ function CreateApiKeyForm() {
       }
     ) }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-      Form.Root,
+      import_radix_ui.Form.Root,
       {
         onSubmit: (e) => {
           if (isPending) return;
@@ -131,8 +131,8 @@ function CreateApiKeyForm() {
                 }
               ) })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Field, { name: "name", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", align: "stretch", gap: "2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Field, { name: "name", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", align: "stretch", gap: "2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                 import_translation.Translation,
                 {
                   defaultMessage: "Name",
@@ -140,7 +140,7 @@ function CreateApiKeyForm() {
                   description: "Label for API key name input field"
                 }
               ) }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                 import_elements.TextField,
                 {
                   "data-1p-ignore": true,
@@ -152,7 +152,7 @@ function CreateApiKeyForm() {
                   })
                 }
               ) }),
-              errors.name && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Message, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              errors.name && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Message, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                 import_translation.Translation,
                 {
                   defaultMessage: "The name is required",
@@ -285,8 +285,8 @@ function PermissionsField({
       window.removeEventListener("resize", onResize);
     };
   }, [filteredPermissions.length]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Field, { name: "permissions", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", align: "stretch", gap: "1", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Field, { name: "permissions", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", align: "stretch", gap: "1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_translation.Translation,
       {
         defaultMessage: "Permissions",

package/dist/cjs/lib/api-keys/create-api-key.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/lib/api-keys/create-api-key.tsx"],"sourcesContent":["import {\n  Box,\n  Checkbox,\n  Flex,\n  ScrollArea,\n  Text,\n  Callout,\n} from \"@radix-ui/themes\";\nimport {\n  Dialog,\n  Label,\n  Button,\n  TextField,\n  TextFieldSlot,\n} from \"../elements.js\";\nimport * as Form from \"@radix-ui/react-form\";\nimport {\n  ExclamationTriangleIcon,\n  InfoCircledIcon,\n  MagnifyingGlassIcon,\n} from \"@radix-ui/react-icons\";\nimport { CopyButton, CopyIconButton } from \"../copy-button.js\";\nimport * as React from \"react\";\nimport {\n  useListOrganizationApiKeyPermissions,\n  ListOrganizationApiKeyPermission,\n} from \"../../api/endpoint.js\";\nimport { useCreateApiKey } from \"../api/api-key.js\";\nimport { useApiKeysContext } from \"./api-keys-context.js\";\nimport { Translation } from \"../i18n/translation.js\";\nimport { useTranslation } from \"../i18n/use-translation.js\";\n\nexport function CreateApiKeyDialog() {\n  const {\n    state: { createDialogOpen, createdApiKey },\n    dispatch,\n  } = useApiKeysContext();\n\n  return (\n    <Dialog.Root\n      open={createDialogOpen}\n      onOpenChange={(open) => {\n        if (!open) {\n          dispatch({ type: \"CLOSE_CREATE_DIALOG\" });\n        }\n      }}\n    >\n      {createdApiKey ? (\n        <SaveApiKeyContent apiKey={createdApiKey.value} />\n      ) : (\n        <CreateApiKeyForm\n          // always remount the form when the dialog is opened to reset the validation errors\n          key={`${createDialogOpen}`}\n        />\n      )}\n    </Dialog.Root>\n  );\n}\n\nfunction CreateApiKeyForm() {\n  const { dispatch } = useApiKeysContext();\n  const translate = useTranslation();\n  const [errors, setErrors] = React.useState<{\n    name: boolean;\n  }>({ name: false });\n\n  const validate = (formData: FormData) => {\n    const name = formData.get(\"name\")?.toString() ?? \"\";\n    const errors = { name: !name.trim().length };\n    setErrors(errors);\n    const isValid = Object.values(errors).every((error) => error === false);\n    return isValid;\n  };\n\n  const {\n    mutate: createOrganizationApiKey,\n    error,\n    isPending,\n    isSuccess,\n  } = useCreateApiKey();\n  const permissions = useListOrganizationApiKeyPermissions({ limit: 100 });\n\n  return (\n    <Dialog.Content maxWidth=\"529px\">\n      <Dialog.Title size=\"4\" weight={\"bold\"}>\n        <Translation\n          defaultMessage=\"Create API key\"\n          id=\"eUFRNS\"\n          description=\"Dialog title for creating a new API key\"\n        />\n      </Dialog.Title>\n      <Form.Root\n        onSubmit={(e) => {\n          if (isPending) return;\n          e.preventDefault();\n          const data = new FormData(e.currentTarget);\n          const isValid = validate(data);\n          if (!isValid) {\n            return;\n          }\n\n          createOrganizationApiKey(\n            {\n              data: {\n                name: data.get(\"name\")?.toString() ?? \"\",\n                permissions: data.getAll(\"permission\").map(String) || [],\n              },\n            },\n            {\n              onSuccess: (data) => {\n                dispatch({ type: \"SET_CREATED_API_KEY\", apiKey: data });\n              },\n            },\n          );\n        }}\n      >\n        <Flex direction=\"column\" align=\"stretch\" gap=\"4\">\n          {error && (\n            <Callout.Root color=\"red\" role=\"alert\">\n              <Callout.Icon>\n                <ExclamationTriangleIcon />\n              </Callout.Icon>\n              <Callout.Text>\n                <Translation\n                  defaultMessage=\"An error occurred while creating the API key.\"\n                  id=\"0LyBVd\"\n                  description=\"Error message when API key creation fails\"\n                />\n              </Callout.Text>\n            </Callout.Root>\n          )}\n          <Form.Field name=\"name\" asChild>\n            <Flex direction=\"column\" align=\"stretch\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Name\"\n                    id=\"v0VmRy\"\n                    description=\"Label for API key name input field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <TextField\n                  data-1p-ignore\n                  autoComplete=\"off\"\n                  placeholder={translate({\n                    defaultMessage: \"A descriptive name for the API key\",\n                    id: \"moyvr4\",\n                    description: \"Placeholder for API key name input\",\n                  })}\n                />\n              </Form.Control>\n              {errors.name && (\n                <Form.Message asChild>\n                  <Text size=\"2\" color=\"red\">\n                    <Translation\n                      defaultMessage=\"The name is required\"\n                      id=\"oF9d2V\"\n                      description=\"Validation error when API key name is empty\"\n                    />\n                  </Text>\n                </Form.Message>\n              )}\n            </Flex>\n          </Form.Field>\n          {permissions.isSuccess && permissions.data.data.length > 0 && (\n            <PermissionsField permissions={permissions.data.data} />\n          )}\n        </Flex>\n\n        <Flex align=\"center\" gap=\"3\" justify=\"end\" mt=\"5\">\n          <Dialog.Close>\n            <Button variant=\"secondary\" disabled={isPending || isSuccess}>\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"AyVAAW\"\n                description=\"Button to cancel API key creation\"\n              />\n            </Button>\n          </Dialog.Close>\n          <Button type=\"submit\" loading={isPending || isSuccess}>\n            <Translation\n              defaultMessage=\"Create API key\"\n              id=\"d4BNWL\"\n              description=\"Button to submit and create the API key\"\n            />\n          </Button>\n        </Flex>\n      </Form.Root>\n    </Dialog.Content>\n  );\n}\n\nfunction SaveApiKeyContent({ apiKey }: { apiKey: string }) {\n  return (\n    <Dialog.Content maxWidth=\"529px\">\n      <Dialog.Title size=\"4\" weight={\"bold\"}>\n        <Translation\n          defaultMessage=\"Save your key\"\n          id=\"wFFCij\"\n          description=\"Dialog title prompting user to save their API key\"\n        />\n      </Dialog.Title>\n      <Dialog.Description size=\"2\">\n        <Translation\n          defaultMessage=\"Please save this API key in a secure location. If you lose it, you'll need to generate a new one.\"\n          id=\"sy+2x7\"\n          description=\"Warning message about saving the API key\"\n        />\n      </Dialog.Description>\n      <Callout.Root mt=\"5\" mb=\"4\">\n        <Callout.Icon>\n          <InfoCircledIcon />\n        </Callout.Icon>\n        <Callout.Text>\n          <Translation\n            defaultMessage=\"You won't be able to access the key again. Please copy it now.\"\n            id=\"EFAK/K\"\n            description=\"Callout warning that the key won't be accessible again\"\n          />\n        </Callout.Text>\n      </Callout.Root>\n      <TextField value={apiKey} readOnly>\n        <TextFieldSlot side=\"right\">\n          <CopyIconButton value={apiKey} />\n        </TextFieldSlot>\n      </TextField>\n      <Flex align=\"center\" gap=\"3\" justify=\"end\" mt=\"5\">\n        <Dialog.Close>\n          <CopyButton value={apiKey}>\n            <Translation\n              defaultMessage=\"Copy and close\"\n              id=\"ViYtvQ\"\n              description=\"Button to copy API key and close dialog\"\n            />\n          </CopyButton>\n        </Dialog.Close>\n      </Flex>\n    </Dialog.Content>\n  );\n}\n\nfunction Permission({\n  checked,\n  permission,\n  onChange,\n}: {\n  checked: boolean;\n  permission: ListOrganizationApiKeyPermission;\n  onChange: (isChecked: boolean) => void;\n}) {\n  return (\n    <label\n      htmlFor={permission.slug}\n      style={{\n        display: \"flex\",\n        alignItems: \"center\",\n        padding: \"var(--space-2) var(--space-4)\",\n        gap: \"var(--space-3)\",\n        borderBottom: \"1px solid var(--gray-6)\",\n        cursor: \"pointer\",\n      }}\n    >\n      <Checkbox\n        checked={checked}\n        id={permission.slug}\n        name=\"permission\"\n        value={permission.slug}\n        onCheckedChange={(e) => onChange(e === \"indeterminate\" ? false : e)}\n      />\n      <Flex direction=\"column\">\n        <Text size=\"2\" weight=\"bold\">\n          {permission.name}\n        </Text>\n        <Text size=\"2\" color=\"gray\">\n          {permission.description}\n        </Text>\n      </Flex>\n    </label>\n  );\n}\n\nfunction PermissionsField({\n  permissions = [],\n}: {\n  permissions: ListOrganizationApiKeyPermission[];\n}) {\n  const [selectedPermissions, setSelectedPermissions] = React.useState<\n    ListOrganizationApiKeyPermission[]\n  >([]);\n  const [filter, setFilter] = React.useState(\"\");\n  const fieldRef = React.useRef<HTMLDivElement | null>(null);\n  const translate = useTranslation();\n  const filteredPermissions = React.useMemo(() => {\n    return permissions.filter((p) => {\n      return (\n        !filter.trim().length ||\n        p.description?.toLowerCase().match(filter.toLowerCase()) ||\n        p.name.toLowerCase().match(filter.toLowerCase()) ||\n        p.slug.toLowerCase().match(filter.toLowerCase())\n      );\n    });\n  }, [permissions, filter]);\n\n  React.useEffect(() => {\n    const onResize = () => {\n      if (fieldRef.current && filteredPermissions.length !== 0) {\n        fieldRef.current.style.minHeight = \"unset\";\n      }\n    };\n    window.addEventListener(\"resize\", onResize);\n    return () => {\n      window.removeEventListener(\"resize\", onResize);\n    };\n  }, [filteredPermissions.length]);\n\n  return (\n    <Form.Field name=\"permissions\" asChild>\n      <Flex direction=\"column\" align=\"stretch\" gap=\"1\">\n        <Form.Label asChild>\n          <Label>\n            <Translation\n              defaultMessage=\"Permissions\"\n              id=\"6YN1wO\"\n              description=\"Label for API key permissions field\"\n            />\n          </Label>\n        </Form.Label>\n        <Text size=\"2\" mb=\"2\" color=\"gray\">\n          <Translation\n            defaultMessage=\"Only enable the minimum permissions required for your use case.\"\n            id=\"q2VEtG\"\n            description=\"Help text for API key permissions selection\"\n          />\n        </Text>\n        <Flex\n          ref={fieldRef}\n          style={{\n            borderRadius: \"var(--radius-3)\",\n            borderColor: \"var(--gray-6)\",\n            borderWidth: \"1px\",\n            borderStyle: \"solid\",\n          }}\n          direction=\"column\"\n          align=\"stretch\"\n        >\n          <TextField\n            name=\"search\"\n            value={filter}\n            size=\"2\"\n            onChange={(e) => {\n              if (fieldRef.current) {\n                fieldRef.current.style.minHeight =\n                  fieldRef.current.clientHeight + 2 + \"px\";\n              }\n              setFilter(e.target.value);\n            }}\n            style={{\n              height: \"40px\",\n              borderRadius: \"var(--radius-3) var(--radius-3) 0 0\",\n              boxShadow: \"none\",\n            }}\n            placeholder={translate({\n              defaultMessage: \"Search\",\n              id: \"iyNcly\",\n              description: \"Placeholder for permissions search input\",\n            })}\n          >\n            <TextFieldSlot side=\"left\" px=\"3\">\n              <MagnifyingGlassIcon aria-hidden=\"true\" height=\"16\" width=\"16\" />\n            </TextFieldSlot>\n          </TextField>\n          {filteredPermissions.length > 0 ? (\n            <>\n              <ScrollArea\n                scrollbars=\"vertical\"\n                style={{\n                  flex: 1,\n                  maxHeight: \"calc(50vh - 150px)\",\n                  border: \"1px solid var(--gray-6)\",\n                  borderWidth: \"1px 0 0\",\n                }}\n              >\n                {filteredPermissions.map((permission) => (\n                  <Permission\n                    checked={selectedPermissions.some(\n                      (sp) => sp.slug === permission.slug,\n                    )}\n                    key={permission.slug}\n                    permission={permission}\n                    onChange={(isChecked) =>\n                      setSelectedPermissions((prev) =>\n                        isChecked\n                          ? [...prev, permission]\n                          : prev.filter((sp) => sp.slug !== permission.slug),\n                      )\n                    }\n                  />\n                ))}\n              </ScrollArea>\n              <Box\n                px=\"4\"\n                py=\"3\"\n                mt={\"-1px\"}\n                flexGrow=\"0\"\n                style={{\n                  borderTop: \"0 solid var(--gray-6)\",\n                  borderWidth: \"1px 0 0\",\n                }}\n              >\n                <SelectedPermissions\n                  total={permissions.length}\n                  selected={selectedPermissions.length}\n                  onToggle={() =>\n                    setSelectedPermissions((prev) =>\n                      prev.length === permissions.length ? [] : permissions,\n                    )\n                  }\n                />\n              </Box>\n            </>\n          ) : (\n            <Flex\n              gap=\"4\"\n              pt=\"6\"\n              pb=\"6\"\n              style={{ borderTop: \"1px solid var(--gray-6)\" }}\n              flexGrow=\"1\"\n              justify=\"center\"\n              align=\"center\"\n              direction=\"column\"\n            >\n              <MagnifyingGlassIcon\n                style={{\n                  color: \"var(--gray-9)\",\n                  width: \"var(--space-5)\",\n                  height: \"var(--space-5)\",\n                }}\n              />\n              <Text size=\"2\" align=\"center\" mb=\"2\" wrap=\"balance\" weight=\"bold\">\n                <Translation\n                  defaultMessage=\"No permissions match your search\"\n                  id=\"xjqT9f\"\n                  description=\"Empty state message when no permissions match search\"\n                />\n              </Text>\n              <Button\n                variant=\"secondary\"\n                size=\"1\"\n                onClick={() => setFilter(\"\")}\n              >\n                <Translation\n                  defaultMessage=\"Clear search\"\n                  id=\"YrMs63\"\n                  description=\"Button to clear permissions search\"\n                />\n              </Button>\n            </Flex>\n          )}\n        </Flex>\n      </Flex>\n    </Form.Field>\n  );\n}\n\nfunction SelectedPermissions({\n  total,\n  selected,\n  onToggle,\n}: {\n  total: number;\n  selected: number;\n  onToggle: () => void;\n}) {\n  return (\n    <Flex align=\"center\" gap=\"2\">\n      <Text size=\"1\" style={{ lineHeight: 1, color: \"var(--gray-11)\" }}>\n        {selected === 0 ? (\n          <Translation\n            defaultMessage=\"No permissions selected\"\n            id=\"FqU9hv\"\n            description=\"Message when no permissions are selected\"\n          />\n        ) : selected === 1 ? (\n          <Translation\n            defaultMessage=\"1 permission selected\"\n            id=\"VouLgT\"\n            description=\"Message showing count of selected permissions\"\n          />\n        ) : (\n          <Translation\n            defaultMessage=\"{count} permissions selected\"\n            id=\"ZL90DI\"\n            description=\"Message showing count of selected permissions\"\n            values={{ count: selected }}\n          />\n        )}\n      </Text>\n      <Text\n        size=\"1\"\n        onClick={onToggle}\n        style={{ cursor: \"pointer\", color: \"var(--accent-10)\" }}\n      >\n        {total === selected ? (\n          <Translation\n            defaultMessage=\"Deselect all\"\n            id=\"63f7SY\"\n            description=\"Button to deselect all permissions\"\n          />\n        ) : (\n          <Translation\n            defaultMessage=\"Select all\"\n            id=\"onTqlA\"\n            description=\"Button to select all permissions\"\n          />\n        )}\n      </Text>\n    </Flex>\n  );\n}\n\nexport function CreateApiKeyButton() {\n  const { dispatch } = useApiKeysContext();\n  return (\n    <Button\n      variant=\"secondary\"\n      onClick={() => dispatch({ type: \"OPEN_CREATE_DIALOG\" })}\n    >\n      <Translation\n        defaultMessage=\"Create API key\"\n        id=\"vq5724\"\n        description=\"Button to open create API key dialog\"\n      />\n    </Button>\n  );\n}\n"],"mappings":"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","names":["errors","error","data"]}
+{"version":3,"sources":["../../../../src/lib/api-keys/create-api-key.tsx"],"sourcesContent":["import {\n  Box,\n  Checkbox,\n  Flex,\n  ScrollArea,\n  Text,\n  Callout,\n} from \"@radix-ui/themes\";\nimport {\n  Dialog,\n  Label,\n  Button,\n  TextField,\n  TextFieldSlot,\n} from \"../elements.js\";\nimport { Form } from \"radix-ui\";\nimport {\n  ExclamationTriangleIcon,\n  InfoCircledIcon,\n  MagnifyingGlassIcon,\n} from \"@radix-ui/react-icons\";\nimport { CopyButton, CopyIconButton } from \"../copy-button.js\";\nimport * as React from \"react\";\nimport {\n  useListOrganizationApiKeyPermissions,\n  ListOrganizationApiKeyPermission,\n} from \"../../api/endpoint.js\";\nimport { useCreateApiKey } from \"../api/api-key.js\";\nimport { useApiKeysContext } from \"./api-keys-context.js\";\nimport { Translation } from \"../i18n/translation.js\";\nimport { useTranslation } from \"../i18n/use-translation.js\";\n\nexport function CreateApiKeyDialog() {\n  const {\n    state: { createDialogOpen, createdApiKey },\n    dispatch,\n  } = useApiKeysContext();\n\n  return (\n    <Dialog.Root\n      open={createDialogOpen}\n      onOpenChange={(open) => {\n        if (!open) {\n          dispatch({ type: \"CLOSE_CREATE_DIALOG\" });\n        }\n      }}\n    >\n      {createdApiKey ? (\n        <SaveApiKeyContent apiKey={createdApiKey.value} />\n      ) : (\n        <CreateApiKeyForm\n          // always remount the form when the dialog is opened to reset the validation errors\n          key={`${createDialogOpen}`}\n        />\n      )}\n    </Dialog.Root>\n  );\n}\n\nfunction CreateApiKeyForm() {\n  const { dispatch } = useApiKeysContext();\n  const translate = useTranslation();\n  const [errors, setErrors] = React.useState<{\n    name: boolean;\n  }>({ name: false });\n\n  const validate = (formData: FormData) => {\n    const name = formData.get(\"name\")?.toString() ?? \"\";\n    const errors = { name: !name.trim().length };\n    setErrors(errors);\n    const isValid = Object.values(errors).every((error) => error === false);\n    return isValid;\n  };\n\n  const {\n    mutate: createOrganizationApiKey,\n    error,\n    isPending,\n    isSuccess,\n  } = useCreateApiKey();\n  const permissions = useListOrganizationApiKeyPermissions({ limit: 100 });\n\n  return (\n    <Dialog.Content maxWidth=\"529px\">\n      <Dialog.Title size=\"4\" weight={\"bold\"}>\n        <Translation\n          defaultMessage=\"Create API key\"\n          id=\"eUFRNS\"\n          description=\"Dialog title for creating a new API key\"\n        />\n      </Dialog.Title>\n      <Form.Root\n        onSubmit={(e) => {\n          if (isPending) return;\n          e.preventDefault();\n          const data = new FormData(e.currentTarget);\n          const isValid = validate(data);\n          if (!isValid) {\n            return;\n          }\n\n          createOrganizationApiKey(\n            {\n              data: {\n                name: data.get(\"name\")?.toString() ?? \"\",\n                permissions: data.getAll(\"permission\").map(String) || [],\n              },\n            },\n            {\n              onSuccess: (data) => {\n                dispatch({ type: \"SET_CREATED_API_KEY\", apiKey: data });\n              },\n            },\n          );\n        }}\n      >\n        <Flex direction=\"column\" align=\"stretch\" gap=\"4\">\n          {error && (\n            <Callout.Root color=\"red\" role=\"alert\">\n              <Callout.Icon>\n                <ExclamationTriangleIcon />\n              </Callout.Icon>\n              <Callout.Text>\n                <Translation\n                  defaultMessage=\"An error occurred while creating the API key.\"\n                  id=\"0LyBVd\"\n                  description=\"Error message when API key creation fails\"\n                />\n              </Callout.Text>\n            </Callout.Root>\n          )}\n          <Form.Field name=\"name\" asChild>\n            <Flex direction=\"column\" align=\"stretch\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Name\"\n                    id=\"v0VmRy\"\n                    description=\"Label for API key name input field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <TextField\n                  data-1p-ignore\n                  autoComplete=\"off\"\n                  placeholder={translate({\n                    defaultMessage: \"A descriptive name for the API key\",\n                    id: \"moyvr4\",\n                    description: \"Placeholder for API key name input\",\n                  })}\n                />\n              </Form.Control>\n              {errors.name && (\n                <Form.Message asChild>\n                  <Text size=\"2\" color=\"red\">\n                    <Translation\n                      defaultMessage=\"The name is required\"\n                      id=\"oF9d2V\"\n                      description=\"Validation error when API key name is empty\"\n                    />\n                  </Text>\n                </Form.Message>\n              )}\n            </Flex>\n          </Form.Field>\n          {permissions.isSuccess && permissions.data.data.length > 0 && (\n            <PermissionsField permissions={permissions.data.data} />\n          )}\n        </Flex>\n\n        <Flex align=\"center\" gap=\"3\" justify=\"end\" mt=\"5\">\n          <Dialog.Close>\n            <Button variant=\"secondary\" disabled={isPending || isSuccess}>\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"AyVAAW\"\n                description=\"Button to cancel API key creation\"\n              />\n            </Button>\n          </Dialog.Close>\n          <Button type=\"submit\" loading={isPending || isSuccess}>\n            <Translation\n              defaultMessage=\"Create API key\"\n              id=\"d4BNWL\"\n              description=\"Button to submit and create the API key\"\n            />\n          </Button>\n        </Flex>\n      </Form.Root>\n    </Dialog.Content>\n  );\n}\n\nfunction SaveApiKeyContent({ apiKey }: { apiKey: string }) {\n  return (\n    <Dialog.Content maxWidth=\"529px\">\n      <Dialog.Title size=\"4\" weight={\"bold\"}>\n        <Translation\n          defaultMessage=\"Save your key\"\n          id=\"wFFCij\"\n          description=\"Dialog title prompting user to save their API key\"\n        />\n      </Dialog.Title>\n      <Dialog.Description size=\"2\">\n        <Translation\n          defaultMessage=\"Please save this API key in a secure location. If you lose it, you'll need to generate a new one.\"\n          id=\"sy+2x7\"\n          description=\"Warning message about saving the API key\"\n        />\n      </Dialog.Description>\n      <Callout.Root mt=\"5\" mb=\"4\">\n        <Callout.Icon>\n          <InfoCircledIcon />\n        </Callout.Icon>\n        <Callout.Text>\n          <Translation\n            defaultMessage=\"You won't be able to access the key again. Please copy it now.\"\n            id=\"EFAK/K\"\n            description=\"Callout warning that the key won't be accessible again\"\n          />\n        </Callout.Text>\n      </Callout.Root>\n      <TextField value={apiKey} readOnly>\n        <TextFieldSlot side=\"right\">\n          <CopyIconButton value={apiKey} />\n        </TextFieldSlot>\n      </TextField>\n      <Flex align=\"center\" gap=\"3\" justify=\"end\" mt=\"5\">\n        <Dialog.Close>\n          <CopyButton value={apiKey}>\n            <Translation\n              defaultMessage=\"Copy and close\"\n              id=\"ViYtvQ\"\n              description=\"Button to copy API key and close dialog\"\n            />\n          </CopyButton>\n        </Dialog.Close>\n      </Flex>\n    </Dialog.Content>\n  );\n}\n\nfunction Permission({\n  checked,\n  permission,\n  onChange,\n}: {\n  checked: boolean;\n  permission: ListOrganizationApiKeyPermission;\n  onChange: (isChecked: boolean) => void;\n}) {\n  return (\n    <label\n      htmlFor={permission.slug}\n      style={{\n        display: \"flex\",\n        alignItems: \"center\",\n        padding: \"var(--space-2) var(--space-4)\",\n        gap: \"var(--space-3)\",\n        borderBottom: \"1px solid var(--gray-6)\",\n        cursor: \"pointer\",\n      }}\n    >\n      <Checkbox\n        checked={checked}\n        id={permission.slug}\n        name=\"permission\"\n        value={permission.slug}\n        onCheckedChange={(e) => onChange(e === \"indeterminate\" ? false : e)}\n      />\n      <Flex direction=\"column\">\n        <Text size=\"2\" weight=\"bold\">\n          {permission.name}\n        </Text>\n        <Text size=\"2\" color=\"gray\">\n          {permission.description}\n        </Text>\n      </Flex>\n    </label>\n  );\n}\n\nfunction PermissionsField({\n  permissions = [],\n}: {\n  permissions: ListOrganizationApiKeyPermission[];\n}) {\n  const [selectedPermissions, setSelectedPermissions] = React.useState<\n    ListOrganizationApiKeyPermission[]\n  >([]);\n  const [filter, setFilter] = React.useState(\"\");\n  const fieldRef = React.useRef<HTMLDivElement | null>(null);\n  const translate = useTranslation();\n  const filteredPermissions = React.useMemo(() => {\n    return permissions.filter((p) => {\n      return (\n        !filter.trim().length ||\n        p.description?.toLowerCase().match(filter.toLowerCase()) ||\n        p.name.toLowerCase().match(filter.toLowerCase()) ||\n        p.slug.toLowerCase().match(filter.toLowerCase())\n      );\n    });\n  }, [permissions, filter]);\n\n  React.useEffect(() => {\n    const onResize = () => {\n      if (fieldRef.current && filteredPermissions.length !== 0) {\n        fieldRef.current.style.minHeight = \"unset\";\n      }\n    };\n    window.addEventListener(\"resize\", onResize);\n    return () => {\n      window.removeEventListener(\"resize\", onResize);\n    };\n  }, [filteredPermissions.length]);\n\n  return (\n    <Form.Field name=\"permissions\" asChild>\n      <Flex direction=\"column\" align=\"stretch\" gap=\"1\">\n        <Form.Label asChild>\n          <Label>\n            <Translation\n              defaultMessage=\"Permissions\"\n              id=\"6YN1wO\"\n              description=\"Label for API key permissions field\"\n            />\n          </Label>\n        </Form.Label>\n        <Text size=\"2\" mb=\"2\" color=\"gray\">\n          <Translation\n            defaultMessage=\"Only enable the minimum permissions required for your use case.\"\n            id=\"q2VEtG\"\n            description=\"Help text for API key permissions selection\"\n          />\n        </Text>\n        <Flex\n          ref={fieldRef}\n          style={{\n            borderRadius: \"var(--radius-3)\",\n            borderColor: \"var(--gray-6)\",\n            borderWidth: \"1px\",\n            borderStyle: \"solid\",\n          }}\n          direction=\"column\"\n          align=\"stretch\"\n        >\n          <TextField\n            name=\"search\"\n            value={filter}\n            size=\"2\"\n            onChange={(e) => {\n              if (fieldRef.current) {\n                fieldRef.current.style.minHeight =\n                  fieldRef.current.clientHeight + 2 + \"px\";\n              }\n              setFilter(e.target.value);\n            }}\n            style={{\n              height: \"40px\",\n              borderRadius: \"var(--radius-3) var(--radius-3) 0 0\",\n              boxShadow: \"none\",\n            }}\n            placeholder={translate({\n              defaultMessage: \"Search\",\n              id: \"iyNcly\",\n              description: \"Placeholder for permissions search input\",\n            })}\n          >\n            <TextFieldSlot side=\"left\" px=\"3\">\n              <MagnifyingGlassIcon aria-hidden=\"true\" height=\"16\" width=\"16\" />\n            </TextFieldSlot>\n          </TextField>\n          {filteredPermissions.length > 0 ? (\n            <>\n              <ScrollArea\n                scrollbars=\"vertical\"\n                style={{\n                  flex: 1,\n                  maxHeight: \"calc(50vh - 150px)\",\n                  border: \"1px solid var(--gray-6)\",\n                  borderWidth: \"1px 0 0\",\n                }}\n              >\n                {filteredPermissions.map((permission) => (\n                  <Permission\n                    checked={selectedPermissions.some(\n                      (sp) => sp.slug === permission.slug,\n                    )}\n                    key={permission.slug}\n                    permission={permission}\n                    onChange={(isChecked) =>\n                      setSelectedPermissions((prev) =>\n                        isChecked\n                          ? [...prev, permission]\n                          : prev.filter((sp) => sp.slug !== permission.slug),\n                      )\n                    }\n                  />\n                ))}\n              </ScrollArea>\n              <Box\n                px=\"4\"\n                py=\"3\"\n                mt={\"-1px\"}\n                flexGrow=\"0\"\n                style={{\n                  borderTop: \"0 solid var(--gray-6)\",\n                  borderWidth: \"1px 0 0\",\n                }}\n              >\n                <SelectedPermissions\n                  total={permissions.length}\n                  selected={selectedPermissions.length}\n                  onToggle={() =>\n                    setSelectedPermissions((prev) =>\n                      prev.length === permissions.length ? [] : permissions,\n                    )\n                  }\n                />\n              </Box>\n            </>\n          ) : (\n            <Flex\n              gap=\"4\"\n              pt=\"6\"\n              pb=\"6\"\n              style={{ borderTop: \"1px solid var(--gray-6)\" }}\n              flexGrow=\"1\"\n              justify=\"center\"\n              align=\"center\"\n              direction=\"column\"\n            >\n              <MagnifyingGlassIcon\n                style={{\n                  color: \"var(--gray-9)\",\n                  width: \"var(--space-5)\",\n                  height: \"var(--space-5)\",\n                }}\n              />\n              <Text size=\"2\" align=\"center\" mb=\"2\" wrap=\"balance\" weight=\"bold\">\n                <Translation\n                  defaultMessage=\"No permissions match your search\"\n                  id=\"xjqT9f\"\n                  description=\"Empty state message when no permissions match search\"\n                />\n              </Text>\n              <Button\n                variant=\"secondary\"\n                size=\"1\"\n                onClick={() => setFilter(\"\")}\n              >\n                <Translation\n                  defaultMessage=\"Clear search\"\n                  id=\"YrMs63\"\n                  description=\"Button to clear permissions search\"\n                />\n              </Button>\n            </Flex>\n          )}\n        </Flex>\n      </Flex>\n    </Form.Field>\n  );\n}\n\nfunction SelectedPermissions({\n  total,\n  selected,\n  onToggle,\n}: {\n  total: number;\n  selected: number;\n  onToggle: () => void;\n}) {\n  return (\n    <Flex align=\"center\" gap=\"2\">\n      <Text size=\"1\" style={{ lineHeight: 1, color: \"var(--gray-11)\" }}>\n        {selected === 0 ? (\n          <Translation\n            defaultMessage=\"No permissions selected\"\n            id=\"FqU9hv\"\n            description=\"Message when no permissions are selected\"\n          />\n        ) : selected === 1 ? (\n          <Translation\n            defaultMessage=\"1 permission selected\"\n            id=\"VouLgT\"\n            description=\"Message showing count of selected permissions\"\n          />\n        ) : (\n          <Translation\n            defaultMessage=\"{count} permissions selected\"\n            id=\"ZL90DI\"\n            description=\"Message showing count of selected permissions\"\n            values={{ count: selected }}\n          />\n        )}\n      </Text>\n      <Text\n        size=\"1\"\n        onClick={onToggle}\n        style={{ cursor: \"pointer\", color: \"var(--accent-10)\" }}\n      >\n        {total === selected ? (\n          <Translation\n            defaultMessage=\"Deselect all\"\n            id=\"63f7SY\"\n            description=\"Button to deselect all permissions\"\n          />\n        ) : (\n          <Translation\n            defaultMessage=\"Select all\"\n            id=\"onTqlA\"\n            description=\"Button to select all permissions\"\n          />\n        )}\n      </Text>\n    </Flex>\n  );\n}\n\nexport function CreateApiKeyButton() {\n  const { dispatch } = useApiKeysContext();\n  return (\n    <Button\n      variant=\"secondary\"\n      onClick={() => dispatch({ type: \"OPEN_CREATE_DIALOG\" })}\n    >\n      <Translation\n        defaultMessage=\"Create API key\"\n        id=\"vq5724\"\n        description=\"Button to open create API key dialog\"\n      />\n    </Button>\n  );\n}\n"],"mappings":"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","names":["errors","error","data"]}

package/dist/cjs/lib/change-password-dialog.cjs

@@ -34,7 +34,7 @@ __export(change_password_dialog_exports, {
 module.exports = __toCommonJS(change_password_dialog_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_themes = require("@radix-ui/themes");
-var Form = __toESM(require("@radix-ui/react-form"), 1);
+var import_radix_ui = require("radix-ui");
 var React = __toESM(require("react"), 1);
 var import_elements = require("./elements.js");
 var import_endpoint = require("../api/endpoint.js");
@@ -112,7 +112,7 @@ function Content({ onClose }) {
     ) }) }),
     errorMessage && errorMessage !== "Invalid credentials" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Callout.Root, { color: "red", my: "-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Callout.Text, { children: errorMessage }) }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-      Form.Root,
+      import_radix_ui.Form.Root,
       {
         onSubmit: handleSubmit,
         onChange: (event) => {
@@ -131,13 +131,13 @@ function Content({ onClose }) {
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { mt: "5", direction: "column", gap: "4", children: [
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              Form.Field,
+              import_radix_ui.Form.Field,
               {
                 name: "oldPassword",
                 asChild: true,
                 serverInvalid: !serverErrors.currentPassword,
                 children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", gap: "2", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_translation.Translation,
                     {
                       defaultMessage: "Enter your current password",
@@ -145,7 +145,7 @@ function Content({ onClose }) {
                       description: "Label for current password field"
                     }
                   ) }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_elements.PasswordField,
                     {
                       autoFocus: true,
@@ -159,7 +159,7 @@ function Content({ onClose }) {
                       })
                     }
                   ) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Message, { match: "valueMissing", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Message, { match: "valueMissing", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_translation.Translation,
                     {
                       defaultMessage: "Please enter your current password",
@@ -167,18 +167,18 @@ function Content({ onClose }) {
                       description: "Error message when current password is missing"
                     }
                   ) }) }),
-                  serverErrors.currentPassword && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Message, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: serverErrors.currentPassword }) })
+                  serverErrors.currentPassword && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Message, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: serverErrors.currentPassword }) })
                 ] })
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              Form.Field,
+              import_radix_ui.Form.Field,
               {
                 name: "password",
                 asChild: true,
                 serverInvalid: !serverErrors.password,
                 children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", gap: "2", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_translation.Translation,
                     {
                       defaultMessage: "Enter your new password",
@@ -186,7 +186,7 @@ function Content({ onClose }) {
                       description: "Label for new password field"
                     }
                   ) }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_elements.PasswordField,
                     {
                       autoComplete: "new-password",
@@ -199,7 +199,7 @@ function Content({ onClose }) {
                       disabled: changePassword.isPending || changePassword.isSuccess
                     }
                   ) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Message, { match: "valueMissing", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Message, { match: "valueMissing", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_translation.Translation,
                     {
                       defaultMessage: "Please enter your new password",
@@ -207,7 +207,7 @@ function Content({ onClose }) {
                       description: "Error message when new password is missing"
                     }
                   ) }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Message, { match: (value) => value.length < 8, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Message, { match: (value) => value.length < 8, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_translation.Translation,
                     {
                       defaultMessage: "Password must be at least 8 characters",
@@ -216,7 +216,7 @@ function Content({ onClose }) {
                     }
                   ) }) }),
                   /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                    Form.Message,
+                    import_radix_ui.Form.Message,
                     {
                       match: (value, formData) => value === formData.get("oldPassword"),
                       asChild: true,
@@ -234,13 +234,13 @@ function Content({ onClose }) {
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-              Form.Field,
+              import_radix_ui.Form.Field,
               {
                 name: "confirmPassword",
                 asChild: true,
                 serverInvalid: !serverErrors.confirmPassword,
                 children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", gap: "2", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Label, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Label, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_translation.Translation,
                     {
                       defaultMessage: "Confirm your new password",
@@ -248,7 +248,7 @@ function Content({ onClose }) {
                       description: "Label for password confirmation field"
                     }
                   ) }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_elements.PasswordField,
                     {
                       autoComplete: "new-password",
@@ -261,7 +261,7 @@ function Content({ onClose }) {
                       disabled: changePassword.isPending || changePassword.isSuccess
                     }
                   ) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Message, { match: "valueMissing", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Message, { match: "valueMissing", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "red", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                     import_translation.Translation,
                     {
                       defaultMessage: "Please confirm your new password",
@@ -270,7 +270,7 @@ function Content({ onClose }) {
                     }
                   ) }) }),
                   /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                    Form.Message,
+                    import_radix_ui.Form.Message,
                     {
                       match: (value, formData) => value !== formData.get("password"),
                       asChild: true,