apply classes to ul and ol

juliuxu · Aug 8, 2023 · e2e2ae5 · e2e2ae5
1 parent 602e4ec
commit e2e2ae5
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/packages/notion-render/CHANGELOG.md b/packages/notion-render/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @julianjark/notion-render
 
+## 0.9.0
+
+### Minor Changes
+
+- apply classes to ul and ol
+
 ## 0.8.0
 
 ### Minor Changes

diff --git a/packages/notion-render/package.json b/packages/notion-render/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@julianjark/notion-render",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "description": "React renderer for the official Notion API",
   "author": "Julian Jark",
   "license": "ISC",

diff --git a/packages/notion-render/src/pseudo-components.tsx b/packages/notion-render/src/pseudo-components.tsx
@@ -1,6 +1,7 @@
-import { BlockObjectResponse } from "@notionhq/client/build/src/api-endpoints";
+import type { BlockObjectResponse } from "@notionhq/client/build/src/api-endpoints";
 import type { BlockComponentProps } from "./components";
 import { DefaultComponents } from "./components";
+import { useNotionRenderContext as ctx } from "./context";
 
 // Pseudo blocks
 export interface ListBlock {
@@ -14,7 +15,7 @@ export type ListBlockType = ListBlock["type"];
 export const BulletedList = ({ block }: BlockComponentProps) => {
   if (block.type !== "bulleted_list") return null;
   return (
-    <ul>
+    <ul className={ctx().classes.bulleted_list.root}>
       {block.children.map((block) => {
         const Component = DefaultComponents[block.type];
         if (Component === undefined) return undefined;
@@ -26,7 +27,7 @@ export const BulletedList = ({ block }: BlockComponentProps) => {
 export const NumberedList = ({ block }: BlockComponentProps) => {
   if (block.type !== "numbered_list") return null;
   return (
-    <ol>
+    <ol className={ctx().classes.numbered_list.root}>
       {block.children.map((block) => {
         const Component = DefaultComponents[block.type];
         if (Component === undefined) return undefined;