Skip to content

Conversation

@Austin1serb
Copy link
Member

πŸš€ Add Experimental SSR-Safe zeroSSR.onClick() Runtime

Summary

This PR introduces an experimental 300B runtime that enables click-based UI state mutation in server components β€” no use client, no re-renders, and fully compatible with Tailwind’s data attribute variants.

βΈ»

βœ… Features Added
β€’activateZeroUiRuntime(variantKeyMap):
β€’Adds a global click listener.
β€’Handles data-ui="global:key(val1,val2,...)" and data-ui="scoped:key(val1,val2,...)".
β€’Cycles values on the data-* attribute target (either body or closest matching ancestor).
β€’zeroSSR.onClick() / scopedZeroSSR.onClick():
β€’Generates proper data-ui attributes as JSX props.
β€’Validates kebab-case keys and non-empty value arrays (in dev).
β€’Keeps server components static and interactive.

βΈ»

πŸ“ Files Added
β€’ packages/core/src/experimental/index.ts
β€’ packages/core/src/experimental/runtime.ts
β€’ packages/core/src/experimental/README.md (module-level docs)

βΈ»

πŸ§ͺ Usage Example

import { zeroSSR } from '@react-zero-ui/experimental';

Toggle Theme
Server Component with Interactivity

βΈ»

πŸ” Developer Notes
β€’ Runtime is opt-in and treeshakable.
β€’ Requires calling activateZeroUiRuntime() with the generated variantKeyMap.
β€’ Designed for use in Next.js 13+/RSC environments where client components are costly.

βΈ»

🧠 Motivation

Many devs want interactivity without sacrificing RSC performance. This PR unlocks a middle-ground: static UI components powered by Tailwind + data-attributes, enhanced with click-based transitions.

βΈ»

@vercel
Copy link

vercel bot commented Aug 6, 2025

The latest updates on your projects. Learn more about Vercel for Git β†—οΈŽ

Name Status Preview Comments Updated (UTC)
react-zero-ui βœ… Ready (Inspect) Visit Preview πŸ’¬ Add feedback Aug 6, 2025 3:12pm

@Austin1serb Austin1serb merged commit a83df23 into main Aug 6, 2025
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants