Vercel Composition Patterns
supabase/supabase
React composition patterns that scale. An agent skill from supabase/supabase.
Compatibility entry point for React-library work in Octane; routes existing-binding maintenance to update-bindings and actual React implementation ports to octane-react-library-port.
Install React Library Port
$ npx skills add octanejs/octane --skill react-library-port -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install octanejs/octane react-library-port --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/octanejs/octane.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/react-library-port .claude/skills/react-library-port && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "react-library-port" agent skill from https://github.com/octanejs/octane/tree/main/.agents/skills/react-library-port into .claude/skills/react-library-port/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-library-port", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/octanejs/octane/tree/main/.agents/skills/react-library-portType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add octanejs/octane --skill react-library-port -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install octanejs/octane react-library-port --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/octanejs/octane.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/react-library-port .agents/skills/react-library-port && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "react-library-port" agent skill from https://github.com/octanejs/octane/tree/main/.agents/skills/react-library-port into .agents/skills/react-library-port/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-library-port", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add octanejs/octane --skill react-library-port -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install octanejs/octane react-library-port --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/octanejs/octane.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/react-library-port .cursor/skills/react-library-port && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "react-library-port" agent skill from https://github.com/octanejs/octane/tree/main/.agents/skills/react-library-port into .cursor/skills/react-library-port/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-library-port", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/octanejs/octane.git --path .agents/skills/react-library-port--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add octanejs/octane --skill react-library-port -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install octanejs/octane react-library-port --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/octanejs/octane.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/react-library-port .gemini/skills/react-library-port && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "react-library-port" agent skill from https://github.com/octanejs/octane/tree/main/.agents/skills/react-library-port into .gemini/skills/react-library-port/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-library-port", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install octanejs/octane react-library-portInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add octanejs/octane --skill react-library-port -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/octanejs/octane.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/react-library-port .github/skills/react-library-port && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "react-library-port" agent skill from https://github.com/octanejs/octane/tree/main/.agents/skills/react-library-port into .github/skills/react-library-port/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-library-port", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add octanejs/octane --skill react-library-port -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install octanejs/octane react-library-port --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/octanejs/octane.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/react-library-port .opencode/skills/react-library-port && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "react-library-port" agent skill from https://github.com/octanejs/octane/tree/main/.agents/skills/react-library-port into .opencode/skills/react-library-port/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-library-port", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
react-library-port- GitHub stars
- 1.5k
- Token cost
- ~274 tokens
- SKILL.md length
- 97 words
- Files
- 1
- Skills in repo
- 19
- Repo updated
- First seen
- Licence
- MIT
At a glance
Compatibility entry point for React-library work in Octane; routes existing-binding maintenance to update-bindings and actual React implementation ports to octane-react-library-port.
- Development work in your project
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
React Library Port is an agent skill from octanejs/octane. Compatibility entry point for React-library work in Octane; routes existing-binding maintenance to update-bindings and actual React implementation ports to octane-react-library-port.
Its SKILL.md is about 270 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Development. It works with React. The repository describes itself as: React’s programming model, compiled. The successor to Inferno. The licence is MIT.
When your agent uses it
- Development work in your project
Example prompts
- “/react-library-port”
What it can do on your machine
Read from SKILL.md and the folder at commit 961638e. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
React Library Port loads about 274 tokens when it runs. Until then it costs about 50 tokens; SKILL.md has 97 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from octanejs/octane at commit 961638e, republished under its MIT licence (© octanejs). 97 words, ~274 tokens.
Download SKILL.mdSave it as
.claude/skills/react-library-port/SKILL.md (or your agent's skills folder).- name
- react-library-port
- description
- Compatibility entry point for React-library work in Octane; routes existing-binding maintenance to update-bindings and actual React implementation ports to octane-react-library-port.
React library port compatibility entry point
This is the stable legacy entry point for React-library binding work.
For existing-binding audits, maintenance, lifecycle fixes, dependency/metadata updates, convenience imports, or reduction, load and follow update-bindings. A missing convenience wrapper does not justify porting framework-neutral code available through a direct import.
For a new React-library port or actual copied/rewritten React implementation, load and follow octane-react-library-port. Preserve supplied library names, versions, and npm/GitHub inputs. Its implementation, verification, and terminal requirements apply to that port; routing alone does not complete an authorized implementation. Preserve the user's scope and any existing shipping authorization.
© octanejs, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in .agents/skills/react-library-port of octanejs/octane.
Open the folder on GitHubat commit 961638e
Compare with similar skills
React Library Port next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| React Library Port this skilloctanejs/octane | 1.5k | — | ~274 | Automated safety check: Pass | MIT | |
| Vercel Composition Patternssupabase/supabase | 111k | 58 repos | ~726 | Automated safety check: Pass | MIT | |
| Electron Multi-Process ArchitectureiOfficeAI/AionUi | 33k | 1 repos | ~1.8k | Automated safety check: Pass | Apache-2.0 | |
| Nx Generatenomcopter/react-mosaic | 4.8k | 7 repos | ~1.9k | Automated safety check: Pass | Custom licence | |
| @pierre/diffs Code Renderingpierrecomputer/pierre | 6.3k | 2 repos | ~803 | Automated safety check: Pass | Apache-2.0 | |
| OpenTUI Terminal Interfacescline/cline | 70k | — | ~1.9k | Automated safety check: Pass | Apache-2.0 |
Similar skills
- Official
Electron Multi-Process Architecture
iOfficeAI/AionUi
Tells the agent where new code belongs in an Electron multi-process project and which APIs each process may use, with rules for new bridges, services, agents and workers.
Nx Generate
nomcopter/react-mosaic
Generate code using nx generators. An agent skill from nomcopter/react-mosaic.
@pierre/diffs Code Rendering
pierrecomputer/pierre
Guides an agent through using @pierre/diffs to render syntax-highlighted files and diffs, and to build editing and review surfaces in React or plain JavaScript.
OpenTUI Terminal Interfaces
cline/cline
Helps build terminal user interfaces with OpenTUI using its core imperative API or its React and Solid reconcilers, with references for layout, keyboard, animation and testing.
Claude Code Skill
codeaashu/claude-code
Development conventions and architecture guide for the Claude Code CLI repository.
More from octanejs/octane
All 19 skills in this repoPerformance Audit
octanejs/octane
Audit or defend Octane performance. An agent skill from octanejs/octane.
Update Bindings
octanejs/octane
Audit one, several, or all existing Octane bindings; implement selected maintenance findings or remove redundant copied files with evidence matched to source ownership.
Concise Code
octanejs/octane
Keep a change small and in the existing idiom - size the plan and weigh smaller alternatives before writing it, reuse the mechanism that already owns the behavior instead of adding a parallel one…
Handle Issue
octanejs/octane
Work a GitHub issue in the octane repo. An agent skill from octanejs/octane.
Migrate V8 To V9
octanejs/octane
Perform a complete @tanstack/react-table v8-to-v9 migration: hook and feature architecture, row-model slots, React state and subscriptions, rendering, composable tables, type helpers, and every…
Octane React Library Port
octanejs/octane
Implement and verify new React-library ports or copied/rewritten React surfaces in Octane bindings from npm names or npm/GitHub links/lists.
Related
Works with
Categories
Questions about React Library Port
What does React Library Port do?
Compatibility entry point for React-library work in Octane; routes existing-binding maintenance to update-bindings and actual React implementation ports to octane-react-library-port. React Library Port is an agent skill from octanejs/octane. Compatibility entry point for React-library work in Octane; routes existing-binding maintenance to update-bindings and actual React implementation ports to octane-react-library-port.
When should I use React Library Port?
React Library Port fits situations like: development work in your project.
How do I install React Library Port in Claude Code?
Run `npx skills add octanejs/octane --skill react-library-port -a claude-code`. Or copy the skill folder (.agents/skills/react-library-port in octanejs/octane) into .claude/skills/react-library-port in your project. Claude Code loads it when a task matches its description.
How do I install React Library Port in Codex?
Run `npx skills add octanejs/octane --skill react-library-port -a codex`. Or copy the skill folder (.agents/skills/react-library-port in octanejs/octane) into .agents/skills/react-library-port in your project. Codex loads it when a task matches its description.
Can I use React Library Port in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add octanejs/octane --skill react-library-port -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/react-library-port, .gemini/skills/react-library-port, .github/skills/react-library-port and .opencode/skills/react-library-port in your project.
What does React Library Port need to run?
SKILL.md names no scripts, command-line tools or credentials: React Library Port is instructions for the agent only.
Does React Library Port access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is React Library Port safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does React Library Port use?
React Library Port is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does React Library Port use?
About 274 tokens (SKILL.md is roughly 1.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to React Library Port?
Skills that share tags, products or a category with React Library Port: Vercel Composition Patterns (supabase/supabase, 111k stars), Electron Multi-Process Architecture (iOfficeAI/AionUi, 33k stars), Nx Generate (nomcopter/react-mosaic, 4.8k stars) and @pierre/diffs Code Rendering (pierrecomputer/pierre, 6.3k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains React Library Port?
octanejs (a GitHub organization) maintains it in octanejs/octane, which has 1,452 GitHub stars. The repository holds 19 skills in this directory. The repository was last updated on October 9, 2026.
Source: octanejs/octane on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.