import { PatternPaletteKey, PatternStyleKey } from './motifs'; /** * Configuración del componente `val-pattern`. * * @example Static (seed fijo, reproducible): * ```html * * ``` * * @example Animated whole-grid reshuffle (cada 10s): * ```html * * ``` * * @example Animated staggered (2 tiles cada 800ms — sutil): * ```html * * ``` * * @example Preset geométrico con paleta ember: * ```html * * ``` */ export interface PatternMetadata { /** * Palette built-in o array custom de 8 colores dark → light. * Built-ins: `'purple' | 'ink' | 'lavender' | 'midnight' | 'ember' | 'forest' | 'rose' | 'gold' | 'mono' * | 'teal' | 'ocean' | 'violet' | 'dusk' | 'slate'`. * Default: `'purple'`. */ palette?: PatternPaletteKey | string[]; /** * Preset de composición de familias de motifs. * - `branded` → Chevrons dominantes (identidad Valtech). Default. * - `geometric` → Triángulos, esquinas redondeadas y círculos. * - `minimal` → Mayoría sólido con trazos sutiles. Look corporativo limpio. * - `dense` → Mezcla rica de todas las familias. Máxima textura. * - `code` → Números, underscore `_` y chevrons. Look de terminal/código. * * Cuando se usa `style`, sobreescribe `chevronDensity`. */ style?: PatternStyleKey; /** Columnas del grid. Default: 12. */ cols?: number; /** Filas del grid. Default: 4. */ rows?: number; /** * Seed para Mulberry32 — determina el patrón. Si no se pasa, genera uno random * al mount y queda fijo (a menos que `animated: true`). */ seed?: number; /** * Densidad de chevrons (0..1). Ignorado si se pasa `style`. * Default: `0.55`. */ chevronDensity?: number; /** * Si `true`, el patrón anima tiles periódicamente. * Con `tilesPerTick: 0` (default): reseed completo de la grid. * Con `tilesPerTick > 0`: reshuffle parcial (staggered — más sutil). * Default: `false`. */ animated?: boolean; /** * ms entre updates (modo animated). * Default: `8000`. */ reshuffleInterval?: number; /** * Cuántos tiles cambiar por tick (modo animated). * `0` → reseed grid completa. `1-N` → staggered sutil. * Default: `0`. */ tilesPerTick?: number; /** * `slice` (default) — cubre todo el contenedor con crop si necesario. * `meet` — fit completo sin crop. */ preserveAspect?: 'slice' | 'meet'; /** * Si `true`, cada tile recibe una rotación aleatoria de 0/90/180/270°. * Multiplica la variedad visual sin añadir nuevos motifs. * Útil con `style: 'geometric'` o `'dense'`. Default: `false`. */ tileRotation?: boolean; }