@kystverket/styrbord-consent 0.0.0

package/README.md

@@ -0,0 +1,145 @@
+# Styrbord Consent
+
+Samtykke for informasjonskapsler (cookie-banner, innstillingsdialog og tilhørende logikk) for
+Kystverkets interne og eksterne applikasjoner.
+
+Pakken står på egne bein: den bruker ikke `@kystverket/styrbord`, bare designtokenene, slik at
+også applikasjoner som ikke kan ta inn hele designsystemet får et samtykkebanner som ser ut som
+resten av Kystverket. Kontrollene den trenger — knapp, bryter, dialog — ligger i pakken og er
+bygget på de samme tokenene.
+
+Bygger på [c15t](https://c15t.com) i offline-modus: ingen backend, ingen nettverkskall, alt
+lagres i nettleseren.
+
+## Versjonering
+
+- Prosjektet følger semantisk versjonering (`major.minor.patch`).
+- Major inkrementeres ved knekkende endringer.
+- Minor inkrementeres ved ny funksjonalitet bakoverkompatibelt.
+- Patch inkrementeres ved feilrettinger og mindre forbedringer.
+
+## Bruk
+
+Importer CSS globalt én gang. Designtokenene følger med i denne fila, så det er den eneste
+importen som trengs — også i en applikasjon som ikke bruker Styrbord ellers.
+
+```js
+import '@kystverket/styrbord-consent/style.css';
+```
+
+> Bruker applikasjonen allerede `@kystverket/styrbord`, laster den tokenene to ganger. Verdiene
+> er de samme, så det koster noen kilobyte og ingenting annet.
+
+Legg `ConsentProvider` rundt applikasjonen og `CookieConsent` inni. Sistnevnte gir banner,
+innstillingsdialog og den flytende knappen som åpner innstillingene igjen.
+
+> Plasserer du flatene hver for seg i stedet, må `ConsentPreferencesDialog` alltid være med.
+> Både banneret og innstillingsknappen skjuler seg selv når de åpner innstillingene, så uten
+> dialogen forsvinner flaten uten at noe kommer i stedet. Pakken advarer i konsollet om den
+> oppdager det.
+
+```tsx
+import { ConsentProvider, CookieConsent, hotjarService, plausibleService } from '@kystverket/styrbord-consent';
+
+<ConsentProvider
+  language="nb-NO"
+  cookieDomain=".kystverket.no"
+  services={[plausibleService({ domain: 'kystverket.no' }), hotjarService({ siteId: 1234567 })]}
+>
+  {children}
+  <CookieConsent />
+</ConsentProvider>;
+```
+
+Les samtykke i egen kode med `useConsent`:
+
+```tsx
+const { hasConsent, showPreferences } = useConsent();
+
+if (hasConsent('measurement')) {
+  // ...
+}
+```
+
+### Felles samtykke på tvers av subdomener
+
+`cookieDomain` er mekanismen som gjør at ett svar gjelder flere applikasjoner: settes den til
+`.kystverket.no`, deler alle tjenester under domenet den samme informasjonskapselen, og
+brukeren slipper å ta stilling til det samme flere ganger.
+
+Appene må da bruke samme `storageKey` (standard `kystverket_consent`) og være enige om hvilken
+kategori hver tjeneste hører til — bruk `services.ts` framfor å definere tjenestene på nytt i
+hver app.
+
+La `cookieDomain` stå udefinert lokalt; da settes kapselen på gjeldende vertsnavn.
+
+> Send alltid inn `cookieDomain` som en prop utenfra. Biblioteket leser aldri miljøvariabler
+> selv, fordi rammeverk som Next.js og Vite baker dem inn på byggetidspunktet — en verdi lest
+> inne i biblioteket ville blitt låst til byggemiljøet.
+
+### Tjenester
+
+`plausibleService`, `hotjarService`, `postHogService` og `consentCookieService` er ferdige
+oppsett med riktig kategori og kapselliste. Andre tjenester defineres som vanlige
+`ConsentService`-objekter.
+
+Plausible lastes uten samtykke (`alwaysLoad`), fordi det verken setter informasjonskapsler
+eller lagrer noe som kan knyttes til enheten. `plausibleService({ domain, requireConsent: true })`
+legger det bak statistikk-kategorien i stedet.
+
+PostHog ligger bak statistikk, fordi det alltid teller sidevisninger og klikk:
+
+```tsx
+postHogService({
+  apiKey: 'phc_...',
+  sessionReplay: true, // sesjonsopptak og varmekart
+  capturePageview: false, // appen teller sidevisninger selv ved ruteendring
+});
+```
+
+Med `sessionReplay` gjør PostHog i tillegg det samme som Hotjar, og det hører hjemme under
+brukeropplevelse. Siden en tjeneste bare kan stå i én kategori i dialogen, løses det i kjøretid:
+skriptet starter med opptak avslått og slår det på når brukeren gir brukeropplevelse — også uten
+at siden lastes på nytt. Varmekart settes ved oppstart og er først med ved neste sidelast.
+
+API-nøkkelen er offentlig og hører hjemme i klientkoden, men send den likevel inn som en prop
+framfor å lese den i biblioteket — se avsnittet om `cookieDomain` over. CSP må åpne for både
+`eu.i.posthog.com` og `eu-assets.i.posthog.com`.
+
+### Kategorier
+
+Kategoriene er c15t sitt faste vokabular: `necessary`, `functionality`, `experience`,
+`measurement`, `marketing`. Det kan ikke utvides. Etikettene er våre egne, så det er usynlig
+for brukeren — og et fast vokabular er nettopp det som gjør at flere apper kan lese den samme
+informasjonskapselen og tolke den likt.
+
+### Tekster
+
+Bokmål, nynorsk og engelsk følger med. Overstyr enkelttekster med `translations`-propen:
+
+```tsx
+<ConsentProvider translations={{ banner: { heading: 'Egen overskrift' } }} …>
+```
+
+Tekstene ligger i biblioteket framfor i applikasjonens i18n-oppsett, slik at komponentene
+fungerer uavhengig av om appen bruker i18next, `@kystverket/sprak-react` eller ingenting.
+
+### Utseende
+
+Alt av farger, avstander, typografi og skygger leses fra `@kystverket/styrbord-tokens`. Flatene
+setter selv `data-color` på rotelementet sitt, slik at de ser like ut uansett hva applikasjonen
+rundt gjør.
+
+Skriften er `--ds-font-family` (Museo Sans) med en systemfont som reserve. Laster applikasjonen
+webfonten, brukes den; ellers faller teksten pent tilbake.
+
+Mørk modus følger `data-color-scheme` på et element lenger opp, på samme måte som i Styrbord.
+
+## Avhengigheter
+
+Følgende peer dependencies må være tilgjengelige i applikasjonen:
+
+- `react` (18.2 eller nyere)
+- `react-dom` (18.2 eller nyere)
+
+`c15t` og `@kystverket/styrbord-tokens` følger med som vanlige avhengigheter.

package/dist/src/components/ConsentBanner/ConsentBanner.d.ts

@@ -0,0 +1,10 @@
+import type { ReactElement } from 'react';
+/**
+ * Samtykkebanneret som vises til brukeren har tatt et valg.
+ *
+ * Bevisst ikke en modal: den låser ikke fokus og blokkerer ikke siden. Å sperre innholdet til
+ * brukeren har svart presser fram et samtykke, og et framtvunget samtykke er ikke gyldig etter
+ * GDPR. De tre valgene er likestilte — «Kun nødvendige» skal være like lett å treffe som
+ * «Godta alle».
+ */
+export declare function ConsentBanner(): ReactElement | null;

package/dist/src/components/ConsentBanner/ConsentBanner.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { type ConsentStoryArgs } from '../../../storybook/ConsentDemo';
+declare const meta: Meta<ConsentStoryArgs>;
+export default meta;
+type Story = StoryObj<ConsentStoryArgs>;
+/**
+ * Banneret er ikke en modal: det låser verken fokus eller siden bak seg. Et samtykke som er
+ * framtvunget ved å sperre innholdet er ikke gyldig etter GDPR, og de tre valgene er derfor
+ * også likestilte visuelt.
+ *
+ * `ConsentPreferencesDialog` står mountet ved siden av, som den må gjøre i en applikasjon også:
+ * «Velg selv» setter `activeUI` til `dialog`, og da skjuler banneret seg selv. Er ikke dialogen
+ * der til å ta over, forsvinner banneret uten at noe kommer i stedet, og brukeren sitter igjen
+ * uten vei videre.
+ */
+export declare const Default: Story;

package/dist/src/components/ConsentPreferencesDialog/ConsentPreferencesDialog.d.ts

@@ -0,0 +1,13 @@
+import { type ReactElement } from 'react';
+/**
+ * Innstillingsdialogen, der brukeren slår kategorier av og på enkeltvis.
+ *
+ * Kategoriene utledes av tjenestene applikasjonen faktisk laster — vi viser ikke valg som ikke
+ * styrer noe. Tjenester som går uten samtykke får sin egen «alltid på»-seksjon, slik at de er
+ * synlige selv om de ikke kan slås av; ellers ville en kapselfri tjeneste som Plausible vært
+ * usynlig for brukeren.
+ *
+ * Bygget på `<dialog>` direkte. `showModal()` gir fokusfelle, Escape og backdrop gratis, som er
+ * hele grunnen til at vi ikke trenger et dialogbibliotek for å klare oss uten Styrbord.
+ */
+export declare function ConsentPreferencesDialog(): ReactElement | null;

package/dist/src/components/ConsentPreferencesDialog/ConsentPreferencesDialog.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { type ConsentStoryArgs } from '../../../storybook/ConsentDemo';
+declare const meta: Meta<ConsentStoryArgs>;
+export default meta;
+type Story = StoryObj<ConsentStoryArgs>;
+/**
+ * Dialogen åpnet med én gang.
+ *
+ * Kategoriene og kapseltabellene er utledet av tjenestelista — det er ingen fast liste i
+ * komponenten. Plausible havner i «alltid på»-seksjonen fordi den går uten samtykke, mens
+ * Hotjar og PostHog får hver sin bryter.
+ */
+export declare const Default: Story;

package/dist/src/components/ConsentProvider/ConsentProvider.d.ts

@@ -0,0 +1,9 @@
+import { type ReactElement } from 'react';
+import type { ConsentProviderProps } from './ConsentProvider.types';
+/**
+ * Setter opp samtykkelageret og gjør det tilgjengelig for komponentene under.
+ *
+ * Legg `<CookieConsent />` inni for å få banner, dialog og innstillingsknapp, eller bygg ditt
+ * eget grensesnitt med `useConsent`.
+ */
+export declare function ConsentProvider({ children, language, translations: translationOverrides, ...config }: Readonly<ConsentProviderProps>): ReactElement;

package/dist/src/components/ConsentProvider/ConsentProvider.types.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from 'react';
+import type { ConsentConfig } from '../../utility/consent.types';
+import type { ConsentTranslations } from '../../utility/translations';
+export interface ConsentProviderProps extends ConsentConfig {
+    children: ReactNode;
+    /** Språkkode, f.eks. `nb-NO`. Styrer standardtekstene. Ukjente språk faller til bokmål. */
+    language?: string;
+    /**
+     * Overstyrer enkelttekster. Utelatte felter beholder standardteksten for språket, så det
+     * holder å sende inn det man faktisk vil endre.
+     */
+    translations?: Partial<ConsentTranslations>;
+}

package/dist/src/components/ConsentSettingsButton/ConsentSettingsButton.d.ts

@@ -0,0 +1,13 @@
+import type { ReactElement } from 'react';
+/**
+ * Flytende knapp nederst til høyre som åpner samtykkeinnstillingene igjen.
+ *
+ * Å trekke tilbake et samtykke skal være like enkelt som å gi det, så inngangen må være
+ * tilgjengelig fra hvor som helst på siden — ikke bare nederst i bunnteksten, der den krever
+ * at brukeren scroller helt ned for å finne den.
+ *
+ * Vises ikke mens banneret er oppe: banneret har allerede en «velg selv»-knapp, og to knapper
+ * som gjør det samme i samme hjørne er bare forvirrende. Vises heller ikke når applikasjonen
+ * ikke har noen tjenester som avhenger av samtykke, for da er det ingenting å administrere.
+ */
+export declare function ConsentSettingsButton(): ReactElement | null;

package/dist/src/components/ConsentSettingsButton/ConsentSettingsButton.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { type ConsentStoryArgs } from '../../../storybook/ConsentDemo';
+declare const meta: Meta<ConsentStoryArgs>;
+export default meta;
+type Story = StoryObj<ConsentStoryArgs>;
+/**
+ * Knappen slik den ser ut etter at brukeren har svart på banneret. Den vises ikke mens banneret
+ * står oppe — banneret har allerede en «Velg selv»-knapp, og to innganger til det samme i
+ * samme hjørne er bare forvirrende.
+ */
+export declare const Default: Story;

package/dist/src/components/CookieConsent/CookieConsent.d.ts

@@ -0,0 +1,18 @@
+import type { ReactElement } from 'react';
+/**
+ * Samtykkeflatene samlet: banner, innstillingsdialog og knappen som åpner den igjen.
+ *
+ * Legges én gang inne i `<ConsentProvider>`, typisk nederst i applikasjonens layout.
+ */
+export declare function CookieConsent(): ReactElement;
+/**
+ * Samtykkeinnstillingene som en vanlig tekstlenke, til bruk i løpende tekst — for eksempel i
+ * en personvernerklæring som omtaler informasjonskapsler.
+ *
+ * Et alternativ til knappen i hjørnet for de som heller vil ha inngangen i bunnteksten eller
+ * midt i en tekst. Det er en `<button>`, ikke en `<a>`: den navigerer ingen steder, og en lenke
+ * uten mål er både uventet for skjermlesere og ubrukelig å åpne i ny fane.
+ */
+export declare function ManageConsentLink({ className }: Readonly<{
+    className?: string;
+}>): ReactElement;

package/dist/src/components/CookieConsent/CookieConsent.stories.d.ts

@@ -0,0 +1,25 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { type ConsentStoryArgs } from '../../../storybook/ConsentDemo';
+declare const meta: Meta<ConsentStoryArgs>;
+export default meta;
+type Story = StoryObj<ConsentStoryArgs>;
+/**
+ * Alle tre flatene på én gang, slik en applikasjon normalt mounter dem: banneret vises til
+ * brukeren har svart, dialogen åpnes derfra, og innstillingsknappen står igjen i hjørnet
+ * etterpå.
+ *
+ * Trykk «Nullstill samtykke» for å få banneret tilbake — svaret lagres i en informasjonskapsel
+ * og forsvinner ellers ikke ved reload.
+ */
+export declare const Default: Story;
+/**
+ * Uten tjenester som avhenger av samtykke er det ingenting å spørre om, og verken banner eller
+ * innstillingsknapp vises. Resten av samtykkeløsningen mountes likevel, så `useConsent` virker
+ * som før.
+ */
+export declare const UtenSporingstjenester: Story;
+/**
+ * `ManageConsentLink` er alternativet til den flytende knappen: en vanlig tekstlenke som kan
+ * stå i bunnteksten eller midt i en personvernerklæring.
+ */
+export declare const MedTekstlenke: Story;

package/dist/src/components/shared/Button/Button.d.ts

@@ -0,0 +1,22 @@
+import type { ButtonHTMLAttributes, ReactElement } from 'react';
+/**
+ * Knappevariantene samtykkeflatene bruker. Navnene er de samme som i `@kystverket/styrbord`,
+ * ikke Designsystemets `primary`/`secondary`/`tertiary` — se `ButtonProps.variant` der for
+ * hvorfor Styrbord navngir formen framfor viktighetsnivået.
+ */
+export type ConsentButtonVariant = 'filled' | 'outline' | 'ghost';
+export interface ConsentButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ConsentButtonVariant;
+}
+/**
+ * Knappen samtykkeflatene bruker.
+ *
+ * Pakken har med vilje ingen avhengighet til `@kystverket/styrbord`, slik at applikasjoner som
+ * ikke kan ta inn hele designsystemet likevel kan vise et samtykkebanner. Prisen er at de få
+ * kontrollene vi trenger må finnes her — bygget på de samme designtokenene, så resultatet ser
+ * likt ut ved siden av en Styrbord-app.
+ *
+ * Forutsetter at en forelder setter `data-color`, slik Designsystemet gjør: det er den som gir
+ * `--ds-color-base-*` en verdi. Samtykkeflatene setter den selv på rotelementet sitt.
+ */
+export declare function Button({ variant, className, type, ...rest }: Readonly<ConsentButtonProps>): ReactElement;

