init commit

.gitignore

@@ -0,0 +1,4 @@
+node_modules
+.DS_Store
+dist
+*.log

.prettierignore

@@ -0,0 +1,12 @@
+node_modules
+
+packages/**/node_modules
+packages/**/dist
+
+pnpm-lock.yaml
+pnpm-workspace.yaml
+
+LICENSE
+
+*.md
+*.mdx

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "trailingComma": "es5",
+  "semi": false,
+  "singleQuote": true,
+  "endOfLine": "lf",
+  "arrowParens": "avoid"
+}

LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright © 2021 nemurubaka 
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE

README.md

@@ -0,0 +1,116 @@
+# astro-satori
+
+This `Astro` integration brings open graph images to your project, powered by [satori](https://github.com/vercel/satori)
+
+See [example](/packages/playground/)
+
+## Install
+
+```shell
+# Using NPM
+npx astro add astro-satori
+# Using Yarn
+yarn astro add astro-satori
+# Using PNPM
+pnpx astro add astro-satori
+```
+
+## Config
+
+```js
+// astro.config.mjs
+import {defineConfig} from "astro/config"
+import satori from "astro-satori"
+export default defineConfig({
+  integrations: [
+    satori({})
+  ],
+})
+```
+
+#### satoriOptionsFactory
+
+Generate your own `satori` options by passing a function, if you do not provide this option, `astro-satori` will provide you with a default option.
+
+`astro.config.mjs`
+
+```js
+import {defineConfig} from "astro/config"
+import satori from "astro-satori"
+export default defineConfig({
+  integrations: [
+    satori({
+      satoriOptionsFactory: async () => {
+        const fontFileRegular = await fetch(
+          'https://www.1001fonts.com/download/font/ibm-plex-mono.regular.ttf'
+        )
+        const fontRegular: ArrayBuffer = await fontFileRegular.arrayBuffer()
+
+        const fontFileBold = await fetch(
+          'https://www.1001fonts.com/download/font/ibm-plex-mono.bold.ttf'
+        )
+        const fontBold: ArrayBuffer = await fontFileBold.arrayBuffer()
+
+        const options = {
+          width: 1200,
+          height: 630,
+          embedFont: true,
+          fonts: [
+            {
+              name: 'IBM Plex Mono',
+              data: fontRegular,
+              weight: 400,
+              style: 'normal',
+            },
+            {
+              name: 'IBM Plex Mono',
+              data: fontBold,
+              weight: 600,
+              style: 'normal',
+            },
+          ],
+        }
+
+        return options
+      }
+    })
+  ],
+})
+```
+
+#### satoriElement
+
+Generate your own satori Element, if you do not provide this option, `astro-satori` will provide you with a default element.
+
+`astro.config.mjs`
+
+```js
+import {defineConfig} from "astro/config"
+import satori from "astro-satori"
+export default defineConfig({
+  integrations: [
+    satori({
+      satoriElement: ({ title, author, description }) => {
+        return {
+          type: 'div',
+          props: {
+            children: [
+              title,
+              author,
+              description
+            ]
+          }
+        }
+      }
+    })
+  ],
+})
+```
+
+## How to use
+
+see [example](/packages/playground/)
+
+## License
+
+MIT © [nemurubaka](https://github.com/cijiugechu)

package.json

@@ -0,0 +1,43 @@
+{
+  "name": "astro-link-preview-monorepo",
+  "version": "0.0.0",
+  "author": "nemurubaka",
+  "private": true,
+  "description": "",
+  "keywords": [],
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "exports": {
+    "require": "./dist/index.js",
+    "import": "./dist/index.mjs"
+  },
+  "types": "./dist/index.d.ts",
+  "homepage": "https://github.com/jufuku-haijo/ts-lib-starter",
+  "repository": {
+    "type": "git",
+    "url": "[email protected]:jufuku-haijo/ts-lib-starter.git"
+  },
+  "bugs": "https://github.com/jufuku-haijo/ts-lib-starter/issues",
+  "scripts": {
+    "format": "prettier --write . --ignore-unkown",
+    "build:core": "pnpm run --filter astro-link-preview build",
+    "build:playground": "pnpm run --filter playground build",
+    "build": "pnpm run build:core && pnpm run build:playground",
+    "test": "vitest",
+    "test:watch": "vitest -w",
+    "prepublishOnly": "pnpm run build"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "prettier": "^2.8.8",
+    "tsup": "^6.7.0",
+    "typescript": "^4.9.5",
+    "vitest": "^0.31.0"
+  }
+}

packages/core/README.md

@@ -0,0 +1,114 @@
+# astro-satori
+
+This `Astro` integration brings open graph images to your project, powered by [satori](https://github.com/vercel/satori)
+
+## Install
+
+```shell
+# Using NPM
+npx astro add astro-satori
+# Using Yarn
+yarn astro add astro-satori
+# Using PNPM
+pnpx astro add astro-satori
+```
+
+## Config
+
+```js
+// astro.config.mjs
+import {defineConfig} from "astro/config"
+import satori from "astro-satori"
+export default defineConfig({
+  integrations: [
+    satori({})
+  ],
+})
+```
+
+#### satoriOptionsFactory
+
+Generate your own `satori` options by passing a function, if you do not provide this option, `astro-satori` will provide you with a default option.
+
+`astro.config.mjs`
+
+```js
+import {defineConfig} from "astro/config"
+import satori from "astro-satori"
+export default defineConfig({
+  integrations: [
+    satori({
+      satoriOptionsFactory: async () => {
+        const fontFileRegular = await fetch(
+          'https://www.1001fonts.com/download/font/ibm-plex-mono.regular.ttf'
+        )
+        const fontRegular: ArrayBuffer = await fontFileRegular.arrayBuffer()
+
+        const fontFileBold = await fetch(
+          'https://www.1001fonts.com/download/font/ibm-plex-mono.bold.ttf'
+        )
+        const fontBold: ArrayBuffer = await fontFileBold.arrayBuffer()
+
+        const options = {
+          width: 1200,
+          height: 630,
+          embedFont: true,
+          fonts: [
+            {
+              name: 'IBM Plex Mono',
+              data: fontRegular,
+              weight: 400,
+              style: 'normal',
+            },
+            {
+              name: 'IBM Plex Mono',
+              data: fontBold,
+              weight: 600,
+              style: 'normal',
+            },
+          ],
+        }
+
+        return options
+      }
+    })
+  ],
+})
+```
+
+#### satoriElement
+
+Generate your own satori Element, if you do not provide this option, `astro-satori` will provide you with a default element.
+
+`astro.config.mjs`
+
+```js
+import {defineConfig} from "astro/config"
+import satori from "astro-satori"
+export default defineConfig({
+  integrations: [
+    satori({
+      satoriElement: ({ title, author, description }) => {
+        return {
+          type: 'div',
+          props: {
+            children: [
+              title,
+              author,
+              description
+            ]
+          }
+        }
+      }
+    })
+  ],
+})
+```
+
+## How to use
+
+see [example](../playground/)
+
+## License
+
+MIT © [nemurubaka](https://github.com/cijiugechu)

packages/core/component/Link.astro

@@ -0,0 +1,67 @@
+---
+
+import type { HTMLAttributes } from 'astro/types'
+import xxhash from 'xxhash-wasm'
+import './Link.css'
+
+
+export interface Props extends HTMLAttributes<'a'> {
+
+}
+
+
+const { href, ...rest } = Astro.props
+
+
+const stringURL = typeof href === 'string' ? href : href.href
+
+const hashed = (await xxhash()).h32(stringURL)
+
+
+---
+
+<a href={href} data-link-preview={hashed} {...rest}>
+  <slot />
+</a>
+
+<script>
+  const links = document.querySelectorAll('[data-link-preview]')
+
+  links.forEach(item => {
+    item.addEventListener('mouseenter', e => {
+      //@ts-ignore
+      const hashed = item.dataset['linkPreview']
+
+      console.log(hashed)
+
+      let previewElement: HTMLImageElement | null = null
+
+      const el = document.getElementById(`image-${hashed}`) as HTMLImageElement
+
+      if(el) {
+        previewElement = el
+        el.classList.remove('astro-link-preview_img--hidden')
+      }else{
+        previewElement = document.createElement('img')
+        previewElement.src = `${import.meta.env.BASE_URL}${hashed}.png`
+        previewElement.className = 'astro-link-preview_img'
+        previewElement.id = `image-${hashed}`
+        previewElement.style.position = 'fixed'
+        //@ts-ignore
+        previewElement.style.left = `${e.clientX}px`
+        //@ts-ignore
+        previewElement.style.top = `${e.clientY}px`
+      }
+
+      document.body.appendChild(previewElement)
+    })
+
+    item.addEventListener('mouseleave', e => {
+      //@ts-ignore
+      const hashed = item.dataset['linkPreview']
+      const previewElement = document.getElementById(`image-${hashed}`)
+
+      previewElement.classList.add('astro-link-preview_img--hidden')
+    })
+  })
+</script>