nativephp-webview-to-native

Converts NativePHP web-view screens into native SuperNative components with EDGE elements.

1|Updated Aug 4, 2026
One-click install
npx skills add https://github.com/LaravelDaily/nativephp-larapackagehunt --skill nativephp-webview-to-native-laraveldaily
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: nativephp-webview-to-native
Source: https://github.com/LaravelDaily/nativephp-larapackagehunt/tree/main/.agents/skills/nativephp-webview-to-native
Command: npx skills add https://github.com/LaravelDaily/nativephp-larapackagehunt --skill nativephp-webview-to-native-laraveldaily

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? NativePHP Mobile v4 apps often contain legacy web-view screens built with Livewire, Inertia, or Blade that render inside a web view instead of using native SwiftUI/Compose UI. Migrating these screens manually is error-prone because every HTML element, Livewire directive, and JavaScript device call has a different native equivalent. ## Core Features & Use Cases - Incremental Migration Strategy: Inventories web routes, Livewire components, and Inertia pages, then converts one screen at a time while web and native stacks coexist via exitToWeb() bridging. - Mapping Tables: Provides Livewire-to-SuperNative and HTML-to-EDGE conversion tables covering routing, data binding, events, chrome elements, icons, and fonts. - Device API Conversion: Replaces JavaScript #nativephp imports with PHP facades and #[On] event listeners that auto-teardown on unmount. - Use Case: A NativePHP app has a Livewire settings page and an Inertia item list rendering in the web view; this Skill converts them into NativeComponent classes registered with Route::native(), complete with native top bars, lists, and tests. ## Quick Start Ask the assistant to convert the Livewire or Inertia screens in your NativePHP app into native SuperNative screens one at a time.

Frequently Asked Questions about nativephp-webview-to-native

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert Livewire components to native screens in NativePHP?

Scaffold a NativeComponent with php artisan native:make, transfer public properties as-is, register the screen with Route::native(), and convert the Blade template using EDGE elements. Replace wire:model with native:model and wire:click with @tap.

How to migrate a NativePHP app from web view to native UI?

Migrate incrementally, one screen at a time, starting with simple high-traffic screens. Native and web stacks coexist during migration: native screens call exitToWeb() to reach remaining web routes, and web screens can link into native routes.

Can web-view and native screens coexist in NativePHP Mobile v4?

Yes, the web view remains available during migration so no big-bang rewrite is needed. Native screens jump to web screens with $this->exitToWeb('/legacy-route'), and web screens can link into native routes registered with Route::native().

Why does my HTML markup render nothing in a NativeComponent?

Raw HTML tags render nothing natively; every element must be an EDGE component such as native:column, native:text, or native:button. Also note that only the supported Tailwind subset applies, so arbitrary CSS-dependent classes may not work.

What if a native capability like maps or rich editors is missing?

Check the NativePHP plugin marketplace for an existing plugin, or build a custom plugin with php artisan native:plugin:create, which can ship native EDGE components. Use native:web-view only as the last resort rather than leaving the screen in the web view.