how to properly set up path for assets in esbuild

Question

How should I configure path for assets in esbuild? My current config looks like so:

const esbuild = require("esbuild");

esbuild.build({
  bundle: true,
  entryPoints: ["src/index.tsx"],
  outdir: "public/build",
  splitting: true,
  minify: true,
  sourcemap: true,
  format: "esm",
  inject: ["react-shim.js"],
  loader: {
    ".png": "file",
    ".jpg": "file",
    ".jpeg": "file",
    ".svg": "file",
    ".gif": "file",
  },
  assetNames: "[dir]/[name]",
});

I have my files like so: public -> index.html

In public during the build the "build" folder is created and in there I have assets/ and index.js with main.css, esbuild provides this generic placeholders for dirname and filename that you can see by the assetNames prop, and I am expecting that whatever folder holds those files, would be copied with this same name and appended to the path given in outdir. And this is exactly what is happening, but in the browser in Network tab the path to the asset is "...smth/front/public/assets/cart.svg". Build folder is skipped. And when I try to append it to assetNames like so

assetNames: "build/[dir]/[name]",

Then in the build folder there is another build folder created with assets folder and files. Why is it happening this way and what can I do about it? In case it makes a difference I'm using React 18 and typescript. Thanks