@iconoma/cli 0.0.1-beta.2 → 0.0.2

package/README.md

@@ -1,374 +1,91 @@
-@iconoma/cli
-=================
-
-A developer-friendly tool to manage and organize icons through CLI and web studio
-
-
-[![oclif](https://img.shields.io/badge/cli-oclif-brightgreen.svg)](https://oclif.io)
-[![Version](https://img.shields.io/npm/v/@iconoma/cli.svg)](https://npmjs.org/package/@iconoma/cli)
-[![Downloads/week](https://img.shields.io/npm/dw/@iconoma/cli.svg)](https://npmjs.org/package/@iconoma/cli)
-
-
-<!-- toc -->
-* [Usage](#usage)
-* [Commands](#commands)
-<!-- tocstop -->
-# Usage
-<!-- usage -->
-```sh-session
-$ npm install -g @iconoma/cli
-$ iconoma COMMAND
-running command...
-$ iconoma (--version)
-@iconoma/cli/0.0.1-beta.2 linux-x64 node-v20.19.6
-$ iconoma --help [COMMAND]
-USAGE
-  $ iconoma COMMAND
-...
-```
-<!-- usagestop -->
-# Commands
-<!-- commands -->
-* [`iconoma help [COMMAND]`](#iconoma-help-command)
-* [`iconoma plugins`](#iconoma-plugins)
-* [`iconoma plugins add PLUGIN`](#iconoma-plugins-add-plugin)
-* [`iconoma plugins:inspect PLUGIN...`](#iconoma-pluginsinspect-plugin)
-* [`iconoma plugins install PLUGIN`](#iconoma-plugins-install-plugin)
-* [`iconoma plugins link PATH`](#iconoma-plugins-link-path)
-* [`iconoma plugins remove [PLUGIN]`](#iconoma-plugins-remove-plugin)
-* [`iconoma plugins reset`](#iconoma-plugins-reset)
-* [`iconoma plugins uninstall [PLUGIN]`](#iconoma-plugins-uninstall-plugin)
-* [`iconoma plugins unlink [PLUGIN]`](#iconoma-plugins-unlink-plugin)
-* [`iconoma plugins update`](#iconoma-plugins-update)
-* [`iconoma studio`](#iconoma-studio)
-
-## `iconoma help [COMMAND]`
-
-Display help for iconoma.
-
-```
-USAGE
-  $ iconoma help [COMMAND...] [-n]
-
-ARGUMENTS
-  [COMMAND...]  Command to show help for.
-
-FLAGS
-  -n, --nested-commands  Include all nested commands in the output.
-
-DESCRIPTION
-  Display help for iconoma.
-```
-
-_See code: [@oclif/plugin-help](https://github.com/oclif/plugin-help/blob/v6.2.36/src/commands/help.ts)_
-
-## `iconoma plugins`
-
-List installed plugins.
-
-```
-USAGE
-  $ iconoma plugins [--json] [--core]
-
-FLAGS
-  --core  Show core plugins.
-
-GLOBAL FLAGS
-  --json  Format output as json.
-
-DESCRIPTION
-  List installed plugins.
-
-EXAMPLES
-  $ iconoma plugins
-```
-
-_See code: [@oclif/plugin-plugins](https://github.com/oclif/plugin-plugins/blob/v5.4.54/src/commands/plugins/index.ts)_
-
-## `iconoma plugins add PLUGIN`
-
-Installs a plugin into iconoma.
-
-```
-USAGE
-  $ iconoma plugins add PLUGIN... [--json] [-f] [-h] [-s | -v]
-
-ARGUMENTS
-  PLUGIN...  Plugin to install.
-
-FLAGS
-  -f, --force    Force npm to fetch remote resources even if a local copy exists on disk.
-  -h, --help     Show CLI help.
-  -s, --silent   Silences npm output.
-  -v, --verbose  Show verbose npm output.
-
-GLOBAL FLAGS
-  --json  Format output as json.
-
-DESCRIPTION
-  Installs a plugin into iconoma.
-
-  Uses npm to install plugins.
-
-  Installation of a user-installed plugin will override a core plugin.
-
-  Use the ICONOMA_NPM_LOG_LEVEL environment variable to set the npm loglevel.
-  Use the ICONOMA_NPM_REGISTRY environment variable to set the npm registry.
-
-ALIASES
-  $ iconoma plugins add
-
-EXAMPLES
-  Install a plugin from npm registry.
-
-    $ iconoma plugins add myplugin
-
-  Install a plugin from a github url.
-
-    $ iconoma plugins add https://github.com/someuser/someplugin
-
-  Install a plugin from a github slug.
-
-    $ iconoma plugins add someuser/someplugin
-```
-
-## `iconoma plugins:inspect PLUGIN...`
-
-Displays installation properties of a plugin.
-
-```
-USAGE
-  $ iconoma plugins inspect PLUGIN...
-
-ARGUMENTS
-  PLUGIN...  [default: .] Plugin to inspect.
-
-FLAGS
-  -h, --help     Show CLI help.
-  -v, --verbose
-
-GLOBAL FLAGS
-  --json  Format output as json.
-
-DESCRIPTION
-  Displays installation properties of a plugin.
-
-EXAMPLES
-  $ iconoma plugins inspect myplugin
-```
-
-_See code: [@oclif/plugin-plugins](https://github.com/oclif/plugin-plugins/blob/v5.4.54/src/commands/plugins/inspect.ts)_
-
-## `iconoma plugins install PLUGIN`
-
-Installs a plugin into iconoma.
-
-```
-USAGE
-  $ iconoma plugins install PLUGIN... [--json] [-f] [-h] [-s | -v]
-
-ARGUMENTS
-  PLUGIN...  Plugin to install.
-
-FLAGS
-  -f, --force    Force npm to fetch remote resources even if a local copy exists on disk.
-  -h, --help     Show CLI help.
-  -s, --silent   Silences npm output.
-  -v, --verbose  Show verbose npm output.
-
-GLOBAL FLAGS
-  --json  Format output as json.
-
-DESCRIPTION
-  Installs a plugin into iconoma.
-
-  Uses npm to install plugins.
-
-  Installation of a user-installed plugin will override a core plugin.
-
-  Use the ICONOMA_NPM_LOG_LEVEL environment variable to set the npm loglevel.
-  Use the ICONOMA_NPM_REGISTRY environment variable to set the npm registry.
-
-ALIASES
-  $ iconoma plugins add
-
-EXAMPLES
-  Install a plugin from npm registry.
-
-    $ iconoma plugins install myplugin
-
-  Install a plugin from a github url.
-
-    $ iconoma plugins install https://github.com/someuser/someplugin
-
-  Install a plugin from a github slug.
-
-    $ iconoma plugins install someuser/someplugin
-```
-
-_See code: [@oclif/plugin-plugins](https://github.com/oclif/plugin-plugins/blob/v5.4.54/src/commands/plugins/install.ts)_
-
-## `iconoma plugins link PATH`
-
-Links a plugin into the CLI for development.
-
-```
-USAGE
-  $ iconoma plugins link PATH [-h] [--install] [-v]
-
-ARGUMENTS
-  PATH  [default: .] path to plugin
-
-FLAGS
-  -h, --help          Show CLI help.
-  -v, --verbose
-      --[no-]install  Install dependencies after linking the plugin.
-
-DESCRIPTION
-  Links a plugin into the CLI for development.
-
-  Installation of a linked plugin will override a user-installed or core plugin.
-
-  e.g. If you have a user-installed or core plugin that has a 'hello' command, installing a linked plugin with a 'hello'
-  command will override the user-installed or core plugin implementation. This is useful for development work.
-
-
-EXAMPLES
-  $ iconoma plugins link myplugin
-```
-
-_See code: [@oclif/plugin-plugins](https://github.com/oclif/plugin-plugins/blob/v5.4.54/src/commands/plugins/link.ts)_
-
-## `iconoma plugins remove [PLUGIN]`
-
-Removes a plugin from the CLI.
-
-```
-USAGE
-  $ iconoma plugins remove [PLUGIN...] [-h] [-v]
-
-ARGUMENTS
-  [PLUGIN...]  plugin to uninstall
-
-FLAGS
-  -h, --help     Show CLI help.
-  -v, --verbose
-
-DESCRIPTION
-  Removes a plugin from the CLI.
-
-ALIASES
-  $ iconoma plugins unlink
-  $ iconoma plugins remove
-
-EXAMPLES
-  $ iconoma plugins remove myplugin
-```
-
-## `iconoma plugins reset`
-
-Remove all user-installed and linked plugins.
-
-```
-USAGE
-  $ iconoma plugins reset [--hard] [--reinstall]
-
-FLAGS
-  --hard       Delete node_modules and package manager related files in addition to uninstalling plugins.
-  --reinstall  Reinstall all plugins after uninstalling.
-```
-
-_See code: [@oclif/plugin-plugins](https://github.com/oclif/plugin-plugins/blob/v5.4.54/src/commands/plugins/reset.ts)_
-
-## `iconoma plugins uninstall [PLUGIN]`
-
-Removes a plugin from the CLI.
-
-```
-USAGE
-  $ iconoma plugins uninstall [PLUGIN...] [-h] [-v]
-
-ARGUMENTS
-  [PLUGIN...]  plugin to uninstall
-
-FLAGS
-  -h, --help     Show CLI help.
-  -v, --verbose
-
-DESCRIPTION
-  Removes a plugin from the CLI.
-
-ALIASES
-  $ iconoma plugins unlink
-  $ iconoma plugins remove
-
-EXAMPLES
-  $ iconoma plugins uninstall myplugin
-```
-
-_See code: [@oclif/plugin-plugins](https://github.com/oclif/plugin-plugins/blob/v5.4.54/src/commands/plugins/uninstall.ts)_
-
-## `iconoma plugins unlink [PLUGIN]`
-
-Removes a plugin from the CLI.
-
-```
-USAGE
-  $ iconoma plugins unlink [PLUGIN...] [-h] [-v]
-
-ARGUMENTS
-  [PLUGIN...]  plugin to uninstall
-
-FLAGS
-  -h, --help     Show CLI help.
-  -v, --verbose
-
-DESCRIPTION
-  Removes a plugin from the CLI.
-
-ALIASES
-  $ iconoma plugins unlink
-  $ iconoma plugins remove
-
-EXAMPLES
-  $ iconoma plugins unlink myplugin
-```
-
-## `iconoma plugins update`
-
-Update installed plugins.
-
-```
-USAGE
-  $ iconoma plugins update [-h] [-v]
-
-FLAGS
-  -h, --help     Show CLI help.
-  -v, --verbose
-
-DESCRIPTION
-  Update installed plugins.
-```
-
-_See code: [@oclif/plugin-plugins](https://github.com/oclif/plugin-plugins/blob/v5.4.54/src/commands/plugins/update.ts)_
-
-## `iconoma studio`
-
-Start the Iconoma Studio
-
-```
-USAGE
-  $ iconoma studio [-p <value>]
-
-FLAGS
-  -p, --port=<value>  port to listen on
-
-DESCRIPTION
-  Start the Iconoma Studio
-
-EXAMPLES
-  $ iconoma studio
-```
-
-_See code: [src/commands/studio.ts](https://github.com/theryston/iconoma/blob/v0.0.1-beta.2/src/commands/studio.ts)_
-<!-- commandsstop -->
+# Iconoma
+
+[![github](https://img.shields.io/badge/github-repo-blue?logo=github)](https://github.com/theryston/iconoma)
+[![Version](https://img.shields.io/npm/v/@iconoma/cli.svg)](https://npmjs.org/package/@iconoma/cli)
+[![Downloads/week](https://img.shields.io/npm/dw/@iconoma/cli.svg)](https://npmjs.org/package/@iconoma/cli)
+
+**Iconoma** is a complete **icon management system** (CLI + Studio) that helps teams and products **organize, standardize, version, and distribute icons** with a reliable workflow.
+
+Instead of keeping random SVG files scattered across the repo, Iconoma turns your icon library into a **structured, reproducible pipeline**: clean SVGs with SVGO, enforce consistency (colors, metadata, conventions), and generate the targets your apps need (SVG files, React components, React Native components).
+
+Start using it now by running this in your project:
+
+```bash
+npx @iconoma/cli studio
+```
+
+---
+
+## Why Iconoma
+
+Icon libraries tend to become messy as projects grow:
+
+- inconsistent sizes and alignment (icons "look bigger" even with the same size)
+- hardcoded colors that break themes/dark mode
+- duplicated icons with different names
+- manual export steps (time-consuming and error-prone)
+- multiple platforms needing different formats (Web + React + React Native)
+
+Iconoma solves that by providing a **single source of truth (the studio)** for your icon catalog and an automated build system.
+
+---
+
+## What you get
+
+### ✅ Icon catalog with metadata
+
+Each icon can have:
+
+- a canonical **name**
+- **tags** for search and organization
+- optimized SVG content
+- generated outputs (targets)
+
+This makes it easy to keep icons discoverable and consistent across the team.
+
+### ✅ SVGO optimization + custom configuration
+
+Iconoma uses **SVGO** to optimize and normalize your SVGs (removing unnecessary data, minimizing output, and improving consistency).
+
+You can **fully customize the SVGO config** to match your rules and design system (plugins, params, presets, etc.).
+
+### ✅ Color mapping and theming-friendly icons
+
+SVGs frequently arrive with hardcoded colors like `#000`, `#111`, `white`, etc.
+
+Iconoma supports a **color map** approach so you can convert colors into:
+
+- `currentColor`
+- CSS variables/tokens (e.g. `var(--icons-secondary)`)
+
+This makes icons theme-friendly and prevents "random SVG colors" from leaking into your UI.
+
+### ✅ Automatic target generation (React, React Native, SVG)
+
+Iconoma can automatically generate the targets you need, including:
+
+- **`.svg` files** (optimized/normalized)
+- **React components**
+- **React Native components**
+
+Targets are treated as build outputs, so you can keep a clean pipeline for multiple platforms.
+
+### ✅ Lockfile-based reproducible builds
+
+Iconoma keeps a lockfile called `iconoma.lock.json` that stores:
+
+- SVG hashes
+- config hashes
+- target outputs and what they were built from
+
+This makes builds **deterministic**, helps you to understand the changes using Git.
+
+### ✅ Studio (UI) integrated with the workflow
+
+Iconoma includes a "Studio" interface to make icon curation easier:
+
+- browse and search icons
+- preview icons in different sizes/themes
+- manage names/tags
+- validate consistency visually
+- run builds/transforms from a friendly UI

package/dist/commands/studio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"studio.d.ts","sourceRoot":"","sources":["../../src/commands/studio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAS,MAAM,aAAa,CAAC;AAO7C,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,OAAO;IACzC,OAAgB,IAAI,KAAM;IAC1B,OAAgB,WAAW,SAA8B;IACzD,OAAgB,QAAQ,WAA2C;IACnE,OAAgB,KAAK;;MAEnB;IAEW,GAAG,IAAI,OAAO,CAAC,IAAI,CAAC;CA8BlC"}
+{"version":3,"file":"studio.d.ts","sourceRoot":"","sources":["../../src/commands/studio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAS,MAAM,aAAa,CAAC;AAO7C,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,OAAO;IACzC,OAAgB,IAAI,KAAM;IAC1B,OAAgB,WAAW,SAA8B;IACzD,OAAgB,QAAQ,WAA2C;IACnE,OAAgB,KAAK;;MAEnB;IAEW,GAAG,IAAI,OAAO,CAAC,IAAI,CAAC;CA6BlC"}

package/dist/commands/studio.js

@@ -1,5 +1,5 @@
 import { Command, Flags } from "@oclif/core";
-import { getStudio } from "../get-studio.js";
+import { createServer } from "@iconoma/studio";
 import figlet from "figlet";
 import gradient from "gradient-string";
 import { createSpinner } from "nanospinner";
@@ -21,13 +21,13 @@ export default class Studio extends Command {
         console.log(coolGradient.multiline(text));
         const spinner = createSpinner("Starting Studio...").start();
         try {
-            const { createServer } = await getStudio();
             const { url } = await createServer({ port });
             await open(url, { wait: true });
             spinner.success({ text: `Studio started at ${url}` });
         }
-        catch {
+        catch (error) {
             spinner.error({ text: `Failed to start Studio` });
+            console.error(error);
             process.exit(1);
         }
     }

package/dist/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["../src/get-studio.ts","../src/index.ts","../src/commands/studio.ts"],"version":"5.9.3"}
+{"root":["../src/index.ts","../src/commands/studio.ts"],"version":"5.9.3"}

package/oclif.manifest.json

@@ -33,5 +33,5 @@
       ]
     }
   },
-  "version": "0.0.1-beta.2"
+  "version": "0.0.2"
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@iconoma/cli",
   "description": "A developer-friendly tool to manage and organize icons through CLI and web studio",
-  "version": "0.0.1-beta.2",
+  "version": "0.0.2",
   "author": "Theryston Santos @Theryston",
   "bin": {
     "iconoma": "bin/run.js"
@@ -14,15 +14,13 @@
   "dependencies": {
     "@oclif/core": "^4",
     "@oclif/plugin-help": "^6",
-    "@oclif/plugin-plugins": "^5",
     "figlet": "^1.9.4",
     "gradient-string": "^3.0.0",
     "nanospinner": "^1.2.2",
-    "open": "^11.0.0"
+    "open": "^11.0.0",
+    "@iconoma/studio": "0.0.4"
   },
   "devDependencies": {
-    "@iconoma/eslint-config": "workspace:*",
-    "@iconoma/typescript-config": "workspace:*",
     "@types/chai": "^4",
     "@types/mocha": "^10",
     "@types/node": "^18",
@@ -32,7 +30,9 @@
     "oclif": "^4",
     "shx": "^0.3.3",
     "ts-node": "^10",
-    "typescript": "^5"
+    "typescript": "^5",
+    "@iconoma/typescript-config": "0.0.0",
+    "@iconoma/eslint-config": "0.0.0"
   },
   "engines": {
     "node": ">=18.0.0"
@@ -44,7 +44,22 @@
   ],
   "homepage": "https://github.com/theryston/iconoma",
   "keywords": [
-    "oclif"
+    "oclif",
+    "iconoma",
+    "icon management",
+    "icons",
+    "studio",
+    "CLI",
+    "SVG",
+    "react",
+    "icon pipeline",
+    "icon optimizer",
+    "icon library",
+    "SVGO",
+    "design system",
+    "icon build",
+    "icon generator",
+    "react icons"
   ],
   "license": "MIT",
   "main": "dist/index.js",
@@ -54,13 +69,12 @@
     "dirname": "iconoma",
     "commands": "./dist/commands",
     "plugins": [
-      "@oclif/plugin-help",
-      "@oclif/plugin-plugins"
+      "@oclif/plugin-help"
     ],
     "topicSeparator": " ",
     "topics": {
-      "hello": {
-        "description": "Say hello to the world and others"
+      "studio": {
+        "description": "Start the Iconoma Studio"
       }
     }
   },
@@ -68,13 +82,9 @@
     "type": "git",
     "url": "git+https://github.com/theryston/iconoma.git"
   },
+  "types": "dist/index.d.ts",
   "scripts": {
-    "postbuild": "node scripts/bundle-studio.js",
     "build": "shx rm -rf dist && tsc -b",
-    "lint": "eslint",
-    "postpack": "shx rm -f oclif.manifest.json",
-    "prepack": "oclif manifest && oclif readme",
-    "version": "oclif readme && git add README.md"
-  },
-  "types": "dist/index.d.ts"
-}
+    "lint": "eslint"
+  }
+}

package/dist/get-studio.d.ts

@@ -1,9 +0,0 @@
-export declare function getStudio(): Promise<{
-    createServer: (options: {
-        port?: number;
-    }) => Promise<{
-        url: string;
-        close: () => Promise<void>;
-    }>;
-}>;
-//# sourceMappingURL=get-studio.d.ts.map

package/dist/get-studio.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"get-studio.d.ts","sourceRoot":"","sources":["../src/get-studio.ts"],"names":[],"mappings":"AAAA,wBAAsB,SAAS,IAAI,OAAO,CAAC;IACzC,YAAY,EAAE,CAAC,OAAO,EAAE;QACtB,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,KAAK,OAAO,CAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;KAAE,CAAC,CAAC;CAC5D,CAAC,CAGD"}

package/dist/get-studio.js

@@ -1,4 +0,0 @@
-export async function getStudio() {
-    const studioPath = "./studio/index.js";
-    return import(studioPath);
-}