@mdfriday/shortcode/dist/themes/style-builder/types.d.ts

A flexible component-based shortcode system for Markdown content with theme support

/**
 * Style interface for component styling
 */
export interface Style {
    variant?: string;
    textColor?: string;
    backgroundColor?: string;
    borderColor?: string;
    size?: 'sm' | 'md' | 'lg';
    width?: string;
    height?: string;
    border?: boolean;
    rounded?: boolean;
    outline?: boolean;
    shadow?: 'none' | 'sm' | 'md' | 'lg';
}
/**
 * Layout interface for component layout
 */
export interface Layout {
    display?: 'block' | 'inline' | 'flex' | 'grid' | 'none';
    position?: 'static' | 'relative' | 'absolute' | 'fixed' | 'sticky';
    gap?: number;
    padding?: number;
    paddingX?: number;
    paddingY?: number;
    margin?: number;
    cols?: number;
    rows?: number;
}
/**
 * Typography interface for text styling
 */
export interface Typography {
    fontFamily?: 'sans' | 'serif' | 'mono';
    fontSize?: 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl';
    fontWeight?: 'normal' | 'medium' | 'bold';
    textAlign?: 'left' | 'center' | 'right' | 'justify';
    lineHeight?: 'none' | 'tight' | 'normal' | 'relaxed';
    letterSpacing?: 'tight' | 'normal' | 'wide';
    textDecoration?: 'underline' | 'line-through' | 'none';
    textTransform?: 'uppercase' | 'lowercase' | 'capitalize';
}
/**
 * Animation interface for component animations
 */
export interface Animation {
    animation?: 'none' | 'spin' | 'ping' | 'pulse' | 'bounce';
    transition?: 'none' | 'all' | 'colors' | 'opacity' | 'shadow';
    duration?: 'fast' | 'normal' | 'slow';
    scale?: number;
    rotate?: number;
    translate?: string;
    delay?: number;
    timing?: 'linear' | 'ease' | 'ease-in' | 'ease-out';
}
/**
 * Interactive interface for interactive states
 */
export interface Interactive {
    cursor?: 'pointer' | 'default' | 'not-allowed';
    hover?: Partial<Style>;
    focus?: Partial<Style>;
    active?: Partial<Style>;
    disabled?: boolean;
}
/**
 * Responsive interface for responsive design
 */
export interface Responsive {
    sm?: number;
    md?: number;
    lg?: number;
    xl?: number;
    hidden?: 'sm' | 'md' | 'lg' | 'xl';
    visible?: 'sm' | 'md' | 'lg' | 'xl';
}
/**
 * ClassBuilder interface for building component classes
 */
export interface ClassBuilder {
    withComponent(component: string): this;
    style(props: Style): this;
    layout(props: Layout): this;
    typography(props: Typography): this;
    animation(props: Animation): this;
    interactive(props: Interactive): this;
    responsive(props: Responsive): this;
    build(): string;
}
/**
 * StyleBuilderFactory interface for creating style builders
 */
export interface StyleBuilderFactory {
    createBuilder(): ClassBuilder;
}