open-index/open-npm huggingface dataset:
npm package: @openstaticfish/actionflow
Description: A terminal UI tool for managing and installing GitHub Actions workflow templates
Author: OpenStaticFish
Latest version: 0.1.4

# ActionFlow

Interactive TUI for installing curated GitHub Actions workflows with a cyberpunk aesthetic.

## Features

- 🎨 **Cyberpunk UI**: Neon colors, smooth animations, modern terminal interface
- ⚡ **Fast Navigation**: Vim keys (j/k), arrow keys, number shortcuts
- 🎯 **Two-Panel Layout**: Browse workflows on the left, see details on the right
- 🔒 **Safe Installation**: Never overwrites without confirmation
- 📐 **Terminal Aware**: Warns if terminal is too small, adapts to window size
- 🎹 **Keyboard Driven**: No mouse required

## Installation

### Option 1: Install from GitHub (Recommended)

```bash
# Install globally from GitHub
bun install -g github:openstaticfish/actionflow
actionflow  # Available globally

# Or clone and link globally
git clone https://github.com/openstaticfish/actionflow.git
cd actionflow
bun link
actionflow  # Available globally
```

### Option 2: Clone and run locally

```bash
git clone https://github.com/openstaticfish/actionflow.git
cd actionflow
bun install
bun run src/tui/index.tsx
```

### Option 3: NPM (coming soon)

```bash
bun install -g @openstaticfish/actionflow
actionflow
```

## Keyboard Shortcuts

| Key | Action |
|-----|--------|
| `↑/↓` or `j/k` | Navigate workflows |
| `←/→` or `h/l` | Switch category |
| `Space` | Select/unselect current variant row |
| `Enter` | Open batch confirmation |
| `D / F` | Toggle dry-run / force in confirmation modal |
| `?` | Toggle help overlay |
| `q` or `Ctrl+C` | Quit |

## Available Workflows

### Category: `opencode`

| Workflow | Type | Variants | Description |
|----------|------|----------|-------------|
| `opencode/pr` | set | standard, nix | AI-powered PR code review |
| `opencode/opencode` | set | standard, nix | Slash command handler (/oc) |
| `opencode/triage` | set | standard | AI issue triage |

## Requirements

- Terminal with minimum 80x24 characters
- Truecolor support recommended (iTerm2, Kitty, Alacritty)
- Bun runtime

## Architecture

```
src/
├── tui/                      # TUI application
│   ├── index.tsx             # Entry point
│   ├── components/           # React components
│   │   ├── App.tsx
│   │   ├── Header.tsx
│   │   ├── Sidebar.tsx
│   │   ├── DetailPanel.tsx
│   │   ├── HelpOverlay.tsx
│   │   ├── TooSmallPopup.tsx
│   │   └── Spinner.tsx
│   ├── hooks/                # Custom hooks
│   │   ├── useTerminalSize.ts
│   │   ├── useWorkflows.ts
│   │   └── useNavigation.ts
│   ├── theme/
│   │   └── cyberpunk.ts      # Color palette
│   └── utils/
│       └── terminal-check.ts
├── core/
│   └── registry.ts           # Workflow discovery
└── models/
    └── workflow.ts           # Type definitions
```

## Theme Customization

Edit `src/tui/theme/cyberpunk.ts` to customize colors:

```typescript
colors: {
  bg: '#0a0a0f',           // Background
  primary: '#00f5ff',      // Cyan accent
  secondary: '#ff00ff',    // Magenta
  success: '#00ff88',      // Green
  warning: '#ffea00',      // Yellow
  error: '#ff0044',        // Red
  // ... more colors
}
```
npm package: @openstatus/react
Description: Create an account on [openstatus.dev](https://openstatus.dev), start monitoring your endpoints and include your own StatusWidget into your React Application.
Latest version: 0.0.3

# Status Widget

Create an account on [openstatus.dev](https://openstatus.dev), start monitoring
your endpoints and include your own StatusWidget into your React Application.

![Image of StatusWidget on openstatus.dev](https://openstatus.dev/assets/changelog/status-widget.png)

## Install

```bash
npm install @openstatus/react
pnpm add @openstatus/react
yarn add @openstatus/react
bun add @openstatus/react
```

## How to use the StatusWidget in your Next.js App Router

### Include the styles.css

If you are using tailwind, extend your config with:

```js
// tailwind.config.js
module.exports = {
  content: [
    "./app/**/*.{tsx,ts,mdx,md}",
    // OpenStatus Widget
    "./node_modules/@openstatus/react/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
};
```

Otherwise, include the styles in your App:

```tsx
// app/layout.tsx
import "@openstatus/react/dist/styles.css";
```

The `StatusWidget` is a React Server Component. Include the `slug` to your
status-page.

```tsx
import { StatusWidget } from "@openstatus/react";

export function Page() {
  return <StatusWidget slug="status" />;
}
```

## Headless getStatus utility function

If you would like to style it yourself, you can use the `getStatus` function to
access the type response of the api call to:

`https://api.openstatus.dev/public/status/:slug`

Learn more about our supported
[API endpoints](https://docs.openstatus.dev/api-reference/auth).

```ts
import { getStatus } from "@openstatus/react";

// React Server Component
async function CustomStatusWidget() {
  const res = await getStatus("slug");
  // ^StatusResponse = { status: Status }

  const { status } = res;
  // ^Status = "unknown" | "operational" | "degraded_performance" | "partial_outage" | "major_outage" | "under_maintenance"

  return <div>{/* customize */}</div>;
}
```

```ts
export type Status =
  | "operational"
  | "degraded_performance"
  | "partial_outage"
  | "major_outage"
  | "under_maintenance"
  | "unknown"
  | "incident";
```

Learn more in the [docs](https://docs.openstatus.dev/packages/react).

### About OpenStatus

OpenStatus is an open source monitoring services with incident managements.

Follow our journey [@openstatusHQ](https://x.com/openstatusHQ).
npm package: @openstax/highlighter
Description: Functionality for OpenStax note taking features including: - serializing highlights - deserializing highlights - versioned serialization strategies - extracting highlighted content - loading wrappers for styling highligted content - managing focus/scrolli
Latest version: 1.13.0

# Highlighter
Functionality for OpenStax note taking features including:
- serializing highlights
- deserializing highlights
- versioned serialization strategies
- extracting highlighted content
- loading wrappers for styling highligted content
- managing focus/scrolling to highlights

## Setup

install [nvm](https://github.com/creationix/nvm#installation)

```bash
# use the right version of node
nvm install

# install yarn, skip if you have it already
npm install -g yarn

# install dependencies
yarn
```

## To run in development

run these in separate terminals as you develop

```bash
# typescript type checking
yarn watch:ts

# unit tests
yarn watch:test
```

### reference changes from another project

do [yarn link](https://yarnpkg.com/lang/en/docs/cli/link/)

```bash
# watch for code changes and re-compile:
yarn watch
```

## to deploy
```bash
# do build
yarn build:clean

# push to npm (this updates package.json and makes a git tag)
yarn publish [--minor|--major|--patch]

# push to github
git push origin v$(yarn -s current)

# PR the version bump back into master (skip this for weirdo beta or release candidate tags)
open https://github.com/openstax/highlighter/compare/master...v$(yarn -s current)?expand=1
```

## Running the examples with docker

```bash

# builds the library for the examples to use
docker-compose run build

# runs the test server on port 8080
docker-compose up serve
```

## Deploy examples to gh-pages 

```bash
yarn build:clean && yarn deploy:examples
```