@questpie/admin 1.1.1 → 3.0.0

package/dist/client/runtime/content-locales-provider.mjs

@@ -0,0 +1,136 @@
+import { selectClient, useAdminStore } from "./provider.mjs";
+import { c } from "react/compiler-runtime";
+import { createContext, useContext } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { DEFAULT_LOCALE } from "questpie/shared";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/client/runtime/content-locales-provider.tsx
+/**
+* Content Locales Provider
+*
+* Fetches and provides content locales from the backend app configuration.
+* Content locales are different from UI locales - they define which languages
+* are available for content translation.
+*/
+const ContentLocalesContext = createContext(null);
+const DEFAULT_LOCALES = {
+	locales: [{
+		code: DEFAULT_LOCALE,
+		label: "English",
+		fallback: true
+	}],
+	defaultLocale: DEFAULT_LOCALE
+};
+/**
+* Content Locales Provider
+*
+* Fetches content locales from the backend and provides them to the UI.
+* Must be used inside AdminProvider to access the client.
+*
+* @example
+* ```tsx
+* <AdminProvider admin={admin} client={client}>
+*   <ContentLocalesProvider>
+*     <App />
+*   </ContentLocalesProvider>
+* </AdminProvider>
+* ```
+*/
+function ContentLocalesProvider(t0) {
+	const $ = c(20);
+	const { children } = t0;
+	const client = useAdminStore(selectClient);
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = ["questpie", "contentLocales"];
+		$[0] = t1;
+	} else t1 = $[0];
+	let t2;
+	if ($[1] !== client) {
+		t2 = {
+			queryKey: t1,
+			queryFn: async () => {
+				try {
+					return await client.routes.getContentLocales({});
+				} catch {
+					return DEFAULT_LOCALES;
+				}
+			},
+			staleTime: 3e5,
+			gcTime: 6e5
+		};
+		$[1] = client;
+		$[2] = t2;
+	} else t2 = $[2];
+	const { data, isLoading, error } = useQuery(t2);
+	const localesData = data ?? DEFAULT_LOCALES;
+	const t3 = localesData.locales.length > 1;
+	const t4 = error;
+	let t5;
+	let t6;
+	if ($[3] !== localesData.locales) {
+		t5 = (code) => {
+			return localesData.locales.find((l) => l.code === code)?.label ?? code.toUpperCase();
+		};
+		t6 = (code_0) => localesData.locales.some((l_0) => l_0.code === code_0);
+		$[3] = localesData.locales;
+		$[4] = t5;
+		$[5] = t6;
+	} else {
+		t5 = $[4];
+		t6 = $[5];
+	}
+	let t7;
+	if ($[6] !== localesData.defaultLocale || $[7] !== localesData.fallbacks) {
+		t7 = (code_1) => {
+			if (localesData.fallbacks?.[code_1]) return localesData.fallbacks[code_1];
+			return localesData.defaultLocale;
+		};
+		$[6] = localesData.defaultLocale;
+		$[7] = localesData.fallbacks;
+		$[8] = t7;
+	} else t7 = $[8];
+	let t8;
+	if ($[9] !== isLoading || $[10] !== localesData || $[11] !== t3 || $[12] !== t4 || $[13] !== t5 || $[14] !== t6 || $[15] !== t7) {
+		t8 = {
+			...localesData,
+			isLocalized: t3,
+			isLoading,
+			error: t4,
+			getLocaleLabel: t5,
+			isValidLocale: t6,
+			getFallbackLocale: t7
+		};
+		$[9] = isLoading;
+		$[10] = localesData;
+		$[11] = t3;
+		$[12] = t4;
+		$[13] = t5;
+		$[14] = t6;
+		$[15] = t7;
+		$[16] = t8;
+	} else t8 = $[16];
+	const value = t8;
+	let t9;
+	if ($[17] !== children || $[18] !== value) {
+		t9 = /* @__PURE__ */ jsx(ContentLocalesContext.Provider, {
+			value,
+			children
+		});
+		$[17] = children;
+		$[18] = value;
+		$[19] = t9;
+	} else t9 = $[19];
+	return t9;
+}
+/**
+* Safely get content locales from context.
+* Returns null if not inside provider (useful for optional features).
+*/
+function useSafeContentLocales() {
+	return useContext(ContentLocalesContext);
+}
+
+//#endregion
+export { ContentLocalesProvider, useSafeContentLocales };

