docs: add version number to documentation homepage

# Description

This PR aims to close #513 by making changes to dynamically add release
versions into the markdown documentation.

<!-- Include a summary of the change made and also list the dependencies
that are required if any -->

Fixes #513

<!-- Specify above which issue this fixes by referencing the issue
number (`#<ISSUE_NUMBER>`) or issue URL. -->
<!-- Example: Fixes
https://github.com/cloudinary-community/next-cloudinary/issues/<ISSUE_NUMBER>
-->

## Type of change

<!-- Please select all options that are applicable. -->

- [ ] Bug fix (non-breaking change which fixes an issue)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to not work as expected)
- [x] Fix or improve the documentation
- [x] This change requires a documentation update


# Checklist

<!-- These must all be followed and checked. -->

- [x] I have followed the contributing guidelines of this project as
mentioned in [CONTRIBUTING.md](/CONTRIBUTING.md)
- [x] I have created an
[issue](https://github.com/cloudinary-community/next-cloudinary/issues)
ticket for this PR
- [x] I have checked to ensure there aren't other open [Pull
Requests](https://github.com/cloudinary-community/next-cloudinary/pulls)
for the same update/change?
- [x] I have performed a self-review of my own code
- [x] I have run tests locally to ensure they all pass
- [x] I have commented my code, particularly in hard-to-understand areas
- [x] I have made corresponding changes needed to the documentation

README.md

@@ -4,19 +4,17 @@
   <img alt="Cloudinary" src="https://user-images.githubusercontent.com/62209650/196528761-a815025a-271a-4d8e-ac7e-cea833728bf9.png" align="center" height=30>
 </picture>
 &ensp;&ensp;
-<picture style="padding: 30px">
-  <source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/62209650/196529551-917766a7-6d73-4a0b-9f80-db31ac62358f.png" align="center" height=30>
-  <source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/62209650/196529695-8c260b0b-b5e6-44ae-bf71-db3c28534b20.png" align="center" height=30>
-  <img alt="Nextjs" src="https://user-images.githubusercontent.com/62209650/196529695-8c260b0b-b5e6-44ae-bf71-db3c28534b20.png" align="center" height=30>
-</picture>
 
 ######
 
 <a href="https://github.com/cloudinary-community/next-cloudinary/actions/workflows/test_and_release.yml"><img alt="GitHub Workflow Status" src="https://img.shields.io/github/actions/workflow/status/cloudinary-community/next-cloudinary/test_and_release.yml?branch=main&label=Test%20%26%20Release&style=flat-square"></a> <a href="https://www.npmjs.com/package/next-cloudinary"><img alt="npm" src="https://img.shields.io/npm/v/next-cloudinary?style=flat-square"></a> <a href="https://bundlephobia.com/package/next-cloudinary"><img alt="npm bundle size" src="https://img.shields.io/bundlephobia/min/next-cloudinary?style=flat-square&label=Minified%20Size"></a> <a href="https://github.com/cloudinary-community/next-cloudinary/blob/main/LICENSE"><img alt="GitHub" src="https://img.shields.io/github/license/cloudinary-community/next-cloudinary?label=License&style=flat-square"></a>
 
-
 # Next Cloudinary
 
+<!-- doc-gen PKGJSON optionOne="hey" -->
+undefined
+<!-- end-doc-gen -->
+
 High-performance image delivery and uploading at scale in Next.js powered by Cloudinary.
 
 <a href="#-features">Features</a> • <a href="#-getting-started">Getting Started</a> • <a href="#%EF%B8%8F-community--support">Community & Support</a> • <a href="#-contributing">Contributing</a>

docs/pages/index.mdx

@@ -1,5 +1,6 @@
 import Head from 'next/head';
 import Link from 'next/link';
+import data from "../../next-cloudinary/package.json"
 
 import { CldImage, CldOgImage } from '../../next-cloudinary';
 
@@ -21,6 +22,11 @@ import Button from '../components/Button';
 <div className="text-center max-w-xl mx-auto mt-14 mb-20 md:mt-36 md:mb-44">
   <h1 className="text-4xl sm:text-5xl md:text-6xl font-bold">Next Cloudinary</h1>
   <p className="text-xl mt-8">High-performance image and video delivery and uploading at scale in Next.js powered by Cloudinary.</p>
+
+  <div>
+    <code className="text-base" > Version: {data.version} </code>
+  </div>
+
   <p className="flex items-center justify-center gap-6 mt-8 px-2">
     {/* Light Mode Image */}
     <CldImage