diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml new file mode 100644 index 0000000..b7dd39a --- /dev/null +++ b/.github/workflows/publish.yml @@ -0,0 +1,22 @@ +name: Publish to NPM +on: + release: + types: [created] +jobs: + build: + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v3 + - name: Setup Node + uses: actions/setup-node@v3 + with: + node-version: '14.x' + cache: 'yarn' + registry-url: 'https://registry.npmjs.org' + - name: Install dependencies and build 🔧 + run: yarn install && yarn build + - name: Publish package on NPM 📦 + run: yarn publish + env: + NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} diff --git a/CHANGELOG.md b/CHANGELOG.md index 50ed8d1..ddbee7c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,12 @@ All notable changes to this project will be documented in this file. +## [4.1.0] - 2022-06-23 + +- Allows `react-markdown v8` and `chakra-ui v2` (#27, thanks [@baartch](https://github.com/baartch)) +- Updates deprecated `d=...` property to `display=...` property. +- Changes type definition of first parameter. `heading` is not accepted as a property anymore since it isn't used anywhere. Use `h1, h2, h3, h4, h5, h6` instead. + ## [4.0.0] - 2021-11-19 ### 🔥💥 Breaking Changes diff --git a/README.md b/README.md index 23529da..f2e70bc 100644 --- a/README.md +++ b/README.md @@ -10,18 +10,18 @@ This package is created for people who using [Chakra-UI's](https://chakra-ui.com CSSReset component is turning down every default style of elements that provided by browser. HTML elements like h1, h2, h3... aren't get default styles but Markdown need them for rendering purposes. This package is solving the problem by changing renderer defaults with chakra-ui's components. -For example, when you want to render level 2 heading component, it is rendering: `Your Header Title`. - ### Install -Make @chakra-ui/react installation how they tell you on their [Getting Started - Chakra UI](https://chakra-ui.com/docs/getting-started) page. +- Install @chakra-ui/react by following their [Getting Started - Chakra UI](https://chakra-ui.com/getting-started) guide. +- Install [react-markdown](https://github.com/remarkjs/react-markdown). +- Install `chakra-ui-markdown-renderer`. ```sh -$ yarn add @chakra-ui/react @emotion/react @emotion/styled framer-motion chakra-ui-markdown-renderer +$ yarn add chakra-ui-markdown-renderer # or -$ npm i @chakra-ui/react @emotion/react @emotion/styled framer-motion chakra-ui-markdown-renderer +$ npm i chakra-ui-markdown-renderer ``` ### Usage @@ -56,3 +56,7 @@ const newTheme = { skipHtml />; ``` + +#### Alternative ways + +[@nikolovlazar/chakra-ui-prose](https://www.npmjs.com/package/@nikolovlazar/chakra-ui-prose) might also work depends on your needs. diff --git a/package.json b/package.json index c7e0836..f9bac8b 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "source": "src/index.tsx", - "version": "4.0.0", + "version": "4.1.0", "private": false, "types": "./dist/index.d.ts", "license": "MIT", @@ -42,7 +42,7 @@ "scripts": { "prepare": "install-peers", "build": "rollup -c", - "build-watch": "rollup -c -w" + "build:watch": "rollup -c -w" }, "eslintConfig": { "extends": "react-app" diff --git a/src/index.tsx b/src/index.tsx index 6b8ed11..65d19dd 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -28,6 +28,9 @@ function getCoreProps(props: GetCoreProps): any { } interface Defaults extends Components { + /** + * @deprecated Use `h1, h2, h3, h4, h5, h6` instead. + */ heading?: Components['h1']; } @@ -59,7 +62,7 @@ export const defaults: Defaults = {