package/dist/client/runtime/index.d.mts

@@ -0,0 +1,5 @@
+import "./content-locales-provider.mjs";
+import "./locale-scope.mjs";
+import { AdminProvider, AdminProviderProps, AdminState, AdminStore, selectAdmin, selectBasePath, selectClient, selectNavigate, useAdminStore } from "./provider.mjs";
+import { useShallow } from "zustand/shallow";
+export { useShallow };

package/dist/client/runtime/index.mjs

@@ -0,0 +1,6 @@
+import { AdminProvider, selectAdmin, selectAuthClient, selectBasePath, selectBrandName, selectClient, selectContentLocale, selectNavigate, selectRealtime, selectSetContentLocale, useAdminStore } from "./provider.mjs";
+import { useSafeContentLocales } from "./content-locales-provider.mjs";
+import { LocaleScopeProvider, useScopedLocale } from "./locale-scope.mjs";
+import { useShallow } from "zustand/shallow";
+
+export { useShallow };

package/dist/client/runtime/locale-scope.d.mts

@@ -0,0 +1,2 @@
+import "react";
+import "react/jsx-runtime";

package/dist/client/runtime/locale-scope.mjs

@@ -0,0 +1,108 @@
+import { selectContentLocale, selectSetContentLocale, useAdminStore } from "./provider.mjs";
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/client/runtime/locale-scope.tsx
+/**
+* LocaleScope Context
+*
+* Provides scoped locale state for nested forms (e.g., ResourceSheet).
+* When a component is wrapped in LocaleScopeProvider, locale changes
+* affect only that scope, not the global content locale.
+*
+* @example
+* ```tsx
+* // In ResourceSheet - creates isolated locale scope
+* <LocaleScopeProvider>
+*   <FormView ... />
+* </LocaleScopeProvider>
+*
+* // In FieldWrapper - uses scoped locale if available
+* const { locale, setLocale } = useScopedLocale();
+* ```
+*/
+const LocaleScopeContext = React.createContext(null);
+/**
+* Provides an isolated locale scope for nested forms.
+* Locale changes inside this provider don't affect the global state.
+*/
+function LocaleScopeProvider(t0) {
+	const $ = c(9);
+	const { children, initialLocale } = t0;
+	const globalLocale = useAdminStore(selectContentLocale);
+	const [scopedLocale, setScopedLocale] = React.useState(initialLocale ?? globalLocale);
+	const hasModifiedRef = React.useRef(false);
+	let t1;
+	let t2;
+	if ($[0] !== globalLocale) {
+		t1 = () => {
+			if (!hasModifiedRef.current) setScopedLocale(globalLocale);
+		};
+		t2 = [globalLocale];
+		$[0] = globalLocale;
+		$[1] = t1;
+		$[2] = t2;
+	} else {
+		t1 = $[1];
+		t2 = $[2];
+	}
+	React.useEffect(t1, t2);
+	let t3;
+	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = (locale) => {
+			hasModifiedRef.current = true;
+			setScopedLocale(locale);
+		};
+		$[3] = t3;
+	} else t3 = $[3];
+	const setLocale = t3;
+	let t4;
+	if ($[4] !== scopedLocale) {
+		t4 = {
+			locale: scopedLocale,
+			setLocale,
+			isScoped: true
+		};
+		$[4] = scopedLocale;
+		$[5] = t4;
+	} else t4 = $[5];
+	const value = t4;
+	let t5;
+	if ($[6] !== children || $[7] !== value) {
+		t5 = /* @__PURE__ */ jsx(LocaleScopeContext.Provider, {
+			value,
+			children
+		});
+		$[6] = children;
+		$[7] = value;
+		$[8] = t5;
+	} else t5 = $[8];
+	return t5;
+}
+/**
+* Returns scoped locale if in a LocaleScopeProvider, otherwise global locale.
+* Use this in components that need locale-aware behavior (FieldWrapper, FormView).
+*/
+function useScopedLocale() {
+	const $ = c(3);
+	const scopedContext = React.useContext(LocaleScopeContext);
+	const globalLocale = useAdminStore(selectContentLocale);
+	const globalSetLocale = useAdminStore(selectSetContentLocale);
+	if (scopedContext) return scopedContext;
+	let t0;
+	if ($[0] !== globalLocale || $[1] !== globalSetLocale) {
+		t0 = {
+			locale: globalLocale,
+			setLocale: globalSetLocale,
+			isScoped: false
+		};
+		$[0] = globalLocale;
+		$[1] = globalSetLocale;
+		$[2] = t0;
+	} else t0 = $[2];
+	return t0;
+}
+
+//#endregion
+export { LocaleScopeProvider, useScopedLocale };

