Styles

PdfStyle is Nuxt PDF's framework-owned authoring contract. It contains the behavior this package tests and supports; it does not re-export the wider upstream stylesheet types and it is not browser CSS.

import type { PdfStyle } from '@lupinum/nuxt-pdf'

const pageStyle = {
  color: '#18251d',
  fontFamily: 'Invoice Sans',
  fontSize: 10,
  paddingHorizontal: 48,
  paddingVertical: 40,
} satisfies PdfStyle

Use satisfies, not a type assertion. It preserves the object's useful inferred type while making vue-tsc reject unknown keys, invalid enums, and unsupported units.

PdfStyle belongs to page-flow layout and text metrics. SVG paint and geometry use direct props: PdfG and shapes do not accept style, PdfSvg.style places the SVG root in page flow, and SVG PdfText.style controls text metrics while its direct fill prop controls paint.

Values and units

rem uses the engine's 18-point base. vw and vh resolve against the PDF page container, not a browser window. Percentages resolve against the relevant parent dimension.

em, ch, ex, calc(), var(), container queries, and arbitrary CSS strings are not part of the contract.

Dimensions and positioning

These keys are valid on page-flow primitives (PdfPage, PdfView, PdfText, PdfImage, PdfLink, and PdfNote). width and height also size PdfSvg inside page flow.

Flex layout

Flex properties primarily belong on PdfPage and PdfView. Text, links, images, notes, and SVGs can be flex items. The engine defaults to a column direction.

There is no grid, browser block layout, floats, selectors, or CSS cascade.

Box model

The box model is valid on page-flow primitives. Percentages resolve through the engine's PDF layout container, not a browser viewport.

Borders and paint

Full CSS border strings such as '1px solid red' are not public authoring syntax. Use the explicit width, style, and color keys so invalid values remain type-checkable.

Text

Text keys apply to PdfText and PdfLink. They may be set on ancestor PdfPage/PdfView nodes when the table marks them inherited.

wordSpacing is not supported. The pinned text layout pipeline accepts the key but does not apply it to glyph advances or wrapping. Nuxt PDF does not type a no-op as supported authoring; use letterSpacing instead.

Images and transforms

Style arrays

PdfStyleValue is either one PdfStyle or a recursively nested readonly array. Arrays merge left-to-right. false, null, and undefined entries are ignored, which makes Vue conditionals direct and type-safe:

import type { PdfStyle, PdfStyleValue } from '@lupinum/nuxt-pdf'

const base = { fontSize: 10 } satisfies PdfStyle
const total = { fontWeight: 700 } satisfies PdfStyle

const style = [base, [isTotal && total], null] satisfies PdfStyleValue

Numbers, strings, true, functions, and arbitrary objects are not valid array entries.

Exported style types

Import these types from @lupinum/nuxt-pdf: