storyblok · alvarosabu · May 21, 2024 · May 14, 2024 · May 14, 2024 · May 14, 2024
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -0,0 +1,28 @@
+version: 2
+updates:
+  - package-ecosystem: "pnpm"
+    directory: "/"
+    schedule:
+      interval: "daily"
+    commit-message:
+      prefix: fix
+      prefix-development: chore
+      include: scope
+    groups:
+      linting-dx-tools:
+        patterns:
+          - "*lint*" # eslint, eslint-*, vue-eslint-parser, lint-staged, @commitlint/*, @typescript-eslint/*
+          - "prettier"
+          - "husky"
+          - "@vue/tsconfig"
+          - "*babel*" # babel-*, @vue/babel-preset-app, @babel/*
+        update-types:
+          - "minor"
+          - "patch"
+      testing-tools:
+        patterns:
+          - "@vue/test-utils"
+          - "vitest"
+        update-types:
+          - "minor"
+          - "patch"
diff --git a/.github/repo-banner.png b/.github/repo-banner.png
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -0,0 +1,41 @@
+name: Release CI
+
+on:
+  push:
+    branches: [main, next, beta]
+  pull_request:
+    branches: [main, next, beta]
+
+env:
+  PNPM_CACHE_FOLDER: .pnpm-store
+  HUSKY: 0 # Bypass husky commit hook for CI
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [20]
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: pnpm
+      - name: Install dependencies
+        run: pnpm install
+      - name: Build lib
+        run: pnpm run build
+      - name: Test run
+        run: pnpm run test
+      - name: Release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+        run: npx semantic-release@latest
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -0,0 +1,30 @@
+name: Run Tests
+on: [push]
+
+env:
+  PNPM_CACHE_FOLDER: .pnpm-store
+  HUSKY: 0 # Bypass husky commit hook for CI
+
+jobs:
+  test:
+    name: Unit Test
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [20]
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: pnpm
+      - name: Install dependencies
+        run: pnpm install
+      - name: Run Unit Tests
+        run: pnpm run test
diff --git a/README.md b/README.md
@@ -1,16 +1,62 @@
-# Storyblok Richtext Resolver PoC
+![](/.github/repo-banner.png)
 
