npm - najm-kit - Versions diffs - 2.11.16 → 2.11.17 - Mend

najm-kit 2.11.16 → 2.11.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/adapters/app.d.ts CHANGED Viewed

@@ -18,20 +18,62 @@ interface NajmAppBranding {
     logoExpanded?: string | null;
     logoCollapsed?: string | null;
 }
+/**
+ * The part of a `najm-i18n` definition this provider reads.
+ *
+ * Structural, so a whole definition satisfies it — its methods are simply
+ * extra — and named for data rather than behaviour because everything derived
+ * here (the writing direction, the formatting tags) is declared metadata.
+ *
+ * That also decides what a Server Component may pass. This provider is a
+ * Client Component, and React rejects a prop carrying functions outright, so a
+ * server layout passes `definition.snapshot` — the same fields without the
+ * methods — while a client parent passes the definition itself.
+ */
+interface NajmAppI18n {
+    translations: Translations;
+    defaultLanguage?: string;
+    supportedLanguages?: readonly string[];
+    fallbackToDefaultLanguage?: boolean;
+    languageMetadata?: {
+        readonly [language: string]: {
+            locale?: string;
+            direction?: 'ltr' | 'rtl';
+        } | undefined;
+    };
+}
 interface NajmAppProviderProps extends Omit<NajmNextUIProviderProps, 't'> {
     /**
      * Enables schema-driven form filling for every `NForm` and `WizardForm`.
      * `true` uses F8; an options object can choose another shortcut.
      */
     formDevTools?: boolean | FormDevToolsOptions;
+    /**
+     * A `najm-i18n` definition, standing in for five props: `translations`,
+     * `defaultLanguage`, `fallbackToDefaultLanguage`, `locales` and
+     * `getLanguageDirection`. All five are already declared in the definition, so
+     * an application that has one should not have to take it apart and hand the
+     * pieces back. Any of them passed explicitly still wins, which is how an
+     * application overrides one facet without abandoning the definition.
+     *
+     * From a Server Component, pass `definition.snapshot` instead — see
+     * `NajmAppI18n`.
+     *
+     * `initialLanguage` is deliberately not part of it: the active language is a
+     * per-request value no definition can know.
+     */
+    i18n?: NajmAppI18n;
     /**
      * Catalog for `najm-i18n`. Supplying it mounts an `I18nProvider` and derives
      * the pagination labels from it, so `t` is not a prop here — the provider
      * already has the translator and passing one in would be a second source of
      * truth.
+     *
+     * Defaults to `i18n.translations`.
      */
     translations?: Translations;
     initialLanguage?: string;
+    /** Defaults to `i18n.defaultLanguage`. */
     defaultLanguage?: string;
     /**
      * Resolves a key missing from the active language against `defaultLanguage`
@@ -41,9 +83,17 @@ interface NajmAppProviderProps extends Omit<NajmNextUIProviderProps, 't'> {
      * Off by default, matching the package. An application shipping an
      * incomplete locale beside a complete one turns it on here rather than
      * pre-merging its catalogs.
+     *
+     * Defaults to `i18n.fallbackToDefaultLanguage`.
      */
     fallbackToDefaultLanguage?: boolean;
-    /** Maps a language to the writing direction applied to `<html>`. */
+    /**
+     * Maps a language to the writing direction applied to `<html>`.
+     *
+     * Defaults to `i18n.languageMetadata`, resolving an unsupported language
+     * against `defaultLanguage` the way the definition's own `direction` does,
+     * rather than falling through to `najm-i18n`'s built-in Arabic guess.
+     */
     getLanguageDirection?: (language: string) => 'ltr' | 'rtl';
     /**
      * Where the chosen language is POSTed, as `{ language }`. Defaults to
@@ -77,6 +127,8 @@ interface NajmAppProviderProps extends Omit<NajmNextUIProviderProps, 't'> {
      * The distinction matters because language and region are separate choices:
      * `fr` alone formats dates and separators the French way, which is not how
      * they are written in Morocco. Unmapped languages are used as-is.
+     *
+     * Defaults to the `locale` of each `i18n.languageMetadata` entry.
      */
     locales?: Record<string, string>;
     /**
@@ -122,6 +174,6 @@ interface NajmAppProviderProps extends Omit<NajmNextUIProviderProps, 't'> {
  * state machine of its own above this provider. The controlled `design` and
  * `branding` props still work for applications that already do.
  */
-declare function NajmAppProvider({ translations, initialLanguage, defaultLanguage, fallbackToDefaultLanguage, getLanguageDirection, languageEndpoint, appName, initialBranding, formDevTools, ...props }: NajmAppProviderProps): React.JSX.Element;
+declare function NajmAppProvider({ i18n, translations, initialLanguage, defaultLanguage, fallbackToDefaultLanguage, getLanguageDirection: languageDirection, locales: localeTags, languageEndpoint, appName, initialBranding, formDevTools, ...props }: NajmAppProviderProps): React.JSX.Element;
-export { type NajmAppBranding, NajmAppProvider, type NajmAppProviderProps };
+export { type NajmAppBranding, type NajmAppI18n, NajmAppProvider, type NajmAppProviderProps };

package/dist/adapters/app.mjs CHANGED Viewed

@@ -69,17 +69,39 @@ function NajmAppNoI18n({
   ) });
 }
 function NajmAppProvider({
-  translations,
+  i18n,
+  translations = i18n?.translations,
   initialLanguage,
-  defaultLanguage,
-  fallbackToDefaultLanguage,
-  getLanguageDirection,
+  defaultLanguage = i18n?.defaultLanguage,
+  fallbackToDefaultLanguage = i18n?.fallbackToDefaultLanguage,
+  getLanguageDirection: languageDirection,
+  locales: localeTags,
   languageEndpoint = DEFAULT_LANGUAGE_ENDPOINT,
   appName,
   initialBranding,
   formDevTools,
   ...props
 }) {
+  const getLanguageDirection = React.useMemo(() => {
+    if (languageDirection) return languageDirection;
+    if (!i18n) return void 0;
+    const metadata = i18n.languageMetadata;
+    const languages = i18n.supportedLanguages ?? Object.keys(i18n.translations);
+    const fallback = i18n.defaultLanguage;
+    return (language) => {
+      const known = languages.includes(language) ? language : fallback ?? language;
+      return metadata?.[known]?.direction ?? "ltr";
+    };
+  }, [i18n, languageDirection]);
+  const locales = React.useMemo(() => {
+    if (localeTags) return localeTags;
+    if (!i18n?.languageMetadata) return void 0;
+    const metadata = i18n.languageMetadata;
+    const languages = i18n.supportedLanguages ?? Object.keys(i18n.translations);
+    return Object.fromEntries(
+      languages.map((language) => [language, metadata[language]?.locale ?? language])
+    );
+  }, [i18n, localeTags]);
   const persistLanguage = React.useCallback(
     async (language) => {
       const response = await fetch(languageEndpoint, {
@@ -98,7 +120,7 @@ function NajmAppProvider({
   );
   const seeded = appName ? { appName, ...initialBranding } : initialBranding;
   if (!translations) {
-    return /* @__PURE__ */ jsx(FormDevToolsProvider, { value: formDevTools, children: /* @__PURE__ */ jsx(NajmAppNoI18n, { ...props, initialBranding: seeded }) });
+    return /* @__PURE__ */ jsx(FormDevToolsProvider, { value: formDevTools, children: /* @__PURE__ */ jsx(NajmAppNoI18n, { ...props, locales, initialBranding: seeded }) });
   }
   return /* @__PURE__ */ jsx(FormDevToolsProvider, { value: formDevTools, children: /* @__PURE__ */ jsx(
     I18nProvider,
@@ -109,7 +131,7 @@ function NajmAppProvider({
       fallbackToDefaultLanguage,
       getLanguageDirection,
       onLanguageChange: persistLanguage,
-      children: /* @__PURE__ */ jsx(NajmAppUI, { ...props, initialBranding: seeded })
+      children: /* @__PURE__ */ jsx(NajmAppUI, { ...props, locales, initialBranding: seeded })
     }
   ) });
 }

package/dist/theme.css CHANGED Viewed

@@ -317,10 +317,10 @@ input:autofill {
   overflow-x: auto;
   scrollbar-width: none;
 }
-.najm-overlay-scroll-x::-webkit-scrollbar {
-  display: none;
-}
+.najm-overlay-scroll-x::-webkit-scrollbar {
+  display: none;
+}
 /* Responsive table actions stay discoverable on touch and tablet layouts.
    Fine-pointer desktops may keep the quieter hover/focus reveal treatment. */
 .ntable-card-action {
@@ -377,7 +377,7 @@ input:autofill {
   .nimage-input-compact-overlay:focus-visible {
     opacity: 1;
   }
-}
+}
 /* OverlayScrollbars theme used by the <NajmScroll> component — a thin,
    translucent slate bar that floats over content with no reserved space.

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "najm-kit",
-  "version": "2.11.16",
+  "version": "2.11.17",
   "license": "MIT",
   "type": "module",
   "description": "Reusable React UI component package for Najm framework",
@@ -198,7 +198,7 @@
     "@uiw/react-codemirror": "^4.25.0",
     "@vitejs/plugin-react": "^5.2.0",
     "happy-dom": "^20.11.1",
-    "najm-i18n": "^2.1.1",
+    "najm-i18n": "^2.1.2",
     "postcss": "^8.5.22",
     "react-hook-form": "^7",
     "rimraf": "^6",