import { type PolicyUiActionDirection } from '@c15t/ui/utils'; import { type FC, type ReactNode } from 'react'; import type { InlineLegalLinksProps } from '../shared/primitives/legal-links'; /** * Identifiers for the available buttons in the consent banner. * @public */ export type ConsentBannerButton = 'reject' | 'accept' | 'customize'; /** * Structure for defining the layout of buttons in the consent banner. * Supports nesting for grouping buttons. * @public */ export type ConsentBannerLayout = (ConsentBannerButton | ConsentBannerButton[])[]; /** * Props for configuring and customizing the ConsentBanner component. * * @remarks * Provides comprehensive customization options for the consent banner's appearance * and behavior while maintaining compliance with privacy regulations. * * @public */ export interface ConsentBannerProps { /** * When true, removes all default styling from the component * @remarks Useful for implementing completely custom designs * @default false */ noStyle?: boolean; /** * Content to display as the banner's title * @remarks Supports string or ReactNode for rich content * @default undefined */ title?: ReactNode; /** * Content to display as the banner's description * @remarks Supports string or ReactNode for rich content * @default undefined */ description?: ReactNode; /** * Content to display on the reject button * @remarks Required by GDPR for explicit consent rejection * @default undefined */ rejectButtonText?: ReactNode; /** * Content to display on the customize button * @remarks Opens detailed consent preferences * @default undefined */ customizeButtonText?: ReactNode; /** * Content to display on the accept button * @remarks Primary action for accepting consent preferences * @default undefined */ acceptButtonText?: ReactNode; /** * When true, the consent banner will lock the scroll of the page * @remarks Useful for implementing a consent banner that locks the scroll of the page * @default false */ scrollLock?: boolean; /** * When true, the consent banner will trap focus * @remarks Useful for implementing a consent banner that traps focus * @default true */ trapFocus?: boolean; /** * When true, disables the entrance/exit animations * @remarks Useful for environments where animations are not desired * @default false */ disableAnimation?: boolean; /** * Controls which legal links to display. * * - `undefined` (default): Shows all available legal links * - `null`: Explicitly hides all legal links * - Array of keys: Shows only the specified legal links * * @defaultValue undefined * * @example * ```tsx * // Show all links * * * // Show no links * * * // Show only privacy policy * * ``` * * @remarks * You must set the legal links in the ConsentManagerProvider options. */ legalLinks?: InlineLegalLinksProps['links']; /** * When true, hides the branding tag on the banner. * @default false */ hideBranding?: boolean; /** * Defines the layout of buttons in the footer. * Allows reordering and grouping of buttons. * * @defaultValue [['reject', 'accept'], 'customize'] */ layout?: ConsentBannerLayout; /** * Defines how footer button groups flow. * * @defaultValue 'row' */ direction?: PolicyUiActionDirection; /** * Specifies which button(s) should be highlighted as the primary action. * * @defaultValue 'customize' */ primaryButton?: ConsentBannerButton | ConsentBannerButton[]; /** * Which consent models this banner responds to. * @default ['opt-in'] */ models?: import('c15t').Model[]; /** * Override the UI source identifier sent with consent API calls. * @default 'banner' */ uiSource?: string; } export declare const ConsentBanner: FC; /** * Component type definition for the ConsentBanner with its compound components. * * @remarks * This interface extends the base ConsentBanner component with additional sub-components * that can be used to compose the banner's structure. Each component is designed to be * fully accessible and customizable while maintaining compliance with privacy regulations. * * @public */