Reference

CLI Reference

The StateGlyph CLI copies editable component source files into your project. Own the code — customize it however you need.

Overview

The CLI is an alternative to installing @stateglyph/react as a dependency. Instead of importing from a package, the CLI generates editable TypeScript component files directly in your project. This is useful when you want to customize icons or avoid adding a runtime dependency.

Requirements

•react and lucide-react installed in the receiving project
•Node.js 18 or newer
•No installation required — runs via npx

Commands

`list`

List all available icon names.

Terminal

$ npx @stateglyph/cli list
Available icons (31):  upload, download, save, delete, refresh,  sync, send, payment, add-to-cart, submit,  install, publish, play-pause, playback,  volume, microphone, camera, fullscreen,  repeat, shuffle, menu, expand, sidebar,  view, chevron-vertical, chevron-horizontal,  panel, copy, like, bookmark, notification

`add <name...>`

Copy one or more icon components into your project.

Terminal

$ npx @stateglyph/cli add upload✓ Created src/stateglyph/upload-state-icon.tsx

`add all`

Copy every available icon component.

Terminal

$ npx @stateglyph/cli add all✓ Created 31 icon components in src/stateglyph/

Adding multiple icons

Pass multiple icon names to add them in one command:

npx @stateglyph/cli add upload save download

Options

Flag	Default	Description
--dir <path>	src/stateglyph	Target directory for generated files. Will be created if it doesn't exist.
--force	false	Overwrite existing files. By default, existing files are preserved.

npx @stateglyph/cli add upload --dir src/components/icons

npx @stateglyph/cli add upload --force

Generated output

Each generated file is a self-contained component that imports from @stateglyph/core for definitions and lucide-react for SVG rendering. You can edit, extend, or refactor the generated code freely.

Generated component

// Generated file: src/components/stateglyph/upload-state-icon.tsx
import { uploadStateIcon } from "@stateglyph/core";import { StateIcon, type StateIconProps } from "@stateglyph/react";
export type UploadStateIconProps = Omit<  StateIconProps<typeof uploadStateIcon.states>,  "definition">;
export function UploadStateIcon(props: UploadStateIconProps) {  return <StateIcon definition={uploadStateIcon} {...props} />;}

For the full icon list, see Browse icons →