ink task list

lista de tinta

Componentes de la lista de tareas para tinta

_{Apoye este proyecto al protagonizarlo y compartirlo. ¡Sígueme para ver en qué otros proyectos geniales estoy trabajando! ❤️}

Instalar

npm i ink-task-list

? Uso rápido

 import React from 'react' ;
import { render } from 'ink' ;
import { TaskList , Task } from 'ink-task-list' ;
import spinners from 'cli-spinners' ;

render (
    < TaskList >
        { /* Pending state */ }
        < Task
            label = "Pending"
            state = "pending"
        />

        { /* Loading state */ }
        < Task
            label = "Loading"
            state = "loading"
            spinner = { spinners . dots }
        />

        { /* Success state */ }
        < Task
            label = "Success"
            state = "success"
        />

        { /* Warning state */ }
        < Task
            label = "Warning"
            state = "warning"
        />

        { /* Error state */ }
        < Task
            label = "Error"
            state = "error"
        />

        { /* Item with children */ }
        < Task
            label = "Item with children"
            isExpanded
        >
            < Task
                label = "Loading"
                state = "loading"
                spinner = { spinners . dots }
            />
        </ Task >
    </ TaskList > ,
) ; 

? API

Lista de tareas

Envoltura opcional para contener una lista de Tasks .

Básicamente solo a <Box flexDirection="column"> ; Solo para el estilo y los fines semánticos.

niños

Tipo: ReactNode | ReactNode[]

Requerido

Pase en la lista de tareas

Tarea

Representa cada tarea.

etiqueta

Tipo: string

Requerido

estado

Tipo: 'pending'|'loading'|'success'|'warning'|'error'

Valor predeterminado: pending

estado

Tipo: string

Estado de la tarea para mostrar a la derecha de la label

producción

Tipo: string

Salida de una sola línea prefijada por → para mostrar debajo de la label

hilandero

Tipo:

 type Spinner = {
    interval : number
    frames : string [ ]
}

Requerido si el estado se está loading

Datos de spinner utilizados para el estado de carga. Pase en un spinner de CLI-Spinners por conveniencia.

es expandido

Tipo: boolean

Valor predeterminado: false

Si mostrar o no a los niños.

niños

Tipo: ReactNode | ReactNode[]

Pasar en uno o más componentes <Task>

Créditos

La interfaz de usuario del componente fue inspirada Listr y Listr2 ❤️