clui

CLUI

This repository is no longer maintained

CLUI is a collection of JavaScript libraries for building command-line interfaces with context-aware autocomplete.

See Demo

Packages

@replit/clui-input

@replit/clui-input implements the logic for mapping text input to suggestions and a potential run function.

…

When the input matches a command with a run function, the onUpdate callback will include a reference to it.

const update = input({
  command: rootCommand,
  onUpdate: (updates) => {
    // call or store reference to `updates.run` based on user interaction
  },
});

update({ value: 'open sesame', index: 6 });

@replit/clui-input a framework agnostic primitive that can be wrapped by more specific framework or application code (like a react hook). If using react you will most likey want to keep the result of onUpdate in a state object. For managing dropdown selection UX I highly recommend downshift.

@replit/clui-session

@replit/clui-session implements the logic for rendering a list of react children. For building a CLI-style interfaces this can be useful for adding and removing lines when the prompt is submitted.

import React from 'react'
import { render } from 'react-dom'
import Session, { Do } from '@replit/clui-session';

/* `Do` is a helper that exposes the `item` prop
 * You will most likey render your own component
 * which will get `item` injected as a prop so 
 * that component can call `item.next` based
 * on specific application logic
 */
render(
  
    
      {item => next 1}
    
    
      {item => next 2}
    
    
      {item => next 3}
    
  ,
  document.getElementById('root'),
);

@replit/clui-gql

@replit/clui-gql is a utility library for building CLUI commands from GraphQL introspection data.

Install

npm install @replit/clui-gql

Usage

To create a tree of CLUI commands call toCommand and then visit each command to define a run function.

…

'parseArgs' is a helper for working with args

…