@sc4rfurryx/proteusjs
Version:
The Modern Web Development Framework for Accessible, Responsive, and High-Performance Applications. Intelligent container queries, fluid typography, WCAG compliance, and performance optimization.
73 lines (71 loc) • 2.48 kB
TypeScript
/**
* @sc4rfurryx/proteusjs/typography
* Fluid typography with CSS-first approach
*
* @version 2.0.0
* @author sc4rfurry
* @license MIT
*/
interface FluidTypeOptions {
minViewportPx?: number;
maxViewportPx?: number;
lineHeight?: number;
containerUnits?: boolean;
}
interface FluidTypeResult {
css: string;
}
/**
* Generate pure-CSS clamp() rules for fluid typography
*/
declare function fluidType(minRem: number, maxRem: number, options?: FluidTypeOptions): FluidTypeResult;
/**
* Apply fluid typography to elements
*/
declare function applyFluidType(selector: string, minRem: number, maxRem: number, options?: FluidTypeOptions): void;
/**
* Create a complete typographic scale
*/
declare function createTypographicScale(baseSize?: number, ratio?: number, steps?: number, options?: FluidTypeOptions): Record<string, FluidTypeResult>;
/**
* Generate CSS custom properties for a typographic scale
*/
declare function generateScaleCSS(scale: Record<string, FluidTypeResult>, prefix?: string): string;
/**
* Optimize line height for readability
*/
declare function optimizeLineHeight(fontSize: number, measure?: number): number;
/**
* Calculate optimal font size for container width
*/
declare function calculateOptimalSize(containerWidth: number, targetCharacters?: number, baseCharWidth?: number): number;
/**
* Apply responsive typography to an element
*/
declare function makeResponsive(target: Element | string, options?: {
minSize?: number;
maxSize?: number;
targetCharacters?: number;
autoLineHeight?: boolean;
}): void;
/**
* Remove applied typography styles
*/
declare function cleanup(target?: Element | string): void;
/**
* Check if container query units are supported
*/
declare function supportsContainerUnits(): boolean;
declare const _default: {
fluidType: typeof fluidType;
applyFluidType: typeof applyFluidType;
createTypographicScale: typeof createTypographicScale;
generateScaleCSS: typeof generateScaleCSS;
optimizeLineHeight: typeof optimizeLineHeight;
calculateOptimalSize: typeof calculateOptimalSize;
makeResponsive: typeof makeResponsive;
cleanup: typeof cleanup;
supportsContainerUnits: typeof supportsContainerUnits;
};
export { applyFluidType, calculateOptimalSize, cleanup, createTypographicScale, _default as default, fluidType, generateScaleCSS, makeResponsive, optimizeLineHeight, supportsContainerUnits };
export type { FluidTypeOptions, FluidTypeResult };