Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: added jsdocs to exported functions #334

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 27 additions & 0 deletions src/css.ts
Original file line number Diff line number Diff line change
Expand Up @@ -64,15 +64,36 @@ export function* parseFontFace(
yield { family: '', source: '' }
}

/**
* Generates a fallback name based on the first font family specified in the input string.
* @param {string} name - The full font family string.
* @returns {string} - The fallback font name.
*/
export function generateFallbackName(name: string) {
const firstFamily = withoutQuotes(name.split(',').shift()!)
return `${firstFamily} fallback`
}

interface FallbackOptions {
/**
* The name of the fallback font.
*/
name: string

/**
* The fallback font family name.
*/
font: string

/**
* Metrics for fallback face calculations.
* @optional
*/
metrics?: FontFaceMetrics

/**
* Additional properties that may be included dynamically
*/
[key: string]: any
}

Expand All @@ -81,6 +102,12 @@ export type FontFaceMetrics = Pick<
'ascent' | 'descent' | 'lineGap' | 'unitsPerEm' | 'xWidthAvg'
>

/**
* Generates a CSS `@font-face' declaration for a font, taking fallback and resizing into account.
* @param {FontFaceMetrics} metrics - The metrics of the preferred font. See {@link FontFaceMetrics}.
* @param {FallbackOptions} fallback - The fallback options, including name, font and optional metrics. See {@link FallbackOptions}.
* @returns {string} - The full `@font-face` CSS declaration.
*/
export function generateFontFace(metrics: FontFaceMetrics, fallback: FallbackOptions) {
const {
name: fallbackName,
Expand Down
13 changes: 13 additions & 0 deletions src/metrics.ts
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,12 @@ function filterRequiredMetrics({
}
}

/**
* Retrieves the font metrics for a given font family from the metrics collection. Uses caching to avoid redundant calculations.
* @param {string} family - The name of the font family for which metrics are requested.
* @returns {Promise<FontFaceMetrics | null>} - A promise that resolves with the filtered font metrics or null if not found. See {@link FontFaceMetrics}.
* @async
*/
export async function getMetricsForFamily(family: string) {
family = withoutQuotes(family)

Expand All @@ -51,6 +57,13 @@ export async function getMetricsForFamily(family: string) {
}
}

/**
* Reads font metrics from a specified source URL or file path. This function supports both local files and remote URLs.
* It caches the results to optimise subsequent requests for the same source.
* @param {URL | string} _source - The source URL or local file path from which to read the font metrics.
* @returns {Promise<FontFaceMetrics | null>} - A promise that resolves to the filtered font metrics or null if the source cannot be processed.
* @async
*/
export async function readMetrics(_source: URL | string) {
const source
= typeof _source !== 'string' && 'href' in _source ? _source.href : _source
Expand Down
45 changes: 43 additions & 2 deletions src/transform.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,49 @@ import { generateFallbackName, generateFontFace, parseFontFace } from './css'
import { getMetricsForFamily, readMetrics } from './metrics'

export interface FontaineTransformOptions {
css?: { value?: string }
/**
* Configuration options for the CSS transformation.
* @optional
*/
css?: {
/**
* Holds the current value of the CSS being transformed.
* @optional
*/
value?: string
}

/**
* An array of fallback font family names to use.
*/
fallbacks: string[]

/**
* Function to resolve a given path to a valid URL or local path.
* This is typically used to resolve font file paths.
* @optional
*/
resolvePath?: (path: string) => string | URL

/**
* A function to determine whether to skip font face generation for a given fallback name.
* @optional
*/
skipFontFaceGeneration?: (fallbackName: string) => boolean
/** this should produce an unquoted font family name */

/**
* Function to generate an unquoted font family name to use as a fallback.
* This should return a valid CSS font family name and should not include quotes.
* @optional
*/
fallbackName?: (name: string) => string
/** @deprecated use fallbackName */
overrideName?: (name: string) => string

/**
* Specifies whether to create a source map for the transformation.
* @optional
*/
sourcemap?: boolean
}

Expand Down Expand Up @@ -51,6 +86,12 @@ const CSS_RE = createRegExp(
.at.lineEnd(),
)

/**
* Transforms CSS files to include font fallbacks.
*
* @param options - The transformation options. See {@link FontaineTransformOptions}.
* @returns The unplugin instance.
*/
export const FontaineTransform = createUnplugin(
(options: FontaineTransformOptions) => {
const cssContext = (options.css = options.css || {})
Expand Down