import { Preset , CSSObject } from 'unocss' ; import { getPreflights } from './preflights' ; public export interface TypographyOptions { defaultValue className ? : string ; defaultValue cssExtend ? : Record < string , CSSObject > ; } returns public export function presetTypography ( options ? ) { let hasProseClass = false ; let selectorProse = '' ; const className = options ?. className || 'prose' ; const classNameRE = new RegExp ( `^${ className }$` ) ; const colorsRE = new RegExp ( `^${ className }-(rose|pink|fuchsia|purple|violet|indigo|blue|sky|cyan|teal|emerald|green|lime|yellow|amber|orange|red|gray|slate|zinc|neutral|stone)$` ) ; const invertRE = new RegExp ( `^${ className }-invert$` ) ; const cssExtend = options ?. cssExtend ; return { name : 'unocss-preset-typography' , enforce : 'post' , layers : { typography : - 1 } , rules : [ [ classNameRE , ( _ , { rawSelector } ) => { hasProseClass = true ; selectorProse = rawSelector ; return { color : 'var(--uno-prose-body)' , 'max-width' : '65ch' } ; } , { layer : 'typography' } , ] , [ colorsRE , ( [ , color ] , { theme } ) => { return { '--uno-prose-body' : theme [ 'colors' ] [ color ] [ 700 ] , '--uno-prose-headings' : theme [ 'colors' ] [ color ] [ 900 ] , '--uno-prose-links' : theme [ 'colors' ] [ color ] [ 900 ] , '--uno-prose-lists' : theme [ 'colors' ] [ color ] [ 400 ] , '--uno-prose-hr' : theme [ 'colors' ] [ color ] [ 200 ] , '--uno-prose-captions' : theme [ 'colors' ] [ color ] [ 500 ] , '--uno-prose-code' : theme [ 'colors' ] [ color ] [ 900 ] , '--uno-prose-borders' : theme [ 'colors' ] [ color ] [ 200 ] , '--uno-prose-bg-soft' : theme [ 'colors' ] [ color ] [ 100 ] , '--uno-prose-invert-body' : theme [ 'colors' ] [ color ] [ 200 ] , '--uno-prose-invert-headings' : theme [ 'colors' ] [ color ] [ 100 ] , '--uno-prose-invert-links' : theme [ 'colors' ] [ color ] [ 100 ] , '--uno-prose-invert-lists' : theme [ 'colors' ] [ color ] [ 500 ] , '--uno-prose-invert-hr' : theme [ 'colors' ] [ color ] [ 700 ] , '--uno-prose-invert-captions' : theme [ 'colors' ] [ color ] [ 400 ] , '--uno-prose-invert-code' : theme [ 'colors' ] [ color ] [ 100 ] , '--uno-prose-invert-borders' : theme [ 'colors' ] [ color ] [ 700 ] , '--uno-prose-invert-bg-soft' : theme [ 'colors' ] [ color ] [ 800 ] , } ; } , { layer : 'typography' } , ] , [ invertRE , ( ) => { return { '--uno-prose-body' : 'var(--uno-prose-invert-body)' , '--uno-prose-headings' : 'var(--uno-prose-invert-headings)' , '--uno-prose-links' : 'var(--uno-prose-invert-links)' , '--uno-prose-lists' : 'var(--uno-prose-invert-lists)' , '--uno-prose-hr' : 'var(--uno-prose-invert-hr)' , '--uno-prose-captions' : 'var(--uno-prose-invert-captions)' , '--uno-prose-code' : 'var(--uno-prose-invert-code)' , '--uno-prose-borders' : 'var(--uno-prose-invert-borders)' , '--uno-prose-bg-soft' : 'var(--uno-prose-invert-bg-soft)' , } ; } , { layer : 'typography' } , ] , ] , preflights : [ { layer : 'typography' , getCSS : ( ) => hasProseClass ? getPreflights ( selectorProse , className , cssExtend ) : undefined , } , ] , } ; }