You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Puck v0.15.0 introduces a powerful new API for dynamically defining fields, and exports Puck's internal field component for use within custom fields.
TLDR
Dynamic fields: Use the resolveFields API to dynamically build your fields object whenever the props change.
AutoField component: Puck's internal field component is now exported, for use within your own custom fields.
Override Publish button: Swap out the publish button without swapping out the entire header.
New puck.isEditing prop: Modify component behaviour based on whether it's inside <Puck> or <Render>.
Highlights
🪄 Dynamic fields
Dynamic field resolution via the resolveFields API allows you to change the field configuration whenever the props change. You can use this to show and hide fields or even load data from an API.
Render a Puck field based on a Field object. Use this when building custom fields that need to use Puck-style fields internally.
constCustomField=({ onChange, value })=>(<AutoFieldfield={{type: "text"}}onChange={onChange}value={value}/>);
🌐 Enable override of Publish button via headerActions
It's now possible to implement a custom Publish button without overriding the entire header by using the headerActions override.
<Puckoverrides={{headerActions: ({ children })=>(<>{/* children will render default Publish button */}{children}{/* Or you can define your own */}<button>Click me</button></>),}}/>;
This creates a breaking change for existing headerActions overrides, which will now need to render children to show the default Publish button.
🖊️ New puck.isEditing prop provided to all components
Components now receive the puck.isEditing prop. Use this to toggle functionality based on whether the component is being rendered in the <Puck> or <Render> contexts.
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
Puck v0.15.0 introduces a powerful new API for dynamically defining fields, and exports Puck's internal field component for use within custom fields.
TLDR
resolveFields
API to dynamically build your fields object whenever the props change.puck.isEditing
prop: Modify component behaviour based on whether it's inside<Puck>
or<Render>
.Highlights
🪄 Dynamic fields
Dynamic field resolution via the
resolveFields
API allows you to change the field configuration whenever the props change. You can use this to show and hide fields or even load data from an API.🔤 AutoField component
Render a Puck field based on a Field object. Use this when building custom fields that need to use Puck-style fields internally.
🌐 Enable override of Publish button via headerActions
It's now possible to implement a custom Publish button without overriding the entire header by using the
headerActions
override.This creates a breaking change for existing
headerActions
overrides, which will now need to renderchildren
to show the default Publish button.🖊️ New
puck.isEditing
prop provided to all componentsComponents now receive the
puck.isEditing
prop. Use this to toggle functionality based on whether the component is being rendered in the<Puck>
or<Render>
contexts.Breaking changes
headerActions
override must now render{children}
to show default Publish buttonIn order to support custom Publish buttons, the
headerActions
override will no longer render the default Publish button unlesschildren
are rendered.Deprecations
Undocumented
editMode
API deprecatedThe undocumented
editMode
prop is now deprecated in favor ofpuck.isEditing
.Changelog
Features
puck
object prop (13bb1bd)lastData
param (dd7051e)Bug Fixes
New Contributors
Full Changelog: v0.14.2...v0.15.0
This discussion was created from the release v0.15.0.
Beta Was this translation helpful? Give feedback.
All reactions