Evaluate a component by checking framework and version, dependencies and runtime cost, responsive behavior, keyboard, focus, motion and contrast handling, source and license, content or data assumptions, browser support, customization surface, fallback behavior, update history, and maintenance owner. Test the exact delivered source in a clean project and record unknowns instead of assuming the preview proves readiness.
Evidence boundary
Three exact published React components from scheduling, data-display, and marketing families were checked against one reusable ten-minute screen. Their immutable delivered packages were then validated in the component-intake TypeScript project and their independent public adapters were replayed at desktop, mobile, and reduced-motion states. Interaction-specific checks exercised date-grid keyboard navigation, range input, pointer/touch-equivalent input, shader pause/resume, and forced fallback. Public metadata is treated as a declaration unless the observed test matrix proves the behavior directly.
Reviewed: by vro.dev clean-project and public-preview audit. Correction owner:support@vro.dev.
Tested matrix: Component-intake TypeScript clean project; Vite production public-preview build; Chromium · 1440 × 900; Chromium mobile · 390 × 844; Chromium · reduced motion
Reusable production-readiness checklist
01Framework and versionTen-minute screen: Confirm the exact framework, supported version, entry boundary, and client/runtime requirement. Deeper check: Compile the delivered package in a clean supported project.
02Dependencies and runtime impactTen-minute screen: List every direct dependency and identify the likely runtime or bundle cost. Deeper check: Build with only declared dependencies and measure against the final app budget.
03Responsive behaviorTen-minute screen: Check the authored container, narrow layout, overflow, touch targets, and content reflow. Deeper check: Replay the real component at desktop and mobile widths with production-length content.
04Keyboard, focus, motion, and contrastTen-minute screen: Identify semantic controls, focus behavior, announcements, reduced motion, and contrast-sensitive surfaces. Deeper check: Exercise keyboard paths, focus visibility, reduced motion, and an automated plus manual accessibility review.
05Source and licenseTen-minute screen: Verify the exact source-access state, versioned license, policy URL, and rights boundary. Deeper check: Retain the applicable receipt and verify the delivered package matches the licensed item/version.
06Content and data assumptionsTen-minute screen: Name caller-owned data, server validation, asset, timezone, sizing, and network assumptions. Deeper check: Replace fixture content with truthful production data and test empty, long, invalid, and failure states.
07Browser supportTen-minute screen: Separate declared browser support from browsers actually replayed. Deeper check: Run the final source in the project browser/device matrix and record exceptions.
08Customization surfaceTen-minute screen: Identify typed props, callbacks, local media, CSS boundaries, and behavior that must survive adaptation. Deeper check: Change realistic content and presentation without breaking semantics or interaction contracts.
09Failure and fallback behaviorTen-minute screen: Find network, asset, renderer, lifecycle, empty-state, and unsupported-runtime failure paths. Deeper check: Force the important failures and verify useful content and actions remain.
10Maintenance owner and update dateTen-minute screen: Record the public owner, exact version, update date, support route, and known limitations. Deeper check: Assign a recheck trigger for dependency, browser, license, data-contract, or source changes.
Three dated component assessments
Pass, fail, and unknown describe one fixed check. They are not a readiness score.
Three public component records checked against ten production-readiness topics.
Offer an accessible monthly date chooser with availability states, keyboard movement, a selected-date summary, and a caller-owned scheduling callback.
Clean-project evidence: The exact 1.0.0 package compiles in the component-intake TypeScript project with React and Lucide React. The public adapter was replayed at desktop and mobile widths, with an available-date selection, Arrow/Home/End and Page Up/Page Down navigation, and reduced motion.
Observed path: Available-date selection updates the polite selected-session summary; unavailable dates stay disabled; month and grid keyboard paths remain native and local-only.
Known unknowns: The dependency list is public, but the delivered package does not publish a current standalone bundle-byte measurement. Declared Safari, Firefox, and Edge support was not re-proved by this Chromium-focused checklist.
Remediation: Measure the delivered source inside the final app bundle; replay Safari, Firefox, and Edge; then connect timezone, capacity, and final availability validation to the application's server.
Compare two caller-owned images through hover or drag, optional autoplay and handlebar, pointer and touch input, keyboard range control, and a luminous sparkling divider.
Clean-project evidence: The exact 1.0.0 package compiles in the component-intake TypeScript project with React and Lucide React. The public adapter was replayed at desktop and mobile widths through pointer movement, keyboard range adjustment, and reduced motion.
Observed path: The native range control and bounded pointer path update one clipped comparison surface; the reviewed narrow layout retains the authored comparison frame and usable controls.
Known unknowns: The dependency list is public, but the delivered package does not publish a current standalone bundle-byte measurement. Declared Safari, Firefox, and Edge support was not re-proved by this Chromium-focused checklist.
Remediation: Measure the delivered source inside the final app bundle; replay Safari, Firefox, and Edge; use rights-cleared paired media with matching dimensions; and mount it in a predictably sized responsive container.
A live generative visual workspace with a full-bleed shader, static fallback, pause control, and conversion actions.
Clean-project evidence: The exact 1.0.0 package compiles in the component-intake TypeScript project with React, Lucide React, and Three.js. Its reviewed isolated production preview measured 654.64 KB JavaScript (175.96 KB gzip), and current public replay covers live rendering, pause/resume, reduced motion, resize, and a forced deterministic fallback.
Observed path: Pause freezes the decorative render loop while content and actions remain native; reduced motion produces a stable frame; forced WebGL failure retains the deterministic 2D visual and complete copy/action hierarchy.
Known unknowns: The isolated preview size is not the final application's incremental bundle cost, and GPU behavior still varies by device, driver, page composition, and concurrent visual work.
Remediation: Code-split the delivered shader, enforce the host performance budget, test target low-power devices, preserve renderer cleanup and context-loss fallback, and keep the final copy above the static layer at sufficient contrast.
Method and limits
This is a dated screening and clean-project evidence set, not a certification, readiness score, security audit, legal opinion, universal browser guarantee, or performance budget for the final host. Public previews are independent adapters and do not expose protected source. Re-run the checklist against the delivered version inside the real application, with production content, data, browser mix, CSP, monitoring, and performance budgets before shipping.