package/dist/client/runtime/provider.d.mts

@@ -0,0 +1,203 @@
+import { I18nAdapter } from "../i18n/types.mjs";
+import { AdminState as AdminState$1, BlockDefinitionMap, ComponentDefinitionMap, FieldDefinitionMap, PageDefinitionMap, TranslationsMap, ViewDefinitionMap, WidgetDefinitionMap } from "../builder/admin-types.mjs";
+import { Admin, AdminInput } from "../builder/admin.mjs";
+import { AnyQuestpieClient } from "../builder/index.mjs";
+import { NavigationGroup } from "./routes.mjs";
+import { ReactElement, ReactNode } from "react";
+import { QueryClient } from "@tanstack/react-query";
+import * as zustand0 from "zustand";
+
+//#region src/client/runtime/provider.d.ts
+
+interface AdminState {
+  admin: Admin;
+  client: AnyQuestpieClient;
+  authClient: any | null;
+  basePath: string;
+  navigate: (path: string) => void;
+  realtime: {
+    enabled: boolean;
+  };
+  contentLocale: string;
+  setContentLocale: (locale: string) => void;
+  navigation: NavigationGroup[];
+  brandName: string;
+}
+type AdminStore = ReturnType<typeof createAdminStore>;
+interface CreateAdminStoreProps {
+  admin: Admin;
+  client: AnyQuestpieClient;
+  authClient: any | null;
+  basePath: string;
+  navigate: (path: string) => void;
+  realtime: {
+    enabled: boolean;
+  };
+  initialContentLocale: string;
+}
+declare function createAdminStore({
+  admin,
+  client,
+  authClient,
+  basePath,
+  navigate,
+  realtime,
+  initialContentLocale
+}: CreateAdminStoreProps): zustand0.StoreApi<AdminState>;
+interface AdminProviderProps {
+  /**
+   * Admin configuration - pass plain AdminState or Admin instance.
+   */
+  admin: AdminInput<any>;
+  /**
+   * The API client for data fetching
+   */
+  client: AnyQuestpieClient;
+  /**
+   * The auth client for authentication (created via createAdminAuthClient)
+   */
+  authClient?: any;
+  /**
+   * Base path for admin routes (default: "/admin")
+   */
+  basePath?: string;
+  /**
+   * Realtime settings for auto-refreshing collection/global queries via SSE.
+   *
+   * - `true`: enable (default)
+   * - `false`: disabled
+   * - `undefined`: enabled by default
+   * - object: configure enabled flag
+   *
+   * The SSE connection config (base URL, credentials) is handled by the client's
+   * built-in `realtime` API — see `createClient()` from `questpie/client`.
+   */
+  realtime?: boolean | {
+    enabled?: boolean;
+  };
+  /**
+   * Navigate function for routing
+   */
+  navigate?: (path: string) => void;
+  /**
+   * Initial UI locale (admin interface language)
+   * If not provided, reads from cookie or uses default from admin config
+   */
+  initialUiLocale?: string;
+  /**
+   * Initial content locale (content language)
+   * If not provided, reads from cookie or uses default from admin config
+   */
+  initialContentLocale?: string;
+  /**
+   * Optional query client (if not provided, uses the nearest QueryClientProvider)
+   */
+  queryClient?: QueryClient;
+  /**
+   * Optional custom i18n adapter
+   * If not provided, uses the built-in simple i18n with admin messages
+   * @deprecated Use useServerTranslations instead
+   */
+  i18nAdapter?: I18nAdapter;
+  /**
+   * Use server-side translations (fetched via getAdminTranslations RPC).
+   * When true, translations are fetched from the server configured via
+   * .adminLocale() and config translations.
+   *
+   * @default false (for backwards compatibility)
+   *
+   * @example
+   * ```tsx
+   * // Server configures locales and messages
+   * const app = runtimeConfig({
+   *   modules: [adminModule],
+   *   adminLocale: { locales: ["en", "sk"], defaultLocale: "en" },
+   *   messages: { sk: { "common.save": "Ulozit" } },
+   * });
+   *
+   * // Client fetches from server
+   * <AdminProvider admin={admin} client={client} useServerTranslations>
+   *   {children}
+   * </AdminProvider>
+   * ```
+   */
+  useServerTranslations?: boolean;
+  /**
+   * Fallback element to show while loading server translations.
+   * Only used when useServerTranslations is true.
+   */
+  translationsFallback?: ReactNode;
+  /**
+   * Children to render
+   */
+  children: ReactNode;
+}
+/**
+ * Admin provider component
+ *
+ * Creates a scoped Zustand store for admin state management.
+ * Use `useAdminStore(selector)` to access state with optimized re-renders.
+ *
+ * @example
+ * ```tsx
+ * import { AdminProvider, useAdminStore } from "@questpie/admin/runtime";
+ *
+ * function App() {
+ *   return (
+ *     <AdminProvider admin={admin} client={client}>
+ *       <MyComponent />
+ *     </AdminProvider>
+ *   );
+ * }
+ *
+ * function MyComponent() {
+ *   // Only re-renders when locale changes
+ *   const locale = useAdminStore((s) => s.locale);
+ *   const setLocale = useAdminStore((s) => s.setLocale);
+ *   // ...
+ * }
+ * ```
+ */
+declare function AdminProvider({
+  admin: adminInput,
+  client,
+  authClient,
+  basePath,
+  realtime,
+  navigate: navigateProp,
+  initialUiLocale,
+  initialContentLocale,
+  i18nAdapter: customI18nAdapter,
+  useServerTranslations,
+  translationsFallback,
+  children
+}: AdminProviderProps): ReactElement;
+/**
+ * Access admin store with a selector for optimized re-renders.
+ *
+ * @example
+ * ```tsx
+ * // Only re-renders when locale changes
+ * const locale = useAdminStore((s) => s.locale);
+ *
+ * // Get multiple values (re-renders when any changes)
+ * const { admin, client } = useAdminStore((s) => ({
+ *   admin: s.admin,
+ *   client: s.client,
+ * }));
+ *
+ * // Get navigation (computed once)
+ * const navigation = useAdminStore((s) => s.navigation);
+ * ```
+ */
+declare function useAdminStore<T>(selector: (state: AdminState) => T): T;
+/** Select admin instance */
+declare const selectAdmin: (s: AdminState) => Admin<AdminState$1<any, FieldDefinitionMap, ComponentDefinitionMap, ViewDefinitionMap, PageDefinitionMap, WidgetDefinitionMap, BlockDefinitionMap, TranslationsMap>>;
+/** Select client instance */
+declare const selectClient: (s: AdminState) => AnyQuestpieClient;
+/** Select base path */
+declare const selectBasePath: (s: AdminState) => string;
+/** Select navigate function */
+declare const selectNavigate: (s: AdminState) => (path: string) => void;
+//#endregion
+export { AdminProvider, AdminProviderProps, AdminState, AdminStore, selectAdmin, selectBasePath, selectClient, selectNavigate, useAdminStore };