@navikt/ds-react 7.6.0 → 7.8.0

package/src/util/i18n/i18n.context.ts

@@ -1,6 +1,5 @@
 import { Locale } from "date-fns";
-import { useContext } from "react";
-import { LanguageProviderContext } from "../../provider/i18n/LanguageProvider";
+import { useProvider } from "../../provider/Provider";
 import { get } from "./get";
 import {
   Component,
@@ -28,15 +27,16 @@ export type TFunction<T extends Component> = (
 
 export function useI18n<T extends Component>(
   componentName: T,
-  ...local: (ComponentTranslation<T> | undefined)[]
+  ...localTranslations: (ComponentTranslation<T> | undefined)[]
 ) {
-  const languageProviderContext = useContext(LanguageProviderContext);
-  const i18n = languageProviderContext.translations;
+  const context = useProvider();
+  const contextTranslations = context.translations || [];
   const i18nObjects: (PartialTranslations | undefined)[] = [
-    ...local,
-    ...(Array.isArray(i18n)
-      ? i18n.map((t) => t[componentName])
-      : [i18n[componentName]]),
+    ...localTranslations,
+    ...(Array.isArray(contextTranslations)
+      ? contextTranslations.map((t) => t[componentName])
+      : [contextTranslations[componentName]]),
+    context.locale[componentName],
   ];
 
   /**
@@ -67,11 +67,12 @@ export function useI18n<T extends Component>(
 }
 
 export function useDateLocale() {
-  const languageProviderContext = useContext(LanguageProviderContext);
-  const i18n = languageProviderContext.translations;
-  const i18nObjects = Array.isArray(i18n)
-    ? i18n.map((t) => t.global)
-    : [i18n.global];
+  const context = useProvider();
+  const contextTranslations = context.translations || [];
+  const i18nObjects = Array.isArray(contextTranslations)
+    ? contextTranslations.map((t) => t.global)
+    : [contextTranslations.global];
+  i18nObjects.push(context.locale.global);
 
   for (const obj of i18nObjects) {
     if (obj?.dateLocale) {

package/src/util/i18n/locales/en.ts

@@ -7,8 +7,53 @@ export default {
     showMore: "Show more",
     showLess: "Show less",
     readOnly: "Read-only",
+    close: "Close",
   },
 
+  Alert: {
+    closeAlert: "Close alert",
+    closeMessage: "Close message",
+    error: "Error",
+    info: "Information",
+    success: "Success",
+    warning: "Warning",
+  },
+  Chips: {
+    Removable: {
+      labelSuffix: "delete",
+    },
+  },
+  Combobox: {
+    addOption: "Add",
+    loading: "Searching…",
+    maxSelected: "{selected} of max {limit} are selected.",
+  },
+  CopyButton: {
+    title: "Copy",
+    activeText: "Copied!",
+  },
+  DatePicker: {
+    chooseDate: "Choose date",
+    chooseDates: "Choose dates",
+    chooseDateRange: "Choose start and end date",
+    chooseMonth: "Choose month",
+    week: "Week",
+    weekNumber: "Week {week}",
+    selectWeekNumber: "Select week {week}",
+    month: "Month",
+    goToNextMonth: "Go to next month",
+    goToPreviousMonth: "Go to previous month",
+    year: "Year",
+    goToNextYear: "Go to next year",
+    goToPreviousYear: "Go to previous year",
+    openDatePicker: "Open date picker",
+    openMonthPicker: "Open month picker",
+    closeDatePicker: "Close date picker",
+    closeMonthPicker: "Close month picker",
+  },
+  ErrorSummary: {
+    heading: "You must correct the following errors before you can continue:",
+  },
   FileUpload: {
     dropzone: {
       button: "Choose file",
@@ -32,28 +77,18 @@ export default {
     showAllSteps: "Show all steps",
     hideAllSteps: "Hide all steps",
   },
-  Alert: {
-    closeAlert: "Close alert",
-    closeMessage: "Close message",
-    error: "Error",
-    info: "Information",
-    success: "Success",
-    warning: "Warning",
+  FormSummary: {
+    editAnswer: "Edit answer",
   },
-  Chips: {
-    Removable: {
-      labelSuffix: "delete",
-    },
+  GuidePanel: {
+    illustrationLabel: "Illustration of advisor",
   },
-  ErrorSummary: {
-    heading: "You must correct the following errors before you can continue:",
+  HelpText: {
+    title: "More information",
   },
   Loader: {
     title: "Waiting…",
   },
-  Modal: {
-    close: "Close",
-  },
   Pagination: {
     previous: "Previous",
     next: "Next",
@@ -64,7 +99,7 @@ export default {
       "Progress is unknown, estimated time is {seconds} seconds.",
   },
   Search: {
-    clear: "Clear",
+    clear: "Clear field",
     search: "Search",
   },
   Textarea: {
@@ -97,24 +132,4 @@ export default {
       reset: "Reset zoom",
     },
   },
-  DatePicker: {
-    close: "Close",
-    chooseDate: "Choose date",
-    chooseDates: "Choose dates",
-    chooseDateRange: "Choose start and end date",
-    chooseMonth: "Choose month",
-    week: "Week",
-    weekNumber: "Week {week}",
-    selectWeekNumber: "Select week {week}",
-    month: "Month",
-    goToNextMonth: "Go to next month",
-    goToPreviousMonth: "Go to previous month",
-    year: "Year",
-    goToNextYear: "Go to next year",
-    goToPreviousYear: "Go to previous year",
-    openDatePicker: "Open date picker",
-    openMonthPicker: "Open month picker",
-    closeDatePicker: "Close date picker",
-    closeMonthPicker: "Close month picker",
-  },
 } satisfies Translations;

package/src/util/i18n/locales/index.ts

@@ -0,0 +1,4 @@
+"use client";
+export { default as nb } from "./nb";
+export { default as nn } from "./nn";
+export { default as en } from "./en";

package/src/util/i18n/locales/nb.ts

@@ -10,8 +10,56 @@ export default {
     showMore: "Vis mer",
     showLess: "Vis mindre",
     readOnly: "Skrivebeskyttet",
+    close: "Lukk",
   },
 
+  Alert: {
+    closeAlert: "Lukk varsel",
+    closeMessage: "Lukk melding",
+    error: "Feil",
+    info: "Informasjon",
+    success: "Suksess",
+    warning: "Advarsel",
+  },
+  Chips: {
+    Removable: {
+      /** Will be appended to the accessible name for the button. */
+      labelSuffix: "slett",
+    },
+  },
+  Combobox: {
+    /** The input value will be appended to the end of this text, e.g. `Legg til "input value"`. */
+    addOption: "Legg til",
+    /** Loader title */
+    loading: "Søker…",
+    maxSelected: "{selected} av maks {limit} er valgt.",
+  },
+  CopyButton: {
+    title: "Kopier",
+    activeText: "Kopiert!",
+  },
+  DatePicker: {
+    chooseDate: "Velg dato",
+    chooseDates: "Velg datoer",
+    chooseDateRange: "Velg start- og sluttdato",
+    chooseMonth: "Velg måned",
+    week: "Uke",
+    weekNumber: "Uke {week}",
+    selectWeekNumber: "Velg uke {week}",
+    month: "Måned",
+    goToNextMonth: "Gå til neste måned",
+    goToPreviousMonth: "Gå til forrige måned",
+    year: "År",
+    goToNextYear: "Gå til neste år",
+    goToPreviousYear: "Gå til forrige år",
+    openDatePicker: "Åpne datovelger",
+    openMonthPicker: "Åpne månedsvelger",
+    closeDatePicker: "Lukk datovelger",
+    closeMonthPicker: "Lukk månedsvelger",
+  },
+  ErrorSummary: {
+    heading: "Du må rette disse feilene før du kan fortsette:",
+  },
   FileUpload: {
     dropzone: {
       button: "Velg fil",
@@ -35,29 +83,18 @@ export default {
     showAllSteps: "Vis alle steg",
     hideAllSteps: "Skjul alle steg",
   },
-  Alert: {
-    closeAlert: "Lukk varsel",
-    closeMessage: "Lukk melding",
-    error: "Feil",
-    info: "Informasjon",
-    success: "Suksess",
-    warning: "Advarsel",
+  FormSummary: {
+    editAnswer: "Endre svar",
   },
-  Chips: {
-    Removable: {
-      /** Will be appended to the accessible name for the button. */
-      labelSuffix: "slett",
-    },
+  GuidePanel: {
+    illustrationLabel: "Illustrasjon av veileder",
   },
-  ErrorSummary: {
-    heading: "Du må rette disse feilene før du kan fortsette:",
+  HelpText: {
+    title: "Mer informasjon",
   },
   Loader: {
     title: "Venter…",
   },
-  Modal: {
-    close: "Lukk",
-  },
   Pagination: {
     previous: "Forrige",
     next: "Neste",
@@ -68,7 +105,7 @@ export default {
       "Fremdrift kan ikke beregnes, antatt tid er {seconds} sekunder.",
   },
   Search: {
-    clear: "Tøm",
+    clear: "Tøm feltet",
     search: "Søk",
   },
   Textarea: {
@@ -91,7 +128,7 @@ export default {
       warning: "Advarsel",
       danger: "Fare",
       info: "Info",
-      neutral: "Nøytral", // TODO: Consider making these global
+      neutral: "Nøytral",
       period: "{status} fra {start} til {end}",
     },
     Pin: {
@@ -102,24 +139,4 @@ export default {
       reset: "Tilbakestill tidsperspektiv",
     },
   },
-  DatePicker: {
-    close: "Lukk", // TODO: Consider making global
-    chooseDate: "Velg dato",
-    chooseDates: "Velg datoer",
-    chooseDateRange: "Velg start- og sluttdato",
-    chooseMonth: "Velg måned",
-    week: "Uke",
-    weekNumber: "Uke {week}",
-    selectWeekNumber: "Velg uke {week}",
-    month: "Måned",
-    goToNextMonth: "Gå til neste måned",
-    goToPreviousMonth: "Gå til forrige måned",
-    year: "År",
-    goToNextYear: "Gå til neste år",
-    goToPreviousYear: "Gå til forrige år",
-    openDatePicker: "Åpne datovelger",
-    openMonthPicker: "Åpne månedsvelger",
-    closeDatePicker: "Lukk datovelger",
-    closeMonthPicker: "Lukk månedsvelger",
-  },
 } satisfies TranslationMap;

package/src/util/i18n/locales/nn.ts

@@ -7,8 +7,53 @@ export default {
     showMore: "Vis meir",
     showLess: "Vis mindre",
     readOnly: "Skrivebeskytta",
+    close: "Lukk",
   },
 
+  Alert: {
+    closeAlert: "Lukk varsel",
+    closeMessage: "Lukk melding",
+    error: "Feil",
+    info: "Informasjon",
+    success: "Suksess",
+    warning: "Åtvaring",
+  },
+  Chips: {
+    Removable: {
+      labelSuffix: "slett",
+    },
+  },
+  Combobox: {
+    addOption: "Legg til",
+    loading: "Søker…",
+    maxSelected: "{selected} av maks {limit} er valt.",
+  },
+  CopyButton: {
+    title: "Kopier",
+    activeText: "Kopiert!",
+  },
+  DatePicker: {
+    chooseDate: "Vel dato",
+    chooseDates: "Vel datoar",
+    chooseDateRange: "Vel start- og sluttdato",
+    chooseMonth: "Vel månad",
+    week: "Veke",
+    weekNumber: "Veke {week}",
+    selectWeekNumber: "Vel veke {week}",
+    month: "Månad",
+    goToNextMonth: "Gå til neste månad",
+    goToPreviousMonth: "Gå til førre månad",
+    year: "År",
+    goToNextYear: "Gå til neste år",
+    goToPreviousYear: "Gå til førre år",
+    openDatePicker: "Opne datoveljar",
+    openMonthPicker: "Opne månadsveljar",
+    closeDatePicker: "Lukk datoveljar",
+    closeMonthPicker: "Lukk månadsveljar",
+  },
+  ErrorSummary: {
+    heading: "Du må rette desse feila før du kan halde fram:",
+  },
   FileUpload: {
     dropzone: {
       button: "Vel fil",
@@ -32,28 +77,18 @@ export default {
     showAllSteps: "Vis alle steg",
     hideAllSteps: "Skjul alle steg",
   },
-  Alert: {
-    closeAlert: "Lukk varsel",
-    closeMessage: "Lukk melding",
-    error: "Feil",
-    info: "Informasjon",
-    success: "Suksess",
-    warning: "Åtvaring",
+  FormSummary: {
+    editAnswer: "Endre svar",
   },
-  Chips: {
-    Removable: {
-      labelSuffix: "slett",
-    },
+  GuidePanel: {
+    illustrationLabel: "Illustrasjon av rettleiar",
   },
-  ErrorSummary: {
-    heading: "Du må rette desse feila før du kan halde fram:",
+  HelpText: {
+    title: "Meir informasjon",
   },
   Loader: {
     title: "Ventar…",
   },
-  Modal: {
-    close: "Lukk",
-  },
   Pagination: {
     previous: "Førre",
     next: "Neste",
@@ -64,7 +99,7 @@ export default {
       "Framdrift kan ikkje bereknast, antatt tid er {seconds} sekund.",
   },
   Search: {
-    clear: "Tøm",
+    clear: "Tøm feltet",
     search: "Søk",
   },
   Textarea: {
@@ -97,24 +132,4 @@ export default {
       reset: "Tilbakestill tidsperspektiv",
     },
   },
-  DatePicker: {
-    close: "Lukk",
-    chooseDate: "Vel dato",
-    chooseDates: "Vel datoar",
-    chooseDateRange: "Vel start- og sluttdato",
-    chooseMonth: "Vel månad",
-    week: "Veke",
-    weekNumber: "Veke {week}",
-    selectWeekNumber: "Vel veke {week}",
-    month: "Månad",
-    goToNextMonth: "Gå til neste månad",
-    goToPreviousMonth: "Gå til førre månad",
-    year: "År",
-    goToNextYear: "Gå til neste år",
-    goToPreviousYear: "Gå til førre år",
-    openDatePicker: "Opne datoveljar",
-    openMonthPicker: "Opne månadsveljar",
-    closeDatePicker: "Lukk datoveljar",
-    closeMonthPicker: "Lukk månadsveljar",
-  },
 } satisfies Translations;

package/cjs/provider/i18n/LanguageProvider.d.ts

@@ -1,26 +0,0 @@
-import React from "react";
-import { PartialTranslations } from "../../util/i18n/i18n.types";
-export interface LanguageProviderContextType {
-    /**
-     * Merged with the default language translations object (officially provided translations).
-     */
-    translations: PartialTranslations | PartialTranslations[];
-}
-export declare const LanguageProviderContext: React.Context<LanguageProviderContextType>;
-export interface LanguageProviderProps {
-    children?: React.ReactNode;
-    translations?: PartialTranslations | PartialTranslations[];
-}
-export declare const useProvider: () => LanguageProviderContextType;
-/**
- * @private Feature is under development and should not be used in any applications.
- *
- * @example
- * ```jsx
- * <UNSAFE_AkselLanguageProvider translations={{...}}>
- *   {app}
- * </UNSAFE_AkselLanguageProvider>
- * ```
- */
-export declare const UNSAFE_AkselLanguageProvider: ({ children, translations, }: LanguageProviderProps) => React.JSX.Element;
-export default UNSAFE_AkselLanguageProvider;

package/cjs/provider/i18n/LanguageProvider.js

@@ -1,54 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.UNSAFE_AkselLanguageProvider = exports.useProvider = exports.LanguageProviderContext = void 0;
-const react_1 = __importStar(require("react"));
-const nb_1 = __importDefault(require("../../util/i18n/locales/nb"));
-exports.LanguageProviderContext = (0, react_1.createContext)({
-    translations: nb_1.default,
-});
-const useProvider = () => (0, react_1.useContext)(exports.LanguageProviderContext);
-exports.useProvider = useProvider;
-/**
- * @private Feature is under development and should not be used in any applications.
- *
- * @example
- * ```jsx
- * <UNSAFE_AkselLanguageProvider translations={{...}}>
- *   {app}
- * </UNSAFE_AkselLanguageProvider>
- * ```
- */
-const UNSAFE_AkselLanguageProvider = ({ children, translations, }) => {
-    return (react_1.default.createElement(exports.LanguageProviderContext.Provider, { value: {
-            translations: translations !== null && translations !== void 0 ? translations : nb_1.default,
-        } }, children));
-};
-exports.UNSAFE_AkselLanguageProvider = UNSAFE_AkselLanguageProvider;
-exports.default = exports.UNSAFE_AkselLanguageProvider;
-//# sourceMappingURL=LanguageProvider.js.map

package/cjs/provider/i18n/LanguageProvider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LanguageProvider.js","sourceRoot":"","sources":["../../../src/provider/i18n/LanguageProvider.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAyD;AAEzD,oEAA4C;AAS/B,QAAA,uBAAuB,GAClC,IAAA,qBAAa,EAA8B;IACzC,YAAY,EAAE,YAAE;CACjB,CAAC,CAAC;AAOE,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,IAAA,kBAAU,EAAC,+BAAuB,CAAC,CAAC;AAAxD,QAAA,WAAW,eAA6C;AAErE;;;;;;;;;GASG;AACI,MAAM,4BAA4B,GAAG,CAAC,EAC3C,QAAQ,EACR,YAAY,GACU,EAAE,EAAE;IAC1B,OAAO,CACL,8BAAC,+BAAuB,CAAC,QAAQ,IAC/B,KAAK,EAAE;YACL,YAAY,EAAE,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,YAAE;SACjC,IAEA,QAAQ,CACwB,CACpC,CAAC;AACJ,CAAC,CAAC;AAbW,QAAA,4BAA4B,gCAavC;AAEF,kBAAe,oCAA4B,CAAC"}

package/esm/provider/i18n/LanguageProvider.d.ts

@@ -1,26 +0,0 @@
-import React from "react";
-import { PartialTranslations } from "../../util/i18n/i18n.types.js";
-export interface LanguageProviderContextType {
-    /**
-     * Merged with the default language translations object (officially provided translations).
-     */
-    translations: PartialTranslations | PartialTranslations[];
-}
-export declare const LanguageProviderContext: React.Context<LanguageProviderContextType>;
-export interface LanguageProviderProps {
-    children?: React.ReactNode;
-    translations?: PartialTranslations | PartialTranslations[];
-}
-export declare const useProvider: () => LanguageProviderContextType;
-/**
- * @private Feature is under development and should not be used in any applications.
- *
- * @example
- * ```jsx
- * <UNSAFE_AkselLanguageProvider translations={{...}}>
- *   {app}
- * </UNSAFE_AkselLanguageProvider>
- * ```
- */
-export declare const UNSAFE_AkselLanguageProvider: ({ children, translations, }: LanguageProviderProps) => React.JSX.Element;
-export default UNSAFE_AkselLanguageProvider;

package/esm/provider/i18n/LanguageProvider.js

@@ -1,23 +0,0 @@
-import React, { createContext, useContext } from "react";
-import nb from "../../util/i18n/locales/nb.js";
-export const LanguageProviderContext = createContext({
-    translations: nb,
-});
-export const useProvider = () => useContext(LanguageProviderContext);
-/**
- * @private Feature is under development and should not be used in any applications.
- *
- * @example
- * ```jsx
- * <UNSAFE_AkselLanguageProvider translations={{...}}>
- *   {app}
- * </UNSAFE_AkselLanguageProvider>
- * ```
- */
-export const UNSAFE_AkselLanguageProvider = ({ children, translations, }) => {
-    return (React.createElement(LanguageProviderContext.Provider, { value: {
-            translations: translations !== null && translations !== void 0 ? translations : nb,
-        } }, children));
-};
-export default UNSAFE_AkselLanguageProvider;
-//# sourceMappingURL=LanguageProvider.js.map

package/esm/provider/i18n/LanguageProvider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LanguageProvider.js","sourceRoot":"","sources":["../../../src/provider/i18n/LanguageProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAS5C,MAAM,CAAC,MAAM,uBAAuB,GAClC,aAAa,CAA8B;IACzC,YAAY,EAAE,EAAE;CACjB,CAAC,CAAC;AAOL,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC;AAErE;;;;;;;;;GASG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,EAC3C,QAAQ,EACR,YAAY,GACU,EAAE,EAAE;IAC1B,OAAO,CACL,oBAAC,uBAAuB,CAAC,QAAQ,IAC/B,KAAK,EAAE;YACL,YAAY,EAAE,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,EAAE;SACjC,IAEA,QAAQ,CACwB,CACpC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,4BAA4B,CAAC"}

package/src/provider/i18n/LanguageProvider.tsx

@@ -1,49 +0,0 @@
-import React, { createContext, useContext } from "react";
-import { PartialTranslations } from "../../util/i18n/i18n.types";
-import nb from "../../util/i18n/locales/nb";
-
-export interface LanguageProviderContextType {
-  /**
-   * Merged with the default language translations object (officially provided translations).
-   */
-  translations: PartialTranslations | PartialTranslations[];
-}
-
-export const LanguageProviderContext =
-  createContext<LanguageProviderContextType>({
-    translations: nb,
-  });
-
-export interface LanguageProviderProps {
-  children?: React.ReactNode;
-  translations?: PartialTranslations | PartialTranslations[];
-}
-
-export const useProvider = () => useContext(LanguageProviderContext);
-
-/**
- * @private Feature is under development and should not be used in any applications.
- *
- * @example
- * ```jsx
- * <UNSAFE_AkselLanguageProvider translations={{...}}>
- *   {app}
- * </UNSAFE_AkselLanguageProvider>
- * ```
- */
-export const UNSAFE_AkselLanguageProvider = ({
-  children,
-  translations,
-}: LanguageProviderProps) => {
-  return (
-    <LanguageProviderContext.Provider
-      value={{
-        translations: translations ?? nb,
-      }}
-    >
-      {children}
-    </LanguageProviderContext.Provider>
-  );
-};
-
-export default UNSAFE_AkselLanguageProvider;