@workos-inc/widgets 1.8.0 → 1.8.2

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/change-password-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport * as Form from \"@radix-ui/react-form\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport { Button, Dialog, Label, PasswordField } from \"./elements.js\";\nimport { useUpdatePassword } from \"../api/endpoint.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface ChangePasswordDialogProps extends Dialog.RootProps {\n  children?: ReactNode;\n}\n\nexport function ChangePasswordDialog({\n  children,\n  ...props\n}: ChangePasswordDialogProps) {\n  const [open, setOpen] = React.useState(false);\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>{children}</Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <Content onClose={handleClose} />\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps {\n  onClose: () => void;\n}\n\nfunction Content({ onClose }: ContentProps) {\n  const translate = useTranslation();\n  const changePassword = useUpdatePassword({\n    mutation: {\n      onError: (error) => {\n        const errorMsg = getMutationErrorMessage(error);\n        if (errorMsg === \"Invalid credentials\") {\n          setServerErrors({\n            currentPassword:\n              \"Your current password is incorrect. Please, try again.\",\n          });\n        }\n      },\n    },\n  });\n  const [disableSubmit, setDisableSubmit] = React.useState(true);\n  const [serverErrors, setServerErrors] = React.useState<{\n    currentPassword?: string;\n    password?: string;\n    confirmPassword?: string;\n  }>({});\n\n  const errorMessage = React.useMemo(() => {\n    if (changePassword.error) {\n      return getMutationErrorMessage(changePassword.error);\n    }\n\n    return null;\n  }, [changePassword.error]);\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const currentPassword = formData.get(\"oldPassword\")?.toString() ?? \"\";\n    const newPassword = formData.get(\"password\")?.toString() ?? \"\";\n\n    changePassword.mutate({\n      data: { currentPassword, newPassword },\n    });\n  };\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Change Password\"\n          id=\"kAYx7z\"\n          description=\"Dialog title for changing password\"\n        />\n      </Dialog.Title>\n      <VisuallyHidden>\n        <Dialog.Description>\n          <Translation\n            defaultMessage=\"Change your account password\"\n            id=\"R5rXuR\"\n            description=\"Dialog description for changing password\"\n          />\n        </Dialog.Description>\n      </VisuallyHidden>\n\n      {errorMessage && errorMessage !== \"Invalid credentials\" ? (\n        <Callout.Root color=\"red\" my=\"-2\">\n          <Callout.Text>{errorMessage}</Callout.Text>\n        </Callout.Root>\n      ) : null}\n\n      <Form.Root\n        onSubmit={handleSubmit}\n        onChange={(event) => {\n          const formData = new FormData(event.currentTarget);\n          const currentPassword = formData.get(\"oldPassword\")?.toString() ?? \"\";\n          const newPassword = formData.get(\"password\")?.toString() ?? \"\";\n          const confirmPassword =\n            formData.get(\"confirmPassword\")?.toString() ?? \"\";\n\n          setDisableSubmit(\n            currentPassword === \"\" ||\n              newPassword === \"\" ||\n              confirmPassword === \"\",\n          );\n          setServerErrors({});\n        }}\n        onClearServerErrors={() => {\n          setServerErrors({});\n        }}\n      >\n        <Flex mt=\"5\" direction=\"column\" gap=\"4\">\n          <Form.Field\n            name=\"oldPassword\"\n            asChild\n            serverInvalid={!serverErrors.currentPassword}\n          >\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Enter your current password\"\n                    id=\"uqn8py\"\n                    description=\"Label for current password field\"\n                  />\n                </Label>\n              </Form.Label>\n\n              <Form.Control asChild>\n                <PasswordField\n                  autoFocus\n                  required\n                  disabled={\n                    changePassword.isPending || changePassword.isSuccess\n                  }\n                  autoComplete=\"current-password\"\n                  placeholder={translate({\n                    defaultMessage: \"Current password\",\n                    id: \"P2oB4G\",\n                    description: \"Placeholder for current password field\",\n                  })}\n                />\n              </Form.Control>\n\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please enter your current password\"\n                    id=\"QKO3st\"\n                    description=\"Error message when current password is missing\"\n                  />\n                </Text>\n              </Form.Message>\n\n              {serverErrors.currentPassword && (\n                <Form.Message asChild>\n                  <Text size=\"2\" color=\"red\">\n                    {serverErrors.currentPassword}\n                  </Text>\n                </Form.Message>\n              )}\n            </Flex>\n          </Form.Field>\n\n          <Form.Field\n            name=\"password\"\n            asChild\n            serverInvalid={!serverErrors.password}\n          >\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Enter your new password\"\n                    id=\"b/+TBS\"\n                    description=\"Label for new password field\"\n                  />\n                </Label>\n              </Form.Label>\n\n              <Form.Control asChild>\n                <PasswordField\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"New password\",\n                    id: \"8d23GS\",\n                    description: \"Placeholder for new password field\",\n                  })}\n                  required\n                  disabled={\n                    changePassword.isPending || changePassword.isSuccess\n                  }\n                />\n              </Form.Control>\n\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please enter your new password\"\n                    id=\"L4yLAf\"\n                    description=\"Error message when new password is missing\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message match={(value) => value.length < 8} asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Password must be at least 8 characters\"\n                    id=\"WRjyrh\"\n                    description=\"Error message when password is too short\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message\n                match={(value, formData) =>\n                  value === formData.get(\"oldPassword\")\n                }\n                asChild\n              >\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"You cannot reuse your current password\"\n                    id=\"mEkhOO\"\n                    description=\"Error message when user tries to reuse current password\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n\n          <Form.Field\n            name=\"confirmPassword\"\n            asChild\n            serverInvalid={!serverErrors.confirmPassword}\n          >\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Confirm your new password\"\n                    id=\"K83lBn\"\n                    description=\"Label for password confirmation field\"\n                  />\n                </Label>\n              </Form.Label>\n\n              <Form.Control asChild>\n                <PasswordField\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"Confirm new password\",\n                    id: \"cubpBN\",\n                    description: \"Placeholder for password confirmation field\",\n                  })}\n                  required\n                  disabled={\n                    changePassword.isPending || changePassword.isSuccess\n                  }\n                />\n              </Form.Control>\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please confirm your new password\"\n                    id=\"fXZhqG\"\n                    description=\"Error message when password confirmation is missing\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message\n                match={(value, formData) => value !== formData.get(\"password\")}\n                asChild\n              >\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"The new passwords you entered don't match.\"\n                    id=\"Zdq2Hr\"\n                    description=\"Error message when passwords don't match\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n        </Flex>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              type=\"button\"\n              disabled={changePassword.isPending || changePassword.isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"hHNj31\"\n                description=\"Cancel button text\"\n              />\n            </Button>\n          </Dialog.Close>\n\n          <SaveButton\n            type=\"submit\"\n            loading={changePassword.isPending}\n            done={changePassword.isSuccess}\n            onDone={onClose}\n            disabled={disableSubmit || undefined}\n          >\n            <Translation\n              defaultMessage=\"Change password\"\n              id=\"8GDtZu\"\n              description=\"Submit button text to change password\"\n            />\n          </SaveButton>\n        </Flex>\n      </Form.Root>\n\n      {/* mirror errors in a live region */}\n      <VisuallyHidden asChild>\n        <section aria-live=\"polite\">{errorMessage}</section>\n      </VisuallyHidden>\n    </>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (error instanceof Error) {\n    return error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    return error.message;\n  }\n\n  return \"Something went wrong. Please try again.\";\n}\n\n// Note: Error messages in getMutationErrorMessage are kept as plain strings\n// since they come from the API and are displayed dynamically\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/change-password-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport { Form } from \"radix-ui\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport { Button, Dialog, Label, PasswordField } from \"./elements.js\";\nimport { useUpdatePassword } from \"../api/endpoint.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface ChangePasswordDialogProps extends Dialog.RootProps {\n  children?: ReactNode;\n}\n\nexport function ChangePasswordDialog({\n  children,\n  ...props\n}: ChangePasswordDialogProps) {\n  const [open, setOpen] = React.useState(false);\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>{children}</Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <Content onClose={handleClose} />\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps {\n  onClose: () => void;\n}\n\nfunction Content({ onClose }: ContentProps) {\n  const translate = useTranslation();\n  const changePassword = useUpdatePassword({\n    mutation: {\n      onError: (error) => {\n        const errorMsg = getMutationErrorMessage(error);\n        if (errorMsg === \"Invalid credentials\") {\n          setServerErrors({\n            currentPassword:\n              \"Your current password is incorrect. Please, try again.\",\n          });\n        }\n      },\n    },\n  });\n  const [disableSubmit, setDisableSubmit] = React.useState(true);\n  const [serverErrors, setServerErrors] = React.useState<{\n    currentPassword?: string;\n    password?: string;\n    confirmPassword?: string;\n  }>({});\n\n  const errorMessage = React.useMemo(() => {\n    if (changePassword.error) {\n      return getMutationErrorMessage(changePassword.error);\n    }\n\n    return null;\n  }, [changePassword.error]);\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const currentPassword = formData.get(\"oldPassword\")?.toString() ?? \"\";\n    const newPassword = formData.get(\"password\")?.toString() ?? \"\";\n\n    changePassword.mutate({\n      data: { currentPassword, newPassword },\n    });\n  };\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Change Password\"\n          id=\"kAYx7z\"\n          description=\"Dialog title for changing password\"\n        />\n      </Dialog.Title>\n      <VisuallyHidden>\n        <Dialog.Description>\n          <Translation\n            defaultMessage=\"Change your account password\"\n            id=\"R5rXuR\"\n            description=\"Dialog description for changing password\"\n          />\n        </Dialog.Description>\n      </VisuallyHidden>\n\n      {errorMessage && errorMessage !== \"Invalid credentials\" ? (\n        <Callout.Root color=\"red\" my=\"-2\">\n          <Callout.Text>{errorMessage}</Callout.Text>\n        </Callout.Root>\n      ) : null}\n\n      <Form.Root\n        onSubmit={handleSubmit}\n        onChange={(event) => {\n          const formData = new FormData(event.currentTarget);\n          const currentPassword = formData.get(\"oldPassword\")?.toString() ?? \"\";\n          const newPassword = formData.get(\"password\")?.toString() ?? \"\";\n          const confirmPassword =\n            formData.get(\"confirmPassword\")?.toString() ?? \"\";\n\n          setDisableSubmit(\n            currentPassword === \"\" ||\n              newPassword === \"\" ||\n              confirmPassword === \"\",\n          );\n          setServerErrors({});\n        }}\n        onClearServerErrors={() => {\n          setServerErrors({});\n        }}\n      >\n        <Flex mt=\"5\" direction=\"column\" gap=\"4\">\n          <Form.Field\n            name=\"oldPassword\"\n            asChild\n            serverInvalid={!serverErrors.currentPassword}\n          >\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Enter your current password\"\n                    id=\"uqn8py\"\n                    description=\"Label for current password field\"\n                  />\n                </Label>\n              </Form.Label>\n\n              <Form.Control asChild>\n                <PasswordField\n                  autoFocus\n                  required\n                  disabled={\n                    changePassword.isPending || changePassword.isSuccess\n                  }\n                  autoComplete=\"current-password\"\n                  placeholder={translate({\n                    defaultMessage: \"Current password\",\n                    id: \"P2oB4G\",\n                    description: \"Placeholder for current password field\",\n                  })}\n                />\n              </Form.Control>\n\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please enter your current password\"\n                    id=\"QKO3st\"\n                    description=\"Error message when current password is missing\"\n                  />\n                </Text>\n              </Form.Message>\n\n              {serverErrors.currentPassword && (\n                <Form.Message asChild>\n                  <Text size=\"2\" color=\"red\">\n                    {serverErrors.currentPassword}\n                  </Text>\n                </Form.Message>\n              )}\n            </Flex>\n          </Form.Field>\n\n          <Form.Field\n            name=\"password\"\n            asChild\n            serverInvalid={!serverErrors.password}\n          >\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Enter your new password\"\n                    id=\"b/+TBS\"\n                    description=\"Label for new password field\"\n                  />\n                </Label>\n              </Form.Label>\n\n              <Form.Control asChild>\n                <PasswordField\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"New password\",\n                    id: \"8d23GS\",\n                    description: \"Placeholder for new password field\",\n                  })}\n                  required\n                  disabled={\n                    changePassword.isPending || changePassword.isSuccess\n                  }\n                />\n              </Form.Control>\n\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please enter your new password\"\n                    id=\"L4yLAf\"\n                    description=\"Error message when new password is missing\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message match={(value) => value.length < 8} asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Password must be at least 8 characters\"\n                    id=\"WRjyrh\"\n                    description=\"Error message when password is too short\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message\n                match={(value, formData) =>\n                  value === formData.get(\"oldPassword\")\n                }\n                asChild\n              >\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"You cannot reuse your current password\"\n                    id=\"mEkhOO\"\n                    description=\"Error message when user tries to reuse current password\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n\n          <Form.Field\n            name=\"confirmPassword\"\n            asChild\n            serverInvalid={!serverErrors.confirmPassword}\n          >\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Confirm your new password\"\n                    id=\"K83lBn\"\n                    description=\"Label for password confirmation field\"\n                  />\n                </Label>\n              </Form.Label>\n\n              <Form.Control asChild>\n                <PasswordField\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"Confirm new password\",\n                    id: \"cubpBN\",\n                    description: \"Placeholder for password confirmation field\",\n                  })}\n                  required\n                  disabled={\n                    changePassword.isPending || changePassword.isSuccess\n                  }\n                />\n              </Form.Control>\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please confirm your new password\"\n                    id=\"fXZhqG\"\n                    description=\"Error message when password confirmation is missing\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message\n                match={(value, formData) => value !== formData.get(\"password\")}\n                asChild\n              >\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"The new passwords you entered don't match.\"\n                    id=\"Zdq2Hr\"\n                    description=\"Error message when passwords don't match\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n        </Flex>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              type=\"button\"\n              disabled={changePassword.isPending || changePassword.isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"hHNj31\"\n                description=\"Cancel button text\"\n              />\n            </Button>\n          </Dialog.Close>\n\n          <SaveButton\n            type=\"submit\"\n            loading={changePassword.isPending}\n            done={changePassword.isSuccess}\n            onDone={onClose}\n            disabled={disableSubmit || undefined}\n          >\n            <Translation\n              defaultMessage=\"Change password\"\n              id=\"8GDtZu\"\n              description=\"Submit button text to change password\"\n            />\n          </SaveButton>\n        </Flex>\n      </Form.Root>\n\n      {/* mirror errors in a live region */}\n      <VisuallyHidden asChild>\n        <section aria-live=\"polite\">{errorMessage}</section>\n      </VisuallyHidden>\n    </>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (error instanceof Error) {\n    return error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    return error.message;\n  }\n\n  return \"Something went wrong. Please try again.\";\n}\n\n// Note: Error messages in getMutationErrorMessage are kept as plain strings\n// since they come from the API and are displayed dynamically\n"],"mappings":"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","names":[]}

