An Astro component for publishing TEI as Custom Elements powered by CETEIcean.
Astro TEI will pre-process a TEI string on the server side (during SSR or SSG) and use CETEIcean on the client side to register TEI as Custom Elements and apply CETEIcean behaviors.
Want to use React with your TEI elements? Check out the Astro-TEI React component.
You'll need both astro-tei
and jsdom
installed.
npm install astro-tei jsdom --save-dev
---
import Tei from 'astro-tei';
// Load TEI data with a dynamic import.
// You can also use Node's library fs to get the file's content.
const teiFile = (await import("someTEI.xml?raw")).default;
---
<Tei data={teiFile} />
CETEIcean's default example CSS is bundled in another component for convenience and can be optionally added as shown below. Other custom styles can be added by importing CSS files or through your preferred method.
---
import Tei, {TeiBaseStyle} from 'astro-tei';
// Load TEI data with a dynamic import.
// You can also use Node's library fs to get the file's content.
const teiFile = (await import("someTEI.xml?raw")).default;
---
<TeiBaseStyle />
<Tei data={teiFile} />