All rules

Sheath rule

native-safe-area-with-chrome

NativePHP safe-area utilities must not duplicate insets already supplied by native chrome.
Package
NativePHP
Category
Native
Default severity
warning by default
Auto-fix
Manual fix

#Why

Hoisted top bars, bottom navigation, side navigation, and qualifying bottom bars already add native edge insets. Applying a matching safe-area utility to screen content adds the same spacing again.

#Examples

#Bad

{{-- safe-area-top duplicates the inset already supplied by top-bar. --}}

<native:column class="safe-area-top">

    <native:top-bar title="Account" />

    <native:text>Profile</native:text>

</native:column>

#Good

{{-- top-bar supplies the top inset without an extra utility. --}}

<native:column>

    <native:top-bar title="Account" />

    <native:text>Profile</native:text>

</native:column>

#Chrome Detection

Native chrome that supplies insets includes top bars, bottom navigation, side navigation, and qualifying bottom bars. Custom chrome does not count because the application owns its insets.

A bottom bar contributes a native bottom inset only when a top bar or bottom navigation activates the native chrome wrapper. Platform-prefixed safe-area classes are checked only for their platform.

Mutually exclusive Blade branches do not conflict. Nested chrome that cannot be hoisted is also ignored.

#Options

All NativePHP rules accept nativeViewPaths. The default is ['views/native/']. See Native View Detection for path configuration.

#See Also

Related rules validate the chrome structure and class support: