{"_id":"@duocrafters/notion-database-astro","_rev":"2-1cec05cd29742eaf572bd1a03f1ee562","name":"@duocrafters/notion-database-astro","dist-tags":{"latest":"0.4.3"},"versions":{"0.4.2":{"name":"@duocrafters/notion-database-astro","version":"0.4.2","keywords":["astro","zod","notion","typescript"],"author":{"name":"Vaduo Consulting"},"license":"MIT","_id":"@duocrafters/notion-database-astro@0.4.2","maintainers":[{"name":"emmanueldemey","email":"demey.emmanuel@gmail.com"}],"homepage":"https://github.com/duocrafters/notion-database-astro","bugs":{"url":"https://github.com/duocrafters/notion-database-astro/issues"},"dist":{"shasum":"cf47b10c42625e1a220bf871d335efeec1e5361a","tarball":"https://registry.npmjs.org/@duocrafters/notion-database-astro/-/notion-database-astro-0.4.2.tgz","fileCount":139,"integrity":"sha512-OPiZyTpLrGdQU76FHirOKBwJNTeCmekMwtPPyBPxvwm18CRe6V54JCDMgp86KBcHB8CAEcTF9ZLCkimrswuTfA==","signatures":[{"sig":"MEYCIQCjiGBr6VORwpO8xSoINM/STHk3Acz84cV7xwIbqRlZPQIhAKpxLf3ykUdqfzwte5hu6Aa3TbNCg/FSxiBJ0fUU+i8X","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":79228},"main":"dist/index.js","type":"module","types":"./dist/index.d.ts","gitHead":"5e6bd167dad35b80dfc2edceaf52d99d01bbe202","scripts":{"ci":"npm run build && npm run check-format && npm run test","dev":"vitest","test":"vitest run","build":"tsc","format":"prettier --write .","check-format":"prettier --check .","local-release":"changeset version && changeset publish","prepublishOnly":"npm run ci"},"_npmUser":{"name":"emmanueldemey","email":"demey.emmanuel@gmail.com"},"repository":{"url":"git+https://github.com/duocrafters/notion-database-astro.git","type":"git"},"_npmVersion":"10.9.0","description":"A Astro loader for Notion database","directories":{},"_nodeVersion":"22.12.0","dependencies":{"astro":"^5.0.3","image-type":"^6.0.0","rehype-mermaid":"^3.0.0","@notionhq/client":"^2.2.15","rehype-highlight":"^7.0.2","@duocrafters/notion-database-zod":"^0.4.0"},"_hasShrinkwrap":false,"devDependencies":{"vitest":"^3.2.4","prettier":"^3.6.2","typescript":"^5.9.2","@changesets/cli":"^2.29.6"},"_npmOperationalInternal":{"tmp":"tmp/notion-database-astro_0.4.2_1756117128043_0.21316539031629422","host":"s3://npm-registry-packages-npm-production"}},"0.4.3":{"name":"@duocrafters/notion-database-astro","version":"0.4.3","license":"MIT","description":"A Astro loader for Notion database","scripts":{"build":"tsc","format":"prettier --write .","check-format":"prettier --check .","test":"vitest run","dev":"vitest","ci":"npm run build && npm run check-format && npm run test","local-release":"changeset version && changeset publish","prepublishOnly":"npm run ci"},"author":{"name":"Vaduo Consulting"},"keywords":["astro","zod","notion","typescript"],"homepage":"https://github.com/duocrafters/notion-database-astro","bugs":{"url":"https://github.com/duocrafters/notion-database-astro/issues"},"repository":{"type":"git","url":"git+https://github.com/duocrafters/notion-database-astro.git"},"type":"module","main":"dist/index.js","devDependencies":{"@changesets/cli":"^2.29.6","prettier":"^3.6.2","typescript":"^5.9.2","vitest":"^3.2.4"},"dependencies":{"@duocrafters/notion-database-zod":"^0.4.0","@notionhq/client":"^2.2.15","astro":"^5.0.3","image-type":"^6.0.0","rehype-highlight":"^7.0.2","rehype-mermaid":"^3.0.0"},"_id":"@duocrafters/notion-database-astro@0.4.3","gitHead":"97f57d90e57e8470d3c8a2e7398947d6a857182b","types":"./dist/index.d.ts","_nodeVersion":"22.12.0","_npmVersion":"10.9.0","dist":{"integrity":"sha512-S8X9ajO/Ly91JK/wVz2CDmFS3nYeLoYMwMmgypv3mYounWetAsPZWMS7kMMSq076Njry4UNv8J6kxvMW2sz5Fw==","shasum":"bc3802fabda57cc47ecb870fba2710d6d865c69f","tarball":"https://registry.npmjs.org/@duocrafters/notion-database-astro/-/notion-database-astro-0.4.3.tgz","fileCount":139,"unpackedSize":79200,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIDpqJXKENexAH4YvfLbhoWGVFxQAvNkLWm6nUa32uQiMAiEAseZ/B25UaSB432W8VPRNwDkGRwEoN1sbqYAoNrgUrAk="}]},"_npmUser":{"name":"emmanueldemey","email":"demey.emmanuel@gmail.com"},"directories":{},"maintainers":[{"name":"emmanueldemey","email":"demey.emmanuel@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/notion-database-astro_0.4.3_1756117989452_0.6083052288269193"},"_hasShrinkwrap":false}},"time":{"created":"2025-08-25T10:18:47.949Z","modified":"2025-08-25T10:33:09.814Z","0.4.2":"2025-08-25T10:18:48.229Z","0.4.3":"2025-08-25T10:33:09.630Z"},"bugs":{"url":"https://github.com/duocrafters/notion-database-astro/issues"},"author":{"name":"Vaduo Consulting"},"license":"MIT","homepage":"https://github.com/duocrafters/notion-database-astro","keywords":["astro","zod","notion","typescript"],"repository":{"type":"git","url":"git+https://github.com/duocrafters/notion-database-astro.git"},"description":"A Astro loader for Notion database","maintainers":[{"name":"emmanueldemey","email":"demey.emmanuel@gmail.com"}],"readme":"# notion-database-astro\n\n## Basics\n\n### Brief presentation of the new content layer API\n\n`Content layer API` is a new feature (Astro V5 Beta) allowing you to define and query custom `Content Collections` (added in Astro V2).\n\n- `Content Collection` was an easier way to manage local content using the `src/content` folder (md, mdx, ...). It provided a way to create collections of content sharing the same structure (blog posts, products, ...), using subfolders. In addition to the better organization, it was giving a better developer experience due to Intellisense and Typescript type-safety.\n\n- `Content layer API` is a feature allowing to declare `loaders` which are custom functions to fetch content locally or remotely outside of the `src/content` folder. Note that remotely fetched content is cached, so Astro does not fetch it every time.\n\nIf you want to learn more, because I can't resume the documentation here, you can go to: [https://5-0-0-beta.docs.astro.build/en/guides/content-collections/]()\n\n### The creation of our custom Notion loader\n\nWith the creation of the new content layer API, some loaders created by the community appeared, like the `notion-astro-loader`. But, unfortunately, it was not satisfying all our needs (we will discuss about motivations in the next section). So we made our own custom notion content loader, inspired by the existing community loader.\n\n#### Motivations\n\nIf we had used `notion-astro-loader` directly:\n\n- We are dependent on another library\n- We have no control over the generated HTML content\n- We can't easily extend the library and add new custom components\n- It can have bugs (it's the case for picture generation for example)\n\n### Setup of the communication with the Notion API\n\nThe notion loader needs to access the Notion API, so it needs a TOKEN. You can obtain it by configuring a new integration. Follow this tutorial to learn how to:\n\n[https://developers.notion.com/docs/authorization#internal-integration-auth-flow-set-up]()\n\nNext, you need to create a simple database (it's just a table in fact):\n\n![Notion database](docs/pictures/notion-database.png)\n\nAnd you need to share it with our Notion integration (otherwise it will not be able to read the database content):\n\n- Click on the three dots button in the top right corner of the web page\n- Click on \"Connect to\"\n- And search for the name of your integration (previously created)\n\n## The loader conception\n\n### How it works ?\n\nA picture is worth a thousand words:\n\n![Loader working](docs/pictures/loader-working.png)\n\nSome additional information:\n\n- Notion has two different endpoints: one to list a database rows and one to retrieve the content of a page. You can't get the content of the pages by listing the database rows, you only get page IDs and metadata (called page properties in Notion vocabulary).\n\n### Folders architecture\n\n- Fetching: handle communication with the Notion API\n- Rendering: handle HTML rendering of the different Notion blocks provided by the API, as well as the blocks tree as a whole (because, as a reminder, Notion blocks can be nested so they form a tree structure)\n  - Notion Rehype: contains the Unified plugin to transform the Notion blocks tree into an HTML tree (we'll talk about it in more detail in the following sections)\n- Schemas: contains schemas to define the expected output of a Notion page object\n- Types: contains useful TypeScript types for the loader\n\n### More explanations on HTML Rendering\n\n#### What's Unified library ?\n\n[Unified](https://github.com/unifiedjs/unified) is a library that \"standardizes\" and helps with the creation and manipulation of syntax trees. Through the usage of different plugins, it allows you, for example, to parse a Markdown file and convert it to HTML (and this is what Astro is using behind the scenes).\n\nWe invite you to read the Github page for a better understanding of its ecosystem.\n\n#### Why not use components to render page content ?\n\nWe wanted to use Astro/React components at first because in my view:\n\n- it is more maintainable\n- allows easier handling of potential interactivity (a copy code button, for example)\n- provides separation of concerns\n- removes the need to use the Unified library (which is great but overwhelming in contrast to simple components)\n\nHowever, we were dealing with the recommended way of doing things provided by Astro: The recommendation is to store the stringified HTML page content in the collection store and then render it using the `<Content />` component. Unfortunately, by doing this, we can't use a components system.\n\nIn addition, in the hypothesis that we didn't directly render the HTML content of the page and had passed the blocks tree to display it in some components, I think to get types intellisense it was necessary to create Zod schemas for each Notion blocks, which is very cumbersome. But maybe it is a lack of knowledge on my part.\n\nAnyway, this is a subject to be developed further...\n","readmeFilename":"README.md"}