package/dist/cjs/lib/copy-button.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/copy-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { IconButton, Button } from \"./elements.js\";\nimport { CheckIcon, CopyIcon } from \"@radix-ui/react-icons\";\nimport { Slot, Slottable } from \"@radix-ui/themes\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface CopyButtonOwnProps {\n  value: string;\n  withIcon?: boolean;\n}\n\ninterface CopyButtonProps\n  extends CopyButtonOwnProps,\n    Omit<React.ComponentProps<typeof Button>, keyof CopyButtonOwnProps> {}\n\nexport const CopyButton = React.forwardRef<HTMLButtonElement, CopyButtonProps>(\n  function CopyButton(\n    { value, asChild, children, style, withIcon = false, ...props },\n    ref,\n  ) {\n    const Comp = asChild ? Slot : Button;\n    const [hasCopied, copy] = useCopy(value);\n    return (\n      <Comp type=\"button\" onPointerUp={copy} ref={ref} {...props}>\n        {withIcon &&\n          (hasCopied ? <CheckIcon aria-hidden /> : <CopyIcon aria-hidden />)}\n        <Slottable>{children}</Slottable>\n      </Comp>\n    );\n  },\n);\n\ninterface CopyIconButtonOwnProps {\n  value: string;\n}\n\ninterface CopyIconButtonProps\n  extends CopyIconButtonOwnProps,\n    Omit<\n      React.ComponentProps<typeof IconButton>,\n      \"asChild\" | \"children\" | \"title\" | keyof CopyIconButtonOwnProps\n    > {\n  title?: string;\n}\n\nexport const CopyIconButton = React.forwardRef<\n  HTMLButtonElement,\n  CopyIconButtonProps\n>(function CopyIconButton({ value, style, ...props }, ref) {\n  const [hasCopied, copy] = useCopy(value);\n  const translate = useTranslation();\n  const copiedText = translate({\n    defaultMessage: \"Copied\",\n    id: \"xgUx3Z\",\n    description: \"Text shown after content has been copied\",\n  });\n  const copyToClipboardText = translate({\n    defaultMessage: \"Copy to clipboard\",\n    id: \"h9d9dv\",\n    description: \"Button text to copy content to clipboard\",\n  });\n  return (\n    <IconButton\n      type=\"button\"\n      onPointerUp={copy}\n      ref={ref}\n      title={hasCopied ? copiedText : copyToClipboardText}\n      aria-label={copyToClipboardText}\n      {...props}\n    >\n      {hasCopied ? <CheckIcon /> : <CopyIcon />}\n    </IconButton>\n  );\n});\n\nfunction useCopy(value: string) {\n  const [hasCopied, setHasCopied] = React.useState(false);\n  const timeoutRef = React.useRef<number | undefined>(undefined);\n\n  const copy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setHasCopied(true);\n\n      // Clear any existing timeout\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n\n      // Set new timeout\n      timeoutRef.current = window.setTimeout(() => {\n        setHasCopied(false);\n      }, 3000);\n    } catch (err) {\n      console.error(\"Failed to copy text:\", err);\n    }\n  };\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n    };\n  }, []);\n\n  return [hasCopied, copy] as const;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBM;AAvBN,YAAuB;AACvB,sBAAmC;AACnC,yBAAoC;AACpC,oBAAgC;AAChC,6BAA+B;AAWxB,MAAM,aAAa,MAAM;AAAA,EAC9B,SAASA,YACP,EAAE,OAAO,SAAS,UAAU,OAAO,WAAW,OAAO,GAAG,MAAM,GAC9D,KACA;AACA,UAAM,OAAO,UAAU,qBAAO;AAC9B,UAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,WACE,6CAAC,QAAK,MAAK,UAAS,aAAa,MAAM,KAAW,GAAG,OAClD;AAAA,mBACE,YAAY,4CAAC,gCAAU,eAAW,MAAC,IAAK,4CAAC,+BAAS,eAAW,MAAC;AAAA,MACjE,4CAAC,2BAAW,UAAS;AAAA,OACvB;AAAA,EAEJ;AACF;AAeO,MAAM,iBAAiB,MAAM,WAGlC,SAASC,gBAAe,EAAE,OAAO,OAAO,GAAG,MAAM,GAAG,KAAK;AACzD,QAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,QAAM,gBAAY,uCAAe;AACjC,QAAM,aAAa,UAAU;AAAA,IAC3B,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AACD,QAAM,sBAAsB,UAAU;AAAA,IACpC,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAa;AAAA,MACb;AAAA,MACA,OAAO,YAAY,aAAa;AAAA,MAChC,cAAY;AAAA,MACX,GAAG;AAAA,MAEH,sBAAY,4CAAC,gCAAU,IAAK,4CAAC,+BAAS;AAAA;AAAA,EACzC;AAEJ,CAAC;AAED,SAAS,QAAQ,OAAe;AAC9B,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,KAAK;AACtD,QAAM,aAAa,MAAM,OAA2B,MAAS;AAE7D,QAAM,OAAO,YAAY;AACvB,QAAI;AACF,YAAM,UAAU,UAAU,UAAU,KAAK;AACzC,mBAAa,IAAI;AAGjB,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAGA,iBAAW,UAAU,OAAO,WAAW,MAAM;AAC3C,qBAAa,KAAK;AAAA,MACpB,GAAG,GAAI;AAAA,IACT,SAAS,KAAK;AACZ,cAAQ,MAAM,wBAAwB,GAAG;AAAA,IAC3C;AAAA,EACF;AAGA,QAAM,UAAU,MAAM;AACpB,WAAO,MAAM;AACX,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,CAAC,WAAW,IAAI;AACzB;","names":["CopyButton","CopyIconButton"]}
+{"version":3,"sources":["../../../src/lib/copy-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { IconButton, Button } from \"./elements.js\";\nimport { CheckIcon, CopyIcon } from \"@radix-ui/react-icons\";\nimport { Slot, Slottable } from \"@radix-ui/themes\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface CopyButtonOwnProps {\n  value: string;\n  withIcon?: boolean;\n}\n\ninterface CopyButtonProps\n  extends\n    CopyButtonOwnProps,\n    Omit<React.ComponentProps<typeof Button>, keyof CopyButtonOwnProps> {}\n\nexport const CopyButton = React.forwardRef<HTMLButtonElement, CopyButtonProps>(\n  function CopyButton(\n    { value, asChild, children, style, withIcon = false, ...props },\n    ref,\n  ) {\n    const Comp = asChild ? Slot : Button;\n    const [hasCopied, copy] = useCopy(value);\n    return (\n      <Comp type=\"button\" onPointerUp={copy} ref={ref} {...props}>\n        {withIcon &&\n          (hasCopied ? <CheckIcon aria-hidden /> : <CopyIcon aria-hidden />)}\n        <Slottable>{children}</Slottable>\n      </Comp>\n    );\n  },\n);\n\ninterface CopyIconButtonOwnProps {\n  value: string;\n}\n\ninterface CopyIconButtonProps\n  extends\n    CopyIconButtonOwnProps,\n    Omit<\n      React.ComponentProps<typeof IconButton>,\n      \"asChild\" | \"children\" | \"title\" | keyof CopyIconButtonOwnProps\n    > {\n  title?: string;\n}\n\nexport const CopyIconButton = React.forwardRef<\n  HTMLButtonElement,\n  CopyIconButtonProps\n>(function CopyIconButton({ value, style, ...props }, ref) {\n  const [hasCopied, copy] = useCopy(value);\n  const translate = useTranslation();\n  const copiedText = translate({\n    defaultMessage: \"Copied\",\n    id: \"xgUx3Z\",\n    description: \"Text shown after content has been copied\",\n  });\n  const copyToClipboardText = translate({\n    defaultMessage: \"Copy to clipboard\",\n    id: \"h9d9dv\",\n    description: \"Button text to copy content to clipboard\",\n  });\n  return (\n    <IconButton\n      type=\"button\"\n      onPointerUp={copy}\n      ref={ref}\n      title={hasCopied ? copiedText : copyToClipboardText}\n      aria-label={copyToClipboardText}\n      {...props}\n    >\n      {hasCopied ? <CheckIcon /> : <CopyIcon />}\n    </IconButton>\n  );\n});\n\nfunction useCopy(value: string) {\n  const [hasCopied, setHasCopied] = React.useState(false);\n  const timeoutRef = React.useRef<number | undefined>(undefined);\n\n  const copy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setHasCopied(true);\n\n      // Clear any existing timeout\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n\n      // Set new timeout\n      timeoutRef.current = window.setTimeout(() => {\n        setHasCopied(false);\n      }, 3000);\n    } catch (err) {\n      console.error(\"Failed to copy text:\", err);\n    }\n  };\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n    };\n  }, []);\n\n  return [hasCopied, copy] as const;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBM;AAxBN,YAAuB;AACvB,sBAAmC;AACnC,yBAAoC;AACpC,oBAAgC;AAChC,6BAA+B;AAYxB,MAAM,aAAa,MAAM;AAAA,EAC9B,SAASA,YACP,EAAE,OAAO,SAAS,UAAU,OAAO,WAAW,OAAO,GAAG,MAAM,GAC9D,KACA;AACA,UAAM,OAAO,UAAU,qBAAO;AAC9B,UAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,WACE,6CAAC,QAAK,MAAK,UAAS,aAAa,MAAM,KAAW,GAAG,OAClD;AAAA,mBACE,YAAY,4CAAC,gCAAU,eAAW,MAAC,IAAK,4CAAC,+BAAS,eAAW,MAAC;AAAA,MACjE,4CAAC,2BAAW,UAAS;AAAA,OACvB;AAAA,EAEJ;AACF;AAgBO,MAAM,iBAAiB,MAAM,WAGlC,SAASC,gBAAe,EAAE,OAAO,OAAO,GAAG,MAAM,GAAG,KAAK;AACzD,QAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,QAAM,gBAAY,uCAAe;AACjC,QAAM,aAAa,UAAU;AAAA,IAC3B,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AACD,QAAM,sBAAsB,UAAU;AAAA,IACpC,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAa;AAAA,MACb;AAAA,MACA,OAAO,YAAY,aAAa;AAAA,MAChC,cAAY;AAAA,MACX,GAAG;AAAA,MAEH,sBAAY,4CAAC,gCAAU,IAAK,4CAAC,+BAAS;AAAA;AAAA,EACzC;AAEJ,CAAC;AAED,SAAS,QAAQ,OAAe;AAC9B,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,KAAK;AACtD,QAAM,aAAa,MAAM,OAA2B,MAAS;AAE7D,QAAM,OAAO,YAAY;AACvB,QAAI;AACF,YAAM,UAAU,UAAU,UAAU,KAAK;AACzC,mBAAa,IAAI;AAGjB,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAGA,iBAAW,UAAU,OAAO,WAAW,MAAM;AAC3C,qBAAa,KAAK;AAAA,MACpB,GAAG,GAAI;AAAA,IACT,SAAS,KAAK;AACZ,cAAQ,MAAM,wBAAwB,GAAG;AAAA,IAC3C;AAAA,EACF;AAGA,QAAM,UAAU,MAAM;AACpB,WAAO,MAAM;AACX,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,CAAC,WAAW,IAAI;AACzB;","names":["CopyButton","CopyIconButton"]}

package/dist/cjs/lib/edit-user-profile-dialog.cjs

@@ -37,7 +37,7 @@ var import_themes = require("@radix-ui/themes");
 var import_endpoint = require("../api/endpoint.js");
 var import_react_query = require("@tanstack/react-query");
 var React = __toESM(require("react"), 1);
-var Form = __toESM(require("@radix-ui/react-form"), 1);
+var import_radix_ui = require("radix-ui");
 var import_elements = require("./elements.js");
 var import_save_button = require("./save-button.js");
 var import_translation = require("./i18n/translation.js");
@@ -101,7 +101,7 @@ function Content({ user, onClose }) {
     ) }) }),
     updateMe.error ? /* @__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: getMutationErrorMessage(updateMe.error) }) }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-      Form.Root,
+      import_radix_ui.Form.Root,
       {
         onSubmit: async (event) => {
           event.preventDefault();
@@ -117,8 +117,8 @@ function Content({ user, onClose }) {
         },
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { my: "5", direction: "column", gap: "4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Field, { name: "firstName", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", 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)(
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Field, { name: "firstName", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", 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: "First name",
@@ -126,7 +126,7 @@ function Content({ user, onClose }) {
                   description: "Label for first name 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,
@@ -141,8 +141,8 @@ function Content({ user, onClose }) {
                 }
               ) })
             ] }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Field, { name: "lastName", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", 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)(
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Field, { name: "lastName", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", 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: "Last name",
@@ -150,7 +150,7 @@ function Content({ user, onClose }) {
                   description: "Label for last name 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,

package/dist/cjs/lib/edit-user-profile-dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/edit-user-profile-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport { getMeQueryKey, Me, useUpdateMe } from \"../api/endpoint.js\";\nimport { useQueryClient } from \"@tanstack/react-query\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport * as Form from \"@radix-ui/react-form\";\nimport { Dialog, Label, Button, TextField } from \"./elements.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface EditUserProfileDialogProps extends Dialog.RootProps {\n  user: Me;\n  children?: ReactNode;\n}\n\nexport function EditUserProfileDialog({\n  children,\n  user,\n  ...props\n}: EditUserProfileDialogProps) {\n  const [open, setOpen] = React.useState(false);\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>{children}</Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <Content user={user} onClose={handleClose} />\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps extends Pick<EditUserProfileDialogProps, \"user\"> {\n  onClose: () => void;\n}\n\nfunction Content({ user, onClose }: ContentProps) {\n  const translate = useTranslation();\n  const client = useQueryClient();\n  const updateMe = useUpdateMe({\n    mutation: {\n      onSettled: () => {\n        client.invalidateQueries({ queryKey: getMeQueryKey() });\n      },\n      onSuccess: (newProfile) => {\n        client.setQueryData(getMeQueryKey(), {\n          ...user,\n          firstName: newProfile.firstName || user.firstName,\n          lastName: newProfile.lastName || user.lastName,\n        });\n      },\n    },\n  });\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Edit name\"\n          id=\"pcK9ly\"\n          description=\"Dialog title for editing user name\"\n        />\n      </Dialog.Title>\n      <VisuallyHidden>\n        <Dialog.Description>\n          <Translation\n            defaultMessage=\"Edit the details of {email}\"\n            id=\"SEsXx0\"\n            description=\"Dialog description for editing user details\"\n            values={{ email: <Text weight=\"bold\">{user.email}</Text> }}\n          />\n        </Dialog.Description>\n      </VisuallyHidden>\n\n      {updateMe.error ? (\n        <Callout.Root color=\"red\" my=\"-2\">\n          <Callout.Text>{getMutationErrorMessage(updateMe.error)}</Callout.Text>\n        </Callout.Root>\n      ) : null}\n\n      <Form.Root\n        onSubmit={async (event) => {\n          event.preventDefault();\n          const formData = new FormData(event.currentTarget);\n          const firstName = formData.get(\"firstName\")?.toString();\n          const lastName = formData.get(\"lastName\")?.toString();\n          updateMe.mutate({\n            data: {\n              firstName: firstName ?? undefined,\n              lastName: lastName ?? undefined,\n            },\n          });\n        }}\n      >\n        <Flex my=\"5\" direction=\"column\" gap=\"4\">\n          <Form.Field name=\"firstName\" asChild>\n            <Flex direction=\"column\" gap=\"1\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"First name\"\n                    id=\"DAYdcg\"\n                    description=\"Label for first name field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <TextField\n                  data-1p-ignore\n                  autoComplete=\"given-name\"\n                  defaultValue={user.firstName ?? \"\"}\n                  placeholder={translate({\n                    defaultMessage: \"Your first name\",\n                    id: \"gUTpgG\",\n                    description: \"Placeholder for first name field\",\n                  })}\n                  disabled={updateMe.isPending || updateMe.isSuccess}\n                />\n              </Form.Control>\n            </Flex>\n          </Form.Field>\n\n          <Form.Field name=\"lastName\" asChild>\n            <Flex direction=\"column\" gap=\"1\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Last name\"\n                    id=\"IwcAMv\"\n                    description=\"Label for last name field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <TextField\n                  data-1p-ignore\n                  autoComplete=\"family-name\"\n                  defaultValue={user.lastName ?? \"\"}\n                  placeholder={translate({\n                    defaultMessage: \"Your last name\",\n                    id: \"Gy8eW0\",\n                    description: \"Placeholder for last name field\",\n                  })}\n                  disabled={updateMe.isPending || updateMe.isSuccess}\n                />\n              </Form.Control>\n            </Flex>\n          </Form.Field>\n        </Flex>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              disabled={updateMe.isPending || updateMe.isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"hHNj31\"\n                description=\"Cancel button text\"\n              />\n            </Button>\n          </Dialog.Close>\n          <SaveButton\n            type=\"submit\"\n            loading={updateMe.isPending}\n            done={updateMe.isSuccess}\n            onDone={onClose}\n          >\n            <Translation\n              defaultMessage=\"Save\"\n              id=\"RT8KNi\"\n              description=\"Save button text\"\n            />\n          </SaveButton>\n        </Flex>\n\n        {/* mirror errors in a live region */}\n        <VisuallyHidden asChild>\n          <section aria-live=\"polite\">\n            {getMutationErrorMessage(updateMe.error)}\n          </section>\n        </VisuallyHidden>\n      </Form.Root>\n    </>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (error instanceof Error) {\n    return error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    return error.message;\n  }\n\n  // TODO Handle server errors\n  return \"Something went wrong. Please try again.\";\n}\n\n// Note: Error messages in getMutationErrorMessage are kept as plain strings\n// since they are displayed dynamically\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/edit-user-profile-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport { getMeQueryKey, Me, useUpdateMe } from \"../api/endpoint.js\";\nimport { useQueryClient } from \"@tanstack/react-query\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport { Form } from \"radix-ui\";\nimport { Dialog, Label, Button, TextField } from \"./elements.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface EditUserProfileDialogProps extends Dialog.RootProps {\n  user: Me;\n  children?: ReactNode;\n}\n\nexport function EditUserProfileDialog({\n  children,\n  user,\n  ...props\n}: EditUserProfileDialogProps) {\n  const [open, setOpen] = React.useState(false);\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>{children}</Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <Content user={user} onClose={handleClose} />\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps extends Pick<EditUserProfileDialogProps, \"user\"> {\n  onClose: () => void;\n}\n\nfunction Content({ user, onClose }: ContentProps) {\n  const translate = useTranslation();\n  const client = useQueryClient();\n  const updateMe = useUpdateMe({\n    mutation: {\n      onSettled: () => {\n        client.invalidateQueries({ queryKey: getMeQueryKey() });\n      },\n      onSuccess: (newProfile) => {\n        client.setQueryData(getMeQueryKey(), {\n          ...user,\n          firstName: newProfile.firstName || user.firstName,\n          lastName: newProfile.lastName || user.lastName,\n        });\n      },\n    },\n  });\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Edit name\"\n          id=\"pcK9ly\"\n          description=\"Dialog title for editing user name\"\n        />\n      </Dialog.Title>\n      <VisuallyHidden>\n        <Dialog.Description>\n          <Translation\n            defaultMessage=\"Edit the details of {email}\"\n            id=\"SEsXx0\"\n            description=\"Dialog description for editing user details\"\n            values={{ email: <Text weight=\"bold\">{user.email}</Text> }}\n          />\n        </Dialog.Description>\n      </VisuallyHidden>\n\n      {updateMe.error ? (\n        <Callout.Root color=\"red\" my=\"-2\">\n          <Callout.Text>{getMutationErrorMessage(updateMe.error)}</Callout.Text>\n        </Callout.Root>\n      ) : null}\n\n      <Form.Root\n        onSubmit={async (event) => {\n          event.preventDefault();\n          const formData = new FormData(event.currentTarget);\n          const firstName = formData.get(\"firstName\")?.toString();\n          const lastName = formData.get(\"lastName\")?.toString();\n          updateMe.mutate({\n            data: {\n              firstName: firstName ?? undefined,\n              lastName: lastName ?? undefined,\n            },\n          });\n        }}\n      >\n        <Flex my=\"5\" direction=\"column\" gap=\"4\">\n          <Form.Field name=\"firstName\" asChild>\n            <Flex direction=\"column\" gap=\"1\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"First name\"\n                    id=\"DAYdcg\"\n                    description=\"Label for first name field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <TextField\n                  data-1p-ignore\n                  autoComplete=\"given-name\"\n                  defaultValue={user.firstName ?? \"\"}\n                  placeholder={translate({\n                    defaultMessage: \"Your first name\",\n                    id: \"gUTpgG\",\n                    description: \"Placeholder for first name field\",\n                  })}\n                  disabled={updateMe.isPending || updateMe.isSuccess}\n                />\n              </Form.Control>\n            </Flex>\n          </Form.Field>\n\n          <Form.Field name=\"lastName\" asChild>\n            <Flex direction=\"column\" gap=\"1\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Last name\"\n                    id=\"IwcAMv\"\n                    description=\"Label for last name field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <TextField\n                  data-1p-ignore\n                  autoComplete=\"family-name\"\n                  defaultValue={user.lastName ?? \"\"}\n                  placeholder={translate({\n                    defaultMessage: \"Your last name\",\n                    id: \"Gy8eW0\",\n                    description: \"Placeholder for last name field\",\n                  })}\n                  disabled={updateMe.isPending || updateMe.isSuccess}\n                />\n              </Form.Control>\n            </Flex>\n          </Form.Field>\n        </Flex>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              disabled={updateMe.isPending || updateMe.isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"hHNj31\"\n                description=\"Cancel button text\"\n              />\n            </Button>\n          </Dialog.Close>\n          <SaveButton\n            type=\"submit\"\n            loading={updateMe.isPending}\n            done={updateMe.isSuccess}\n            onDone={onClose}\n          >\n            <Translation\n              defaultMessage=\"Save\"\n              id=\"RT8KNi\"\n              description=\"Save button text\"\n            />\n          </SaveButton>\n        </Flex>\n\n        {/* mirror errors in a live region */}\n        <VisuallyHidden asChild>\n          <section aria-live=\"polite\">\n            {getMutationErrorMessage(updateMe.error)}\n          </section>\n        </VisuallyHidden>\n      </Form.Root>\n    </>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (error instanceof Error) {\n    return error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    return error.message;\n  }\n\n  // TODO Handle server errors\n  return \"Something went wrong. Please try again.\";\n}\n\n// Note: Error messages in getMutationErrorMessage are kept as plain strings\n// since they are displayed dynamically\n"],"mappings":"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","names":[]}

