@nikkory/vibe-engine 4.0.0

package/dist/styling/factors-17-24.d.ts

@@ -0,0 +1,668 @@
+/**
+ * 24-Factor Variant System - Factors 17-24
+ *
+ * Factor 17: Spacing - Internal spacing and margins
+ * Factor 18: Typography - Text styling presets
+ * Factor 19: Border - Border style and width
+ * Factor 20: Opacity - Transparency levels
+ * Factor 21: Overflow - Content overflow behavior
+ * Factor 22: Cursor - Cursor style on hover
+ * Factor 23: ZIndex - Stacking order
+ * Factor 24: Transition - Transition timing and duration
+ *
+ * @packageDocumentation
+ * @module generator/factors-17-24
+ * @since 2.1.0
+ *
+ * Powered by Nikkory
+ */
+/**
+ * Clear the factor memoization cache.
+ * Useful for testing or memory management.
+ *
+ * @since 2.1.0
+ */
+export declare function clearFactorCache(): void;
+/**
+ * Get current cache statistics.
+ *
+ * @returns Cache size and max size
+ *
+ * @since 2.1.0
+ */
+export declare function getFactorCacheStats(): {
+    size: number;
+    maxSize: number;
+};
+import type { FactorSpacing, FactorTypography, FactorBorder, FactorOpacity, FactorOverflow, FactorCursor, FactorZIndex, FactorTransition } from './types';
+/**
+ * Spacing options constant.
+ * @since 2.1.0
+ */
+export declare const SPACINGS: {
+    readonly none: "none";
+    readonly xs: "xs";
+    readonly sm: "sm";
+    readonly md: "md";
+    readonly lg: "lg";
+    readonly xl: "xl";
+    readonly '2xl': "2xl";
+    readonly '3xl': "3xl";
+};
+/**
+ * Spacing-specific Tailwind classes for different contexts.
+ * @since 2.1.0
+ */
+export declare const spacingVariants: {
+    /** Padding all sides */
+    readonly padding: {
+        readonly none: "p-0";
+        readonly xs: "p-1";
+        readonly sm: "p-2";
+        readonly md: "p-4";
+        readonly lg: "p-6";
+        readonly xl: "p-8";
+        readonly '2xl': "p-12";
+        readonly '3xl': "p-16";
+    };
+    /** Padding horizontal */
+    readonly paddingX: {
+        readonly none: "px-0";
+        readonly xs: "px-1";
+        readonly sm: "px-2";
+        readonly md: "px-4";
+        readonly lg: "px-6";
+        readonly xl: "px-8";
+        readonly '2xl': "px-12";
+        readonly '3xl': "px-16";
+    };
+    /** Padding vertical */
+    readonly paddingY: {
+        readonly none: "py-0";
+        readonly xs: "py-1";
+        readonly sm: "py-2";
+        readonly md: "py-4";
+        readonly lg: "py-6";
+        readonly xl: "py-8";
+        readonly '2xl': "py-12";
+        readonly '3xl': "py-16";
+    };
+    /** Margin all sides */
+    readonly margin: {
+        readonly none: "m-0";
+        readonly xs: "m-1";
+        readonly sm: "m-2";
+        readonly md: "m-4";
+        readonly lg: "m-6";
+        readonly xl: "m-8";
+        readonly '2xl': "m-12";
+        readonly '3xl': "m-16";
+    };
+    /** Gap spacing */
+    readonly gap: {
+        readonly none: "gap-0";
+        readonly xs: "gap-1";
+        readonly sm: "gap-2";
+        readonly md: "gap-4";
+        readonly lg: "gap-6";
+        readonly xl: "gap-8";
+        readonly '2xl': "gap-12";
+        readonly '3xl': "gap-16";
+    };
+    /** Space between children */
+    readonly space: {
+        readonly none: "space-y-0";
+        readonly xs: "space-y-1";
+        readonly sm: "space-y-2";
+        readonly md: "space-y-4";
+        readonly lg: "space-y-6";
+        readonly xl: "space-y-8";
+        readonly '2xl': "space-y-12";
+        readonly '3xl': "space-y-16";
+    };
+};
+export type SpacingVariantKey = keyof typeof spacingVariants;
+/**
+ * Build spacing classes for a specific context.
+ *
+ * @param context - Context (padding, margin, gap, etc.)
+ * @param spacing - Spacing value
+ * @returns Tailwind classes for spacing
+ *
+ * @example
+ * ```typescript
+ * buildSpacingClasses('padding', 'md')
+ * // => "p-4"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function buildSpacingClasses(context: SpacingVariantKey, spacing: FactorSpacing): string;
+/**
+ * Typography options constant.
+ * @since 2.1.0
+ */
+export declare const TYPOGRAPHIES: {
+    readonly body: "body";
+    readonly bodyLarge: "bodyLarge";
+    readonly bodySm: "bodySm";
+    readonly heading: "heading";
+    readonly headingLg: "headingLg";
+    readonly headingSm: "headingSm";
+    readonly display: "display";
+    readonly displayLg: "displayLg";
+    readonly displaySm: "displaySm";
+    readonly caption: "caption";
+    readonly overline: "overline";
+    readonly mono: "mono";
+    readonly label: "label";
+    readonly labelLg: "labelLg";
+    readonly labelSm: "labelSm";
+};
+/**
+ * Typography-specific Tailwind classes.
+ * @since 2.1.0
+ */
+export declare const typographyVariants: Record<FactorTypography, string>;
+/**
+ * Get typography classes for a specific preset.
+ *
+ * @param typography - Typography preset
+ * @returns Tailwind classes for typography
+ *
+ * @example
+ * ```typescript
+ * getTypographyClasses('heading')
+ * // => "text-2xl font-bold leading-tight tracking-tight"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function getTypographyClasses(typography: FactorTypography): string;
+/**
+ * Border options constant.
+ * @since 2.1.0
+ */
+export declare const BORDERS: {
+    readonly none: "none";
+    readonly subtle: "subtle";
+    readonly solid: "solid";
+    readonly bold: "bold";
+    readonly dashed: "dashed";
+    readonly dotted: "dotted";
+    readonly double: "double";
+    readonly ring: "ring";
+    readonly ringBold: "ringBold";
+};
+/**
+ * Border-specific Tailwind classes.
+ * @since 2.1.0
+ */
+export declare const borderVariants: Record<FactorBorder, string>;
+/**
+ * Get border classes for a specific style.
+ *
+ * @param border - Border style
+ * @returns Tailwind classes for border
+ *
+ * @example
+ * ```typescript
+ * getBorderClasses('dashed')
+ * // => "border-2 border-dashed border-neutral-300 dark:border-neutral-600"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function getBorderClasses(border: FactorBorder): string;
+/**
+ * Opacity options constant.
+ * @since 2.1.0
+ */
+export declare const OPACITIES: {
+    readonly transparent: "transparent";
+    readonly dim: "dim";
+    readonly light: "light";
+    readonly medium: "medium";
+    readonly high: "high";
+    readonly full: "full";
+};
+/**
+ * Opacity-specific Tailwind classes.
+ * @since 2.1.0
+ */
+export declare const opacityVariants: Record<FactorOpacity, string>;
+/**
+ * Get opacity classes for a specific level.
+ *
+ * @param opacity - Opacity level
+ * @returns Tailwind classes for opacity
+ *
+ * @example
+ * ```typescript
+ * getOpacityClasses('medium')
+ * // => "opacity-75"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function getOpacityClasses(opacity: FactorOpacity): string;
+/**
+ * Overflow options constant.
+ * @since 2.1.0
+ */
+export declare const OVERFLOWS: {
+    readonly visible: "visible";
+    readonly hidden: "hidden";
+    readonly scroll: "scroll";
+    readonly auto: "auto";
+    readonly clip: "clip";
+    readonly scrollX: "scrollX";
+    readonly scrollY: "scrollY";
+    readonly hiddenX: "hiddenX";
+    readonly hiddenY: "hiddenY";
+};
+/**
+ * Overflow-specific Tailwind classes.
+ * @since 2.1.0
+ */
+export declare const overflowVariants: Record<FactorOverflow, string>;
+/**
+ * Get overflow classes for a specific behavior.
+ *
+ * @param overflow - Overflow behavior
+ * @returns Tailwind classes for overflow
+ *
+ * @example
+ * ```typescript
+ * getOverflowClasses('scrollY')
+ * // => "overflow-y-scroll overflow-x-hidden"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function getOverflowClasses(overflow: FactorOverflow): string;
+/**
+ * Cursor options constant.
+ * @since 2.1.0
+ */
+export declare const CURSORS: {
+    readonly default: "default";
+    readonly pointer: "pointer";
+    readonly grab: "grab";
+    readonly grabbing: "grabbing";
+    readonly move: "move";
+    readonly notAllowed: "notAllowed";
+    readonly wait: "wait";
+    readonly progress: "progress";
+    readonly text: "text";
+    readonly crosshair: "crosshair";
+    readonly help: "help";
+    readonly zoomIn: "zoomIn";
+    readonly zoomOut: "zoomOut";
+    readonly none: "none";
+};
+/**
+ * Cursor-specific Tailwind classes.
+ * @since 2.1.0
+ */
+export declare const cursorVariants: Record<FactorCursor, string>;
+/**
+ * Get cursor classes for a specific style.
+ *
+ * @param cursor - Cursor style
+ * @returns Tailwind classes for cursor
+ *
+ * @example
+ * ```typescript
+ * getCursorClasses('pointer')
+ * // => "cursor-pointer"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function getCursorClasses(cursor: FactorCursor): string;
+/**
+ * Z-Index options constant.
+ * @since 2.1.0
+ */
+export declare const Z_INDICES: {
+    readonly auto: "auto";
+    readonly base: "base";
+    readonly docked: "docked";
+    readonly dropdown: "dropdown";
+    readonly sticky: "sticky";
+    readonly banner: "banner";
+    readonly overlay: "overlay";
+    readonly modal: "modal";
+    readonly popover: "popover";
+    readonly skipLink: "skipLink";
+    readonly toast: "toast";
+    readonly tooltip: "tooltip";
+    readonly max: "max";
+};
+/**
+ * Z-Index numeric values (Chakra UI-inspired).
+ * @since 2.1.0
+ */
+export declare const zIndexValues: Record<FactorZIndex, number | 'auto'>;
+/**
+ * Z-Index-specific Tailwind classes.
+ * @since 2.1.0
+ */
+export declare const zIndexVariants: Record<FactorZIndex, string>;
+/**
+ * Get z-index classes for a specific layer.
+ *
+ * @param zIndex - Z-Index layer
+ * @returns Tailwind classes for z-index
+ *
+ * @example
+ * ```typescript
+ * getZIndexClasses('modal')
+ * // => "z-[1400]"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function getZIndexClasses(zIndex: FactorZIndex): string;
+/**
+ * Get numeric z-index value for a layer.
+ *
+ * @param zIndex - Z-Index layer
+ * @returns Numeric z-index value
+ *
+ * @since 2.1.0
+ */
+export declare function getZIndexValue(zIndex: FactorZIndex): number | 'auto';
+/**
+ * Transition options constant.
+ * @since 2.1.0
+ */
+export declare const TRANSITIONS: {
+    readonly none: "none";
+    readonly instant: "instant";
+    readonly fast: "fast";
+    readonly default: "default";
+    readonly slow: "slow";
+    readonly slower: "slower";
+    readonly smooth: "smooth";
+    readonly spring: "spring";
+    readonly bounce: "bounce";
+    readonly easeIn: "easeIn";
+    readonly easeOut: "easeOut";
+    readonly easeInOut: "easeInOut";
+};
+/**
+ * Transition-specific Tailwind classes.
+ * @since 2.1.0
+ */
+export declare const transitionVariants: Record<FactorTransition, string>;
+/**
+ * Get transition classes for a specific timing.
+ *
+ * @param transition - Transition timing
+ * @returns Tailwind classes for transition
+ *
+ * @example
+ * ```typescript
+ * getTransitionClasses('spring')
+ * // => "transition-all duration-300 ease-[cubic-bezier(0.34,1.56,0.64,1)]"
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function getTransitionClasses(transition: FactorTransition): string;
+/**
+ * Factor 17-24 configuration interface.
+ * @since 2.1.0
+ */
+export interface Factors17to24Config {
+    /** Factor 17: Spacing */
+    spacing?: FactorSpacing;
+    /** Factor 18: Typography */
+    typography?: FactorTypography;
+    /** Factor 19: Border */
+    border?: FactorBorder;
+    /** Factor 20: Opacity */
+    opacity?: FactorOpacity;
+    /** Factor 21: Overflow */
+    overflow?: FactorOverflow;
+    /** Factor 22: Cursor */
+    cursor?: FactorCursor;
+    /** Factor 23: Z-Index */
+    zIndex?: FactorZIndex;
+    /** Factor 24: Transition */
+    transition?: FactorTransition;
+}
+/**
+ * Apply all Factor 17-24 configurations to generate classes.
+ * Results are memoized for performance.
+ *
+ * @param config - Factor 17-24 configuration
+ * @param spacingContext - Context for spacing (padding, margin, gap)
+ * @returns Combined class string
+ *
+ * @example
+ * ```typescript
+ * applyFactors17to24({
+ *   spacing: 'md',
+ *   typography: 'heading',
+ *   border: 'solid',
+ *   transition: 'spring'
+ * })
+ * // => "p-4 text-2xl font-bold leading-tight tracking-tight border-2 ..."
+ * ```
+ *
+ * @since 2.1.0
+ */
+export declare function applyFactors17to24(config: Factors17to24Config, spacingContext?: SpacingVariantKey): string;
+/**
+ * Default values for Factor 17-24.
+ * @since 2.1.0
+ */
+export declare const FACTOR_17_24_DEFAULTS: Required<Factors17to24Config>;
+/**
+ * Get default value for a specific factor.
+ *
+ * @param factor - Factor name
+ * @returns Default value for the factor
+ *
+ * @since 2.1.0
+ */
+export declare function getFactor17to24Default<K extends keyof Factors17to24Config>(factor: K): NonNullable<Factors17to24Config[K]>;
+export declare const Factors17to24: {
+    SPACINGS: {
+        readonly none: "none";
+        readonly xs: "xs";
+        readonly sm: "sm";
+        readonly md: "md";
+        readonly lg: "lg";
+        readonly xl: "xl";
+        readonly '2xl': "2xl";
+        readonly '3xl': "3xl";
+    };
+    spacingVariants: {
+        /** Padding all sides */
+        readonly padding: {
+            readonly none: "p-0";
+            readonly xs: "p-1";
+            readonly sm: "p-2";
+            readonly md: "p-4";
+            readonly lg: "p-6";
+            readonly xl: "p-8";
+            readonly '2xl': "p-12";
+            readonly '3xl': "p-16";
+        };
+        /** Padding horizontal */
+        readonly paddingX: {
+            readonly none: "px-0";
+            readonly xs: "px-1";
+            readonly sm: "px-2";
+            readonly md: "px-4";
+            readonly lg: "px-6";
+            readonly xl: "px-8";
+            readonly '2xl': "px-12";
+            readonly '3xl': "px-16";
+        };
+        /** Padding vertical */
+        readonly paddingY: {
+            readonly none: "py-0";
+            readonly xs: "py-1";
+            readonly sm: "py-2";
+            readonly md: "py-4";
+            readonly lg: "py-6";
+            readonly xl: "py-8";
+            readonly '2xl': "py-12";
+            readonly '3xl': "py-16";
+        };
+        /** Margin all sides */
+        readonly margin: {
+            readonly none: "m-0";
+            readonly xs: "m-1";
+            readonly sm: "m-2";
+            readonly md: "m-4";
+            readonly lg: "m-6";
+            readonly xl: "m-8";
+            readonly '2xl': "m-12";
+            readonly '3xl': "m-16";
+        };
+        /** Gap spacing */
+        readonly gap: {
+            readonly none: "gap-0";
+            readonly xs: "gap-1";
+            readonly sm: "gap-2";
+            readonly md: "gap-4";
+            readonly lg: "gap-6";
+            readonly xl: "gap-8";
+            readonly '2xl': "gap-12";
+            readonly '3xl': "gap-16";
+        };
+        /** Space between children */
+        readonly space: {
+            readonly none: "space-y-0";
+            readonly xs: "space-y-1";
+            readonly sm: "space-y-2";
+            readonly md: "space-y-4";
+            readonly lg: "space-y-6";
+            readonly xl: "space-y-8";
+            readonly '2xl': "space-y-12";
+            readonly '3xl': "space-y-16";
+        };
+    };
+    buildSpacingClasses: typeof buildSpacingClasses;
+    TYPOGRAPHIES: {
+        readonly body: "body";
+        readonly bodyLarge: "bodyLarge";
+        readonly bodySm: "bodySm";
+        readonly heading: "heading";
+        readonly headingLg: "headingLg";
+        readonly headingSm: "headingSm";
+        readonly display: "display";
+        readonly displayLg: "displayLg";
+        readonly displaySm: "displaySm";
+        readonly caption: "caption";
+        readonly overline: "overline";
+        readonly mono: "mono";
+        readonly label: "label";
+        readonly labelLg: "labelLg";
+        readonly labelSm: "labelSm";
+    };
+    typographyVariants: Record<FactorTypography, string>;
+    getTypographyClasses: typeof getTypographyClasses;
+    BORDERS: {
+        readonly none: "none";
+        readonly subtle: "subtle";
+        readonly solid: "solid";
+        readonly bold: "bold";
+        readonly dashed: "dashed";
+        readonly dotted: "dotted";
+        readonly double: "double";
+        readonly ring: "ring";
+        readonly ringBold: "ringBold";
+    };
+    borderVariants: Record<FactorBorder, string>;
+    getBorderClasses: typeof getBorderClasses;
+    OPACITIES: {
+        readonly transparent: "transparent";
+        readonly dim: "dim";
+        readonly light: "light";
+        readonly medium: "medium";
+        readonly high: "high";
+        readonly full: "full";
+    };
+    opacityVariants: Record<FactorOpacity, string>;
+    getOpacityClasses: typeof getOpacityClasses;
+    OVERFLOWS: {
+        readonly visible: "visible";
+        readonly hidden: "hidden";
+        readonly scroll: "scroll";
+        readonly auto: "auto";
+        readonly clip: "clip";
+        readonly scrollX: "scrollX";
+        readonly scrollY: "scrollY";
+        readonly hiddenX: "hiddenX";
+        readonly hiddenY: "hiddenY";
+    };
+    overflowVariants: Record<FactorOverflow, string>;
+    getOverflowClasses: typeof getOverflowClasses;
+    CURSORS: {
+        readonly default: "default";
+        readonly pointer: "pointer";
+        readonly grab: "grab";
+        readonly grabbing: "grabbing";
+        readonly move: "move";
+        readonly notAllowed: "notAllowed";
+        readonly wait: "wait";
+        readonly progress: "progress";
+        readonly text: "text";
+        readonly crosshair: "crosshair";
+        readonly help: "help";
+        readonly zoomIn: "zoomIn";
+        readonly zoomOut: "zoomOut";
+        readonly none: "none";
+    };
+    cursorVariants: Record<FactorCursor, string>;
+    getCursorClasses: typeof getCursorClasses;
+    Z_INDICES: {
+        readonly auto: "auto";
+        readonly base: "base";
+        readonly docked: "docked";
+        readonly dropdown: "dropdown";
+        readonly sticky: "sticky";
+        readonly banner: "banner";
+        readonly overlay: "overlay";
+        readonly modal: "modal";
+        readonly popover: "popover";
+        readonly skipLink: "skipLink";
+        readonly toast: "toast";
+        readonly tooltip: "tooltip";
+        readonly max: "max";
+    };
+    zIndexValues: Record<FactorZIndex, number | "auto">;
+    zIndexVariants: Record<FactorZIndex, string>;
+    getZIndexClasses: typeof getZIndexClasses;
+    getZIndexValue: typeof getZIndexValue;
+    TRANSITIONS: {
+        readonly none: "none";
+        readonly instant: "instant";
+        readonly fast: "fast";
+        readonly default: "default";
+        readonly slow: "slow";
+        readonly slower: "slower";
+        readonly smooth: "smooth";
+        readonly spring: "spring";
+        readonly bounce: "bounce";
+        readonly easeIn: "easeIn";
+        readonly easeOut: "easeOut";
+        readonly easeInOut: "easeInOut";
+    };
+    transitionVariants: Record<FactorTransition, string>;
+    getTransitionClasses: typeof getTransitionClasses;
+    FACTOR_17_24_DEFAULTS: Required<Factors17to24Config>;
+    getFactor17to24Default: typeof getFactor17to24Default;
+    applyFactors17to24: typeof applyFactors17to24;
+    clearFactorCache: typeof clearFactorCache;
+    getFactorCacheStats: typeof getFactorCacheStats;
+};
+export default Factors17to24;
+//# sourceMappingURL=factors-17-24.d.ts.map