package/dist/src/components/shared/Switch/Switch.d.ts

@@ -0,0 +1,15 @@
+import { type ChangeEvent, type ReactElement } from 'react';
+export interface ConsentSwitchProps {
+    label: string;
+    description?: string;
+    checked: boolean;
+    onChange: (event: ChangeEvent<HTMLInputElement>) => void;
+}
+/**
+ * Av/på-bryteren for en samtykkekategori.
+ *
+ * En vanlig avkrysningsboks med `role="switch"` framfor et eget kontrollelement: da følger
+ * tastaturbruk, skjermlesere og nettleserens autofyll med av seg selv, og det eneste vi
+ * faktisk trenger å gjøre er å tegne den om.
+ */
+export declare function Switch({ label, description, checked, onChange }: Readonly<ConsentSwitchProps>): ReactElement;

package/dist/src/hooks/useConsent.d.ts

@@ -0,0 +1,26 @@
+import type { ConsentState, ConsentUI } from '../utility/consent.types';
+import type { ConsentStore } from '../utility/consentStore';
+export interface UseConsentResult {
+    /**
+     * Sant når brukeren har samtykket til kategorien. Tar også sammensatte uttrykk, f.eks.
+     * `hasConsent({ or: ['measurement', 'marketing'] })`.
+     */
+    hasConsent: (category: Parameters<ReturnType<ConsentStore['getState']>['has']>[0]) => boolean;
+    /** Samtykkestatus per kategori. */
+    consents: ConsentState;
+    /** Sant inntil brukeren har tatt et valg. */
+    needsDecision: boolean;
+    /** Åpner innstillingsdialogen. */
+    showPreferences: () => void;
+    /** Lukker banner og dialog uten å lagre. */
+    close: () => void;
+    /** Hvilken flate som vises nå. */
+    activeUI: ConsentUI;
+}
+/**
+ * Leser og endrer samtykke.
+ *
+ * Dette er inngangen applikasjonskode skal bruke. Den sier ingenting om hvordan samtykket
+ * lagres, så implementasjonen under kan byttes ut uten at kallstedene må skrives om.
+ */
+export declare function useConsent(): UseConsentResult;

