chore: initial commit

.eslintrc

@@ -0,0 +1,5 @@
+{
+  "extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["@typescript-eslint"]
+}

.gitignore

@@ -0,0 +1 @@
+node_modules

.prettierrc

@@ -0,0 +1,19 @@
+{
+  "printWidth": 80,
+  "tabWidth": 2,
+  "semi": true,
+  "singleQuote": false,
+  "trailingComma": "es5",
+  "arrowParens": "always",
+  "plugins": ["prettier-plugin-astro", "prettier-plugin-svelte"],
+  "overrides": [
+    {
+      "files": "*.astro",
+      "options": { "parser": "astro" }
+    },
+    {
+      "files": "*.svelte",
+      "options": { "parser": "svelte" }
+    }
+  ]
+}

README.md

@@ -0,0 +1,178 @@
+# astro-portabletext
+
+[![License: ISC](https://img.shields.io/badge/License-ISC-green.svg)](https://opensource.org/licenses/ISC)
+
+Render [Portable Text](https://portabletext.org/) with [Astro](https://astro.build/).
+
+We have [react-portabletext](https://github.com/portabletext/react-portabletext) and [svelte-portabletext](https://github.com/portabletext/svelte-portabletext) which can be used to output your [Portable Text](https://github.com/portabletext/portabletext) with [Astro](https://astro.build/). Like so...
+
+```js
+/* .astro file */
+---
+import { PortableText } from "@portabletext/react";
+---
+
+<PortableText
+  /* client:{load|idle|visible|media|only} needed for hydration */
+  value={[/* ... */]}
+  components={/* ... */}
+/>
+```
+
+However, it will add bloat if **_only_** one or some of the blocks  need hydration.
+
+
+
+## Install
+```
+npm install astro-portabletext --save-dev
+```
+
+## Usage
+```js
+/* .astro file */
+---
+import { PortableText } from "astro-portabletext";
+---
+
+<PortableText 
+  value={[/* portable text blocks */]} 
+  components={/* custom components */}
+/>
+```
+
+## Default Components
+**astro-portabletext** components will render the following
+```js
+{
+  /* type: Must be defined by you! */,
+  block: {
+    h1: /* <h1 class="..."><slot /></h1> */,
+    h2: /* <h2 class="..."><slot /></h2> */,
+    h3: /* <h3 class="..."><slot /></h3> */,
+    h4: /* <h4 class="..."><slot /></h4> */,
+    h5: /* <h5 class="..."><slot /></h5> */,
+    h6: /* <h6 class="..."><slot /></h6> */,
+    blockquote: /* <blockquote class="..."><slot /></blockquote> */,
+    normal: /* <p class="..."><slot /></p> */
+  },
+  list: /* <ul class="..."><slot /></ul> | <ol class="..."><slot /></ol>*/,
+  listItem: /* <li class="..."><slot /></li> */,
+  mark: {
+    code: /* <code class="..."><slot /></code> */,
+    em: /* <em class="..."><slot /></em> */,
+    link: /* <a href="..." class="..."><slot /></a> */,
+    'strike-through': /* <del class="..."><slot /></del> */,
+    strong: /* <strong class="..."><slot /></strong> */,
+    underline: /* <span class="..." style="text-decoration: underline;"><slot /></span> */
+  },
+  hardBreak: /* <br /> */,
+}
+```
+
+## Merge Components
+
+Keep default components and add to them
+```js
+---
+import { PortableText } from "astro-portabletext";
+import { Unicorn } from "@component/Unicorn";
+import { Dinosaur } from "@component/Dinosaur";
+import { Sunny } from "@component/Sunny";
+import { Highlight } from "@component/Highlight";
+---
+
+<PortableText 
+  value={[/* portable text blocks */]}
+  components={{
+    type: {
+      unicorn: Unicorn,
+      dinosaur: Dinosaur,
+    },
+    block: {
+      sunny: Sunny,
+    },
+    mark: {
+      highlight: Highlight,
+    },
+  }}
+/>
+```
+
+## Overwrite Default Component
+Change some default components like so
+```js
+/* .astro file */
+---
+import { PortableText } from "astro-portabletext";
+import { PageHeading } from "@component/PageHeading";
+---
+
+<PortableText 
+  value={[/* portable text blocks */]}
+  components={{
+    block: {
+      h1: PageHeading,
+    },
+  }}
+/>
+```
+
+## With Handler
+
+Create a handler for better control
+```js
+/* .astro file */
+---
+import { PortableText } from "astro-portabletext";
+import { Type } from "@handler/Type"
+import { Block } from "@handler/Block"
+import { Mark } from "@handler/Mark"
+---
+
+<PortableText 
+  value={[/* portable text blocks */]}
+  components={{
+    type: Type,
+    block: Block,
+    mark: Mark
+  }}
+/>
+```
+
+## Using `<style>` in Astro component
+```js
+/* .astro file */
+---
+import { PortableText } from "astro-portabletext";
+import { Unicorn } from "@component/Unicorn";
+---
+
+<PortableText 
+  value={[/* portable text blocks */]} 
+  components={{
+    type: {
+      unicorn: Unicorn
+    }
+  }}
+/>
+
+<style>
+  .unicorn {/* some values */}
+</style>
+```
+
+```js
+/* @component/Unicorn.tsx */
+import type { PtTypeComponentProps } from "astro-portabletext";
+
+export function Unicorn(props: PtTypeComponentProps) {
+  const { astroClass = "" } = props;
+
+  return (
+    <div className={`unicorn ${astroClass}`}>
+      /* ... */
+    </div>
+  )
+}
+```

demo/.gitignore

@@ -0,0 +1,20 @@
+# build output
+dist/
+.output/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store

demo/.npmrc

@@ -0,0 +1,2 @@
+# Expose Astro dependencies for `pnpm` users
+shamefully-hoist=true

demo/.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}

demo/.vscode/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}

demo/README.md

@@ -0,0 +1,42 @@
+# Welcome to [Astro](https://astro.build)
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/starter)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro project, you'll see the following folders and files:
+
+```
+/
+├── public/
+│   └── favicon.ico
+├── src/
+│   ├── components/
+│   │   └── Layout.astro
+│   └── pages/
+│       └── index.astro
+└── package.json
+```
+
+Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
+
+There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components or layouts.
+
+Any static assets, like images, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command           | Action                                       |
+| :---------------- | :------------------------------------------- |
+| `npm install`     | Installs dependencies                        |
+| `npm run dev`     | Starts local dev server at `localhost:3000`  |
+| `npm run build`   | Build your production site to `./dist/`      |
+| `npm run preview` | Preview your build locally, before deploying |
+
+## 👀 Want to learn more?
+
+Feel free to check [our documentation](https://github.com/withastro/astro) or jump into our [Discord server](https://astro.build/chat).

demo/astro.config.mjs

@@ -0,0 +1,8 @@
+import { defineConfig } from 'astro/config';
+import solid from '@astrojs/solid-js';
+import svelte from '@astrojs/svelte';
+
+// https://astro.build/config
+export default defineConfig({
+  integrations: [solid(), svelte()],
+});

demo/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@example/basics",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "dev": "astro dev",
+    "start": "astro dev",
+    "build": "astro build",
+    "preview": "astro preview"
+  },
+  "devDependencies": {
+    "@astrojs/solid-js": "^0.1.2",
+    "@astrojs/svelte": "^0.1.2",
+    "astro": "^1.0.0-beta.20",
+    "astro-portabletext": "workspace:*",
+    "solid-js": "^1.3.17",
+    "svelte": "^3.48.0"
+  }
+}