menu-scrolling

menu-scrolling is a skill for Claude Code, Codex from asmyshlyaev177/react-horizontal-scrolling-menu. It costs 120 tokens per session (3,303 once invoked), scanned A, original, MIT.

A set of controls for moving a React horizontal scrolling menu to a chosen item, forward, or backward. It can also control the menu from code outside the menu.

In plain words
What is it for?
Use it for carousels, tab bars, and other rows of horizontally scrolling React items. It supports clicking an item into view, next/previous buttons, and outside controls.
Why use it?
It avoids manually managing scroll positions and makes menu navigation predictable. It also helps when items have just been added or when navigation should move one page at a time.

Skill for Claude CodeCodex

Written for no agent in particular: nothing here depends on one.

Good fit Use it for carousels, tab bars, and other rows of horizontally scrolling React items. It supports clicking an item into view, next/previous buttons, and outside controls.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/asmyshlyaev177/react-horizontal-scrolling-menu/menu-scrolling
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add asmyshlyaev177/react-horizontal-scrolling-menu --skill menu-scrolling
Clone the repo
git clone --depth 1 https://github.com/asmyshlyaev177/react-horizontal-scrolling-menu

Made for: Claude Code, Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for menu-scrolling

README.md
[![agentmods](https://agentmods.dev/badge/skills/asmyshlyaev177/react-horizontal-scrolling-menu/menu-scrolling.svg)](https://agentmods.dev/skills/asmyshlyaev177/react-horizontal-scrolling-menu/menu-scrolling)
Your own site
<a href="https://agentmods.dev/skills/asmyshlyaev177/react-horizontal-scrolling-menu/menu-scrolling"><img src="https://agentmods.dev/badge/skills/asmyshlyaev177/react-horizontal-scrolling-menu/menu-scrolling.svg" alt="Measured on agentmods" height="20"></a>
Per session 120 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 3,303 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe. Third-party audits
  • NVIDIA SkillSpector warn 7 Sept 2026
SkillSpector: 7 findings, up to medium

These are SkillSpector’s own severities. On a checked sample its high-severity flags on skills were ~96% false positives — a documented command, a public API, a “never do X” rule — so we show them as a caution to read, not a verdict. Why →

  • medium Agent Snooping · line 371
    Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.
    Fix: Remove all code or instructions that list or read other skills' files or directories. Skills should operate independently; cross-skill access is a privilege escalation.
  • medium Agent Snooping · line 371
    Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.
    Fix: Remove all code or instructions that list or read other skills' files or directories. Skills should operate independently; cross-skill access is a privilege escalation.
  • medium Agent Snooping · line 379
    Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.
    Fix: Remove all code or instructions that list or read other skills' files or directories. Skills should operate independently; cross-skill access is a privilege escalation.
  • medium Agent Snooping · line 390
    Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.
    Fix: Remove all code or instructions that list or read other skills' files or directories. Skills should operate independently; cross-skill access is a privilege escalation.
  • medium Agent Snooping · line 386
    Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.
    Fix: Remove all code or instructions that list or read other skills' files or directories. Skills should operate independently; cross-skill access is a privilege escalation.
  • medium Agent Snooping · line 394
    Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.
    Fix: Remove all code or instructions that list or read other skills' files or directories. Skills should operate independently; cross-skill access is a privilege escalation.
  • medium Agent Snooping · line 392
    Skill enumerates or reads other installed skills. Access to other skills' SKILL.md files or the skills directory reveals prompt instructions, capabilities, and secrets that should be invisible to peer skills.
    Fix: Remove all code or instructions that list or read other skills' files or directories. Skills should operate independently; cross-skill access is a privilege escalation.
How audits are shown
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00120 $0.03303
Opus 5 $0.00060 $0.01651
Sonnet 5 $0.00024 $0.00661
Haiku 4.5 $0.00012 $0.00330

Measured 8d ago against content hash 46b17dd01d16, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-07, from the pricing page.

Security

Grade A, and why

menu-scrolling scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 8d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

skills/menu-scrolling/SKILL.md · 400 lines

How it starts

The opening of the file, as written. The whole thing — 400 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Imperative Scrolling

Setup

Click an item to center it. The api object comes from VisibilityContext inside the menu, from the apiRef prop outside it, and as the first argument of every callback prop (onInit, onUpdate, onWheel, onScroll).

import React from 'react';
import {
  ScrollMenu,
  VisibilityContext,
  type publicApiType,
} from 'react-horizontal-scrolling-menu';
import 'react-horizontal-scrolling-menu/dist/styles.css';

const ids = ['item-0', 'item-1', 'item-2', 'item-3', 'item-4', 'item-5'];

function Card({ itemId, title }: { itemId: string; title: string }) {
  const api = React.useContext<publicApiType>(VisibilityContext);
  return (
    <div
      role="button"
      tabIndex={0}
      style={{ width: '160px' }}
      onClick={() =>
        api.scrollToItem(api.getItemById(itemId), 'smooth', 'center')
      }
    >
      {title}
    </div>
  );
}

export function Menu() {
  return (
    <ScrollMenu>
      {ids.map((id) => (
        <Card itemId={id} key={id} title={id} />
      ))}
    </ScrollMenu>
  );
}

The blessed form is api.scrollToItem(api.getItemById(id), 'smooth', 'center') — a bare string id is a silent no-op (see Common Mistakes). getItemElementById(id) / getItemElementByIndex(index) are the advanced form: they query the DOM directly by data-key / data-index, which makes them stale-proof for items added in the current render.

Defaults (src/helpers.tsx:60,68-69; src/createApi.ts:131-132,152-153):

Method behavior inline block
scrollToItem 'smooth' 'end' 'nearest'
scrollPrev 'smooth' 'end' 'nearest'
scrollNext 'smooth' 'start' 'nearest'

behavior accepts 'auto' | 'instant' | 'smooth' and falls back to the transitionBehavior prop when one is set. The optional trailing { duration, boundary } argument only takes effect with noPolyfill={false} — the default native scroll ignores it.

Read the full file on GitHub · 400 lines

Files

What ships with it

1 file beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 8d ago First seen · 400 lines · 120 tokens per session scan A 46b17dd01d16

Subscribe to this mod's changes

menu-scrolling is a skill published in the GitHub repository asmyshlyaev177/react-horizontal-scrolling-menu (788 stars, last pushed 2d ago), licensed MIT. It adds 120 tokens to every session and 3,303 once invoked, about $0.0006 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

compiler-orchestrator

Orchestrate the Rust compiler port end-to-end. Discovers the current frontier, fixes failing passes, ports new passes, reviews, and commits in a loop.

react/react · 38 tokens

plan-update

Use when you need to update a plan document with deep research across all compiler passes. Launches parallel subagents to analyze how a topic affects every compiler phase, then consolidates findings into the plan doc.

react/react · 44 tokens

compiler-commit

Use when you want to verify compiler changes and commit with the correct convention. Runs tests, lint, and format, then commits with the [compiler] or [rust-compiler] prefix.

react/react · 42 tokens

copilotkit-integrations

Use when wiring an external agent framework (LangGraph, CrewAI, PydanticAI, Mastra, ADK, LlamaIndex, Agno, Strands, Microsoft Agent Framework, or others) into a CopilotKit application via the AG-UI protocol.

CopilotKit/CopilotKit · 61 tokens

a2ui-renderer

Render A2UI (Agent-to-UI declarative surfaces) in CopilotKit v2. Enable the runtime via CopilotRuntime({ a2ui: {...} }), then enable the provider via . Auto-activates via /info — do NOT manually pass renderActivityMessages. createA2UIMessageRenderer ships from @copilotkit/react-core/v2; low-level primitives…

CopilotKit/CopilotKit · 175 tokens

copilotkit-develop

Use when building AI-powered features with CopilotKit v2 -- adding chat interfaces, registering frontend tools, sharing application context with agents, handling agent interrupts, and working with the CopilotKit runtime.

CopilotKit/CopilotKit · 46 tokens