package/dist/src/hooks/useStoreValue.d.ts

@@ -0,0 +1,10 @@
+import type { ConsentStore } from '../utility/consentStore';
+/**
+ * Abonnerer på en utledet verdi fra samtykkelageret.
+ *
+ * `getServerSnapshot` må returnere den samme verdien hver gang den kalles — React bruker den
+ * både ved serverrendring og under hydrering, og en verdi som endrer seg gir enten en
+ * hydreringsfeil eller en uendelig renderløkke. Derfor låses den første verdien i et ref.
+ * Selve samtykkeflatene venter uansett på `mounted`, så verdien påvirker ikke markupen.
+ */
+export declare function useStoreValue<T>(store: ConsentStore, selector: (state: ReturnType<ConsentStore['getState']>) => T): T;

package/dist/src/main.d.ts

@@ -0,0 +1,19 @@
+import './css/index.css';
+export { ConsentProvider } from './components/ConsentProvider/ConsentProvider';
+export type { ConsentProviderProps } from './components/ConsentProvider/ConsentProvider.types';
+export { CookieConsent, ManageConsentLink } from './components/CookieConsent/CookieConsent';
+export { ConsentBanner } from './components/ConsentBanner/ConsentBanner';
+export { ConsentPreferencesDialog } from './components/ConsentPreferencesDialog/ConsentPreferencesDialog';
+export { ConsentSettingsButton } from './components/ConsentSettingsButton/ConsentSettingsButton';
+export { useConsent } from './hooks/useConsent';
+export type { UseConsentResult } from './hooks/useConsent';
+export { useStoreValue } from './hooks/useStoreValue';
+export { useConsentStore } from './utility/consentContext';
+export type { ConsentContextValue } from './utility/consentContext';
+export { clearServiceCookies, createConsentStore, getSelectableCategories, hasGatedServices, DEFAULT_EXPIRY_DAYS, DEFAULT_STORAGE_KEY, } from './utility/consentStore';
+export type { ConsentStore } from './utility/consentStore';
+export { consentCookieService, hotjarService, plausibleService, postHogService } from './utility/services';
+export type { HotjarOptions, PlausibleOptions, PostHogOptions } from './utility/services';
+export { consentTranslations, defaultConsentLanguage, formatCookieDuration, getConsentTranslations, } from './utility/translations';
+export type { ConsentLanguage, ConsentTranslations } from './utility/translations';
+export type { ConsentCategory, ConsentConfig, ConsentService, ConsentState, ConsentUI, ServiceCookie, } from './utility/consent.types';

