# Defaults (/themes/sdk/reference/consent/defaults)

```ts
import { … } from '@poltura/theme-sdk/consent';
```

## `Consent` [#consent]

The complete cookie consent: the banner until the shopper chooses and the preferences panel while it is open.

```ts
Consent(props: ConsentProps): ReactElement | null
```

The storefront draws it on every page. A theme replaces it with the default export of `src/layout/consent.tsx`; the stored choice and what it lets the trackers do stay the platform's.

**Props:** [`ConsentProps`](/themes/sdk/reference/consent/types-2#consentprops)

<Tab value='Example'>

```tsx
// src/layout/consent.tsx
import { ConsentBanner, ConsentPreferences, useConsent } from '@poltura/theme-sdk/consent';

export default function ThemeConsent() {
  const consent = useConsent();
  if (consent.decided && !consent.preferencesOpen) return null;
  return consent.preferencesOpen ? <ConsentPreferences /> : <ConsentBanner className='theme-consent' />;
}
```

</Tab>
<Tab value='Source'>

```tsx title="source/consent.tsx"
import type { ReactElement } from 'react';
import { ConsentBanner, ConsentPreferences, type ConsentProps } from '@poltura/theme-sdk/consent';

export function Consent({ className }: ConsentProps): ReactElement {
  return (
    <>
      <ConsentBanner className={className} />
      <ConsentPreferences className={className} />
    </>
  );
}
```

</Tab>


**See also:** [`ConsentBanner`](/themes/sdk/reference/consent/parts#consentbanner), [`ConsentPreferences`](/themes/sdk/reference/consent/parts#consentpreferences), [`useConsent`](/themes/sdk/reference/consent/hooks#useconsent)