package/dist/cjs/lib/elements/utils.cjs

@@ -32,12 +32,11 @@ __export(utils_exports, {
 });
 module.exports = __toCommonJS(utils_exports);
 var React = __toESM(require("react"), 1);
-var import_react_compose_refs = require("@radix-ui/react-compose-refs");
-var import_use_layout_effect = require("../use-layout-effect.js");
+var import_internal = require("radix-ui/internal");
 function useDialogOverlayHack(forwardedRef, { className, selector }) {
   const [node, setNode] = React.useState(null);
-  const ref = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, setNode);
-  (0, import_use_layout_effect.useLayoutEffect)(() => {
+  const ref = (0, import_internal.useComposedRefs)(forwardedRef, setNode);
+  (0, import_internal.useLayoutEffect)(() => {
     if (!node) {
       return;
     }

package/dist/cjs/lib/elements/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/lib/elements/utils.ts"],"sourcesContent":["import * as React from \"react\";\nimport { useComposedRefs } from \"@radix-ui/react-compose-refs\";\nimport { useLayoutEffect } from \"../use-layout-effect.js\";\n\n/**\n * HACK: Radix themes does not expose the dialog overlay, but we want consumer\n * to be able to style it with a classname. This will add a classname to the\n * overlay when the dialog content is mounted.\n */\nexport function useDialogOverlayHack(\n  forwardedRef: React.Ref<HTMLDivElement | null>,\n  { className, selector }: { className: string; selector: string },\n): { ref: React.Ref<HTMLDivElement | null> } {\n  const [node, setNode] = React.useState<HTMLDivElement | null>(null);\n  const ref = useComposedRefs(forwardedRef, setNode as any);\n  useLayoutEffect(() => {\n    if (!node) {\n      return;\n    }\n    const document = node.ownerDocument;\n    const overlay = document.querySelector<HTMLDivElement>(selector);\n    overlay?.classList.add(className);\n  }, [node, className, selector]);\n\n  return { ref };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,gCAAgC;AAChC,+BAAgC;AAOzB,SAAS,qBACd,cACA,EAAE,WAAW,SAAS,GACqB;AAC3C,QAAM,CAAC,MAAM,OAAO,IAAI,MAAM,SAAgC,IAAI;AAClE,QAAM,UAAM,2CAAgB,cAAc,OAAc;AACxD,gDAAgB,MAAM;AACpB,QAAI,CAAC,MAAM;AACT;AAAA,IACF;AACA,UAAM,WAAW,KAAK;AACtB,UAAM,UAAU,SAAS,cAA8B,QAAQ;AAC/D,aAAS,UAAU,IAAI,SAAS;AAAA,EAClC,GAAG,CAAC,MAAM,WAAW,QAAQ,CAAC;AAE9B,SAAO,EAAE,IAAI;AACf;","names":[]}
+{"version":3,"sources":["../../../../src/lib/elements/utils.ts"],"sourcesContent":["import * as React from \"react\";\nimport { useComposedRefs, useLayoutEffect } from \"radix-ui/internal\";\n\n/**\n * HACK: Radix themes does not expose the dialog overlay, but we want consumer\n * to be able to style it with a classname. This will add a classname to the\n * overlay when the dialog content is mounted.\n */\nexport function useDialogOverlayHack(\n  forwardedRef: React.Ref<HTMLDivElement | null>,\n  { className, selector }: { className: string; selector: string },\n): { ref: React.Ref<HTMLDivElement | null> } {\n  const [node, setNode] = React.useState<HTMLDivElement | null>(null);\n  const ref = useComposedRefs(forwardedRef, setNode as any);\n  useLayoutEffect(() => {\n    if (!node) {\n      return;\n    }\n    const document = node.ownerDocument;\n    const overlay = document.querySelector<HTMLDivElement>(selector);\n    overlay?.classList.add(className);\n  }, [node, className, selector]);\n\n  return { ref };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,sBAAiD;AAO1C,SAAS,qBACd,cACA,EAAE,WAAW,SAAS,GACqB;AAC3C,QAAM,CAAC,MAAM,OAAO,IAAI,MAAM,SAAgC,IAAI;AAClE,QAAM,UAAM,iCAAgB,cAAc,OAAc;AACxD,uCAAgB,MAAM;AACpB,QAAI,CAAC,MAAM;AACT;AAAA,IACF;AACA,UAAM,WAAW,KAAK;AACtB,UAAM,UAAU,SAAS,cAA8B,QAAQ;AAC/D,aAAS,UAAU,IAAI,SAAS;AAAA,EAClC,GAAG,CAAC,MAAM,WAAW,QAAQ,CAAC;AAE9B,SAAO,EAAE,IAAI;AACf;","names":[]}

package/dist/cjs/lib/elements.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/elements.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Avatar as RadixAvatar,\n  AvatarProps as RadixAvatarProps,\n  Badge as RadixBadge,\n  IconButton as RadixIconButton,\n  Skeleton as RadixSkeleton,\n  Text,\n  TextField as RadixTextField,\n  type BadgeProps,\n  type ButtonProps as RadixButtonProps,\n  type IconButtonProps as RadixIconButtonProps,\n  type SkeletonProps,\n  type TextProps,\n  Button as RadixButton,\n} from \"@radix-ui/themes\";\nimport type {\n  GetPropDefTypes,\n  avatarPropDefs,\n  badgePropDefs,\n  buttonPropDefs,\n  dialogContentPropDefs,\n  dropdownMenuContentPropDefs,\n  dropdownMenuItemPropDefs,\n  iconButtonPropDefs,\n  textPropDefs,\n  textFieldRootPropDefs,\n  selectTriggerPropDefs,\n  skeletonPropDefs,\n} from \"@radix-ui/themes/props\";\nimport cx from \"clsx\";\nimport { useElement } from \"./widgets-context.js\";\nimport { getDomProps, namespaceClassNames } from \"./utils.js\";\nimport { EyeClosedIcon, EyeOpenIcon } from \"@radix-ui/react-icons\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\nexport interface ButtonProps\n  extends Omit<RadixButtonProps, \"variant\" | \"color\"> {\n  variant?: \"primary\" | \"secondary\" | \"destructive\";\n  unsafe_radixVariant?: RadixButtonProps[\"variant\"];\n}\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(\n    { className, variant = \"primary\", unsafe_radixVariant, ...props },\n    ref,\n  ) {\n    const element = useElement(`${variant}Button`);\n\n    const themeProps = (() => {\n      let props: RadixButtonProps = {};\n      if (variant === \"primary\") {\n        props = {\n          variant: \"solid\",\n        } satisfies RadixButtonProps;\n      } else if (variant === \"secondary\") {\n        props = {\n          highContrast: true,\n          variant: \"surface\",\n          color: \"gray\",\n        } satisfies RadixButtonProps;\n      } else if (variant === \"destructive\") {\n        props = {\n          variant: \"solid\",\n          color: \"red\",\n        } satisfies RadixButtonProps;\n      } else {\n        variant satisfies never;\n      }\n\n      if (unsafe_radixVariant) {\n        props.variant = unsafe_radixVariant;\n      }\n\n      return props;\n    })();\n\n    return (\n      <RadixButton\n        ref={ref}\n        {...getDomProps({\n          elementId: `${variant}Button`,\n          className: cx(\n            className,\n            // TODO: Remove BEM-style selector once conventions are standardized\n            `button--${variant}`,\n          ),\n        })}\n        {...themeProps}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\nexport interface IconButtonProps extends RadixIconButtonProps {\n  title: string;\n}\n\nexport const IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(\n  function IconButton({ className, ...props }, ref) {\n    const element = useElement(\"iconButton\");\n    return (\n      <RadixIconButton\n        ref={ref}\n        {...getDomProps({ elementId: \"iconButton\", className })}\n        variant=\"ghost\"\n        color=\"gray\"\n        aria-label={props.title}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\nexport const Skeleton = React.forwardRef<HTMLSpanElement, SkeletonProps>(\n  function Skeleton({ className, ...props }, ref) {\n    const element = useElement(\"skeleton\");\n    return (\n      <RadixSkeleton\n        ref={ref}\n        {...getDomProps({ elementId: \"skeleton\", className })}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\nexport const Label = React.forwardRef<HTMLLabelElement, TextProps>(\n  function Label({ children, className, style = {}, ...props }, ref) {\n    const element = useElement(\"label\");\n    return (\n      <Text\n        as=\"label\"\n        ref={ref}\n        weight=\"bold\"\n        size=\"2\"\n        {...getDomProps({ elementId: \"label\", className })}\n        style={{ width: \"fit-content\", ...style }}\n        // Text props are a complex union type depending on the `as` prop value,\n        // which breaks down when spreading in `element`.\n        {...(props as any)}\n        {...element}\n      >\n        {children}\n      </Text>\n    );\n  },\n);\n\nexport const TextField = React.forwardRef<\n  HTMLInputElement,\n  RadixTextField.RootProps\n>(function TextField({ className, ...props }, ref) {\n  const element = useElement(\"textfield\");\n  return (\n    <RadixTextField.Root\n      ref={ref}\n      variant=\"surface\"\n      className={cx(namespaceClassNames(\"text-field\"), className)}\n      {...props}\n      {...element}\n    />\n  );\n});\n\nexport const TextFieldSlot = React.forwardRef<\n  HTMLDivElement,\n  RadixTextField.SlotProps\n>(function TextFieldSlot({ className, ...props }, ref) {\n  return (\n    <RadixTextField.Slot\n      ref={ref}\n      className={cx(namespaceClassNames(\"text-field-slot\"), className)}\n      {...props}\n    />\n  );\n});\n\nexport const PasswordField = React.forwardRef<\n  HTMLInputElement,\n  RadixTextField.RootProps\n>(function PasswordField({ className, ...props }, ref) {\n  const element = useElement(\"textfield\");\n  const [showPassword, setShowPassword] = React.useState(false);\n  const translate = useTranslation();\n  const hidePasswordText = translate({\n    defaultMessage: \"Hide password\",\n    id: \"Jv4Vps\",\n    description: \"Button text to hide password\",\n  });\n  const showPasswordText = translate({\n    defaultMessage: \"Show password\",\n    id: \"UIfBSd\",\n    description: \"Button text to show password\",\n  });\n  return (\n    <RadixTextField.Root\n      ref={ref}\n      variant=\"surface\"\n      className={cx(namespaceClassNames(\"text-field\"), className)}\n      {...props}\n      {...element}\n      type={showPassword ? \"text\" : \"password\"}\n    >\n      <RadixTextField.Slot side=\"right\">\n        <IconButton\n          type=\"button\"\n          size=\"1\"\n          onClick={() => setShowPassword(!showPassword)}\n          title={showPassword ? hidePasswordText : showPasswordText}\n        >\n          {showPassword ? <EyeOpenIcon /> : <EyeClosedIcon />}\n        </IconButton>\n      </RadixTextField.Slot>\n    </RadixTextField.Root>\n  );\n});\n\nexport const Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n  function Badge({ className, ...props }, ref) {\n    const element = useElement(\"badge\");\n    return (\n      <RadixBadge\n        ref={ref}\n        {...getDomProps({ elementId: \"badge\", className })}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\ninterface AvatarProps extends RadixAvatarProps {\n  dim?: boolean;\n}\n\nexport const Avatar = React.forwardRef<HTMLImageElement, AvatarProps>(\n  function Avatar({ dim, className, ...props }, ref) {\n    const element = useElement(\"avatar\");\n    return (\n      <RadixAvatar\n        ref={ref}\n        color=\"gray\"\n        {...getDomProps({ elementId: \"avatar\", className })}\n        {...props}\n        {...element}\n        // TODO: use CSS var instead of hard-coded value for opacity\n        style={dim ? { opacity: 0.6, ...props.style } : props.style}\n      />\n    );\n  },\n);\n\ntype OmitAsChild<T> = {\n  [K in keyof T]: T[K] extends undefined\n    ? undefined\n    : Omit<NonNullable<T[K]>, \"asChild\">;\n};\n\nexport * as Dialog from \"./elements/dialog.js\";\nexport * as AlertDialog from \"./elements/alert-dialog.js\";\nexport * as DropdownMenu from \"./elements/dropdown-menu.js\";\nexport * as Select from \"./elements/select.js\";\n\nexport type Elements = OmitAsChild<{\n  dialog?: GetPropDefTypes<typeof dialogContentPropDefs>;\n  primaryButton?: GetPropDefTypes<typeof buttonPropDefs>;\n  secondaryButton?: GetPropDefTypes<typeof buttonPropDefs>;\n  destructiveButton?: GetPropDefTypes<typeof buttonPropDefs>;\n  iconButton?: GetPropDefTypes<typeof iconButtonPropDefs>;\n  textfield?: GetPropDefTypes<typeof textFieldRootPropDefs>;\n  select?: GetPropDefTypes<typeof selectTriggerPropDefs>;\n  badge?: GetPropDefTypes<typeof badgePropDefs>;\n  dropdown?: GetPropDefTypes<typeof dropdownMenuContentPropDefs>;\n  primaryMenuItem?: GetPropDefTypes<typeof dropdownMenuItemPropDefs>;\n  destructiveMenuItem?: GetPropDefTypes<typeof dropdownMenuItemPropDefs>;\n  avatar?: Omit<GetPropDefTypes<typeof avatarPropDefs>, \"fallback\">;\n  label?: GetPropDefTypes<typeof textPropDefs>;\n  skeleton?: GetPropDefTypes<typeof skeletonPropDefs>;\n}>;\n"],"mappings":"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","names":["Button","props","RadixButton","cx","IconButton","RadixIconButton","Skeleton","RadixSkeleton","Label","TextField","RadixTextField","TextFieldSlot","PasswordField","Badge","RadixBadge","Avatar","RadixAvatar"]}
+{"version":3,"sources":["../../../src/lib/elements.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Avatar as RadixAvatar,\n  AvatarProps as RadixAvatarProps,\n  Badge as RadixBadge,\n  IconButton as RadixIconButton,\n  Skeleton as RadixSkeleton,\n  Text,\n  TextField as RadixTextField,\n  type BadgeProps,\n  type ButtonProps as RadixButtonProps,\n  type IconButtonProps as RadixIconButtonProps,\n  type SkeletonProps,\n  type TextProps,\n  Button as RadixButton,\n} from \"@radix-ui/themes\";\nimport type {\n  GetPropDefTypes,\n  avatarPropDefs,\n  badgePropDefs,\n  buttonPropDefs,\n  dialogContentPropDefs,\n  dropdownMenuContentPropDefs,\n  dropdownMenuItemPropDefs,\n  iconButtonPropDefs,\n  textPropDefs,\n  textFieldRootPropDefs,\n  selectTriggerPropDefs,\n  skeletonPropDefs,\n} from \"@radix-ui/themes/props\";\nimport cx from \"clsx\";\nimport { useElement } from \"./widgets-context.js\";\nimport { getDomProps, namespaceClassNames } from \"./utils.js\";\nimport { EyeClosedIcon, EyeOpenIcon } from \"@radix-ui/react-icons\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\nexport interface ButtonProps extends Omit<\n  RadixButtonProps,\n  \"variant\" | \"color\"\n> {\n  variant?: \"primary\" | \"secondary\" | \"destructive\";\n  unsafe_radixVariant?: RadixButtonProps[\"variant\"];\n}\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(\n    { className, variant = \"primary\", unsafe_radixVariant, ...props },\n    ref,\n  ) {\n    const element = useElement(`${variant}Button`);\n\n    const themeProps = (() => {\n      let props: RadixButtonProps = {};\n      if (variant === \"primary\") {\n        props = {\n          variant: \"solid\",\n        } satisfies RadixButtonProps;\n      } else if (variant === \"secondary\") {\n        props = {\n          highContrast: true,\n          variant: \"surface\",\n          color: \"gray\",\n        } satisfies RadixButtonProps;\n      } else if (variant === \"destructive\") {\n        props = {\n          variant: \"solid\",\n          color: \"red\",\n        } satisfies RadixButtonProps;\n      } else {\n        variant satisfies never;\n      }\n\n      if (unsafe_radixVariant) {\n        props.variant = unsafe_radixVariant;\n      }\n\n      return props;\n    })();\n\n    return (\n      <RadixButton\n        ref={ref}\n        {...getDomProps({\n          elementId: `${variant}Button`,\n          className: cx(\n            className,\n            // TODO: Remove BEM-style selector once conventions are standardized\n            `button--${variant}`,\n          ),\n        })}\n        {...themeProps}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\nexport interface IconButtonProps extends RadixIconButtonProps {\n  title: string;\n}\n\nexport const IconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>(\n  function IconButton({ className, ...props }, ref) {\n    const element = useElement(\"iconButton\");\n    return (\n      <RadixIconButton\n        ref={ref}\n        {...getDomProps({ elementId: \"iconButton\", className })}\n        variant=\"ghost\"\n        color=\"gray\"\n        aria-label={props.title}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\nexport const Skeleton = React.forwardRef<HTMLSpanElement, SkeletonProps>(\n  function Skeleton({ className, ...props }, ref) {\n    const element = useElement(\"skeleton\");\n    return (\n      <RadixSkeleton\n        ref={ref}\n        {...getDomProps({ elementId: \"skeleton\", className })}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\nexport const Label = React.forwardRef<HTMLLabelElement, TextProps>(\n  function Label({ children, className, style = {}, ...props }, ref) {\n    const element = useElement(\"label\");\n    return (\n      <Text\n        as=\"label\"\n        ref={ref}\n        weight=\"bold\"\n        size=\"2\"\n        {...getDomProps({ elementId: \"label\", className })}\n        style={{ width: \"fit-content\", ...style }}\n        // Text props are a complex union type depending on the `as` prop value,\n        // which breaks down when spreading in `element`.\n        {...(props as any)}\n        {...element}\n      >\n        {children}\n      </Text>\n    );\n  },\n);\n\nexport const TextField = React.forwardRef<\n  HTMLInputElement,\n  RadixTextField.RootProps\n>(function TextField({ className, ...props }, ref) {\n  const element = useElement(\"textfield\");\n  return (\n    <RadixTextField.Root\n      ref={ref}\n      variant=\"surface\"\n      className={cx(namespaceClassNames(\"text-field\"), className)}\n      {...props}\n      {...element}\n    />\n  );\n});\n\nexport const TextFieldSlot = React.forwardRef<\n  HTMLDivElement,\n  RadixTextField.SlotProps\n>(function TextFieldSlot({ className, ...props }, ref) {\n  return (\n    <RadixTextField.Slot\n      ref={ref}\n      className={cx(namespaceClassNames(\"text-field-slot\"), className)}\n      {...props}\n    />\n  );\n});\n\nexport const PasswordField = React.forwardRef<\n  HTMLInputElement,\n  RadixTextField.RootProps\n>(function PasswordField({ className, ...props }, ref) {\n  const element = useElement(\"textfield\");\n  const [showPassword, setShowPassword] = React.useState(false);\n  const translate = useTranslation();\n  const hidePasswordText = translate({\n    defaultMessage: \"Hide password\",\n    id: \"Jv4Vps\",\n    description: \"Button text to hide password\",\n  });\n  const showPasswordText = translate({\n    defaultMessage: \"Show password\",\n    id: \"UIfBSd\",\n    description: \"Button text to show password\",\n  });\n  return (\n    <RadixTextField.Root\n      ref={ref}\n      variant=\"surface\"\n      className={cx(namespaceClassNames(\"text-field\"), className)}\n      {...props}\n      {...element}\n      type={showPassword ? \"text\" : \"password\"}\n    >\n      <RadixTextField.Slot side=\"right\">\n        <IconButton\n          type=\"button\"\n          size=\"1\"\n          onClick={() => setShowPassword(!showPassword)}\n          title={showPassword ? hidePasswordText : showPasswordText}\n        >\n          {showPassword ? <EyeOpenIcon /> : <EyeClosedIcon />}\n        </IconButton>\n      </RadixTextField.Slot>\n    </RadixTextField.Root>\n  );\n});\n\nexport const Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n  function Badge({ className, ...props }, ref) {\n    const element = useElement(\"badge\");\n    return (\n      <RadixBadge\n        ref={ref}\n        {...getDomProps({ elementId: \"badge\", className })}\n        {...props}\n        {...element}\n      />\n    );\n  },\n);\n\ninterface AvatarProps extends RadixAvatarProps {\n  dim?: boolean;\n}\n\nexport const Avatar = React.forwardRef<HTMLImageElement, AvatarProps>(\n  function Avatar({ dim, className, ...props }, ref) {\n    const element = useElement(\"avatar\");\n    return (\n      <RadixAvatar\n        ref={ref}\n        color=\"gray\"\n        {...getDomProps({ elementId: \"avatar\", className })}\n        {...props}\n        {...element}\n        // TODO: use CSS var instead of hard-coded value for opacity\n        style={dim ? { opacity: 0.6, ...props.style } : props.style}\n      />\n    );\n  },\n);\n\ntype OmitAsChild<T> = {\n  [K in keyof T]: T[K] extends undefined\n    ? undefined\n    : Omit<NonNullable<T[K]>, \"asChild\">;\n};\n\nexport * as Dialog from \"./elements/dialog.js\";\nexport * as AlertDialog from \"./elements/alert-dialog.js\";\nexport * as DropdownMenu from \"./elements/dropdown-menu.js\";\nexport * as Select from \"./elements/select.js\";\n\nexport type Elements = OmitAsChild<{\n  dialog?: GetPropDefTypes<typeof dialogContentPropDefs>;\n  primaryButton?: GetPropDefTypes<typeof buttonPropDefs>;\n  secondaryButton?: GetPropDefTypes<typeof buttonPropDefs>;\n  destructiveButton?: GetPropDefTypes<typeof buttonPropDefs>;\n  iconButton?: GetPropDefTypes<typeof iconButtonPropDefs>;\n  textfield?: GetPropDefTypes<typeof textFieldRootPropDefs>;\n  select?: GetPropDefTypes<typeof selectTriggerPropDefs>;\n  badge?: GetPropDefTypes<typeof badgePropDefs>;\n  dropdown?: GetPropDefTypes<typeof dropdownMenuContentPropDefs>;\n  primaryMenuItem?: GetPropDefTypes<typeof dropdownMenuItemPropDefs>;\n  destructiveMenuItem?: GetPropDefTypes<typeof dropdownMenuItemPropDefs>;\n  avatar?: Omit<GetPropDefTypes<typeof avatarPropDefs>, \"fallback\">;\n  label?: GetPropDefTypes<typeof textPropDefs>;\n  skeleton?: GetPropDefTypes<typeof skeletonPropDefs>;\n}>;\n"],"mappings":"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","names":["Button","props","RadixButton","cx","IconButton","RadixIconButton","Skeleton","RadixSkeleton","Label","TextField","RadixTextField","TextFieldSlot","PasswordField","Badge","RadixBadge","Avatar","RadixAvatar"]}

package/dist/cjs/lib/elevated-access.cjs

@@ -32,7 +32,7 @@ __export(elevated_access_exports, {
 });
 module.exports = __toCommonJS(elevated_access_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var Form = __toESM(require("@radix-ui/react-form"), 1);
+var import_radix_ui = require("radix-ui");
 var import_themes = require("@radix-ui/themes");
 var import_endpoint = require("../api/endpoint.js");
 var import_api_provider = require("../api/api-provider.js");
@@ -193,7 +193,7 @@ function VerificationIdentityForm({
     }
     setIsSubmitting(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Form.Root, { onSubmit: handleSubmit, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_radix_ui.Form.Root, { onSubmit: handleSubmit, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_translation.Translation,
       {

package/dist/cjs/lib/elevated-access.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/elevated-access.tsx"],"sourcesContent":["import * as Form from \"@radix-ui/react-form\";\nimport { Callout, Flex, Text } from \"@radix-ui/themes\";\nimport { useMe, useSendVerification, useVerify } from \"../api/endpoint.js\";\nimport { useElevatedAccessToken } from \"../api/api-provider.js\";\nimport { PropsWithChildren, useEffect, useRef, useState } from \"react\";\nimport { AlertDialog, Dialog, Button } from \"./elements.js\";\nimport * as Otp from \"./otp-input.js\";\nimport { Translation } from \"./i18n/translation.js\";\n\ninterface ElevatedAccessProps extends PropsWithChildren {\n  onVerified?: () => Promise<unknown>;\n  type?: \"dialog\" | \"alert\";\n}\n\nexport function ElevatedAccess({\n  type = \"dialog\",\n  children,\n  onVerified,\n}: ElevatedAccessProps) {\n  const { elevatedAccess } = useElevatedAccessToken();\n  const [authenticationChallengeId, setAuthenticationChallengeId] =\n    useState<string>();\n\n  const prevAccessToken = useRef(elevatedAccess);\n\n  useEffect(() => {\n    prevAccessToken.current = elevatedAccess;\n  }, [elevatedAccess]);\n\n  if (elevatedAccess) {\n    return <>{children}</>;\n  }\n\n  if (!authenticationChallengeId) {\n    // FIXME: This should be refactored\n    // eslint-disable-next-line react-hooks/refs\n    const hasTokenExpired = !!prevAccessToken.current;\n\n    return (\n      <SendVerificationEmailForm\n        type={type}\n        hasTokenExpired={hasTokenExpired}\n        onSuccess={(challengeId) => {\n          setAuthenticationChallengeId(challengeId);\n        }}\n      />\n    );\n  }\n\n  if (authenticationChallengeId) {\n    return (\n      <VerificationIdentityForm\n        type={type}\n        authenticationChallengeId={authenticationChallengeId}\n        onSuccess={() => {\n          // Reset the challenge id\n          setAuthenticationChallengeId(undefined);\n\n          return onVerified?.();\n        }}\n      />\n    );\n  }\n\n  return null;\n}\n\ninterface SendVerificationEmailFormProps {\n  onSuccess: (challengeId: string) => unknown | Promise<unknown>;\n  type: \"dialog\" | \"alert\";\n  hasTokenExpired: boolean;\n}\n\nfunction SendVerificationEmailForm({\n  onSuccess,\n  type,\n  hasTokenExpired,\n}: SendVerificationEmailFormProps) {\n  const { data: me } = useMe();\n  const sendVerification = useSendVerification({\n    mutation: { onSuccess: (data) => onSuccess(data.authenticationChallenge) },\n  });\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    sendVerification.mutate();\n  };\n\n  return (\n    <form onSubmit={handleSubmit}>\n      <Title>\n        {hasTokenExpired ? (\n          <Translation\n            defaultMessage=\"Your verification token has expired\"\n            id=\"lb/AsC\"\n            description=\"Dialog title when verification token has expired\"\n          />\n        ) : (\n          <Translation\n            defaultMessage=\"Verify your identity\"\n            id=\"7tGCOh\"\n            description=\"Dialog title for identity verification\"\n          />\n        )}\n      </Title>\n\n      <Description color=\"gray\" mb=\"5\">\n        <Translation\n          defaultMessage=\"To continue, we need to confirm your identity. We'll send a temporary verification code to {email}.\"\n          id=\"FTUSRM\"\n          description=\"Description explaining verification code will be sent\"\n          values={{\n            email: (\n              <Text weight=\"bold\" highContrast>\n                {me?.email}\n              </Text>\n            ),\n          }}\n        />\n      </Description>\n\n      {sendVerification.error && (\n        <Callout.Root color=\"red\" mt=\"-2\" mb=\"0\">\n          <Callout.Text>\n            {getMutationErrorMessage(sendVerification.error)}\n          </Callout.Text>\n        </Callout.Root>\n      )}\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <Button\n            variant=\"secondary\"\n            type=\"button\"\n            disabled={sendVerification.isPending}\n          >\n            <Translation\n              defaultMessage=\"Cancel\"\n              id=\"hHNj31\"\n              description=\"Cancel button text\"\n            />\n          </Button>\n        </Close>\n        <Button type=\"submit\" loading={sendVerification.isPending}>\n          <Translation\n            defaultMessage=\"Send verification code\"\n            id=\"XsTeXJ\"\n            description=\"Button text to send verification code\"\n          />\n        </Button>\n      </Flex>\n    </form>\n  );\n}\n\ninterface VerificationIdentityFormProps {\n  onSuccess?: () => unknown | Promise<unknown>;\n  authenticationChallengeId: string;\n  type: \"dialog\" | \"alert\";\n}\n\nfunction VerificationIdentityForm({\n  onSuccess,\n  authenticationChallengeId,\n  type,\n}: VerificationIdentityFormProps) {\n  const { data: me } = useMe();\n  const { setElevatedAccess } = useElevatedAccessToken();\n  const verifyIdentity = useVerify();\n  const [isSubmitting, setIsSubmitting] = useState(false);\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const code = formData.get(\"otp-code\")?.toString() ?? \"\";\n\n    setIsSubmitting(true);\n\n    try {\n      // Mutate async so we can wait for the onSuccess callback as well\n      const newAuthState = await verifyIdentity.mutateAsync({\n        data: {\n          code,\n          authenticationChallengeId,\n        },\n      });\n\n      const in10Seconds = new Date(Date.now() + 5 * 1000);\n\n      setElevatedAccess({\n        token: newAuthState.elevatedAccessToken,\n        // expiresAt: newAuthState.expiresAt,\n        expiresAt: in10Seconds.toISOString(),\n      });\n\n      if (onSuccess) {\n        await new Promise((resolve) => setTimeout(resolve, 200));\n        await onSuccess();\n      }\n    } catch (error) {\n      console.error(error);\n    }\n\n    setIsSubmitting(false);\n  };\n\n  return (\n    <Form.Root onSubmit={handleSubmit}>\n      <Title>\n        <Translation\n          defaultMessage=\"Verify your identity\"\n          id=\"7tGCOh\"\n          description=\"Dialog title for identity verification\"\n        />\n      </Title>\n\n      <Description color=\"gray\">\n        <Translation\n          defaultMessage=\"A verification code was sent to {email}. Please enter it below.\"\n          id=\"kvxE0S\"\n          description=\"Description explaining where verification code was sent\"\n          values={{\n            email: (\n              <Text weight=\"bold\" highContrast>\n                {me?.email}\n              </Text>\n            ),\n          }}\n        />\n      </Description>\n\n      <Flex direction=\"column\" gap=\"2\" mt=\"5\" mx=\"auto\" width=\"fit-content\">\n        <Otp.Root\n          autoSubmit\n          gap=\"2\"\n          justify=\"center\"\n          columns=\"repeat(6, 48px)\"\n          width=\"fit-content\"\n          rows=\"48px\"\n          name=\"otp-code\"\n          readOnly={isSubmitting}\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        {verifyIdentity.error && (\n          <Text color=\"red\" size=\"2\" as=\"p\">\n            {getMutationErrorMessage(verifyIdentity.error)}\n          </Text>\n        )}\n      </Flex>\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <Button variant=\"secondary\" type=\"button\">\n            <Translation\n              defaultMessage=\"Cancel\"\n              id=\"hHNj31\"\n              description=\"Cancel button text\"\n            />\n          </Button>\n        </Close>\n        <Button type=\"submit\" loading={isSubmitting}>\n          <Translation\n            defaultMessage=\"Confirm\"\n            id=\"EmYENK\"\n            description=\"Confirm button text for verification\"\n          />\n        </Button>\n      </Flex>\n    </Form.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  let message = typeof error === \"string\" ? error : \"\";\n\n  if (error instanceof Error) {\n    message = error.message;\n  } else 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 || message === \"Bad Request\") {\n    message = \"Invalid code, please try again.\";\n  }\n\n  return message;\n}\n\n// Note: Error messages in getMutationErrorMessage are kept as plain strings\n// since they are displayed dynamically\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/elevated-access.tsx"],"sourcesContent":["import { Form } from \"radix-ui\";\nimport { Callout, Flex, Text } from \"@radix-ui/themes\";\nimport { useMe, useSendVerification, useVerify } from \"../api/endpoint.js\";\nimport { useElevatedAccessToken } from \"../api/api-provider.js\";\nimport { PropsWithChildren, useEffect, useRef, useState } from \"react\";\nimport { AlertDialog, Dialog, Button } from \"./elements.js\";\nimport * as Otp from \"./otp-input.js\";\nimport { Translation } from \"./i18n/translation.js\";\n\ninterface ElevatedAccessProps extends PropsWithChildren {\n  onVerified?: () => Promise<unknown>;\n  type?: \"dialog\" | \"alert\";\n}\n\nexport function ElevatedAccess({\n  type = \"dialog\",\n  children,\n  onVerified,\n}: ElevatedAccessProps) {\n  const { elevatedAccess } = useElevatedAccessToken();\n  const [authenticationChallengeId, setAuthenticationChallengeId] =\n    useState<string>();\n\n  const prevAccessToken = useRef(elevatedAccess);\n\n  useEffect(() => {\n    prevAccessToken.current = elevatedAccess;\n  }, [elevatedAccess]);\n\n  if (elevatedAccess) {\n    return <>{children}</>;\n  }\n\n  if (!authenticationChallengeId) {\n    // FIXME: This should be refactored\n    // eslint-disable-next-line react-hooks/refs\n    const hasTokenExpired = !!prevAccessToken.current;\n\n    return (\n      <SendVerificationEmailForm\n        type={type}\n        hasTokenExpired={hasTokenExpired}\n        onSuccess={(challengeId) => {\n          setAuthenticationChallengeId(challengeId);\n        }}\n      />\n    );\n  }\n\n  if (authenticationChallengeId) {\n    return (\n      <VerificationIdentityForm\n        type={type}\n        authenticationChallengeId={authenticationChallengeId}\n        onSuccess={() => {\n          // Reset the challenge id\n          setAuthenticationChallengeId(undefined);\n\n          return onVerified?.();\n        }}\n      />\n    );\n  }\n\n  return null;\n}\n\ninterface SendVerificationEmailFormProps {\n  onSuccess: (challengeId: string) => unknown | Promise<unknown>;\n  type: \"dialog\" | \"alert\";\n  hasTokenExpired: boolean;\n}\n\nfunction SendVerificationEmailForm({\n  onSuccess,\n  type,\n  hasTokenExpired,\n}: SendVerificationEmailFormProps) {\n  const { data: me } = useMe();\n  const sendVerification = useSendVerification({\n    mutation: { onSuccess: (data) => onSuccess(data.authenticationChallenge) },\n  });\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    sendVerification.mutate();\n  };\n\n  return (\n    <form onSubmit={handleSubmit}>\n      <Title>\n        {hasTokenExpired ? (\n          <Translation\n            defaultMessage=\"Your verification token has expired\"\n            id=\"lb/AsC\"\n            description=\"Dialog title when verification token has expired\"\n          />\n        ) : (\n          <Translation\n            defaultMessage=\"Verify your identity\"\n            id=\"7tGCOh\"\n            description=\"Dialog title for identity verification\"\n          />\n        )}\n      </Title>\n\n      <Description color=\"gray\" mb=\"5\">\n        <Translation\n          defaultMessage=\"To continue, we need to confirm your identity. We'll send a temporary verification code to {email}.\"\n          id=\"FTUSRM\"\n          description=\"Description explaining verification code will be sent\"\n          values={{\n            email: (\n              <Text weight=\"bold\" highContrast>\n                {me?.email}\n              </Text>\n            ),\n          }}\n        />\n      </Description>\n\n      {sendVerification.error && (\n        <Callout.Root color=\"red\" mt=\"-2\" mb=\"0\">\n          <Callout.Text>\n            {getMutationErrorMessage(sendVerification.error)}\n          </Callout.Text>\n        </Callout.Root>\n      )}\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <Button\n            variant=\"secondary\"\n            type=\"button\"\n            disabled={sendVerification.isPending}\n          >\n            <Translation\n              defaultMessage=\"Cancel\"\n              id=\"hHNj31\"\n              description=\"Cancel button text\"\n            />\n          </Button>\n        </Close>\n        <Button type=\"submit\" loading={sendVerification.isPending}>\n          <Translation\n            defaultMessage=\"Send verification code\"\n            id=\"XsTeXJ\"\n            description=\"Button text to send verification code\"\n          />\n        </Button>\n      </Flex>\n    </form>\n  );\n}\n\ninterface VerificationIdentityFormProps {\n  onSuccess?: () => unknown | Promise<unknown>;\n  authenticationChallengeId: string;\n  type: \"dialog\" | \"alert\";\n}\n\nfunction VerificationIdentityForm({\n  onSuccess,\n  authenticationChallengeId,\n  type,\n}: VerificationIdentityFormProps) {\n  const { data: me } = useMe();\n  const { setElevatedAccess } = useElevatedAccessToken();\n  const verifyIdentity = useVerify();\n  const [isSubmitting, setIsSubmitting] = useState(false);\n\n  const Title = type === \"dialog\" ? Dialog.Title : AlertDialog.Title;\n  const Description =\n    type === \"dialog\" ? Dialog.Description : AlertDialog.Description;\n  const Close = type === \"dialog\" ? Dialog.Close : AlertDialog.Cancel;\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const code = formData.get(\"otp-code\")?.toString() ?? \"\";\n\n    setIsSubmitting(true);\n\n    try {\n      // Mutate async so we can wait for the onSuccess callback as well\n      const newAuthState = await verifyIdentity.mutateAsync({\n        data: {\n          code,\n          authenticationChallengeId,\n        },\n      });\n\n      const in10Seconds = new Date(Date.now() + 5 * 1000);\n\n      setElevatedAccess({\n        token: newAuthState.elevatedAccessToken,\n        // expiresAt: newAuthState.expiresAt,\n        expiresAt: in10Seconds.toISOString(),\n      });\n\n      if (onSuccess) {\n        await new Promise((resolve) => setTimeout(resolve, 200));\n        await onSuccess();\n      }\n    } catch (error) {\n      console.error(error);\n    }\n\n    setIsSubmitting(false);\n  };\n\n  return (\n    <Form.Root onSubmit={handleSubmit}>\n      <Title>\n        <Translation\n          defaultMessage=\"Verify your identity\"\n          id=\"7tGCOh\"\n          description=\"Dialog title for identity verification\"\n        />\n      </Title>\n\n      <Description color=\"gray\">\n        <Translation\n          defaultMessage=\"A verification code was sent to {email}. Please enter it below.\"\n          id=\"kvxE0S\"\n          description=\"Description explaining where verification code was sent\"\n          values={{\n            email: (\n              <Text weight=\"bold\" highContrast>\n                {me?.email}\n              </Text>\n            ),\n          }}\n        />\n      </Description>\n\n      <Flex direction=\"column\" gap=\"2\" mt=\"5\" mx=\"auto\" width=\"fit-content\">\n        <Otp.Root\n          autoSubmit\n          gap=\"2\"\n          justify=\"center\"\n          columns=\"repeat(6, 48px)\"\n          width=\"fit-content\"\n          rows=\"48px\"\n          name=\"otp-code\"\n          readOnly={isSubmitting}\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        {verifyIdentity.error && (\n          <Text color=\"red\" size=\"2\" as=\"p\">\n            {getMutationErrorMessage(verifyIdentity.error)}\n          </Text>\n        )}\n      </Flex>\n\n      <Flex justify=\"end\" align=\"center\" gap=\"3\" mt=\"5\">\n        <Close>\n          <Button variant=\"secondary\" type=\"button\">\n            <Translation\n              defaultMessage=\"Cancel\"\n              id=\"hHNj31\"\n              description=\"Cancel button text\"\n            />\n          </Button>\n        </Close>\n        <Button type=\"submit\" loading={isSubmitting}>\n          <Translation\n            defaultMessage=\"Confirm\"\n            id=\"EmYENK\"\n            description=\"Confirm button text for verification\"\n          />\n        </Button>\n      </Flex>\n    </Form.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  let message = typeof error === \"string\" ? error : \"\";\n\n  if (error instanceof Error) {\n    message = error.message;\n  } else 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 || message === \"Bad Request\") {\n    message = \"Invalid code, please try again.\";\n  }\n\n  return message;\n}\n\n// Note: Error messages in getMutationErrorMessage are kept as plain strings\n// since they are displayed dynamically\n"],"mappings":"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","names":[]}

package/dist/cjs/lib/marker.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/marker.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Text } from \"@radix-ui/themes\";\nimport { MarginProps } from \"@radix-ui/themes/props\";\nimport clsx from \"clsx\";\nimport { namespaceClassNames } from \"./utils.js\";\n\ntype TextProps = React.ComponentPropsWithoutRef<typeof Text>;\n\ntype MarkerOwnProps = {\n  color?: \"gray\" | \"purple\" | \"blue\" | \"green\" | \"yellow\" | \"red\";\n  highContrast?: boolean;\n  size?: TextProps[\"size\"];\n};\n\ninterface MarkerProps\n  extends Omit<React.ComponentPropsWithRef<\"span\">, \"color\">,\n    MarkerOwnProps,\n    MarginProps {}\n\nexport const Marker = React.forwardRef<HTMLSpanElement, MarkerProps>(\n  function Marker(\n    { children, className, highContrast, ...props },\n    forwardedRef,\n  ) {\n    return (\n      <Text\n        ref={forwardedRef}\n        className={clsx(className, namespaceClassNames(\"marker\"))}\n        {...props}\n      >\n        <span className={namespaceClassNames(\"marker-circle\")}>\n          <span className={namespaceClassNames(\"marker-content\")}>\n            {children}\n          </span>\n        </span>\n      </Text>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BU;AA/BV,YAAuB;AACvB,oBAAqB;AAErB,kBAAiB;AACjB,mBAAoC;AAe7B,MAAM,SAAS,MAAM;AAAA,EAC1B,SAASA,QACP,EAAE,UAAU,WAAW,cAAc,GAAG,MAAM,GAC9C,cACA;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,eAAW,YAAAC,SAAK,eAAW,kCAAoB,QAAQ,CAAC;AAAA,QACvD,GAAG;AAAA,QAEJ,sDAAC,UAAK,eAAW,kCAAoB,eAAe,GAClD,sDAAC,UAAK,eAAW,kCAAoB,gBAAgB,GAClD,UACH,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;","names":["Marker","clsx"]}
+{"version":3,"sources":["../../../src/lib/marker.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Text } from \"@radix-ui/themes\";\nimport { MarginProps } from \"@radix-ui/themes/props\";\nimport clsx from \"clsx\";\nimport { namespaceClassNames } from \"./utils.js\";\n\ntype TextProps = React.ComponentPropsWithoutRef<typeof Text>;\n\ntype MarkerOwnProps = {\n  color?: \"gray\" | \"purple\" | \"blue\" | \"green\" | \"yellow\" | \"red\";\n  highContrast?: boolean;\n  size?: TextProps[\"size\"];\n};\n\ninterface MarkerProps\n  extends\n    Omit<React.ComponentPropsWithRef<\"span\">, \"color\">,\n    MarkerOwnProps,\n    MarginProps {}\n\nexport const Marker = React.forwardRef<HTMLSpanElement, MarkerProps>(\n  function Marker(\n    { children, className, highContrast, ...props },\n    forwardedRef,\n  ) {\n    return (\n      <Text\n        ref={forwardedRef}\n        className={clsx(className, namespaceClassNames(\"marker\"))}\n        {...props}\n      >\n        <span className={namespaceClassNames(\"marker-circle\")}>\n          <span className={namespaceClassNames(\"marker-content\")}>\n            {children}\n          </span>\n        </span>\n      </Text>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgCU;AAhCV,YAAuB;AACvB,oBAAqB;AAErB,kBAAiB;AACjB,mBAAoC;AAgB7B,MAAM,SAAS,MAAM;AAAA,EAC1B,SAASA,QACP,EAAE,UAAU,WAAW,cAAc,GAAG,MAAM,GAC9C,cACA;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,eAAW,YAAAC,SAAK,eAAW,kCAAoB,QAAQ,CAAC;AAAA,QACvD,GAAG;AAAA,QAEJ,sDAAC,UAAK,eAAW,kCAAoB,eAAe,GAClD,sDAAC,UAAK,eAAW,kCAAoB,gBAAgB,GAClD,UACH,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;","names":["Marker","clsx"]}

package/dist/cjs/lib/organization-switcher.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/organization-switcher.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon } from \"@radix-ui/react-icons\";\nimport {\n  Box,\n  ChevronDownIcon,\n  Flex,\n  Text,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport type { OrganizationInfo } from \"../api/endpoint.js\";\nimport cx from \"clsx\";\nimport {\n  getDomProps,\n  isPromiseLike,\n  type WidgetRootDomProps,\n  type WidgetRootState,\n} from \"./utils.js\";\nimport { getErrorMessage } from \"./generic-error.js\";\nimport {\n  Button,\n  type ButtonProps,\n  Skeleton,\n  DropdownMenu,\n} from \"./elements.js\";\nimport { unstable_useWidgetsInvalidator as useWidgetsInvalidator } from \"../utils.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ntype OrganizationSwitcherVariant = \"ghost\" | \"outline\";\n\n// Rename all uses of `org` to `organization`\ninterface OrganizationSwitcherPassthroughProps extends WidgetRootDomProps {\n  switchToOrganization: ({\n    organizationId,\n  }: {\n    organizationId: string;\n  }) => void | Promise<void>;\n  // Simple props to affect the overall style\n  variant?: OrganizationSwitcherVariant;\n  organizationLabel?: string | null;\n  children?: React.ReactNode;\n  /**\n   * Choose where to truncate organization name in the trigger and dropdown\n   * items.\n   *\n   * - `right`: Truncate the right side of the organization name\n   * - `middle`: Truncate the middle of the organization name, trying to keep\n   *  words whole\n   */\n  truncateBehavior?: \"right\" | \"middle\";\n}\n\ninterface OrganizationSwitcherProps\n  extends OrganizationSwitcherPassthroughProps {\n  organizations: OrganizationInfo[];\n}\n\nconst OrganizationSwitcher: React.FC<OrganizationSwitcherProps> = ({\n  organizations,\n  switchToOrganization,\n  variant,\n  organizationLabel = \"Organizations\",\n  truncateBehavior = \"right\",\n  children,\n  ...domProps\n}) => {\n  const currentOrganization = organizations.find(\n    (organization) => organization.current,\n  );\n  const invalidateAllWidgets = useWidgetsInvalidator();\n\n  // TODO: Possible if the user has no organizations - we should figure out what\n  // to do in this case\n  if (!currentOrganization) {\n    return null;\n  }\n\n  return (\n    <DropdownMenu.Root>\n      <DropdownMenu.Trigger>\n        <Button\n          variant=\"secondary\"\n          {...mapVariantProps(variant)}\n          {...getWidgetRootDomProps(\"resolved\", {\n            ...domProps,\n            // TODO: Remove `OrganizationSwitcherTrigger` in the next major\n            // version. This should follow conventions of all other widgets\n            // using classnames in getWidgetRootDomProps.\n            className: cx(domProps.className, \"OrganizationSwitcherTrigger\"),\n          })}\n        >\n          <Flex\n            align=\"center\"\n            justify=\"between\"\n            gap=\"2\"\n            flexGrow=\"1\"\n            overflow=\"hidden\"\n            minWidth=\"0\"\n          >\n            <TruncatedOrganizationName\n              organizationName={currentOrganization.name}\n              truncateBehavior={truncateBehavior}\n            />\n            <Flex asChild flexShrink=\"0\">\n              <DropdownMenu.TriggerIcon />\n            </Flex>\n          </Flex>\n        </Button>\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content>\n        <DropdownMenu.Group>\n          {organizationLabel ? (\n            <DropdownMenu.Label>\n              <Text>{organizationLabel}</Text>\n            </DropdownMenu.Label>\n          ) : null}\n          {organizations.map((organization) => (\n            <Flex\n              key={organization.id}\n              asChild\n              pr=\"2\"\n              maxWidth=\"280px\"\n              minWidth=\"180px\"\n            >\n              <DropdownMenu.Item\n                onClick={() => {\n                  if (organization.id !== currentOrganization.id) {\n                    const result = switchToOrganization({\n                      organizationId: organization.id,\n                    });\n                    if (isPromiseLike(result)) {\n                      result.then(invalidateAllWidgets);\n                    } else {\n                      invalidateAllWidgets();\n                    }\n                  }\n                }}\n              >\n                <Flex\n                  justify=\"between\"\n                  align=\"center\"\n                  gap=\"4\"\n                  flexGrow=\"1\"\n                  overflow=\"hidden\"\n                >\n                  <TruncatedOrganizationName\n                    organizationName={organization.name}\n                    truncateBehavior={truncateBehavior}\n                  />\n                  {organization.current && (\n                    <VisuallyHidden>\n                      <Translation\n                        defaultMessage=\"(current)\"\n                        id=\"daFXTP\"\n                        description=\"Label for screen readers indicating current organization\"\n                      />\n                    </VisuallyHidden>\n                  )}\n                  <Flex\n                    aria-hidden\n                    align=\"center\"\n                    justify=\"center\"\n                    flexShrink=\"0\"\n                  >\n                    {organization.current ? (\n                      <CheckIcon width=\"18px\" height=\"18px\" />\n                    ) : (\n                      // make the extra space for\n                      <Box width=\"18px\" height=\"18px\" />\n                    )}\n                  </Flex>\n                </Flex>\n              </DropdownMenu.Item>\n            </Flex>\n          ))}\n        </DropdownMenu.Group>\n        {children}\n      </DropdownMenu.Content>\n    </DropdownMenu.Root>\n  );\n};\n\ninterface OrganizationSwitcherLoadingProps extends WidgetRootDomProps {\n  variant?: OrganizationSwitcherVariant;\n}\n\nconst OrganizationSwitcherLoading: React.FC<\n  OrganizationSwitcherLoadingProps\n> = ({ variant, ...props }: OrganizationSwitcherLoadingProps) => {\n  return (\n    // Always need DropdownMenu.Root to wrap children than may include\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"loading\", props)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Skeleton>\n          {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n          <Text>Loading...</Text>\n        </Skeleton>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n};\n\ninterface OrganizationSwitcherErrorProps extends WidgetRootDomProps {\n  error: unknown;\n  variant?: OrganizationSwitcherVariant;\n}\n\nfunction OrganizationSwitcherError({\n  error,\n  variant,\n  ...domProps\n}: OrganizationSwitcherErrorProps) {\n  const translate = useTranslation();\n  const { heading } = getErrorMessage(error, translate);\n\n  return (\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"error\", domProps)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Text>{heading}</Text>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n}\n\nconst MAX_TRUNCATED_SUFFIX_LENGTH = 10;\nconst MIN_TRUNCATED_SUFFIX_LENGTH = 3;\n\nconst WHITE_SPACE_REGEX = /\\s/;\n\nconst getSplitPosition = (organizationName: string) => {\n  if (organizationName.length <= MAX_TRUNCATED_SUFFIX_LENGTH) {\n    return organizationName.length;\n  }\n\n  for (\n    let i = organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n    i < organizationName.length - MIN_TRUNCATED_SUFFIX_LENGTH;\n    i++\n  ) {\n    if (WHITE_SPACE_REGEX.test(organizationName[i - 1])) {\n      return i;\n    }\n  }\n\n  return organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n};\n\nconst splitOrganizationName = (organizationName: string) => {\n  const splitPosition = getSplitPosition(organizationName);\n  return [\n    organizationName.slice(0, splitPosition),\n    organizationName.slice(splitPosition),\n  ];\n};\n\nconst TruncatedOrganizationName = ({\n  organizationName,\n  truncateBehavior,\n}: {\n  organizationName: string;\n  truncateBehavior: \"right\" | \"middle\";\n}) => {\n  if (truncateBehavior === \"right\") {\n    return <Text truncate>{organizationName}</Text>;\n  }\n\n  const [organizationNameLeft, organizationNameRight] =\n    splitOrganizationName(organizationName);\n\n  return (\n    <Flex overflow=\"hidden\">\n      <VisuallyHidden>\n        <Text>{organizationName}</Text>\n      </VisuallyHidden>\n      <Text aria-hidden truncate style={{ whiteSpace: \"pre\" }}>\n        {organizationNameLeft}\n      </Text>\n      <Text aria-hidden>{organizationNameRight}</Text>\n    </Flex>\n  );\n};\n\nfunction mapVariantProps(variant?: OrganizationSwitcherVariant): ButtonProps {\n  const variantProps: ButtonProps = {};\n  // Passing `undefined` to the variant prop will result in overrides to props we\n  // set internally. This should be addressed in Radix Themes, but we can\n  // explicitly set it only when it's provided and _not_ undefined.\n  if (variant) {\n    variantProps.unsafe_radixVariant = variant;\n  }\n  return variantProps;\n}\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"organization-switcher\",\n    widgetState: state,\n  });\n}\n\nexport type {\n  OrganizationSwitcherProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherErrorProps,\n  /** @internal */\n  OrganizationSwitcherPassthroughProps,\n};\nexport {\n  OrganizationSwitcher,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcherError,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA4FU;AA1FV,yBAA0B;AAC1B,oBAMO;AAEP,kBAAe;AACf,mBAKO;AACP,2BAAgC;AAChC,sBAKO;AACP,IAAAA,gBAAwE;AACxE,yBAA4B;AAC5B,6BAA+B;AA+B/B,MAAM,uBAA4D,CAAC;AAAA,EACjE;AAAA,EACA;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB,mBAAmB;AAAA,EACnB;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,sBAAsB,cAAc;AAAA,IACxC,CAAC,iBAAiB,aAAa;AAAA,EACjC;AACA,QAAM,2BAAuB,cAAAC,gCAAsB;AAInD,MAAI,CAAC,qBAAqB;AACxB,WAAO;AAAA,EACT;AAEA,SACE,6CAAC,6BAAa,MAAb,EACC;AAAA,gDAAC,6BAAa,SAAb,EACC;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACP,GAAG,gBAAgB,OAAO;AAAA,QAC1B,GAAG,sBAAsB,YAAY;AAAA,UACpC,GAAG;AAAA;AAAA;AAAA;AAAA,UAIH,eAAW,YAAAC,SAAG,SAAS,WAAW,6BAA6B;AAAA,QACjE,CAAC;AAAA,QAED;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN,SAAQ;AAAA,YACR,KAAI;AAAA,YACJ,UAAS;AAAA,YACT,UAAS;AAAA,YACT,UAAS;AAAA,YAET;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,kBAAkB,oBAAoB;AAAA,kBACtC;AAAA;AAAA,cACF;AAAA,cACA,4CAAC,sBAAK,SAAO,MAAC,YAAW,KACvB,sDAAC,6BAAa,aAAb,EAAyB,GAC5B;AAAA;AAAA;AAAA,QACF;AAAA;AAAA,IACF,GACF;AAAA,IACA,6CAAC,6BAAa,SAAb,EACC;AAAA,mDAAC,6BAAa,OAAb,EACE;AAAA,4BACC,4CAAC,6BAAa,OAAb,EACC,sDAAC,sBAAM,6BAAkB,GAC3B,IACE;AAAA,QACH,cAAc,IAAI,CAAC,iBAClB;AAAA,UAAC;AAAA;AAAA,YAEC,SAAO;AAAA,YACP,IAAG;AAAA,YACH,UAAS;AAAA,YACT,UAAS;AAAA,YAET;AAAA,cAAC,6BAAa;AAAA,cAAb;AAAA,gBACC,SAAS,MAAM;AACb,sBAAI,aAAa,OAAO,oBAAoB,IAAI;AAC9C,0BAAM,SAAS,qBAAqB;AAAA,sBAClC,gBAAgB,aAAa;AAAA,oBAC/B,CAAC;AACD,4BAAI,4BAAc,MAAM,GAAG;AACzB,6BAAO,KAAK,oBAAoB;AAAA,oBAClC,OAAO;AACL,2CAAqB;AAAA,oBACvB;AAAA,kBACF;AAAA,gBACF;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,SAAQ;AAAA,oBACR,OAAM;AAAA,oBACN,KAAI;AAAA,oBACJ,UAAS;AAAA,oBACT,UAAS;AAAA,oBAET;AAAA;AAAA,wBAAC;AAAA;AAAA,0BACC,kBAAkB,aAAa;AAAA,0BAC/B;AAAA;AAAA,sBACF;AAAA,sBACC,aAAa,WACZ,4CAAC,gCACC;AAAA,wBAAC;AAAA;AAAA,0BACC,gBAAe;AAAA,0BACf,IAAG;AAAA,0BACH,aAAY;AAAA;AAAA,sBACd,GACF;AAAA,sBAEF;AAAA,wBAAC;AAAA;AAAA,0BACC,eAAW;AAAA,0BACX,OAAM;AAAA,0BACN,SAAQ;AAAA,0BACR,YAAW;AAAA,0BAEV,uBAAa,UACZ,4CAAC,gCAAU,OAAM,QAAO,QAAO,QAAO;AAAA;AAAA,4BAGtC,4CAAC,qBAAI,OAAM,QAAO,QAAO,QAAO;AAAA;AAAA;AAAA,sBAEpC;AAAA;AAAA;AAAA,gBACF;AAAA;AAAA,YACF;AAAA;AAAA,UAtDK,aAAa;AAAA,QAuDpB,CACD;AAAA,SACH;AAAA,MACC;AAAA,OACH;AAAA,KACF;AAEJ;AAMA,MAAM,8BAEF,CAAC,EAAE,SAAS,GAAG,MAAM,MAAwC;AAC/D;AAAA;AAAA,IAEE;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,UAAQ;AAAA,QACP,GAAG,gBAAgB,OAAO;AAAA,QAC1B,GAAG,sBAAsB,WAAW,KAAK;AAAA,QAE1C,uDAAC,sBAAK,OAAM,UAAS,KAAI,KACvB;AAAA,sDAAC,4BAEC,sDAAC,sBAAK,wBAAU,GAClB;AAAA,UACA,4CAAC,iCAAgB;AAAA,WACnB;AAAA;AAAA,IACF;AAAA;AAEJ;AAOA,SAAS,0BAA0B;AAAA,EACjC;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAmC;AACjC,QAAM,gBAAY,uCAAe;AACjC,QAAM,EAAE,QAAQ,QAAI,sCAAgB,OAAO,SAAS;AAEpD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,UAAQ;AAAA,MACP,GAAG,gBAAgB,OAAO;AAAA,MAC1B,GAAG,sBAAsB,SAAS,QAAQ;AAAA,MAE3C,uDAAC,sBAAK,OAAM,UAAS,KAAI,KACvB;AAAA,oDAAC,sBAAM,mBAAQ;AAAA,QACf,4CAAC,iCAAgB;AAAA,SACnB;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AAEpC,MAAM,oBAAoB;AAE1B,MAAM,mBAAmB,CAAC,qBAA6B;AACrD,MAAI,iBAAiB,UAAU,6BAA6B;AAC1D,WAAO,iBAAiB;AAAA,EAC1B;AAEA,WACM,IAAI,iBAAiB,SAAS,6BAClC,IAAI,iBAAiB,SAAS,6BAC9B,KACA;AACA,QAAI,kBAAkB,KAAK,iBAAiB,IAAI,CAAC,CAAC,GAAG;AACnD,aAAO;AAAA,IACT;AAAA,EACF;AAEA,SAAO,iBAAiB,SAAS;AACnC;AAEA,MAAM,wBAAwB,CAAC,qBAA6B;AAC1D,QAAM,gBAAgB,iBAAiB,gBAAgB;AACvD,SAAO;AAAA,IACL,iBAAiB,MAAM,GAAG,aAAa;AAAA,IACvC,iBAAiB,MAAM,aAAa;AAAA,EACtC;AACF;AAEA,MAAM,4BAA4B,CAAC;AAAA,EACjC;AAAA,EACA;AACF,MAGM;AACJ,MAAI,qBAAqB,SAAS;AAChC,WAAO,4CAAC,sBAAK,UAAQ,MAAE,4BAAiB;AAAA,EAC1C;AAEA,QAAM,CAAC,sBAAsB,qBAAqB,IAChD,sBAAsB,gBAAgB;AAExC,SACE,6CAAC,sBAAK,UAAS,UACb;AAAA,gDAAC,gCACC,sDAAC,sBAAM,4BAAiB,GAC1B;AAAA,IACA,4CAAC,sBAAK,eAAW,MAAC,UAAQ,MAAC,OAAO,EAAE,YAAY,MAAM,GACnD,gCACH;AAAA,IACA,4CAAC,sBAAK,eAAW,MAAE,iCAAsB;AAAA,KAC3C;AAEJ;AAEA,SAAS,gBAAgB,SAAoD;AAC3E,QAAM,eAA4B,CAAC;AAInC,MAAI,SAAS;AACX,iBAAa,sBAAsB;AAAA,EACrC;AACA,SAAO;AACT;AAEA,SAAS,sBACP,OACA,UACA;AACA,aAAO,0BAAY;AAAA,IACjB,GAAG;AAAA,IACH,cAAc;AAAA,IACd,UAAU;AAAA,IACV,aAAa;AAAA,EACf,CAAC;AACH;","names":["import_utils","useWidgetsInvalidator","cx"]}
+{"version":3,"sources":["../../../src/lib/organization-switcher.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon } from \"@radix-ui/react-icons\";\nimport {\n  Box,\n  ChevronDownIcon,\n  Flex,\n  Text,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport type { OrganizationInfo } from \"../api/endpoint.js\";\nimport cx from \"clsx\";\nimport {\n  getDomProps,\n  isPromiseLike,\n  type WidgetRootDomProps,\n  type WidgetRootState,\n} from \"./utils.js\";\nimport { getErrorMessage } from \"./generic-error.js\";\nimport {\n  Button,\n  type ButtonProps,\n  Skeleton,\n  DropdownMenu,\n} from \"./elements.js\";\nimport { unstable_useWidgetsInvalidator as useWidgetsInvalidator } from \"../utils.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ntype OrganizationSwitcherVariant = \"ghost\" | \"outline\";\n\n// Rename all uses of `org` to `organization`\ninterface OrganizationSwitcherPassthroughProps extends WidgetRootDomProps {\n  switchToOrganization: ({\n    organizationId,\n  }: {\n    organizationId: string;\n  }) => void | Promise<void>;\n  // Simple props to affect the overall style\n  variant?: OrganizationSwitcherVariant;\n  organizationLabel?: string | null;\n  children?: React.ReactNode;\n  /**\n   * Choose where to truncate organization name in the trigger and dropdown\n   * items.\n   *\n   * - `right`: Truncate the right side of the organization name\n   * - `middle`: Truncate the middle of the organization name, trying to keep\n   *  words whole\n   */\n  truncateBehavior?: \"right\" | \"middle\";\n}\n\ninterface OrganizationSwitcherProps extends OrganizationSwitcherPassthroughProps {\n  organizations: OrganizationInfo[];\n}\n\nconst OrganizationSwitcher: React.FC<OrganizationSwitcherProps> = ({\n  organizations,\n  switchToOrganization,\n  variant,\n  organizationLabel = \"Organizations\",\n  truncateBehavior = \"right\",\n  children,\n  ...domProps\n}) => {\n  const currentOrganization = organizations.find(\n    (organization) => organization.current,\n  );\n  const invalidateAllWidgets = useWidgetsInvalidator();\n\n  // TODO: Possible if the user has no organizations - we should figure out what\n  // to do in this case\n  if (!currentOrganization) {\n    return null;\n  }\n\n  return (\n    <DropdownMenu.Root>\n      <DropdownMenu.Trigger>\n        <Button\n          variant=\"secondary\"\n          {...mapVariantProps(variant)}\n          {...getWidgetRootDomProps(\"resolved\", {\n            ...domProps,\n            // TODO: Remove `OrganizationSwitcherTrigger` in the next major\n            // version. This should follow conventions of all other widgets\n            // using classnames in getWidgetRootDomProps.\n            className: cx(domProps.className, \"OrganizationSwitcherTrigger\"),\n          })}\n        >\n          <Flex\n            align=\"center\"\n            justify=\"between\"\n            gap=\"2\"\n            flexGrow=\"1\"\n            overflow=\"hidden\"\n            minWidth=\"0\"\n          >\n            <TruncatedOrganizationName\n              organizationName={currentOrganization.name}\n              truncateBehavior={truncateBehavior}\n            />\n            <Flex asChild flexShrink=\"0\">\n              <DropdownMenu.TriggerIcon />\n            </Flex>\n          </Flex>\n        </Button>\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content>\n        <DropdownMenu.Group>\n          {organizationLabel ? (\n            <DropdownMenu.Label>\n              <Text>{organizationLabel}</Text>\n            </DropdownMenu.Label>\n          ) : null}\n          {organizations.map((organization) => (\n            <Flex\n              key={organization.id}\n              asChild\n              pr=\"2\"\n              maxWidth=\"280px\"\n              minWidth=\"180px\"\n            >\n              <DropdownMenu.Item\n                onClick={() => {\n                  if (organization.id !== currentOrganization.id) {\n                    const result = switchToOrganization({\n                      organizationId: organization.id,\n                    });\n                    if (isPromiseLike(result)) {\n                      result.then(invalidateAllWidgets);\n                    } else {\n                      invalidateAllWidgets();\n                    }\n                  }\n                }}\n              >\n                <Flex\n                  justify=\"between\"\n                  align=\"center\"\n                  gap=\"4\"\n                  flexGrow=\"1\"\n                  overflow=\"hidden\"\n                >\n                  <TruncatedOrganizationName\n                    organizationName={organization.name}\n                    truncateBehavior={truncateBehavior}\n                  />\n                  {organization.current && (\n                    <VisuallyHidden>\n                      <Translation\n                        defaultMessage=\"(current)\"\n                        id=\"daFXTP\"\n                        description=\"Label for screen readers indicating current organization\"\n                      />\n                    </VisuallyHidden>\n                  )}\n                  <Flex\n                    aria-hidden\n                    align=\"center\"\n                    justify=\"center\"\n                    flexShrink=\"0\"\n                  >\n                    {organization.current ? (\n                      <CheckIcon width=\"18px\" height=\"18px\" />\n                    ) : (\n                      // make the extra space for\n                      <Box width=\"18px\" height=\"18px\" />\n                    )}\n                  </Flex>\n                </Flex>\n              </DropdownMenu.Item>\n            </Flex>\n          ))}\n        </DropdownMenu.Group>\n        {children}\n      </DropdownMenu.Content>\n    </DropdownMenu.Root>\n  );\n};\n\ninterface OrganizationSwitcherLoadingProps extends WidgetRootDomProps {\n  variant?: OrganizationSwitcherVariant;\n}\n\nconst OrganizationSwitcherLoading: React.FC<\n  OrganizationSwitcherLoadingProps\n> = ({ variant, ...props }: OrganizationSwitcherLoadingProps) => {\n  return (\n    // Always need DropdownMenu.Root to wrap children than may include\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"loading\", props)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Skeleton>\n          {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n          <Text>Loading...</Text>\n        </Skeleton>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n};\n\ninterface OrganizationSwitcherErrorProps extends WidgetRootDomProps {\n  error: unknown;\n  variant?: OrganizationSwitcherVariant;\n}\n\nfunction OrganizationSwitcherError({\n  error,\n  variant,\n  ...domProps\n}: OrganizationSwitcherErrorProps) {\n  const translate = useTranslation();\n  const { heading } = getErrorMessage(error, translate);\n\n  return (\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"error\", domProps)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Text>{heading}</Text>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n}\n\nconst MAX_TRUNCATED_SUFFIX_LENGTH = 10;\nconst MIN_TRUNCATED_SUFFIX_LENGTH = 3;\n\nconst WHITE_SPACE_REGEX = /\\s/;\n\nconst getSplitPosition = (organizationName: string) => {\n  if (organizationName.length <= MAX_TRUNCATED_SUFFIX_LENGTH) {\n    return organizationName.length;\n  }\n\n  for (\n    let i = organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n    i < organizationName.length - MIN_TRUNCATED_SUFFIX_LENGTH;\n    i++\n  ) {\n    if (WHITE_SPACE_REGEX.test(organizationName[i - 1])) {\n      return i;\n    }\n  }\n\n  return organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n};\n\nconst splitOrganizationName = (organizationName: string) => {\n  const splitPosition = getSplitPosition(organizationName);\n  return [\n    organizationName.slice(0, splitPosition),\n    organizationName.slice(splitPosition),\n  ];\n};\n\nconst TruncatedOrganizationName = ({\n  organizationName,\n  truncateBehavior,\n}: {\n  organizationName: string;\n  truncateBehavior: \"right\" | \"middle\";\n}) => {\n  if (truncateBehavior === \"right\") {\n    return <Text truncate>{organizationName}</Text>;\n  }\n\n  const [organizationNameLeft, organizationNameRight] =\n    splitOrganizationName(organizationName);\n\n  return (\n    <Flex overflow=\"hidden\">\n      <VisuallyHidden>\n        <Text>{organizationName}</Text>\n      </VisuallyHidden>\n      <Text aria-hidden truncate style={{ whiteSpace: \"pre\" }}>\n        {organizationNameLeft}\n      </Text>\n      <Text aria-hidden>{organizationNameRight}</Text>\n    </Flex>\n  );\n};\n\nfunction mapVariantProps(variant?: OrganizationSwitcherVariant): ButtonProps {\n  const variantProps: ButtonProps = {};\n  // Passing `undefined` to the variant prop will result in overrides to props we\n  // set internally. This should be addressed in Radix Themes, but we can\n  // explicitly set it only when it's provided and _not_ undefined.\n  if (variant) {\n    variantProps.unsafe_radixVariant = variant;\n  }\n  return variantProps;\n}\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"organization-switcher\",\n    widgetState: state,\n  });\n}\n\nexport type {\n  OrganizationSwitcherProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherErrorProps,\n  /** @internal */\n  OrganizationSwitcherPassthroughProps,\n};\nexport {\n  OrganizationSwitcher,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcherError,\n};\n"],"mappings":"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","names":["import_utils","useWidgetsInvalidator","cx"]}

package/dist/cjs/lib/otp-input.cjs

@@ -34,9 +34,8 @@ __export(otp_input_exports, {
 });
 module.exports = __toCommonJS(otp_input_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react_compose_refs = require("@radix-ui/react-compose-refs");
-var import_react_use_controllable_state = require("@radix-ui/react-use-controllable-state");
-var Form = __toESM(require("@radix-ui/react-form"), 1);
+var import_internal = require("radix-ui/internal");
+var import_radix_ui = require("radix-ui");
 var import_themes = require("@radix-ui/themes");
 var React = __toESM(require("react"), 1);
 var import_elements = require("./elements.js");
@@ -57,7 +56,7 @@ const Root = React.forwardRef(
     const [lastCharIndex, setLastCharIndex] = React.useState(0);
     const [allChildrenAdded, setAllChildrenAdded] = React.useState(false);
     const childCount = React.Children.count(children);
-    const [value, setValue] = (0, import_react_use_controllable_state.useControllableState)({
+    const [value, setValue] = (0, import_internal.useControllableState)({
       prop: getValueAsArray(valueProp, childCount),
       defaultProp: getValueAsArray(defaultValue, childCount) ?? [],
       onChange: (value2) => onValueChange?.(value2.join(""))
@@ -144,7 +143,7 @@ const Root = React.forwardRef(
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             "input",
             {
-              ref: (0, import_react_compose_refs.composeRefs)(forwardedRef, hiddenInputRef),
+              ref: (0, import_internal.composeRefs)(forwardedRef, hiddenInputRef),
               defaultValue: value?.join(""),
               minLength: childCount,
               name,
@@ -160,14 +159,14 @@ const Input = React.forwardRef(
   function Input2({ style, readOnly, autoComplete = "off", ...props }, forwardedRef) {
     const otpContext = useOptContext();
     const inputRef = React.useRef(null);
-    const composedInputRef = (0, import_react_compose_refs.useComposedRefs)(
+    const composedInputRef = (0, import_internal.useComposedRefs)(
       forwardedRef,
       inputRef,
       otpContext.onChildAdd
     );
     const index = Number(inputRef.current?.dataset.index ?? -1);
     const char = otpContext.value[index] ?? "";
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Field, { name: `otp-${index}`, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Field, { name: `otp-${index}`, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Form.Control, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_elements.TextField,
       {
         ref: composedInputRef,