@devigner-ui/icons-mcp 0.0.0-stage → 3.5.0

package/ATTRIBUTION.md

@@ -0,0 +1,85 @@
+# Attribution
+
+Devigner Icons is a free, open-source icon set. The **artwork is not original
+work**: it is derived from two existing open icon sets, merged, deduplicated,
+renamed and rebuilt as React components. This file records where every drawing
+came from and what each upstream set asks of you in return.
+
+If you ship these icons, you inherit these obligations. They are light, but
+they are real.
+
+## The two upstream sets
+
+| Set | Author | Icons here | Licence |
+| --- | --- | --- | --- |
+| [Iconsax](https://iconsax.io) | [Vuesax](https://vuesax.com) | 908 | Free for personal and commercial use |
+| [Solar Icon Set](https://www.figma.com/community/file/1166831539721848736) | [480 Design](https://www.figma.com/@480design) | 1,055 | [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/) |
+
+Every drawing in this repository sits in a `0 0 24 24` viewBox, whichever set
+it came from, so the coordinate system no longer tells the two apart. The
+repository does not record which set a given icon came from.
+
+## What Solar's CC BY 4.0 requires of you
+
+The Solar-derived icons are the larger half of this set, and CC BY 4.0 is an
+attribution licence. Using them, including in a commercial or closed-source
+product, is free, but you must credit the original author. The licence asks
+for the creator's name, a link to the licence, and an indication that changes
+were made.
+
+A credit line that satisfies it:
+
+> Icons from [Devigner Icons](https://icons.devigner.cc), derived from
+> [Solar Icon Set](https://www.figma.com/community/file/1166831539721848736) by
+> 480 Design, licensed under [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/),
+> and [Iconsax](https://iconsax.io) by Vuesax. Modified.
+
+Put it wherever you keep third-party notices: an about page, a credits screen,
+a `NOTICE` file, an open-source-licences list. It does not have to be visible
+on every page that draws an icon.
+
+CC BY 4.0 is not a copyleft licence: it does not require you to open-source
+your own project, and it does not stop you from selling what you build.
+
+## What was changed
+
+Neither set is shipped as it was published. The modifications, which CC BY 4.0
+requires be indicated:
+
+- **Merged.** Two sets combined into one namespace, with overlapping symbols
+  deduplicated.
+- **Renamed.** Names normalised to a single `PascalCase` scheme and exported as
+  `Icon<Name>`. Upstream names were not always preserved.
+- **Rebuilt as components.** Each symbol's separate style files were collapsed
+  into one React component with `fill` and `duotone` props selecting between
+  four drawings.
+- **Recoloured.** Fixed fills and strokes replaced with `currentColor` so
+  colour comes from CSS.
+- **Restroked.** Stroke width lifted to a `width` prop.
+- **Annotated.** Categories, tags, descriptions and 384-dimension search
+  embeddings generated for each icon. That metadata is original work.
+
+## Brand and trademark icons
+
+Roughly 35 icons in this set reproduce third-party logos and wordmarks: Apple,
+Google, Figma, Slack, Spotify, YouTube, PayPal, Windows, Adobe products, and
+around two dozen cryptocurrency marks.
+
+**These are not licensed by this project, and no licence in this repository
+grants you any right to them.** Trademarks belong to their respective owners
+and are governed by each owner's brand guidelines, not by CC BY, MIT, or
+anything else here. Using a company's logo to refer to that company is
+generally acceptable; using it to imply endorsement, or as part of your own
+branding, is generally not. Check the owner's terms before shipping one.
+
+## The code
+
+Everything that is not artwork (the React wrappers, the CLI, the build scripts,
+the type definitions, the website and the documentation) is original work, MIT
+licensed. See [LICENSE](LICENSE).
+
+## Corrections
+
+If you are one of the upstream authors and something here is wrong (a miscount,
+a wrong licence, a set credited that should not be, or a request to be removed),
+write to hello@remidevigner.pro and it will be fixed or the artwork pulled.

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @devigner-ui/icons-mcp
+
+## 3.5.0
+
+### Minor Changes
+
+- First release.

package/LICENSE

@@ -0,0 +1,77 @@
+Devigner Icons is a free and open-source project. Two different licences apply
+to two different parts of it.
+
+The CODE is MIT licensed and original work.
+The ICON ARTWORK is derived from third-party sets and carries their terms.
+
+See ATTRIBUTION.md for the full provenance of the artwork, what changed, and
+how to credit it in your own project.
+
+
+================================================================================
+CODE
+================================================================================
+
+Applies to the React components, the CLI, the build scripts, the type
+definitions, the generated metadata and embeddings, the website and the
+documentation.
+
+MIT License
+
+Copyright (c) 2026 Devigner
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+
+================================================================================
+ICON ARTWORK
+================================================================================
+
+The SVG path data is not original work. It is derived from two existing open
+icon sets:
+
+  Iconsax, by Vuesax                                            909 icons
+  https://iconsax.io
+  Free for personal and commercial use.
+
+  Solar Icon Set, by 480 Design                               1,055 icons
+  https://www.figma.com/community/file/1166831539721848736
+  Licensed under CC BY 4.0.
+  https://creativecommons.org/licenses/by/4.0/
+
+Both sets were modified: merged, deduplicated, renamed, recoloured to
+currentColor and rebuilt as React components.
+
+CC BY 4.0 requires attribution. If you ship the Solar-derived icons, free or
+commercial, open or closed, credit the original author somewhere you keep
+third-party notices:
+
+  Icons from Devigner Icons, derived from Solar Icon Set by 480 Design
+  (CC BY 4.0) and Iconsax by Vuesax. Modified.
+
+CC BY 4.0 does not require you to open-source your own project.
+
+
+================================================================================
+TRADEMARKS
+================================================================================
+
+Around 35 icons reproduce third-party logos and wordmarks. Those marks belong
+to their respective owners. Nothing in this licence grants any right to use
+them, and each owner's brand guidelines govern instead. See ATTRIBUTION.md.

package/README.md

@@ -1,3 +1,29 @@
-# Temporary Holding Version
+# @devigner-ui/icons-mcp
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+An [MCP](https://modelcontextprotocol.io) server for [Devigner Icons](https://icons.devigner.cc). It lets an AI coding tool find the right icon among 2,112 by what it means, then write the import and element for your framework.
+
+## Set up
+
+Add it to your client's MCP config:
+
+```json
+{
+  "mcpServers": {
+    "devigner-icons": { "command": "npx", "args": ["-y", "@devigner-ui/icons-mcp"] }
+  }
+}
+```
+
+## Tools
+
+| Tool | What it does |
+| --- | --- |
+| `search_icons` | Ranks icons against a description, such as "add to cart". Old names from before 3.5.0 match too. |
+| `get_icon` | The code for one icon in `react`, `vue`, `svelte`, `solid`, `angular`, `react-native` or `js`, or the raw `svg`, in any style. |
+| `list_categories` | Every category with its icon count. |
+
+Search runs the `@devigner-ui/icons` CLI, so it ranks exactly as `npx @devigner-ui/icons search` does. It ranks by meaning when `@xenova/transformers` is installed, and by keywords otherwise.
+
+## Licence
+
+MIT for the code, CC-BY-4.0 for the artwork. See ATTRIBUTION.md.

package/bin/server.mjs

@@ -0,0 +1,9 @@
+#!/usr/bin/env node
+/*
+ * The MCP server on stdio. Add it to a client's config as
+ * `npx -y @devigner-ui/icons-mcp`.
+ */
+import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
+import { createServer } from "../lib/server.mjs";
+
+await createServer().connect(new StdioServerTransport());

package/lib/server.mjs

@@ -0,0 +1,137 @@
+/*
+ * An MCP server over stdio, so an AI coding tool can find an icon by what it
+ * means and write the code that draws it.
+ *
+ * It does no searching of its own. Every lookup runs the @devigner-ui/icons
+ * CLI with --json, so the ranking, the old-name lookups and the SVG output
+ * are the ones `npx @devigner-ui/icons` gives, and cannot drift from them.
+ * Search is semantic when @xenova/transformers is installed beside it and
+ * falls back to keywords when it is not, exactly as the CLI does.
+ *
+ * bin/server.mjs connects this to stdio; scripts/check.mjs drives it in
+ * memory.
+ */
+import { execFile } from "node:child_process";
+import { createRequire } from "node:module";
+import path from "node:path";
+import { promisify } from "node:util";
+import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
+import { z } from "zod";
+
+const require = createRequire(import.meta.url);
+const CLI = path.join(path.dirname(require.resolve("@devigner-ui/icons/package.json")), "bin", "cli.mjs");
+const { version } = require("../package.json");
+
+const STYLES = ["outline", "twotone", "bold", "bulk", "broken"];
+const FRAMEWORKS = ["react", "vue", "svelte", "solid", "angular", "react-native", "js", "svg"];
+
+/** Runs the CLI and returns stdout, or throws with what it printed to stderr. */
+export async function cli(...args) {
+  try {
+    const { stdout } = await promisify(execFile)(process.execPath, [CLI, ...args], {
+      maxBuffer: 16 * 1024 * 1024,
+    });
+    return stdout;
+  } catch (error) {
+    throw new Error(String(error.stderr || error.message).trim());
+  }
+}
+
+/* The React package spells its styles in PascalCase; every other one in lowercase. */
+const REACT_STYLE = { outline: "Outline", twotone: "TwoTone", bold: "Bold", bulk: "Bulk", broken: "Broken" };
+
+/** How to draw one icon in one framework: the import and the element. */
+export function snippet(name, framework, style) {
+  const C = `Icon${name}`;
+  const v = style === "outline" ? "" : ` variant="${style}"`;
+  switch (framework) {
+    case "react":
+      return `import { ${C} } from "@devigner-ui/icons/${name}";\n\n<${C}${style === "outline" ? "" : ` variant="${REACT_STYLE[style]}"`} className="size-6" />`;
+    case "react-native":
+      return `import { ${C} } from "@devigner-ui/icons-react-native";\n\n<${C}${v} size={24} color="#16161a" />`;
+    case "vue":
+      return `<script setup>\nimport { ${C} } from "@devigner-ui/icons-vue";\n</script>\n\n<${C}${v} class="size-6" />`;
+    case "svelte":
+      return `<script>\n  import { ${C} } from "@devigner-ui/icons-svelte";\n</script>\n\n<${C}${v} class="size-6" />`;
+    case "solid":
+      return `import { ${C} } from "@devigner-ui/icons-solid";\n\n<${C}${v} class="size-6" />`;
+    case "angular":
+      return `import { DvIcon, ${C} } from "@devigner-ui/icons-angular";\n\n// imports: [DvIcon], and in the class: ${C} = ${C};\n<svg [dvIcon]="${C}"${v} class="size-6"></svg>`;
+    case "js":
+      return `import { toSvg, ${C} } from "@devigner-ui/icons-js";\n\nel.innerHTML = toSvg(${C}${style === "outline" ? "" : `, { variant: "${style}" }`});`;
+  }
+}
+
+const text = (value) => ({
+  content: [{ type: "text", text: typeof value === "string" ? value : JSON.stringify(value, null, 2) }],
+});
+
+/* What a search result carries: enough to choose, not the whole record. */
+const brief = (icon) => ({
+  name: icon.name,
+  category: icon.category,
+  keywords: icon.keywords,
+  usage: icon.usage,
+  ...(icon.formerly?.length ? { formerly: icon.formerly } : {}),
+});
+
+export function createServer() {
+  const server = new McpServer({ name: "devigner-icons", version });
+
+  server.registerTool(
+    "search_icons",
+    {
+      title: "Search icons",
+      description:
+        "Find Devigner icons by meaning, such as 'add to cart' or 'settings cog'. " +
+        "Returns names ranked best first. Old names from before 3.5.0 are matched too.",
+      inputSchema: {
+        query: z.string().min(1).describe("What the icon should show or mean"),
+        limit: z.number().int().min(1).max(50).optional().describe("How many results, default 10"),
+        category: z.string().optional().describe("Restrict to one category slug, from list_categories"),
+      },
+    },
+    async ({ query, limit = 10, category }) => {
+      const args = ["search", query, "--json", `--limit=${limit}`];
+      if (category) args.push(`--category=${category}`);
+      return text(JSON.parse(await cli(...args)).map(brief));
+    },
+  );
+
+  server.registerTool(
+    "get_icon",
+    {
+      title: "Get an icon",
+      description:
+        "The code to draw one icon: an import and an element for a framework, or the raw SVG. " +
+        "An old name is resolved to the current one.",
+      inputSchema: {
+        name: z.string().min(1).describe("Icon name, as search_icons returns it, e.g. BagStraps"),
+        framework: z.enum(FRAMEWORKS).optional().describe("Default react. 'svg' returns the markup itself"),
+        style: z.enum(STYLES).optional().describe("Default outline"),
+      },
+    },
+    async ({ name, framework = "react", style = "outline" }) => {
+      const icon = JSON.parse(await cli("info", name, "--json"));
+      const code =
+        framework === "svg"
+          ? (await cli("copy", icon.name, "--format=svg", `--style=${style}`)).trim()
+          : snippet(icon.name, framework, style);
+      const note = icon.name === name ? "" : `${name} was renamed to ${icon.name}.\n\n`;
+      return text(`${note}${code}`);
+    },
+  );
+
+  server.registerTool(
+    "list_categories",
+    {
+      title: "List categories",
+      description: "Every icon category slug with how many icons it holds, for narrowing search_icons.",
+      inputSchema: {},
+    },
+    async () => text(JSON.parse(await cli("categories", "--json"))),
+  );
+
+  return server;
+}
+

package/package.json

@@ -1,6 +1,52 @@
 {
   "name": "@devigner-ui/icons-mcp",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "3.5.0",
+  "description": "MCP server for Devigner Icons: lets AI coding tools search 2,112 icons by meaning and drop them into React, Vue, Svelte, Solid, Angular, React Native or plain SVG.",
+  "keywords": [
+    "icons",
+    "mcp",
+    "model-context-protocol",
+    "ai",
+    "claude",
+    "cursor",
+    "svg",
+    "icon-search"
+  ],
+  "license": "MIT AND CC-BY-4.0",
+  "author": "Devigner",
+  "homepage": "https://icons.devigner.cc",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/devigner-ui/icons.git",
+    "directory": "packages/icons-mcp"
+  },
+  "bugs": {
+    "url": "https://github.com/devigner-ui/icons/issues"
+  },
+  "type": "module",
+  "files": [
+    "bin",
+    "lib",
+    "ATTRIBUTION.md",
+    "CHANGELOG.md"
+  ],
+  "devDependencies": {},
+  "engines": {
+    "node": ">=20.0.0"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "bin": {
+    "devigner-icons-mcp": "./bin/server.mjs"
+  },
+  "dependencies": {
+    "@modelcontextprotocol/sdk": "^1.17.0",
+    "zod": "^3.25.0",
+    "@devigner-ui/icons": "^3.5.0"
+  },
+  "scripts": {
+    "test": "node scripts/check.mjs"
+  }
 }