new-api-support
Add introspection support for a SwiftUI API (view type, modifier, or View extension function). Use when the user wants to add support for a new SwiftUI entity to ViewInspector.
Install
mkdir -p .claude/skills/new-api-support && curl -L -o skill.zip "https://mcp.directory/api/skills/download/5922" && unzip -o skill.zip -d .claude/skills/new-api-support && rm skill.zipInstalls to .claude/skills/new-api-support
About this skill
new-api-support
Add introspection support for a SwiftUI API (view type, modifier, or View extension function).
Usage
/new-api-support <entity_name>
Where <entity_name> is:
- A SwiftUI struct name (e.g.,
ContentUnavailableView,ProgressView) - A View extension function name (e.g.,
onAppear,disabled,opacity) - A modifier struct name (e.g.,
ScaledMetric)
Workflow
Step 1: Locate and Catalog the API
Find the API in the local iOS SDK (prefer local over network):
# Find SwiftUI interface files in Xcode SDK
find /Applications/Xcode.app/Contents/Developer/Platforms -name "SwiftUI.swiftmodule" -type d 2>/dev/null | head -5
# Search for the entity in SwiftUI interfaces
grep -r "<entity_name>" /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS.sdk/System/Library/Frameworks/SwiftUI.framework/Modules/SwiftUI.swiftmodule/*.swiftinterface 2>/dev/null | head -50
# For macOS SDK
grep -r "<entity_name>" /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX.sdk/System/Library/Frameworks/SwiftUI.framework/Modules/SwiftUI.swiftmodule/*.swiftinterface 2>/dev/null | head -50
Catalog ALL related APIs:
- For functions: Find all overloads (same name, different parameters)
- For structs: Find the struct definition AND any View extension functions that return this type
- Note ALL
@availableattributes for each API variant
Example catalog format:
Entity: .buttonStyle(_:)
Type: View extension function
Related APIs:
1. func buttonStyle<S>(_ style: S) -> some View where S : ButtonStyle
@available(iOS 13.0, macOS 10.15, tvOS 13.0, watchOS 6.0, *)
2. func buttonStyle<S>(_ style: S) -> some View where S : PrimitiveButtonStyle
@available(iOS 13.0, macOS 10.15, tvOS 13.0, watchOS 6.0, *)
Step 2: Research Usage Context
Understand HOW the API is meant to be used by researching its typical context:
-
Search for documentation and usage patterns:
- Use web search to find Apple documentation and WWDC sessions
- Look for common usage patterns in tutorials and Stack Overflow
- Identify which parent views/containers the API is typically used with
-
Identify related parent/child relationships:
Entity Type Find Related Context View inside container Which container views typically hold this view? (e.g., Tabgoes insideTabView)View modifier Which views is this modifier typically applied to? (e.g., subscriptionStoreButtonLabelapplies toSubscriptionStoreView)Container-specific modifier Which container makes this modifier meaningful? (e.g., listRowBackgroundon views insideList)Style modifier Which view type does this style affect? (e.g., buttonStyleonButton) -
Document the context for test design:
Example context analysis:
Entity: Tab Type: View Typical Context: Used as direct child of TabView Related APIs: TabView, tabItem (deprecated predecessor) Test Structure: Tab should be tested INSIDE TabView hierarchy Entity: subscriptionStoreButtonLabel Type: View modifier Typical Context: Applied to SubscriptionStoreView Related APIs: SubscriptionStoreView, SubscriptionStoreButton Test Structure: Apply modifier to SubscriptionStoreView, not EmptyView -
Check for container-dependent behavior:
- Some modifiers only work in specific contexts (e.g.,
listRowInsetsonly meaningful inList) - Some views only function inside specific parents (e.g.,
SectioninListorForm) - Test in the correct context to ensure real-world usability
- Some modifiers only work in specific contexts (e.g.,
Step 3: Determine File Placement
For new View types (structs like ProgressView, ContentUnavailableView):
- Create new file:
Sources/ViewInspector/SwiftUI/<ViewName>.swift - Create test file:
Tests/ViewInspectorTests/SwiftUI/<ViewName>Tests.swift
For View modifiers/functions, find the appropriate existing file by category:
| Category | Source File | Test File |
|---|---|---|
| Animation (.animation, .transition) | Modifiers/AnimationModifiers.swift | ViewModifiers/AnimationModifiersTests.swift |
| Configuration (.disabled, .labelsHidden) | Modifiers/ConfigurationModifiers.swift | ViewModifiers/ConfigurationModifiersTests.swift |
| Environment (.environment, .environmentObject) | Modifiers/EnvironmentModifiers.swift | ViewModifiers/EnvironmentModifiersTests.swift |
| Interaction (.onTapGesture, .onAppear) | Modifiers/InteractionModifiers.swift | ViewModifiers/InteractionModifiersTests.swift |
| Positioning (.offset, .position) | Modifiers/PositioningModifiers.swift | ViewModifiers/PositioningModifiersTests.swift |
| Sizing (.frame, .fixedSize) | Modifiers/SizingModifiers.swift | ViewModifiers/SizingModifiersTests.swift |
| Text input (.keyboardType, .textContentType) | Modifiers/TextInputModifiers.swift | ViewModifiers/TextInputModifiersTests.swift |
| Transform (.rotationEffect, .scaleEffect) | Modifiers/TransformingModifiers.swift | ViewModifiers/TransformingModifiersTests.swift |
| Navigation bar (.navigationTitle) | Modifiers/NavigationBarModifiers.swift | - |
| Custom styles (.buttonStyle, .pickerStyle) | Modifiers/CustomStyleModifiers.swift | - |
Check existing files to confirm the pattern:
grep -l "similar_modifier" Sources/ViewInspector/Modifiers/*.swift
Step 4: Reverse Engineering Investigation
Create a reverse engineering test to understand the internal structure:
import XCTest
import SwiftUI
@testable import ViewInspector
final class ReverseEngineeringTests: XCTestCase {
func testInvestigate_<EntityName>() throws {
// Create a simple view using the target API
let sut = EmptyView().<targetAPI>()
// Print the internal structure
print("\(Inspector.print(sut) as AnyObject)")
}
}
Run the investigation test:
swift test --filter "testInvestigate_"
Analyze the output to identify:
- The internal modifier/view type name (e.g.,
_AppearanceActionModifier) - Property names and their paths (e.g.,
appear,disappear) - Nested structure for complex types
- Whether it uses
ModifiedContentwrapper
Example Inspector.print output:
EmptyView
→ _AppearanceActionModifier
modifier: _AppearanceActionModifier
appear: Optional<() -> ()>
some: (Function)
disappear: Optional<() -> ()>
none
Iterate investigation for each API variant and parameter combination to understand all internal structures.
Step 5: Implement Introspection Support
For View modifiers, add to the appropriate Modifiers file:
@available(iOS 13.0, macOS 10.15, tvOS 13.0, *)
public extension InspectableView {
// For simple value extraction
func <modifierName>() throws -> <ReturnType> {
return try modifierAttribute(
modifierName: "<InternalModifierName>", // From Inspector.print
path: "modifier|<propertyPath>", // Path to the value
type: <ReturnType>.self,
call: "<modifierName>")
}
// For callback invocation
func call<CallbackName>() throws {
let callback = try modifierAttribute(
modifierName: "<InternalModifierName>",
path: "modifier|<callbackPath>",
type: (() -> Void).self,
call: "call<CallbackName>")
callback()
}
}
For new View types, create the full ViewType structure:
@available(iOS 16.0, macOS 13.0, tvOS 16.0, watchOS 9.0, *)
public extension ViewType {
struct NewViewType: KnownViewType {
public static let typePrefix: String = "NewViewType" // From Inspector.print
public static var namespacedPrefixes: [String] {
["SwiftUI.NewViewType"]
}
}
}
// MARK: - Content Extraction
@available(iOS 16.0, macOS 13.0, tvOS 16.0, watchOS 9.0, *)
extension ViewType.NewViewType: SingleViewContent { // or MultipleViewContent
public static func child(_ content: Content) throws -> Content {
return try Inspector.attribute(path: "content", value: content.view)
}
}
// MARK: - Extraction from View hierarchy
@available(iOS 16.0, macOS 13.0, tvOS 16.0, watchOS 9.0, *)
public extension InspectableView where View == ViewType.NewViewType {
// Add attribute getters based on Inspector.print analysis
func someAttribute() throws -> SomeType {
return try Inspector.attribute(
path: "attributePath",
value: content.view,
type: SomeType.self)
}
}
// MARK: - Global View hierarchy access
@available(iOS 16.0, macOS 13.0, tvOS 16.0, watchOS 9.0, *)
public extension InspectableView {
func newViewType(_ index: Int? = nil) throws -> InspectableView<ViewType.NewViewType> {
return try contentForModifierLookup.newViewType(parent: self, index: index)
}
}
@available(iOS 16.0, macOS 13.0, tvOS 16.0, watchOS 9.0, *)
internal extension Content {
func newViewType(parent: UnwrappedView, index: Int?) throws
-> InspectableView<ViewType.NewViewType> {
let call = "newViewType(\(index == nil ? "" : "\(index!)"))"
return try .init(try Inspector.attribute(path: "content", value: view),
parent: parent, call: call, index: index)
}
}
Step 6: Add Tests
IMPORTANT: Use contextual test structure based on Step 2 research.
Tests should reflect real-world usage patterns, not just technical functionality.
For views that belong inside specific containers:
import XCTest
import SwiftUI
@testable import ViewInspector
// Example: Tab is meant to be used inside TabView
@available(iOS 18.0, macOS 15.0, tvOS 18.0, watchOS 11.0, visionOS 2.0, *)
final class TabTests: XCTestCase {
// Test extraction in proper contex
---
*Content truncated.*
You might also like
flutter-development
aj-geddes
Build beautiful cross-platform mobile apps with Flutter and Dart. Covers widgets, state management with Provider/BLoC, navigation, API integration, and material design.
drawio-diagrams-enhanced
jgtolentino
Create professional draw.io (diagrams.net) diagrams in XML format (.drawio files) with integrated PMP/PMBOK methodologies, extensive visual asset libraries, and industry-standard professional templates. Use this skill when users ask to create flowcharts, swimlane diagrams, cross-functional flowcharts, org charts, network diagrams, UML diagrams, BPMN, project management diagrams (WBS, Gantt, PERT, RACI), risk matrices, stakeholder maps, or any other visual diagram in draw.io format. This skill includes access to custom shape libraries for icons, clipart, and professional symbols.
ui-ux-pro-max
nextlevelbuilder
"UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient."
godot
bfollington
This skill should be used when working on Godot Engine projects. It provides specialized knowledge of Godot's file formats (.gd, .tscn, .tres), architecture patterns (component-based, signal-driven, resource-based), common pitfalls, validation tools, code templates, and CLI workflows. The `godot` command is available for running the game, validating scripts, importing resources, and exporting builds. Use this skill for tasks involving Godot game development, debugging scene/resource files, implementing game systems, or creating new Godot components.
nano-banana-pro
garg-aayush
Generate and edit images using Google's Nano Banana Pro (Gemini 3 Pro Image) API. Use when the user asks to generate, create, edit, modify, change, alter, or update images. Also use when user references an existing image file and asks to modify it in any way (e.g., "modify this image", "change the background", "replace X with Y"). Supports both text-to-image generation and image-to-image editing with configurable resolution (1K default, 2K, or 4K for high resolution). DO NOT read the image file first - use this skill directly with the --input-image parameter.
fastapi-templates
wshobson
Create production-ready FastAPI projects with async patterns, dependency injection, and comprehensive error handling. Use when building new FastAPI applications or setting up backend API projects.
Related MCP Servers
Browse all serversCreate modern React UI components instantly with Magic AI Agent. Integrates with top IDEs for fast, stunning design and
Anki MCP Server: use AI to manage Anki decks, create basic & cloze cards, add cards and handle review queues via natural
Optimize your codebase for AI with Repomix—transform, compress, and secure repos for easier analysis with modern AI tool
Effortlessly create 25+ chart types with MCP Server Chart. Visualize complex datasets using TypeScript and AntV for powe
Easily integrate and debug Sentry APIs with sentry-mcp, a flexible MCP middleware for cloud and self-hosted setups.
Transform any OpenAPI specification into callable tools. Easily test an API, handle authentication, and generate schemas
Stay ahead of the MCP ecosystem
Get weekly updates on new skills and servers.