Globals
View as MarkdownReads the request-wide values your global context exposes to the client.
Values that every component needs, or constants for your own entry files like icons, come from the global context on the server. Getters marked #[ExposeToClient] are written once into window.FluidPrimitives.globals, and getGlobal() reads them.
// GlobalContext.php
#[ExposeToClient(name: 'lightbox.icons')]
public function getLightboxIcons(): array
{
return ['close' => '<svg>...</svg>'];
}
import { getGlobal } from 'fluid-primitives';
const icons = getGlobal<Record<string, string>>('lightbox.icons', {});
const locale = getGlobal<string>('locale');
getGlobal
Permalink to heading "getGlobal"function getGlobal<T = unknown>(path: string): T | undefined;
function getGlobal<T>(path: string, fallback: T): T;
The path is a dot path. A key that literally contains a dot wins, otherwise the path walks objects and arrays segment by segment (getGlobal('items.0.label')). A missing segment gives undefined, or the fallback when you pass one.
locale and debug are always available. Everything else is whatever your global context exposes.
getGlobals
Permalink to heading "getGlobals"function getGlobals(): FluidPrimitivesGlobals | null;
Returns the whole globals object, or null when the page has no window.FluidPrimitives. That is the case on a page where no component hydrates and no template reads a global, see Hydration. In entry code that can run on such a page, recommended: read with getGlobal() and a fallback.
import { devWarn, isDebug } from 'fluid-primitives';
devWarn('Missing data-id on the lightbox trigger', element);
devWarn() prints a console.warn prefixed with [fluid-primitives], but only when the debug global is true, which is the case in the Development application context. isDebug() returns that flag. Use them in your own entry files for checks that production pages should skip.