Saltar al contenido principal

​
Agregar ejemplos de código

Puedes agregar fragmentos de código en línea o bloques de código. Los bloques de código admiten opciones meta para el resaltado de sintaxis, títulos, resaltado de líneas, íconos y más.

​
Código en línea

Para indicar una palabra o frase como código, colócala entre acentos graves (`). 
Para indicar una `palabra` o `frase` como código, enciérrala entre acentos graves (`).

​
Bloques de código

Usa bloques de código con cercas encerrando el código entre tres acentos invertidos. Los bloques de código se pueden copiar y, si tienes el Asistente habilitado, los usuarios pueden pedir a la IA que explique el código. Especifica el lenguaje de programación para el resaltado de sintaxis y para habilitar opciones meta. Agrega cualquier opción meta, como un título o un ícono, después del lenguaje.
HelloWorld.java
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("¡Hola, mundo!");
    }
}

```java HelloWorld.java lines icon="java"
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("¡Hola, mundo!");
    }
}
```

​
Opciones de bloques de código

Puedes añadir opciones meta a tus bloques de código para personalizar su apariencia.
Debes especificar un lenguaje de programación para un bloque de código antes de añadir cualquier otra opción meta.

​
Sintaxis de opciones

  • Opciones de tipo string y booleanas: Envuelve con "", '' o sin comillas.
  • Opciones de expresión: Envuelve con {}, "" o ''.

​
Resaltado de sintaxis

Activa el resaltado de sintaxis especificando el lenguaje de programación después de las comillas invertidas de apertura de un bloque de código. Usamos Shiki para el resaltado de sintaxis y admitimos todos los lenguajes disponibles. Consulta la lista completa de lenguajes en la documentación de Shiki. 
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("¡Hola, mundo!");
    }
}

```java
class HelloWorld {
    public static void main(String[] args) {
        System.out.println("¡Hola, mundo!");
    }
}
```

​
Título

Añade un título para etiquetar tu ejemplo de código. Usa title="Your title" o una cadena en una sola línea.
Ejemplo de bloque de código
const hello = "mundo";

```javascript Ejemplo de bloque de código
const hello = "world";
```

​
Icono

Agrega un icono a tu bloque de código usando la propiedad icon. Consulta Iconos para ver todas las opciones disponibles. 
const hello = "world";

```javascript icon="square-js"
const hello = "world";
```

​
Resaltado de líneas

Resalta líneas específicas en tus bloques de código usando highlight con los números o rangos de líneas que quieras resaltar.
Ejemplo de resalte de líneas
const greeting = "¡Hola, mundo!";
function sayHello() {
  console.log(greeting);
}
sayHello();

```javascript Ejemplo de resaltado de líneas highlight={1-2,5}
const saludo = "¡Hola, mundo!";
function decirHola() {
  console.log(saludo);
}
decirHola();
```

​
Enfoque de líneas

Resalta líneas específicas en tus bloques de código usando focus con números de línea o rangos. ---MDX_CONTENTEND---
Ejemplo de enfoque de línea
const greeting = "¡Hola, mundo!";
function decirHola() {
  console.log(greeting);
}
decirHola();

```javascript Ejemplo de enfoque de líneas focus={2,4-5}
const greeting = "¡Hola, mundo!";
function sayHello() {
  console.log(greeting);
}
sayHello();
```

​
Mostrar números de línea

Muestra los números de línea en el lado izquierdo de tu bloque de código usando lines.
Mostrar números de línea Ejemplo de líneas
const greeting = "¡Hola, mundo!";
function decirHola() {
  console.log(greeting);
}
decirHola();

```javascript Mostrar números de línea Ejemplo líneas
const greeting = "¡Hola, mundo!";
function sayHello() {
  console.log(greeting);
}
sayHello();
```

​
Expandible

Permite que los usuarios expandan y contraigan bloques de código largos usando expandable.
Ejemplo expandible
from datetime import datetime, timedelta
from typing import Dict, List, Optional
from dataclasses import dataclass

@dataclass
class Book:
    title: str
    author: str
    isbn: str
    checked_out: bool = False
    due_date: Optional[datetime] = None

