SkillsAdd

lucianghinda/superpowers-ruby

hwc-navigation-content

>- Build Hotwire navigation and content-discovery flows: Turbo Frame pagination, tabbed navigation, lazy loading, faceted filtering/search, cache lifecycle, scroll restoration, and visit/render control. Prefer this skill when the core problem is request/response navigation state and browser history behavior. Use hwc-forms-validation for form validation and inline edit flows, hwc-realtime-streaming for WebSocket/Turbo Stream push updates, hwc-media-content for image/video/audio features, hwc-ux-…

First seen Mar 25, 2026

Installation

$ npx skills add lucianghinda/superpowers-ruby --skill hwc-navigation-content
View on skills.sh ↗ GitHub repository ↗

Similar popular skills

Related neighbors and high-traction skills in the same topics — useful to compare before installing.

flutter-implementing-navigation-and-routing Similar name
flutter/agent-plugins

Handles routing, navigation, and deep linking in a Flutter application. Use when moving between…

9.4K installs
react-navigation Similar name
callstackincubator/agent-skills

Provides React Navigation UI patterns for stacks, tabs, drawers etc. Use when building navigati…

2.1K installs
flutter-routing-and-navigation Similar name
flutter/agent-plugins

Move between or deep link to different screens or routes within a Flutter application

1.1K installs
swiftui-navigation Similar name
dpearson2699/swift-ios-skills

Implement SwiftUI navigation patterns including NavigationStack, NavigationSplitView, sheet pre…

3.7K installs
navigation-3 Similar name
android/skills

Learn how to install and migrate to Jetpack Navigation 3, and how to implement features and pat…

2.3K installs
initialize-ai-navigation Similar name
unity-technologies/skills

Sets up and configures the Unity AI Navigation system — NavMesh surfaces, NavMesh agents, obsta…

1.9K installs

Also in this package

Other skills from lucianghinda/superpowers-ruby · top by installs.

npx skills add lucianghinda/superpowers-ruby
ruby 123 rails-guides 95 test-driven-development 59 using-superpowers 51 sandi-metz-rules 49 37signals-style 48 brakeman 48 systematic-debugging 44 verification-before-completion 40 requesting-code-review 38

Browse all from lucianghinda/superpowers-ruby

More details

Agent compatibility

Declared targets from SKILL.md / docs. Unmarked agents are not listed — the skill may still install via the CLI.

Claude Code Not declared
Cursor Not declared
Codex Not declared
GitHub Copilot Not declared
Windsurf Not declared
Gemini CLI Not declared
Cline Not declared
OpenCode Not declared

Repository health

Stars 396
License LICENSE
Default branch main
Status Active

Package contents

Files included with this skill beyond the listing page.

  • skill md SKILL.md 2,893 B
  • docs SUMMARY.md 658 B

History

  1. First seen on skills.sh
  2. First recorded snapshot · 32 installs

SKILL.md

Navigation & Content Display

Implement navigation and content-discovery behavior with Turbo Drive and Turbo Frames.

Core Workflow

  1. Classify navigation mode: tabs, pagination, lazy frame loading, faceted search, or custom render/cache lifecycle.
  2. Decide URL and history ownership first (data-turbo-action, frame src, query params, back/forward behavior).
  3. Use frame lifecycle and visit events to update active state, request params, and scroll restoration.
  4. Clean transient UI state before Turbo cache snapshots.
  5. Validate behavior across forward/back navigation and refresh paths.

Guardrails

  • Update active/tab state on load/render events, not click intent events.
  • Keep URL state canonical for filters and pagination.
  • Avoid leaving transient UI artifacts in cache snapshots.
  • Use lazy loading deliberately; verify loading boundaries and observer behavior.

Load References Selectively

Open only the file needed for the current request.

  • Tabbed frame navigation: references/2023-06-20-turbo-frames-tabbed-navigation.md
  • Pagination + history management: references/2023-07-04-turbo-frames-pagination.md
  • Lazy frame lifecycle: references/2023-09-26-turbo-frames-lazy-loading-lifecycle.md
  • Scroll restoration: references/2023-09-12-turbo-frames-scroll-position-restoration.md
  • Cache lifecycle cleanup: references/2023-05-23-turbo-drive-cache-lifecycle.md
  • Custom render interception: references/2023-05-09-turbo-drive-custom-rendering.md
  • Conditional instant click strategy: references/2024-02-13-turbo-drive-conditional-instant-click.md
  • Faceted search with Stimulus: references/2024-12-10-stimulus-turbo-frames-faceted-search.md
  • Markdown preview flow: references/2024-10-08-turbo-frames-markdown-preview.md

Use references/INDEX.md for the full catalog.

Escalate to Neighbor Skills

  • Form submission and validation behavior: use hwc-forms-validation
  • Push-based real-time updates: use hwc-realtime-streaming
  • Media-specific interaction design: use hwc-media-content
  • Generic feedback/transitions and perceived-performance polish: use hwc-ux-feedback
  • Non-navigation Stimulus API fundamentals: use hwc-stimulus-fundamentals