PAM Native UI component catalog

Every tag below creates or configures retained native UI. The release parity manifest is the source of truth for this verified surface: 62 modules and 84 component parts, on both Android and iOS.

The README, generated map, parity schema and executable release gate all use this same 62-module/84-component contract.

Android showcase application

The catalog below is also a real Android application. These images were captured from the release renderer on a physical Samsung SM-G973F running Android 12 (API 31) at 420 dpi—not from HTML, an emulator or a design mockup. The publication gate verified 90/90 screens and real interaction on 84/84 component routes, including input, selection, drag, scroll and native overlay flows. No blank render, invalid viewport or overlapping text is accepted into this page.

PAM Native UI showcase home on a physical Samsung Android device — Showcase home

Complete PAM Native UI component workbench on a physical Samsung Android device — 84 components

PAM Native UI actions showcase on a physical Samsung Android device — Actions

PAM Native UI forms showcase on a physical Samsung Android device — Forms

PAM Native UI data showcase on a physical Samsung Android device — Data

PAM Native UI overlays showcase on a physical Samsung Android device — Overlays

Actions, feedback and status

Module	Tags
Buttons	`p-btn`, `p-btn-group`, `p-btn-toggle`, `p-icon-btn`, `p-fab`
Status	`p-alert`, `p-badge`, `p-chip`, `p-chip-group`
Feedback	`p-snackbar`, `p-tooltip`, `p-progress-circular`, `p-progress-linear`, `p-skeleton-loader`
Overlays	`p-dialog`, `p-bottom-sheet`, `p-sheet`, `p-overlay`, `p-menu`

Input and forms

Module	Tags
Form	`p-form`, `p-text-field`, `p-textarea`, `p-number-input`, `p-otp-input`
Choice	`p-checkbox`, `p-switch`, `p-radio`, `p-radio-group`, `p-select`, `p-autocomplete`, `p-combobox`
Range	`p-slider`, `p-range-slider`, `p-rating`
Date and time	`p-calendar`, `p-calendar-day`, `p-date-input`, `p-date-picker`, `p-time-picker`
Color	`p-color-input`

Content and data

Module	Tags
Content	`p-avatar`, `p-icon`, `p-img`, `p-divider`, `p-empty-state`
Cards	`p-card`, `p-card-actions`
Lists	`p-list`, `p-list-item`, `p-item-group`, `p-item`
Data	`p-data-table`, `p-data-table-virtual`, `p-infinite-scroll`, `p-sparkline`
Expandable	`p-expansion-panels`, `p-expansion-panel`, `p-expansion-panel-title`, `p-expansion-panel-text`
Timeline	`p-timeline`, `p-timeline-item`

Use the virtual table and infinite-scroll components for large collections. Keep stable item keys and bounded event payloads so native reconciliation can reuse views rather than recreate them.

Module	Tags
App chrome	`p-app-bar`, `p-app-bar-nav-icon`, `p-toolbar`, `p-banner`, `p-banner-actions`
Tabs	`p-tabs`, `p-tab`
Carousels	`p-carousel`, `p-carousel-item`, `p-slide-group`, `p-slide-group-item`
Steppers	`p-stepper`, `p-stepper-header`, `p-stepper-item`, `p-stepper-window`, `p-stepper-window-item`, `p-stepper-actions`
Vertical steppers	`p-stepper-vertical`, `p-stepper-vertical-item`, `p-stepper-vertical-actions`
Trees	`p-treeview`, `p-treeview-item`
Floating actions	`p-speed-dial`

Product composition

Typed forms bind schema, values, errors, loading and submit behavior without inventing a second state model. Async content should model loading, empty, error and ready states explicitly. Navigation chrome belongs to the platform navigation primitives; component tags provide the visual and interactive content inside those destinations.

For app-owned reusable tags, register a PHP component with TemplateRegistry. Keep public tag inputs serializable and treat native events as an explicit, versioned contract.

Native interaction recordings

The touch markers in these GIFs are emitted by Android while the catalog is running. The examples exercise local native state, overlays, gestures and a system picker instead of replaying a prepared animation.

Switching the active PAM Native UI expansion panel — Expansion panels

Opening and dismissing a PAM Native UI dialog — Dialog and focus-safe overlay

Dragging a PAM Native UI native slider — UI-thread slider gesture

Opening the Android system time picker from PAM Native UI — Android system time picker

These captures exercise the retained Android views themselves. Navigation state survives configuration changes, overlays use native windows and safe areas, and gesture-driven controls update without a WebView or JavaScript bridge.

Using the navigation and overflow actions in a PAM Native UI app bar — Adaptive app bar and persistent navigation state

Opening and interacting with a native PAM Native UI bottom sheet — Native bottom sheet, scrim, focus and safe-area handling

Selecting a Material calendar day in PAM Native UI — 48 dp calendar-day target and controlled selection

Swiping between native PAM Native UI carousel pages — Native carousel gestures, indicators and continuous wrap

Complete Android visual catalog

Every specimen opens the original full-device capture. Anatomy tags remain listed separately even when they intentionally share the same composed example as their parent component.