class Library:
    def __init__(self):
        self.books: Dict[str, Book] = {}
        self.checkouts: Dict[str, List[str]] = {}  # patron -> list of ISBNs

    def add_book(self, book: Book) -> None:
        if book.isbn in self.books:
            raise ValueError(f"Ya existe un libro con el ISBN {book.isbn}")
        self.books[book.isbn] = book

    def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None:
        if patron not in self.checkouts:
            self.checkouts[patron] = []

        book = self.books.get(isbn)
        if not book:
            raise ValueError("No se encontró el libro")

        if book.checked_out:
            raise ValueError("El libro ya está prestado")

        if len(self.checkouts[patron]) >= 3:
            raise ValueError("El usuario alcanzó el límite de préstamos")

        book.checked_out = True
        book.due_date = datetime.now() + timedelta(days=days)
        self.checkouts[patron].append(isbn)

    def return_book(self, isbn: str) -> float:
        book = self.books.get(isbn)
        if not book or not book.checked_out:
            raise ValueError("No se encontró el libro o no está prestado")

        late_fee = 0.0
        if datetime.now() > book.due_date:
            days_late = (datetime.now() - book.due_date).days
            late_fee = days_late * 0.50

        book.checked_out = False
        book.due_date = None

        # Quitar de los préstamos del usuario
        for patron, books in self.checkouts.items():
            if isbn in books:
                books.remove(isbn)
                break

        return late_fee

    def search(self, query: str) -> List[Book]:
        query = query.lower()
        return [
            book for book in self.books.values()
            if query in book.title.lower() or query in book.author.lower()
        ]

def main():
    library = Library()

    # Agregar algunos libros
    books = [
        Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"),
        Book("1984", "George Orwell", "978-0-452-28423-4"),
    ]

    for book in books:
        library.add_book(book)

    # Ejemplo de préstamo y devolución
    library.checkout_book("978-0-261-10295-4", "patron123")
    late_fee = library.return_book("978-0-261-10295-4")
    print(f"Multa por retraso: ${late_fee:.2f}")

if __name__ == "__main__":
    main()

```python Ejemplo desplegable expandable
from datetime import datetime, timedelta
from typing import Dict, List, Optional
from dataclasses import dataclass

# ...

if __name__ == "__main__":
    main()
```

​
Ajuste

Habilita el ajuste de texto para líneas largas con wrap. Esto evita el desplazamiento horizontal y facilita la lectura de líneas extensas.
Ejemplo de ajuste
const greeting = "¡Hola, mundo! Soy una línea de texto larga que se ajustará a la siguiente línea.";
function sayHello() {
  console.log(greeting);
}
sayHello();

```javascript Ejemplo de ajuste wrap
const greeting = "¡Hola, mundo! Soy una línea de texto larga que se ajustará a la siguiente línea.";
function sayHello() {
  console.log(greeting);
}
sayHello();
```

​
Diff

Muestra un diff visual de las líneas añadidas o eliminadas en tus bloques de código. Las líneas añadidas se resaltan en verde y las eliminadas en rojo. Para crear diffs, agrega estos comentarios especiales al final de las líneas en tu bloque de código:
  • // [!code ++]: Marca una línea como añadida (resaltado en verde).
  • // [!code --]: Marca una línea como eliminada (resaltado en rojo).
Para varias líneas consecutivas, especifica el número de líneas después de dos puntos:
  • // [!code ++:3]: Marca la línea actual más las dos siguientes como añadidas.
  • // [!code --:5]: Marca la línea actual más las cuatro siguientes como eliminadas.
La sintaxis de los comentarios debe coincidir con tu lenguaje de programación (por ejemplo, // para JavaScript o # para Python).
Ejemplo de diff
const greeting = "¡Hola, mundo!"; 
function sayHello() {
  console.log("¡Hola, mundo!"); 
  console.log(greeting); 
}
sayHello();

```js Diff Example icon="code" lines
const greeting = "¡Hola, mundo!"; // [!code ++]
function sayHello() {
  console.log("¡Hola, mundo!"); // [!code --]
  console.log(greeting); // [!code ++]
}
sayHello();
```
⌘I