v0.12.0

puckeditor/puckv0.12.0Nov 23, 2023by chrisvxd

AI Summary

Adds support for React Server Components, significantly improves responsive behavior, introduces a Remix recipe, and allows direct CSS imports from the package.

Key Highlights

  • React Server Components support via `@measured/puck/rsc` bundle
  • Improved responsive behavior on small viewports
  • Remix recipe for generating a configured Remix v2 application
  • Direct CSS import from `@measured/puck/puck.css`

New Features

  • Server components bundle
  • Explicit RSC and CSS exports
  • Visibility toggle for the right-hand sidebar
  • Custom fields setting UI state during onChange
  • Exposure of field 'id' to custom fields
  • Improved accessibility and font stacks

Full Release Notes

The Puck docs now live at https://puckeditor.com/.

## Summary

This release introduces support for React Server Components (thanks @4leite), makes huge improvements to responsive behaviour (🙇‍♂️ @monospaced) and introduces a Remix recipe (ty @EarthlingDavey).

### ⚡️ React Server Components

Puck now supports React server components via the included `@measured/puck/rsc` bundle. You should import Render from this bundle instead of the main bundle if you need to support RSC:

```tsx
import { Render } from "@measured/puck/rsc";
 
export function Page() {
  return <Render config={config} data={data} />;
}
```

Docs:  https://puckeditor.com/docs/integrating-puck/server-components

### 📱 Responsive Improvements

Puck now behaves much better on small viewports! We’ll continue to iterate on this experience.

### ✨ Remix Recipe

The new [Remix recipe](https://github.com/measuredco/puck/tree/main/recipes/remix) enables you to generate a Remix Run v2 application configured with Puck.

### 💅 New CSS imports 
You can now import your CSS directly from the Puck package, instead of reaching into `dist`. This is backwards compatible.

```css
@import "@measured/puck/puck.css";
```

## Changelog

### Features

* support React server components via @measured/puck/rsc bundle ([90ac161](https://github.com/measuredco/puck/commit/90ac161513d0c8c84f6b2bb968f7e5400c732a0a))
* add explicit rsc and css exports ([0b6a527](https://github.com/measuredco/puck/commit/0b6a52792628225d392775ba6b3d549aab5be59b))
* improve responsive behaviour ([889b4c7](https://github.com/measuredco/puck/commit/889b4c7a91f1a9b95c9fd7d4b3cdb20b2ee4946b))
* add visibility toggle for right-hand sidebar ([3d6c5d4](https://github.com/measuredco/puck/commit/3d6c5d479f2237400e0dc7cab6d5ed5773058d3b))
* allow custom fields to set UI state during onChange ([388793c](https://github.com/measuredco/puck/commit/388793c9b0ac27b14a538b70357abd0dc4f26779))
* expose field "id" to custom fields ([849161e](https://github.com/measuredco/puck/commit/849161ef0e2e2e01f6a1b9f517ba4bcc66cf6bd1))
* improve IconButton accessibility ([4c71d39](https://github.com/measuredco/puck/commit/4c71d39d1138f0fc823ada04710d0057433475b7))
* add new monospaced font stack ([c484ea6](https://github.com/measuredco/puck/commit/c484ea6bae5e6283bf82860e9a84413e60720163))
* tweak Field input focus state ([8012afd](https://github.com/measuredco/puck/commit/8012afdd9be2e3bc96185b4f0208b3ebdef0ed21))


### Bug Fixes

* don't enable style pollution of input background color ([bb1a76b](https://github.com/measuredco/puck/commit/bb1a76b314f744b76197cb670c448abc7896a45e))
* don't reset array item labels when changing order ([57563e1](https://github.com/measuredco/puck/commit/57563e1da1826dbfa08a32fabb27153e4618ab40))
* ensure field icon and label are vertically aligned ([caa40e0](https://github.com/measuredco/puck/commit/caa40e0499570831e5779f9a6a031e38f054c3f8))
* ensure root render receives props from latest data API ([abb6ff1](https://github.com/measuredco/puck/commit/abb6ff1bd53d7f93ef0ac287290712943ca2c1ce))
* export missing PuckAction type ([f22f32d](https://github.com/measuredco/puck/commit/f22f32dc5569eaa9cea90f896cf4cdafc59940fe))
* fix rootResolver behaviour when using recommended root data API ([5c13de5](https://github.com/measuredco/puck/commit/5c13de58a335f2b4c81f2b424fee8b4a356fb563))
* migrate to @hello-pangea/dnd to fix defaultProps warning ([2c97362](https://github.com/measuredco/puck/commit/2c97362e15f5d2046dc216c6e5fc25f5199d0a37))
* prevent inconsistent default input font-size ([99f90b3](https://github.com/measuredco/puck/commit/99f90b3ba81bf286758685f7c2a457abaffeb2e1))
* show a default value when no placeholder set on external fields ([e30b5b6](https://github.com/measuredco/puck/commit/e30b5b69b6a9f6467db4b05c55ffdc5f1ecebcfb))
* stop `zones` getting wiped out if data prop updated ([0c4514f](https://github.com/measuredco/puck/commit/0c4514fcde24d0ba585fea0981d73e7a8188840f))
* stop style pollution into array field items ([03b89d5](https://github.com/measuredco/puck/commit/03b89d568ded7cae6eb34e0dcf45e60eb758b552))
* stretch external field table to width of modal ([f6d89f6](https://github.com/measuredco/puck/commit/f6d89f69f1a24f94479365b9d955a3ea60b17b8d))
* use correct root data API in next recipe example database ([b598144](https://github.com/measuredco/puck/commit/b5981446ee64a3b5451eb17b8d42263f42df179f))
* use Inter font in button type Buttons ([1973847](https://github.com/measuredco/puck/commit/19738473723c49ddb0d764864283bf597280c7c5))

**Full Changelog**: https://github.com/measuredco/puck/compare/v0.11.0...v0.12.0

## New Contributors

* @4leite made their first contribution in https://github.com/measuredco/puck/pull/197
* @monospaced made their first contribution in https://github.com/measuredco/puck/pull/230
* @EarthlingDavey made their first contribution in https://github.com/measuredco/puck/pull/227