@innspel/react-native 0.1.0

package/dist/index.d.cts

@@ -0,0 +1,444 @@
+import { InnspelClient, OpenFeedbackOptions, InnspelStorage, SubmissionStatus, SubmissionType } from '@innspel/core';
+export { CaptureInput, ContextInput, InnspelClient, InnspelOptions, InnspelStorage, MySubmission, OpenFeedbackOptions, SubmissionStatusView } from '@innspel/core';
+import React from 'react';
+
+/**
+ * tokens.ts — GENERERT fra theme/theme.ts (avtrykk f03570c596e2).
+ * Rediger aldri denne filen. Endre temaet i kilden og kjør
+ * `node scripts/generate-tokens.ts`, som CI verifiserer med `--check`.
+ *
+ * Tokenene @innspel/react-native faller tilbake på når verten ikke sender egne.
+ * Widgeten lever inne i vertsappen og skal arve dens flate (DD-21); dette er
+ * bunnen, ikke fasiten.
+ *
+ * 72 kontrastpar er målt mot WCAG AA i begge paletter, og generatoren
+ * nekter å skrive hvis ett faller under kravet. Farge bærer aldri mening alene
+ * — hver status har ikon og tekstetikett (DD-08).
+ *
+ * fontFamily finnes ikke her med vilje: systemfonten er standard i React
+ * Native, og å sette den ville brutt med vertsappen.
+ */
+/** Mørk palett — fallback når verten ikke sender egne tokens. */
+declare const t: {
+    readonly color: {
+        readonly bg: "#111417";
+        readonly surface: "#1A1E22";
+        readonly surfaceRaised: "#232830";
+        readonly border: "#2E343B";
+        readonly borderStrong: "#3D444D";
+        readonly borderInteractive: "#7C8894";
+        readonly textPrimary: "#F2F4F6";
+        readonly textSecondary: "#B4BCC5";
+        readonly textMuted: "#8D96A1";
+        readonly textDisabled: "#5A626B";
+        readonly actionPrimary: "#5AD3E2";
+        readonly onActionPrimary: "#04252A";
+        readonly actionSecondaryBorder: "#7C8894";
+        readonly actionSecondaryText: "#F2F4F6";
+        readonly brand: "#5AD3E2";
+        readonly onBrand: "#04252A";
+        readonly brandFill: "#0E7C8C";
+        readonly onBrandFill: "#FFFFFF";
+        readonly brandBg: "#0C2A30";
+        readonly danger: "#FF7A8C";
+        readonly dangerFill: "#C4001F";
+        readonly onDangerFill: "#FFFFFF";
+        readonly dangerBg: "#2C1116";
+        readonly success: "#3ED88A";
+        readonly onSuccess: "#062015";
+        readonly successBg: "#0E2A1E";
+        readonly warning: "#FFC24D";
+        readonly onWarning: "#2A1C02";
+        readonly warningBg: "#2C2107";
+        readonly info: "#5CC0FF";
+        readonly onInfo: "#04222F";
+        readonly infoBg: "#0E2531";
+        readonly neutral: "#A3ACB6";
+        readonly onNeutral: "#111417";
+        readonly neutralBg: "#242A31";
+        readonly scrim: "rgba(0, 0, 0, 0.72)";
+    };
+    readonly space: {
+        readonly xs: 4;
+        readonly sm: 8;
+        readonly md: 16;
+        readonly lg: 24;
+        readonly xl: 32;
+        readonly xxl: 48;
+    };
+    readonly radius: {
+        readonly sm: 6;
+        readonly md: 8;
+        readonly lg: 12;
+        readonly pill: 999;
+    };
+    readonly font: {
+        readonly h1: 24;
+        readonly h2: 21;
+        readonly h3: 18;
+        readonly body: 16;
+        readonly small: 13;
+        readonly tiny: 11;
+    };
+    readonly lineHeight: {
+        readonly h1: 30;
+        readonly h2: 27;
+        readonly h3: 24;
+        readonly body: 24;
+        readonly small: 18;
+        readonly tiny: 16;
+    };
+    readonly weight: {
+        readonly regular: "400";
+        readonly medium: "500";
+        readonly semibold: "600";
+        readonly bold: "700";
+    };
+    readonly motion: {
+        readonly fast: 120;
+        readonly base: 200;
+        readonly slow: 320;
+    };
+    readonly touch: 48;
+    readonly screenPadding: 24;
+    readonly hairline: 1;
+};
+/** Lys palett. */
+declare const light: {
+    readonly color: {
+        readonly bg: "#F6F7F9";
+        readonly surface: "#FFFFFF";
+        readonly surfaceRaised: "#EDEFF3";
+        readonly border: "#D2D7DE";
+        readonly borderStrong: "#B9C0C9";
+        readonly borderInteractive: "#6F7883";
+        readonly textPrimary: "#14181D";
+        readonly textSecondary: "#454D57";
+        readonly textMuted: "#5C6470";
+        readonly textDisabled: "#9AA2AD";
+        readonly actionPrimary: "#0A6673";
+        readonly onActionPrimary: "#FFFFFF";
+        readonly actionSecondaryBorder: "#6F7883";
+        readonly actionSecondaryText: "#14181D";
+        readonly brand: "#0A6673";
+        readonly onBrand: "#FFFFFF";
+        readonly brandFill: "#0A6673";
+        readonly onBrandFill: "#FFFFFF";
+        readonly brandBg: "#E0F0F2";
+        readonly danger: "#B3001B";
+        readonly dangerFill: "#B3001B";
+        readonly onDangerFill: "#FFFFFF";
+        readonly dangerBg: "#FCE8EA";
+        readonly success: "#04693C";
+        readonly onSuccess: "#FFFFFF";
+        readonly successBg: "#E4F4EC";
+        readonly warning: "#7A5200";
+        readonly onWarning: "#FFFFFF";
+        readonly warningBg: "#FBF1DE";
+        readonly info: "#00588F";
+        readonly onInfo: "#FFFFFF";
+        readonly infoBg: "#E4F0F8";
+        readonly neutral: "#5C6470";
+        readonly onNeutral: "#FFFFFF";
+        readonly neutralBg: "#EEF0F3";
+        readonly scrim: "rgba(10, 14, 18, 0.45)";
+    };
+    readonly space: {
+        readonly xs: 4;
+        readonly sm: 8;
+        readonly md: 16;
+        readonly lg: 24;
+        readonly xl: 32;
+        readonly xxl: 48;
+    };
+    readonly radius: {
+        readonly sm: 6;
+        readonly md: 8;
+        readonly lg: 12;
+        readonly pill: 999;
+    };
+    readonly font: {
+        readonly h1: 24;
+        readonly h2: 21;
+        readonly h3: 18;
+        readonly body: 16;
+        readonly small: 13;
+        readonly tiny: 11;
+    };
+    readonly lineHeight: {
+        readonly h1: 30;
+        readonly h2: 27;
+        readonly h3: 24;
+        readonly body: 24;
+        readonly small: 18;
+        readonly tiny: 16;
+    };
+    readonly weight: {
+        readonly regular: "400";
+        readonly medium: "500";
+        readonly semibold: "600";
+        readonly bold: "700";
+    };
+    readonly motion: {
+        readonly fast: 120;
+        readonly base: 200;
+        readonly slow: 320;
+    };
+    readonly touch: 48;
+    readonly screenPadding: 24;
+    readonly hairline: 1;
+};
+/** Skjermbilde-maskering. Faste signalfarger, uavhengig av palett (DD-39, DD-40). Vedlegg er M1.3. */
+declare const screenRules: {
+    readonly brushFill: "#E5007D";
+    readonly autoMaskFill: "#101114";
+    readonly autoMaskStroke: "#E5007D";
+    readonly previewBackdrop: "#000000";
+};
+/** Formen widgeten tar imot. Verten sender et delvis tema; resten faller tilbake hit. */
+type InnspelTheme = typeof t;
+type InnspelColors = InnspelTheme['color'];
+
+/**
+ * Widgeten lever INNE i vertsappen (DD-21) og skal arve dens flate. Verten
+ * sender et delvis tema; alt den ikke sender faller tilbake på Innspels eget
+ * (M0.4), som er generert fra `theme/theme.ts` og målt mot WCAG AA.
+ *
+ * Ingen hex-verdi, px-verdi eller fontstørrelse skrives i en komponent — alt
+ * hentes herfra (CLAUDE.md, «Styling»). `fontFamily` finnes ikke: systemfonten
+ * er standard i React Native, og å sette den ville brutt med vertsappen.
+ */
+/**
+ * De genererte tokenene er `as const`, så `t.touch` har typen `48` og ikke
+ * `number`. Det er riktig for KILDEN — den skal ikke kunne endres ved et uhell
+ * — men gjør temaet umulig å overstyre: verten ville måttet sende nøyaktig 48.
+ * Denne typen åpner verdiene uten å åpne nøkkelsettet: en vert kan bytte en
+ * farge, men ikke finne på en ny.
+ */
+type Tema = Omit<InnspelTheme, 'color' | 'space' | 'radius' | 'font' | 'lineHeight' | 'motion' | 'touch' | 'screenPadding' | 'hairline'> & {
+    color: Record<keyof InnspelColors, string>;
+    space: Record<keyof InnspelTheme['space'], number>;
+    radius: Record<keyof InnspelTheme['radius'], number>;
+    font: Record<keyof InnspelTheme['font'], number>;
+    lineHeight: Record<keyof InnspelTheme['lineHeight'], number>;
+    motion: Record<keyof InnspelTheme['motion'], number>;
+    touch: number;
+    screenPadding: number;
+    hairline: number;
+};
+type PartialTheme = {
+    color?: Partial<Tema['color']>;
+} & Partial<Omit<Tema, 'color'>>;
+/**
+ * Fletter vertens tokens over Innspels egne.
+ *
+ * @param vertens Delvis tema fra `<InnspelProvider theme={…}>`.
+ * @param palett `dark` er standard: widgeten åpnes oftest over en app i mørk
+ *   modus, og et lyst ark over en mørk app blender.
+ */
+declare function byggTema(vertens?: PartialTheme, palett?: 'dark' | 'light'): Tema;
+/** Tokenene som gjelder her. Bruk ALDRI en literal farge eller avstand i stedet. */
+declare function useTema(): Tema;
+
+interface InnspelKontekst {
+    client: InnspelClient;
+    /** Åpner widgeten. Samme som `client.openFeedback()`. */
+    open: (options?: OpenFeedbackOptions) => Promise<void>;
+    close: () => void;
+}
+/**
+ * Pakk appen i denne, og widgeten finnes.
+ *
+ * Provideren gjør tre ting: den registrerer visningen hos kjernen (så
+ * `client.openFeedback()` virker hvor som helst i appen, også utenfor React),
+ * den holder temaet, og den rendrer selve arket.
+ *
+ * @example
+ * ```tsx
+ * const innspel = init({ … });
+ *
+ * export default function App() {
+ *   return (
+ *     <InnspelProvider client={innspel}>
+ *       <MinApp />
+ *     </InnspelProvider>
+ *   );
+ * }
+ * ```
+ */
+declare function InnspelProvider({ client, children, theme, colorScheme, tenantName, }: {
+    client: InnspelClient;
+    children?: React.ReactNode;
+    /** Vertens egne tokens. Alt som utelates faller tilbake på Innspels tema. */
+    theme?: PartialTheme;
+    colorScheme?: 'dark' | 'light';
+    /** Navnet som står på svaret i «Mine innspill» — leietakerens, ikke Innspels. */
+    tenantName?: string;
+}): React.JSX.Element;
+/**
+ * Klienten og `open` fra nærmeste {@link InnspelProvider}.
+ *
+ * Kaster utenfor provideren i stedet for å gi `null`: en knapp som stille ikke
+ * gjør noe er verre enn en feil under utvikling (tech-decisions.md, «Feil bruk
+ * feiler høyt og tidlig»).
+ */
+declare function useInnspel(): InnspelKontekst;
+
+/**
+ * Formen på lagringspakkene i React Native-økosystemet: AsyncStorage, MMKV med
+ * async-fasade, expo-secure-store. Alle tre har disse tre metodene.
+ */
+interface AsyncStorageLike {
+    getItem(key: string): Promise<string | null>;
+    setItem(key: string, value: string): Promise<void>;
+    removeItem(key: string): Promise<void>;
+}
+/**
+ * Lager en {@link InnspelStorage} av vertens egen lagringspakke.
+ *
+ * Pakken tar ingen avhengighet på AsyncStorage eller MMKV med vilje: verten har
+ * som regel én av dem allerede, og to kopier av samme lagring i én app er verre
+ * enn litt oppsett. Send inn den du bruker:
+ *
+ * @example
+ * ```ts
+ * import AsyncStorage from '@react-native-async-storage/async-storage';
+ * const storage = createStorage(AsyncStorage);
+ * ```
+ *
+ * Det eneste som lagres er offline-køen (DD-41) — aldri feedback-tokenet, aldri
+ * en install- eller enhets-ID (K20). Lagringen trenger derfor ikke være kryptert.
+ */
+declare function createStorage(pakke: AsyncStorageLike): InnspelStorage;
+/**
+ * Lagring i minne. Køen overlever da ikke at appen lukkes, så den er til
+ * utvikling og test — ikke til produksjon. `InnspelProvider` sier fra i
+ * konsollen hvis den brukes uten at det er sagt eksplisitt.
+ */
+declare function createMemoryStorage(): InnspelStorage;
+
+/**
+ * DD-22: `complete` heter «Rettet» i feilsporet og «Levert» i ønskesporet —
+ * samme maskinstatus, to navn. Klienten velger navnet; serveren gjør det ikke.
+ *
+ * DD-08 / «Styling» i CLAUDE.md: **farge bærer aldri mening alene.** Hver status
+ * har ikon OG tekstetikett. `brand ↔ info` og `brand ↔ danger` er målt til under
+ * 1,5 i kontrast mot hverandre av tema-generatoren — to statuser er altså ikke
+ * skillbare på farge for alle, og etiketten er det som faktisk bærer meningen.
+ */
+interface StatusVisning {
+    ikon: string;
+    etikett: string;
+    /** Tokennavn i den aktive paletten, ikke en farge. */
+    farge: 'info' | 'success' | 'warning' | 'neutral' | 'danger';
+    lofte: string;
+}
+/**
+ * Oversetter en innsending til det innsenderen skal se.
+ *
+ * @param status Maskinens status fra kontrakten.
+ * @param type Sporet — avgjør «Rettet» mot «Levert» (DD-22).
+ * @param deadlineAt Svarfristen, satt kun i `vurderes`.
+ */
+declare function statusVisning(status: SubmissionStatus, type: SubmissionType, deadlineAt?: string): StatusVisning;
+/** Raden som venter på nett (DD-41). Den har ingen saksnummer og intet løfte om svar. */
+declare const venterVisning: StatusVisning;
+
+/**
+ * Hver streng innsenderen ser, ett sted.
+ *
+ * Ordlyden er ikke fri: den er tegnet i `design/wireframes/innsending-widget.jsx`
+ * og bundet av beslutninger. Løftene under er DD-08 og skal stå ORDRETT likt i
+ * SDK-et og i panelet — en innsender som får «Svar innen 3. desember» i appen og
+ * noe annet i portalen har fått to løfter.
+ *
+ * Norsk bokmål. Ingen leietakernavn: strengen som nevner avsenderen tar navnet
+ * som parameter, siden pakken skal kunne brukes av hvem som helst.
+ */
+declare const tekst: {
+    readonly valgTittel: "Hva gjelder det?";
+    readonly valgUnder: "Ett valg. Vi spør aldri om kategori eller alvorlighet.";
+    readonly sporFeil: "Noe virker ikke";
+    readonly sporFeilUnder: "Feilsporet — kontekst legges ved";
+    readonly sporOnske: "Jeg ønsker meg noe";
+    readonly sporOnskeUnder: "Ønskesporet — aldri spørsmål om reproduksjon";
+    readonly kjenteFeilTittelFeil: "Er det dette du ser?";
+    readonly kjenteFeilUnderFeil: "«Ja» registrerer deg på saken. «Ligner» sender ditt eget med lenke.";
+    readonly kjenteFeilTittelOnske: "Har noen ønsket dette?";
+    readonly kjenteFeilUnderOnske: "Ett trykk legger deg til på ønsket — ingen ny sak.";
+    readonly svarJa: "Ja, jeg også";
+    readonly svarLigner: "Ligner, men ikke helt";
+    readonly svarNei: "Nei, det er noe annet";
+    readonly omvei: "Omvei:";
+    readonly rettesI: (versjon: string) => string;
+    readonly rettetI: (versjon: string) => string;
+    readonly feltLabelFeil: "Din feil";
+    readonly feltLabelOnske: "Ditt ønske";
+    /** DD-45: to spørsmål i feilsporet. Kilde: Sentry «What's the bug? What did you expect?» */
+    readonly placeholderFeil: "Hva skjedde? Hva forventet du?";
+    readonly placeholderOnske: "Hva ønsker du deg?";
+    readonly send: "Send";
+    readonly nesteOnske: "Neste — sjekk om noen har ønsket dette";
+    /** DD-44: minimum tegn er det ENESTE kravet. */
+    readonly forKort: (min: number) => string;
+    readonly tellerFull: " — kort og konkret holder";
+    readonly kontekstLinje: "Legges ved: skjerm, appversjon, plattform, OS";
+    readonly kontekstVis: " — Vis";
+    readonly kontekstFjern: "Fjern";
+    readonly kontekstAldri: "Aldri: navn, e-post, telefon, posisjon eller det som står på skjermen.";
+    readonly lenketTil: (tittel: string) => string;
+    readonly fjernLenke: "Fjern lenken til den kjente feilen";
+    readonly monsterSpm: {
+        readonly email: "Dette ser ut som en e-postadresse. Vil du fjerne den?";
+        readonly phone: "Dette ser ut som et telefonnummer. Vil du fjerne det?";
+        readonly card: "Dette ser ut som et kortnummer. Vil du fjerne det?";
+        readonly ip: "Dette ser ut som en IP-adresse. Vil du fjerne den?";
+        readonly token: "Dette ser ut som en tilgangsnøkkel. Vil du fjerne den?";
+    };
+    readonly monsterFjern: "Fjern";
+    readonly monsterBehold: "Behold";
+    readonly monsterForklaring: "Teksten endres bare hvis du trykker Fjern. Vi fjerner aldri noe stille.";
+    readonly kvitteringSendt: "Sendt";
+    readonly kvitteringRegistrert: "Registrert";
+    readonly kvitteringFeil: "Du får beskjed når den er rettet, eller hvis vi trenger mer.";
+    readonly kvitteringOnske: "Vurderes innen 90 dager. Du får et personlig svar — også hvis det er nei.";
+    readonly kvitteringJaOgsa: "Du får beskjed når den er rettet.";
+    readonly saksnummer: (nr: string) => string;
+    readonly tilbakeTilAppen: "Tilbake til appen";
+    readonly offlineTittel: "Ingen nett";
+    readonly offlineBanner: "Ingen nett. Lagres og sendes automatisk — du ser det under «Mine innspill» til det er sendt.";
+    readonly offlineLagre: "Lagre — sendes automatisk";
+    readonly sendefeilBanner: (arsak: string) => string;
+    readonly provIgjen: "Prøv igjen";
+    readonly mineTittel: "Mine innspill";
+    readonly mineUnder: "Status og hva du kan vente deg — samme løfte som i kvitteringen.";
+    readonly mineTom: "Du har ikke sendt noe ennå.";
+    readonly mineIkkeSendt: "Ikke sendt ennå";
+    readonly mineSak: (nr: string) => string;
+    readonly svarFra: (leietaker: string) => string;
+    readonly svarFraGenerisk: "Svar";
+    readonly sendNytt: "Send nytt innspill";
+    readonly tilbake: "Tilbake";
+    readonly lukk: "Lukk";
+    readonly venterPaaNett: "Venter på nett — sendes automatisk";
+};
+/**
+ * Løftet per status (DD-08). Samme streng i SDK og panel. Det eneste tidsløftet
+ * er svarfristen som DATO (DD-28) — aldri «innen X dager», som ville betydd noe
+ * nytt hver gang innsenderen leser det.
+ */
+declare const lofte: {
+    readonly venterNett: "Sendes automatisk når du er på nett — kvitteringen kommer da.";
+    readonly vurderes: (frist: string) => string;
+    readonly vurderesUtenFrist: "Du får svar — også hvis det er nei.";
+    readonly bygges: "Du får beskjed når den er rettet.";
+    readonly planlagt: "Du får beskjed når den er rettet.";
+    readonly rettet: "Ferdig. Ser du feilen igjen, send et nytt innspill.";
+    readonly levert: "Ferdig. Takk for ønsket.";
+    readonly ny: "Vi har fått den. Du hører fra oss.";
+    readonly kjentFeil: "Kjent feil. Du får beskjed når den er rettet.";
+    readonly duplikat: "Slått sammen med et innspill som ligner.";
+    readonly avvist: "Vi har svart på denne.";
+};
+
+export { type AsyncStorageLike, type InnspelColors, InnspelProvider, type InnspelTheme, type PartialTheme, type StatusVisning, type Tema, byggTema, createMemoryStorage, createStorage, t as darkTokens, light, lofte, screenRules, statusVisning, tekst, useInnspel, useTema, venterVisning };