package/dist/src/utility/consent.types.d.ts

@@ -0,0 +1,78 @@
+import type { AllConsentNames, Script } from 'c15t';
+/**
+ * Samtykkekategoriene c15t opererer med. Vokabularet er fast og kan ikke utvides — det er en
+ * fordel når flere applikasjoner deler den samme informasjonskapselen, siden de da er nødt
+ * til å tolke nøklene likt.
+ */
+export type ConsentCategory = AllConsentNames;
+/**
+ * En informasjonskapsel en tjeneste setter, slik den vises i samtykkedialogen.
+ *
+ * Brukeren har krav på å vite hva som lagres, av hvem og hvor lenge, før de tar stilling til
+ * samtykket. Ved å henge informasjonen på tjenesten den hører til, havner den i dialogen der
+ * valget faktisk tas.
+ */
+export interface ServiceCookie {
+    /** Navn, eventuelt med `*` for en familie av kapsler, f.eks. `_hjSession*`. */
+    name: string;
+    /** Levetid i dager, eller `'session'` for kapsler som forsvinner når nettleseren lukkes. */
+    duration: number | 'session';
+}
+/**
+ * En tjeneste som lastes (eller ikke lastes) avhengig av samtykke.
+ *
+ * Dette er c15t sin `Script`-type med feltene vi trenger for å kunne vise tjenesten i
+ * dialogen og rydde opp etter den.
+ */
+export type ConsentService = Script & {
+    /**
+     * Informasjonskapslene tjenesten setter, til visning i dialogen. En tom liste betyr at
+     * tjenesten er kapselfri, og vises som nettopp det — ikke som at vi ikke vet.
+     */
+    cookies?: ServiceCookie[];
+    /**
+     * Navn slik det vises i dialogen. Faller tilbake til `id` når det ikke er satt.
+     */
+    displayName?: string;
+    /**
+     * Informasjonskapsler tjenesten setter, og som skal slettes når samtykket trekkes tilbake.
+     * Prefiks-match: `_hj` treffer `_hjSession`, `_hjIncludedInSessionSample`, osv.
+     *
+     * c15t laster ut selve skriptet og laster siden på nytt, men sletter ikke kapslene
+     * tredjeparten allerede har satt.
+     */
+    clearCookiePrefixes?: string[];
+};
+/**
+ * Konfigurasjon av samtykkeløsningen. Alt som varierer mellom miljøer og applikasjoner sendes
+ * inn her — biblioteket leser aldri `process.env` selv.
+ *
+ * Det er et bevisst krav: i rammeverk som bygger ett artefakt for flere miljøer (Next.js med
+ * `NEXT_PUBLIC_*`, Vite med `import.meta.env`) bakes miljøvariabler inn på byggetidspunktet,
+ * og en verdi lest inne i biblioteket ville blitt låst til byggemiljøet.
+ */
+export interface ConsentConfig {
+    /**
+     * Domenet informasjonskapselen settes på. Dette er mekanismen som gir ett felles samtykke
+     * på tvers av subdomener: `.example.no` gjør at alle tjenester under domenet deler svaret.
+     *
+     * La stå udefinert lokalt, da settes kapselen på gjeldende vertsnavn.
+     *
+     * Merk: bruk denne fremfor c15t sin `crossSubdomain: true`. Den utleder domenet fra de to
+     * siste leddene i vertsnavnet, som gir riktig `.example.no` i produksjon, men et bredere
+     * domene enn ønsket når testmiljøene ligger dypere nestet.
+     */
+    cookieDomain?: string;
+    /** Navn på informasjonskapselen. Må være likt i alle apper som skal dele samtykke. */
+    storageKey?: string;
+    /** Hvor lenge samtykket varer. Datatilsynet anbefaler høyst 12 måneder. */
+    expiryDays?: number;
+    /** Tjenestene applikasjonen laster. Se `services.ts` for ferdige oppsett. */
+    services: ConsentService[];
+    /** Slår på `[c15t]`-logging i konsollet. */
+    debug?: boolean;
+}
+/** Samtykkestatus per kategori. */
+export type ConsentState = Record<ConsentCategory, boolean>;
+/** Hvilken del av samtykke-grensesnittet som vises. */
+export type ConsentUI = 'none' | 'banner' | 'dialog';

