CookieConsent

Cookie consent banner: fixed bar that auto-shows on page load, persists accepted/rejected state in localStorage. Wraps child nodes (text, buttons) — no hardcoded content.

Supports Children: any

Structure

Children structure: outer Container (fixed banner bar with bg/shadow), inner Container (flex row, max-w-page, items-center, justify-between), Text node for consent message, Container with Accept/Reject Buttons using show-hide action targeting the banner anchor. All styling in className. Dismiss buttons must use action: { type: 'show-hide', target: '<anchor>', direction: 'hide', trigger: 'click', method: 'class' }.

Properties

Property	Type	Description	Examples
`anchor`	string	DOM id for show-hide targeting; auto-wired on drop Default: `"cookie-consent"`	-
`consentKey`	string	localStorage key for consent state (prefixed with ph-consent-). Change to create separate consent banners. Default: `"cookie-consent"`	-
`position`	string bottom \| top	Fixed position of the banner Default: `"bottom"`	-
`animation`	string slide-up \| slide-down \| fade \| none	- Default: `"slide-up"`	-
`showBackdrop`	boolean	Show a semi-transparent backdrop behind the banner Default: `false`	-
`backdropBlur`	boolean	Apply backdrop blur when showBackdrop is true Default: `false`	-
`blockScroll`	boolean	Prevent page scrolling until banner is dismissed Default: `false`	-
`showCloseButton`	boolean	- Default: `false`	-
`closeOnEscape`	boolean	Escape key dismisses banner (marks as rejected) Default: `true`	-
`canDelete`	boolean	- Default: `true`	-
`canEditName`	boolean	- Default: `true`	-
`custom`	object	-	-
`className`	string	Tailwind utility classes. The banner container itself — typically flex layout with padding.	`flex flex-colflex flex-col bg-base-200 text-base-content shadow-lg`
`root`	object	Editor-only container chrome	-