@fabio.caffarello/react-design-system 2.0.1 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -116,10 +116,32 @@ npm run plop # scaffold a new component
116
116
 
117
117
  Consumers can import from:
118
118
 
119
- - `@fabio.caffarello/react-design-system` — all components, providers, hooks, tokens
120
- - `@fabio.caffarello/react-design-system/styles` — the bundled CSS
119
+ - `@fabio.caffarello/react-design-system` — the default entry. Everything: providers, hooks, all primitives, components, layouts, tokens. The emitted bundle carries `"use client";` so RSC frameworks (Next App Router 15+/16, etc.) accept it from a Server Component without crashing on `React.createContext`. The whole module is treated as a client boundary by the consumer's bundler.
120
+ - `@fabio.caffarello/react-design-system/server` — the opt-in server entry (issue #150). Re-exports only the components whose render tree is safe to evaluate inside a React Server Component: presentational primitives (`Text`, `Skeleton`, `Spinner`, `Progress`, `Chip`, `ErrorMessage`, `Info`), layout (`Container`, `Stack`), and structural / informational components (`Breadcrumb`, `Timeline`, `AutocompleteOption`, `DialogHeader`, `DialogFooter`, `DrawerHeader`, `DrawerFooter`, `HeaderActions`, `HeaderNavigation`, `MenuSeparator`, `NavbarSeparator`, `TableCell`). The bundle carries NO `"use client"` directive, so importing from it in a Server Component does NOT cross a client boundary — useful for SEO-critical / first-paint-critical routes where the shell shouldn't ship JS to the client.
121
+ - `@fabio.caffarello/react-design-system/styles` — the bundled CSS. Same stylesheet regardless of which JS entry you import.
121
122
 
122
- Sub-entries (`/primitives`, `/components`, `/tokens`, `/providers`) were removed in Phase 13dthey had been silently broken for external consumers since v1.0.0 because cross-chunk references to `cva` and other shared utilities failed at runtime. A single entry collapses the cross-chunk class of bug structurally; tree-shaking still works at the named-export level via any modern bundler.
123
+ The two JS entries can be mixed in one Server Component `import { Text } from "…/server"; import { Button } from "…"` is the normal pattern. The server entry is purely additive; consumers who never use it see no behavioural change.
124
+
125
+ ```tsx
126
+ // app/profile/page.tsx — a Next 16 App Router Server Component.
127
+ import { Button } from "@fabio.caffarello/react-design-system";
128
+ import { Text, Container } from "@fabio.caffarello/react-design-system/server";
129
+
130
+ export default function Profile() {
131
+ return (
132
+ <Container>
133
+ {/* Renders on the server, no JS shipped to the client for this part. */}
134
+ <Text variant="heading" as="h1">
135
+ Profile
136
+ </Text>
137
+ {/* Button is a Client Component; Next inserts the boundary. */}
138
+ <Button variant="primary">Edit</Button>
139
+ </Container>
140
+ );
141
+ }
142
+ ```
143
+
144
+ Sub-entries (`/primitives`, `/components`, `/tokens`, `/providers`) were removed in Phase 13d — they had been silently broken for external consumers since v1.0.0 because cross-chunk references to `cva` and other shared utilities failed at runtime. A single main entry collapses that class of bug structurally; tree-shaking still works at the named-export level via any modern bundler. The `./server` entry sidesteps the same regression by being its OWN independent Vite build with all third-party deps externalised — no chunks are shared between the two entries.
123
145
 
124
146
  ## Working with Claude Code
125
147