package/dist/src/utility/consentContext.d.ts

@@ -0,0 +1,23 @@
+import type { ConsentStore } from './consentStore';
+import type { ConsentTranslations } from './translations';
+export interface ConsentContextValue {
+    store: ConsentStore;
+    translations: ConsentTranslations;
+    /** Falsk når ingen av tjenestene faktisk avhenger av samtykke. Da vises ikke banneret. */
+    showsBanner: boolean;
+    /**
+     * Falsk under serverrendring og fram til første klientrender er ferdig.
+     *
+     * Samtykket ligger i en informasjonskapsel som bare leses i nettleseren, så serveren kan
+     * ikke vite om banneret skal vises. Render vi ut fra klienttilstanden med én gang, spriker
+     * markupen fra det serveren sendte, og React forkaster hele treet med en hydreringsfeil.
+     * Samtykkeflatene venter derfor til etter mount.
+     */
+    mounted: boolean;
+}
+export declare const ConsentContext: import("react").Context<ConsentContextValue | null>;
+/**
+ * Tilgang til hele samtykkekonteksten. Brukes av komponentene i pakken; applikasjonskode
+ * klarer seg som regel med `useConsent`.
+ */
+export declare function useConsentStore(): ConsentContextValue;

package/dist/src/utility/consentStore.d.ts

@@ -0,0 +1,40 @@
+import { createConsentManagerStore } from 'c15t';
+import type { ConsentConfig, ConsentService, ConsentState } from './consent.types';
+/** Navn på informasjonskapselen dersom kallstedet ikke overstyrer det. */
+export declare const DEFAULT_STORAGE_KEY = "kystverket_consent";
+/** Halvår. Kortere enn c15t sin standard på 365 dager. */
+export declare const DEFAULT_EXPIRY_DAYS = 182;
+export type ConsentStore = ReturnType<typeof createConsentManagerStore>;
+/**
+ * Kategoriene som faktisk kan slås av og på av brukeren, utledet fra tjenestelista.
+ *
+ * `necessary` er alltid på og vises ikke som et valg. Tjenester med `alwaysLoad` lastes
+ * uansett samtykke, så de bidrar ikke med en kategori brukeren kan styre.
+ */
+export declare function getSelectableCategories(services: ConsentService[]): ("experience" | "functionality" | "marketing" | "measurement")[];
+/**
+ * Sant når applikasjonen har minst én tjeneste som faktisk avhenger av samtykke.
+ *
+ * Saksbehandling laster i dag bare Plausible, som er informasjonskapselfritt og går med
+ * `alwaysLoad`. Da har banneret ingenting å gate, og skal ikke vises — men resten av
+ * samtykkeløsningen mountes likevel, slik at status kan leses og endres.
+ */
+export declare function hasGatedServices(services: ConsentService[]): boolean;
+/**
+ * Sletter informasjonskapsler satt av tjenester brukeren ikke har samtykket til.
+ *
+ * c15t laster ut skriptet og laster siden på nytt, men rører ikke kapslene tjenesten
+ * allerede har skrevet. Matcher på prefiks, siden Hotjar & co. setter et ukjent antall
+ * kapsler med felles prefiks (`_hjSession`, `_hjIncludedInSessionSample`, ...).
+ *
+ * Kjøres også ved oppstart, slik at kapsler som ligger igjen fra et tidligere samtykke
+ * blir ryddet bort.
+ */
+export declare function clearServiceCookies(services: ConsentService[], consents: Partial<ConsentState>, cookieDomain?: string): void;
+/**
+ * Setter opp samtykkelageret i offline-modus: ingen nettverkskall, ingen backend, alt lagres
+ * i nettleseren. Informasjonskapselen er fasit, og c15t speiler den til localStorage — som
+ * er viktig her, siden localStorage er bundet til origin og derfor ikke deles mellom
+ * subdomener slik kapselen gjør.
+ */
+export declare function createConsentStore(config: ConsentConfig): ConsentStore;

package/dist/src/utility/dialogRegistry.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Teller over hvor mange `ConsentPreferencesDialog` som står mountet.
+ *
+ * Et muterbart objekt framfor tilstand: ingen skal rendre på nytt fordi dialogen registrerer
+ * seg. Dette brukes bare til å advare utviklere om et oppsett som ikke henger sammen.
+ */
+export interface ConsentDialogRegistry {
+    count: number;
+}
+export declare const ConsentDialogRegistryProvider: import("react").Provider<ConsentDialogRegistry | null>;
+/** Lager registeret. Kalles én gang, av `ConsentProvider`. */
+export declare function useConsentDialogRegistry(): ConsentDialogRegistry;
+/** Melder dialogen inn i registeret så lenge den står mountet. */
+export declare function useRegisterConsentDialog(): void;
+/**
+ * Advarer når en flate som åpner innstillingsdialogen vises uten at dialogen er mountet.
+ *
+ * Både banneret og innstillingsknappen skjuler seg selv når de setter `activeUI` til `dialog`.
+ * Er det ingen dialog til å ta over, forsvinner flaten uten at noe kommer i stedet, og brukeren
+ * sitter igjen uten vei videre — verken til å gi eller trekke tilbake samtykke. Det er lett å gå
+ * i når flatene mountes hver for seg i stedet for gjennom `CookieConsent`.
+ *
+ * @param componentName Navnet som skal stå i advarselen.
+ * @param active Om flaten faktisk vises. En skjult flate kan ingen klikke seg fast i.
+ */
+export declare function useMissingConsentDialogWarning(componentName: string, active: boolean): void;