-This is a proof of concept for a custom resolver for the Storyblok Richtext field. It is based on the [Storyblok Richtext Resolver](https://www.storyblok.com/docs/guide/rich-text-field) documentation.
+<div align="center">
+  <h1>@storyblok/richtext</h1>
+  <p>
+    A custom resolver for the Storyblok Richtext field.
+  </p>
+  <br />
+</div>
 
-- [Proposal and PoC definition](https://www.notion.so/storyblok/RichText-d6334cacdd1946148a3992bcfca851a1?pvs=4)
-- [Results of PoC](https://www.notion.so/storyblok/RichText-d6334cacdd1946148a3992bcfca851a1?pvs=4#37503f50422d41e29760fc5fc0dd91e2)
+<p align="center">
+  <a href="https://npmjs.com/package/@storyblok/richtext">
+    <img src="https://img.shields.io/npm/v/@storyblok/richtext/latest.svg?style=flat-square" alt="Storyblok JS" />
+  </a>
+  <a href="https://npmjs.com/package/@storyblok/richtext" rel="nofollow">
+    <img src="https://img.shields.io/npm/dt/@storyblok/richtext.svg?style=flat-square" alt="npm">
+  </a>
+</p>
 
-## Usage
+<p align="center">
+  <a href="https://discord.gg/jKrbAMz">
+   <img src="https://img.shields.io/discord/700316478792138842?label=Join%20Our%20Discord%20Community&style=appveyor&logo=discord&color=09b3af">
+   </a>
+  <a href="https://twitter.com/intent/follow?screen_name=storyblok">
+    <img src="https://img.shields.io/badge/Follow-%40storyblok-09b3af?style=appveyor&logo=twitter" alt="Follow @Storyblok" />
+  </a>
+  <a href="https://app.storyblok.com/#!/signup?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-richtext">
+    <img src="https://img.shields.io/badge/Try%20Storyblok-Free-09b3af?style=appveyor&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABGdBTUEAALGPC/xhBQAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAHqADAAQAAAABAAAAHgAAAADpiRU/AAACRElEQVRIDWNgGGmAEd3D3Js3LPrP8D8WXZwSPiMjw6qvPoHhyGYwIXNAbGpbCjbzP0MYuj0YFqMroBV/wCxmIeSju64eDNzMBJUxvP/9i2Hnq5cM1devMnz984eQsQwETeRhYWHgIcJiXqC6VHlFBjUeXgav40cIWkz1oLYXFmGwFBImaDFBHyObcOzdW4aSq5eRhRiE2dgYlpuYoYSKJi8vw3GgWnyAJIs/AuPu4scPGObd/fqVQZ+PHy7+6udPOBsXgySLDfn5GRYYmaKYJcXBgWLpsx8/GPa8foWiBhuHJIsl2DkYQqWksZkDFgP5PObcKYYff//iVAOTIDlx/QPqRMb/YSYBaWlOToZIaVkGZmAZSQiQ5OPtwHwacuo4iplMQEu6tXUZMhSUGDiYmBjylFQYvv/7x9B04xqKOnQOyT5GN+Df//8M59ASXKyMHLoyDD5JPtbj42OYrm+EYgg70JfuYuIoYmLs7AwMjIzA+uY/zjAnyWJpDk6GOFnCvrn86SOwmsNtKciVFAc1ileBHFDC67lzG10Yg0+SjzF0ownsf/OaofvOLYaDQJoQIGix94ljv1gIZI8Pv38zPvj2lQWYf3HGKbpDCFp85v07NnRN1OBTPY6JdRSGxcCw2k6sZuLVMZ5AV4s1TozPnGGFKbz+/PE7IJsHmC//MDMyhXBw8e6FyRFLv3Z0/IKuFqvFyIqAzd1PwBzJw8jAGPfVx38JshwlbIygxmYY43/GQmpais0ODDHuzevLMARHBcgIAQAbOJHZW0/EyQAAAABJRU5ErkJggg==" alt="Follow @Storyblok" />
+  </a>
+</p>
+
+
+## 🚀 Usage
+
+> If you are first-time user of the Storyblok, read the [Getting Started](https://www.storyblok.com/docs/guide/getting-started?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-richtext) guide to get a project ready in less than 5 minutes.
+
+
+### Installation
+
+```bash
+npm install @storyblok/richtext
+```
+
+or `yarn`:
+
+```bash
+yarn add @storyblok/richtext
+```
+
+or `pnpm`:
+
+```bash
+pnpm add @storyblok/richtext
+```
 
 ### Basic
 
 ```ts
-import { RichTextResolver } from '@storyblok/richtext-resolver'
+import { RichTextResolver } from '@storyblok/richtext'
 
 const { render } = RichTextResolver()
 
@@ -28,7 +74,7 @@ document.querySelector<HTMLDivElement>('#app')!.innerHTML = `
 To overwrite an existing resolver, you can pass a property called resolvers available on the `RichTextResolver` options.
 
 ```ts
-import { MarkTypes, RichTextResolver } from '@storyblok/richtext-resolver'
+import { MarkTypes, RichTextResolver } from '@storyblok/richtext'
 
 const html = RichTextResolver({
   resolvers: {
@@ -47,7 +93,7 @@ It is possible to ensure correct typing support in a framework-agnostic way by u
 - Vue `VNode`
 - React `React.ReactElement`
 
-This way the `@storyblok/richtext-resolver` is ignorant of framework specific types, avoiding having to import them and having `vue` `react` etc as dependencies.
+This way the `@storyblok/richtext` is ignorant of framework specific types, avoiding having to import them and having `vue` `react` etc as dependencies.
 
 ```ts
 // Vanilla
@@ -146,6 +192,21 @@ To run the tests for the core package:
 pnpm run test
 ```
 
-## License
 
-[MIT](/LICENSE)
+## 🔗 Related Links
+
+- **[Storyblok Technology Hub](https://www.storyblok.com/technologies?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-js)**: Storyblok integrates with every framework so that you are free to choose the best fit for your project. We prepared the technology hub so that you can find selected beginner tutorials, videos, boilerplates, and even cheatsheets all in one place.
+- **[Getting Started](https://www.storyblok.com/docs/guide/getting-started?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-js)**: Get a project ready in less than 5 minutes.
+- **[Storyblok CLI](https://github.com/storyblok/storyblok)**: A simple CLI for scaffolding Storyblok projects and fieldtypes.
+
+## ℹ️ More Resources
+
+### Support
+
+- Bugs or Feature Requests? [Submit an issue](/../../issues/new).
+- Do you have questions about Storyblok or you need help? [Join our Discord Community](https://discord.gg/jKrbAMz).
+
+### Contributing
+
+Please see our [contributing guidelines](https://github.com/storyblok/.github/blob/main/contributing.md) and our [code of conduct](https://www.storyblok.com/trust-center#code-of-conduct?utm_source=github.com&utm_medium=readme&utm_campaign=storyblok-js).
+This project use [semantic-release](https://semantic-release.gitbook.io/semantic-release/) for generate new versions by using commit messages and we use the Angular Convention to naming the commits. Check [this question](https://semantic-release.gitbook.io/semantic-release/support/faq#how-can-i-change-the-type-of-commits-that-trigger-a-release) about it in semantic-release FAQ
diff --git a/package.json b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "@storyblok/richtext-resolver",
+  "name": "@storyblok/richtext",
   "type": "module",
   "version": "0.0.0",
   "packageManager": "[email protected]",
@@ -109,6 +109,19 @@
     "semi": true,
     "singleQuote": false
   },
+  "release": {
+    "branches": [
+      "main",
+      {
+        "name": "next",
+        "prerelease": true
+      },
+      {
+        "name": "beta",
+        "prerelease": true
+      }
+    ]
+  },
   "dependencies": {
     "consola": "^3.2.3"
   }

diff --git a/packages/react/package.json b/packages/react/package.json
@@ -35,7 +35,7 @@
   },
   "dependencies": {
     "@storyblok/react": "^3.0.9",
-    "@storyblok/richtext-resolver": "workspace:^",
+    "@storyblok/richtext": "workspace:^",
     "@vitejs/plugin-react": "^4.2.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"

diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts
@@ -1,7 +1,7 @@
 import React from 'react'
 import { StoryblokComponent } from '@storyblok/react'
-import type { Node, SbRichtextOptions } from '@storyblok/richtext-resolver'
-import { BlockTypes, RichTextResolver } from '@storyblok/richtext-resolver'
+import type { Node, SbRichtextOptions } from '@storyblok/richtext'
+import { BlockTypes, RichTextResolver } from '@storyblok/richtext'
 import SbRichText from './SbRichText'
 
 function componentResolver(node: Node<React.ReactElement>) {

diff --git a/packages/vue/package.json b/packages/vue/package.json
@@ -34,7 +34,7 @@
     "lint:fix": "eslint . --fix"
   },
   "dependencies": {
-    "@storyblok/richtext-resolver": "workspace:^",
+    "@storyblok/richtext": "workspace:^",
     "@storyblok/vue": "^8.0.7",
     "vue": "^3.4.21",
     "vue-router": "^4.3.0"

diff --git a/packages/vue/src/index.ts b/packages/vue/src/index.ts
@@ -2,8 +2,8 @@ import type { VNode } from 'vue'
 import { createTextVNode, h } from 'vue'
 import { RouterLink } from 'vue-router'
 
-import type { Node, NodeResolver, SbRichtextOptions } from '@storyblok/richtext-resolver'
-import { BlockTypes, MarkTypes, RichTextResolver } from '@storyblok/richtext-resolver'
+import type { Node, NodeResolver, SbRichtextOptions } from '@storyblok/richtext'
+import { BlockTypes, MarkTypes, RichTextResolver } from '@storyblok/richtext'
 import { StoryblokComponent } from '@storyblok/vue'
 import SbRichText from './components/SbRichText.vue'
 

diff --git a/playground/react/src/App.tsx b/playground/react/src/App.tsx
@@ -1,4 +1,4 @@
-import { RichTextResolver } from '@storyblok/richtext-resolver'
+import { RichTextResolver } from '@storyblok/richtext'
 import { StoryblokComponent, useStoryblok } from '@storyblok/react'
 import { SbRichText } from '@storyblok/react-richtext'
 import './App.css'

diff --git a/playground/react/vite.config.ts b/playground/react/vite.config.ts
@@ -11,7 +11,7 @@ export default defineConfig({
   ],
   resolve: {
     alias: {
-      '@storyblok/richtext-resolver': resolve(__dirname, '../../src/index.ts'),
+      '@storyblok/richtext': resolve(__dirname, '../../src/index.ts'),
       '@storyblok/react-richtext': resolve(__dirname, '../../packages/react/src/index.ts'),
     },
   },

diff --git a/playground/vanilla/package.json b/playground/vanilla/package.json
@@ -14,7 +14,7 @@
     "vite-plugin-qrcode": "^0.2.3"
   },
   "dependencies": {
-    "@storyblok/richtext-resolver": "workspace:^",
+    "@storyblok/richtext": "workspace:^",
     "storyblok-js-client": "^6.7.1"
   }
 }
diff --git a/playground/vanilla/src/main.ts b/playground/vanilla/src/main.ts
@@ -1,5 +1,5 @@
 import './style.css'
-import { MarkTypes, type Node, RichTextResolver, type SbRichtextOptions } from '@storyblok/richtext-resolver'
+import { MarkTypes, type Node, RichTextResolver, type SbRichtextOptions } from '@storyblok/richtext'
 import StoryblokClient from 'storyblok-js-client'
 
 /* const doc: Node<string> = {

diff --git a/playground/vanilla/vite.config.ts b/playground/vanilla/vite.config.ts
@@ -16,7 +16,7 @@ export default defineConfig({
   },
   resolve: {
     alias: {
-      '@storyblok/richtext-resolver': resolve(__dirname, '../../src/index.ts'),
+      '@storyblok/richtext': resolve(__dirname, '../../src/index.ts'),
     },
   },
 })
diff --git a/playground/vue/package.json b/playground/vue/package.json
@@ -9,7 +9,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@storyblok/richtext-resolver": "workspace:^",
+    "@storyblok/richtext": "workspace:^",
     "@storyblok/vue": "^8.0.7",
     "@storyblok/vue-richtext": "workspace:^",
     "vue": "^3.4.21",

diff --git a/playground/vue/src/components/HomeView.vue b/playground/vue/src/components/HomeView.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { VNode, createTextVNode, h } from 'vue'
-import { BlockTypes, MarkTypes, RichTextResolver, type Node, type SbRichtextOptions} from '@storyblok/richtext-resolver'
+import { BlockTypes, MarkTypes, RichTextResolver, type Node, type SbRichtextOptions} from '@storyblok/richtext'
 import { RouterLink } from 'vue-router'
 import { SbRichText } from '@storyblok/vue-richtext'
 import { useStoryblok } from '@storyblok/vue'

diff --git a/playground/vue/vite.config.ts b/playground/vue/vite.config.ts
@@ -14,7 +14,7 @@ export default defineConfig({
   ],
   resolve: {
     alias: {
-      '@storyblok/richtext-resolver': resolve(__dirname, '../../src/index.ts'),
+      '@storyblok/richtext': resolve(__dirname, '../../src/index.ts'),
       '@storyblok/vue-richtext': resolve(__dirname, '../../packages/vue/src/index.ts'),
     },
   },

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml