shared description

packages/docs/app/root.tsx

@@ -1,3 +1,4 @@
+import packageJson from "reacord/package.json"
 import type { LinksFunction, MetaFunction } from "remix"
 import {
   Links,
@@ -9,12 +10,10 @@ import {
 } from "remix"
 import prismThemeCss from "./prism-theme.css"
 
-export const meta: MetaFunction = () => {
+export const meta: MetaFunction = () => ({
-  return {
   title: "Reacord",
-    description: "Create interactive Discord messages using React and JSX.",
+  description: packageJson.description,
-  }
+})
-}
 
 export const links: LinksFunction = () => [
   { rel: "stylesheet", href: prismThemeCss },

packages/docs/app/routes/index.tsx

@@ -1,3 +1,4 @@
+import packageJson from "reacord/package.json"
 import { Link } from "remix"
 import LandingExample from "~/components/landing-example.mdx"
 
@@ -11,9 +12,7 @@ export default function Landing() {
             <LandingExample />
           </section>
         </div>
-        <p className="px-8 text-2xl font-light">
+        <p className="px-8 text-2xl font-light">{packageJson.description}</p>
-          Create interactive Discord messages using React and JSX.
-        </p>
         <Link
           to="/docs/guides/getting-started"
           className="inline-block px-4 py-3 text-xl transition rounded-lg bg-emerald-700 hover:translate-y-[-2px] hover:bg-emerald-800 hover:shadow-md "

packages/docs/package.json

@@ -17,8 +17,10 @@
     "@tailwindcss/typography": "^0.5.0",
     "autoprefixer": "^10.4.1",
     "clsx": "^1.1.1",
+    "fast-glob": "^3.2.7",
     "gray-matter": "^4.0.3",
     "postcss": "^8.4.5",
+    "reacord": "workspace:*",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "rehype-stringify": "^9.0.2",
@@ -37,7 +39,6 @@
     "@types/react": "^17.0.24",
     "@types/react-dom": "^17.0.9",
     "concurrently": "^6.5.1",
-    "fast-glob": "^3.2.7",
     "prettier": "^2.5.1",
     "rehype-highlight": "^5.0.2",
     "rehype-prism-plus": "^1.1.3",

packages/reacord/package.json

@@ -1,16 +1,22 @@
 {
   "name": "reacord",
   "type": "module",
-  "description": "send reactive discord messages using react components ⚛",
+  "description": "Create interactive Discord messages using React.",
   "version": "0.0.0",
   "types": "./dist/main.d.ts",
   "files": [
     "dist"
   ],
   "exports": {
+    ".": {
       "import": "./dist/main.js",
       "require": "./dist/main.cjs"
     },
+    "./package.json": {
+      "import": "./package.json",
+      "require": "./package.json"
+    }
+  },
   "scripts": {
     "build": "tsup-node library/main.ts --target node16 --format cjs,esm --dts --sourcemap",
     "build-watch": "pnpm build -- --watch",

pnpm-lock.yaml

@@ -51,6 +51,7 @@ importers:
       gray-matter: ^4.0.3
       postcss: ^8.4.5
       prettier: ^2.5.1
+      reacord: workspace:*
       react: ^17.0.2
       react-dom: ^17.0.2
       rehype-highlight: ^5.0.2
@@ -73,8 +74,10 @@ importers:
       '@tailwindcss/typography': 0.5.0_tailwindcss@3.0.8
       autoprefixer: 10.4.1_postcss@8.4.5
       clsx: 1.1.1
+      fast-glob: 3.2.7
       gray-matter: 4.0.3
       postcss: 8.4.5
+      reacord: link:../reacord
       react: 17.0.2
       react-dom: 17.0.2_react@17.0.2
       rehype-stringify: 9.0.2
@@ -92,7 +95,6 @@ importers:
       '@types/react': 17.0.38
       '@types/react-dom': 17.0.11
       concurrently: 6.5.1
-      fast-glob: 3.2.7
       prettier: 2.5.1
       rehype-highlight: 5.0.2
       rehype-prism-plus: 1.1.3