Snippets con JavaScript: expansión de texto programable

A veces una plantilla no es suficiente. Necesitas calcular un valor, transformar texto o generar algo de forma programática. TypeSnap te permite escribir JavaScript directamente en tus snippets.

Hay dos formas de usar JavaScript: el tipo de contenido JavaScript (todo el snippet es un script) y la macro {{js:...}} (JavaScript en línea dentro de un snippet normal).

El tipo de contenido JavaScript

Cuando configuras el tipo de contenido de un snippet como JavaScript, todo el contenido se ejecuta como un script. El valor de retorno se convierte en el texto expandido.

Crea un nuevo snippet
Cambia el selector de Tipo de Texto plano a JavaScript
Escribe tu script. El valor de la última expresión (o un return explícito) es la salida.

Ejemplo: Contraseña aleatoria

Abreviatura: ;pass Tipo: JavaScript

const chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefghjkmnpqrstwxyz23456789!@#$%';
let password = '';
for (let i = 0; i < 16; i++) {
  password += chars[Math.floor(Math.random() * chars.length)];
}
password;

Escribe ;pass y obtienes una contraseña aleatoria de 16 caracteres. Una nueva cada vez.

Ejemplo: Unix timestamp

Abreviatura: ;unix Tipo: JavaScript

Math.floor(Date.now() / 1000).toString();

Ejemplo: Formateador de JSON

Abreviatura: ;jsonpretty Tipo: JavaScript

const raw = getClipboard();
try {
  JSON.stringify(JSON.parse(raw), null, 2);
} catch (e) {
  'JSON inválido en el portapapeles';
}

Copia un JSON minificado, escribe ;jsonpretty y obtienes la versión formateada. La función getClipboard() lee el contenido actual del portapapeles.

La macro de script en línea

Para snippets donde necesitas un valor calculado dentro de una plantilla más grande, usa la macro {{js:...}} o {{javascript:...}}:

Hoy es el día {{js:Math.ceil((new Date() - new Date(new Date().getFullYear(),0,1)) / 86400000)}} del año.

El script se ejecuta en línea y su resultado reemplaza la macro.

Ejemplo: Número de semana

Abreviatura: ;semana

Semana {{js:Math.ceil((((new Date() - new Date(new Date().getFullYear(),0,1)) / 86400000) + new Date(new Date().getFullYear(),0,1).getDay() + 1) / 7)}} de {{date:yyyy}}

Ejemplo: Cuenta regresiva

Abreviatura: ;navidad

{{js:Math.ceil((new Date(new Date().getFullYear(), 11, 25) - new Date()) / 86400000)}} días para Navidad

Funciones integradas disponibles

El sandbox de JavaScript de TypeSnap incluye funciones de ayuda:

Función	Descripción
`getDate()`	Fecha actual como cadena de texto
`getTime()`	Hora actual como cadena de texto
`getClipboard()`	Contenido actual del portapapeles
`uppercase(str)`	Convierte a mayúsculas
`lowercase(str)`	Convierte a minúsculas
`capitalize(str)`	Pone en mayúscula la primera letra de cada palabra
`trim(str)`	Elimina espacios al inicio y al final
`uuid()`	Genera un UUID v4
`getEnv(key)`	Lee variables de entorno permitidas
`formatDate(format)`	Formatea la fecha actual con una cadena de formato personalizada
`randomInt(min, max)`	Genera un número entero aleatorio en un rango
`join(array, sep)`	Une un array con un separador

El sandbox también expone variables de fecha y hora que puedes usar directamente: now (un objeto Date), year, month, day, hour, minute, second y weekday.

Ejemplo: Title case desde el portapapeles

Abreviatura: ;titlecase Tipo: JavaScript

capitalize(getClipboard());

Copia “el zorro marrón rápido”, escribe ;titlecase, obtén “El Zorro Marrón Rápido”.

Ejemplo: Contador de palabras

Abreviatura: ;cuentapalabras Tipo: JavaScript

const text = getClipboard();
const words = text.trim().split(/\s+/).length;
const chars = text.length;
words + ' palabras, ' + chars + ' caracteres';

Ejemplo: Generador de slug

Abreviatura: ;slug Tipo: JavaScript

lowercase(getClipboard())
  .replace(/[^a-z0-9\s-]/g, '')
  .replace(/\s+/g, '-')
  .replace(/-+/g, '-')
  .replace(/^-|-$/g, '');

Copia “Mi Título de Blog Post!”, escribe ;slug, obtén mi-titulo-de-blog-post.

Combinando JavaScript con campos de relleno

Los snippets de JavaScript pueden coexistir con macros de relleno. El diálogo de relleno aparece primero; luego el script se ejecuta con los valores ya ingresados disponibles.

Abreviatura: ;calc

{{input:Expresión}} = {{js:eval('{{input:Expresión}}')}}

Escribe ;calc, ingresa 24 * 365 en el diálogo, obtén 24 * 365 = 8760.

Seguridad

TypeSnap ejecuta JavaScript en un entorno sandbox. Los scripts:

No pueden acceder al sistema de archivos
No pueden hacer solicitudes de red
No pueden acceder a otras aplicaciones
No pueden ejecutar comandos de shell
Tienen acceso limitado a variables de entorno

El sandbox mantiene tu sistema seguro incluso si importas snippets de una fuente externa.

Cuándo usar JavaScript vs. macros

Usa macros ({{date}}, {{random}}, etc.) cuando una macro integrada cubra tu necesidad. Son más simples, rápidas y fáciles de leer.

Usa JavaScript cuando necesites:

Transformación de texto (conversión de mayúsculas, formato, codificación)
Cálculos matemáticos
Lógica condicional
Procesar contenido del portapapeles
Generar datos estructurados
Cualquier cosa que una macro no pueda hacer

Los snippets de JavaScript son la válvula de escape. Cuando las macros integradas no son suficientes, tienes un lenguaje de programación completo disponible.