Skip to content

Repository files navigation

Docxcelerate — Documents as components. DOCX as output.

npm JSR JSR score node

Compose DOCX documents from small typed components, using the JSX you already write. Write and preview them on your machine, then generate finished documents through the engine.

Documentation · docxcelerate.com

Requirements

Node.js 20 or newer. Nothing else — authoring, preview and DOCX packing all run locally.

Quick start

npx docxcelerate init my-documents
cd my-documents
npm run dev

This creates a workspace and opens the preview app, where you can begin to create documents and edit or add nodes and finally package it into a reusable format.

To get the dxcl binary on your path:

npm install -g docxcelerate

What a document looks like

Below is the index.ts which is the root of a document inside of a workspace. All documents use the Document component as the parent and allow us to configure the documents settings and stylings.

import { Document, Section, template } from "docxcelerate/template";
import { Balance, Greeting } from "./nodes/index.ts";
import type { TenancyData } from "./types.ts";

export const documentTemplate = template<TenancyData>(
  <Document id="tenancy-renewal" title="Tenancy Renewal">
    <Section id="opening" title="Opening">
      <Greeting />
      <Balance />
    </Section>
  </Document>,
);

If you are fammilar with frontend frameworks the idea of having an entrypoint for your application maps well into the shape of how we structure documents with docxcerlate.

We build components which represent the contents of a document, these are basic elements of a word document such as a paragraph, image, clipart or something else.

import { Paragraph, useSetPrompts, useState } from "docxcelerate/template";
import type { TenancyData } from "../types.ts";

export const Balance: Paragraph = () => {
  const [state] = useState((data: TenancyData) => ({
    name: data.recipientName,
    settled: data.balanceDue === 0,
  }));

  useSetPrompts({ generalPrompt: `Explain the balance to ${state.name}.` });

  if (state.settled) {
    return <Paragraph id="settled">Nothing outstanding, {state.name}.</Paragraph>;
  }

  return <Paragraph id="arrears" />;
};

We structure documents with hooks that allow us to bring in ai features, at the most basic level this is just stuff like making a paragraph say X or Y or write something unique.

In the example above we are simply using the generalPrompt to get some text out about the balance a user has left, you can imagine that if the user has a lot of money the AI may choose to write "You've got a substantial amount of money William".

Jump into our documentation to understand how you can structure documents with AI and create more complex documents for your own needs.

Documentation

Everything is on docxcelerate.com:

Development

npm install       # install dependencies
npm run build     # compile src/ to dist/ with type declarations
npm test          # build, then run the Node test suite
npm run typecheck # type-check sources and tests
npm run jsr:doc   # check every entrypoint and exported symbol is documented

jsr:doc is what keeps the package's JSR score at nine out of nine. It needs Deno on your path, and runs on every pull request that touches src/.

The published package ships compiled output from dist/ plus the dxcl binary. Pushing a change to src/ on main publishes a new version.

License

MIT

About

Write documents like you write websites

Topics

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Contributors

Languages