fimo 0.12.0-staging.1 → 0.12.0-staging.3

package/dist/runtime/labels/core.d.ts

@@ -0,0 +1,18 @@
+import { FimoString } from '../primitives/lib/index.js';
+export interface LabelsSnapshot {
+    locale: string;
+    labels: Record<string, string>;
+    updatedAt: string | null;
+}
+export interface Labels {
+    locale: string;
+    snapshot: LabelsSnapshot;
+    t(key: string): FimoString;
+}
+/**
+ * Build the shared label reader used by server `getLabels()` and client
+ * `useLabels()`. Missing keys stay editable but render as an empty string;
+ * snapshots never fall back across locales implicitly.
+ */
+export declare function createLabels(snapshot: LabelsSnapshot): Labels;
+//# sourceMappingURL=core.d.ts.map

package/dist/runtime/labels/core.js

@@ -0,0 +1,15 @@
+import { FimoString } from '../primitives/lib/index.js';
+/**
+ * Build the shared label reader used by server `getLabels()` and client
+ * `useLabels()`. Missing keys stay editable but render as an empty string;
+ * snapshots never fall back across locales implicitly.
+ */
+export function createLabels(snapshot) {
+    return {
+        locale: snapshot.locale,
+        snapshot,
+        t(key) {
+            return new FimoString(snapshot.labels[key] ?? '', `__labels.${snapshot.locale}.${key}.value`);
+        },
+    };
+}

package/dist/runtime/labels/fetch.d.ts

@@ -0,0 +1,7 @@
+import type { ContentRuntime } from '../content/client/runtime.js';
+import { type Labels } from './core.js';
+export interface GetLabelsOptions {
+    locale?: string;
+}
+export declare function fetchLabels(runtime: ContentRuntime, { locale: requestedLocale }?: GetLabelsOptions): Promise<Labels>;
+//# sourceMappingURL=fetch.d.ts.map

package/dist/runtime/labels/fetch.js

@@ -0,0 +1,41 @@
+import { createLabels } from './core.js';
+function dictionaryFrom(value) {
+    if (!value || typeof value !== 'object' || Array.isArray(value)) {
+        return {};
+    }
+    return Object.fromEntries(Object.entries(value).filter((entry) => typeof entry[1] === 'string'));
+}
+function snapshotFrom(body, requestedLocale) {
+    if (Array.isArray(body.data)) {
+        return {
+            locale: requestedLocale,
+            labels: Object.fromEntries(body.data.flatMap((row) => {
+                if (typeof row.key !== 'string') {
+                    return [];
+                }
+                const value = typeof row.value === 'string' ? row.value : row.defaultValue;
+                return [[row.key, typeof value === 'string' ? value : '']];
+            })),
+            updatedAt: null,
+        };
+    }
+    const data = body.data;
+    return {
+        locale: typeof data?.locale === 'string' && data.locale.trim() ? data.locale : requestedLocale,
+        labels: dictionaryFrom(data?.labels),
+        updatedAt: typeof data?.updatedAt === 'string' ? data.updatedAt : null,
+    };
+}
+export async function fetchLabels(runtime, { locale: requestedLocale } = {}) {
+    const locale = requestedLocale?.trim() || runtime.defaultLocale();
+    const url = new URL('/labels', runtime.apiBase());
+    url.searchParams.set('locale', locale);
+    const response = await runtime.fetch(url, {
+        headers: runtime.headers({ Accept: 'application/json' }),
+    });
+    if (!response.ok) {
+        throw new Error(`Failed to read Fimo labels (${response.status}).`);
+    }
+    const body = (await response.json());
+    return createLabels(snapshotFrom(body, locale));
+}

package/dist/runtime/next/client.d.ts

@@ -9,8 +9,16 @@ export type { CollectionContentClient, InfiniteListResult, SingletonContentClien
 export { createContentCore, createSingletonCore } from '../content/index.js';
 export type { CollectionContentCore, CollectionPage, CollectionPageInfo, ContentClientConfig, ContentClientHandle, ContentModuleMeta, ContentModuleRef, ContentReadOptions, ContentResult, ContentRuntime, ContentSchema, ContentSchemaField, SingletonContentCore, } from '../content/index.js';
 export { FIMO_PARTS, FIMO_SOURCE, FimoBoolean, FimoDate, FimoMedia, FimoRichText, FimoString, getFimoParts, getFimoSource, hasFimoSource, isFimoDate, isFimoString, } from '../content/index.js';
-export { Text } from '../primitives/components/Text.js';
+export { Boolean } from '../react/primitives/editable/Boolean.js';
+export { Date } from '../react/primitives/editable/Date.js';
+export { Image } from '../react/primitives/editable/Image.js';
+export { Json } from '../react/primitives/editable/Json.js';
+export { RichText } from '../react/primitives/editable/RichText.js';
+export { StaticImage } from '../react/primitives/renderers/StaticImage.js';
+export { Text } from '../react/primitives/editable/Text.js';
+export { Video } from '../react/primitives/editable/Video.js';
 export type { BoolOps, DateOps, Field, Fields, FilterFor, FimoPart, FimoPolymorphicReference, FimoReference, FimoRichTextComponents, FimoRichTextContent, FimoRichTextMarkProps, FimoRichTextNodeProps, FimoSource, NullOnlyOps, NumberOps, Populate, Populated, PopulatedResult, Projected, ProjectedWithPopulate, Query, ReferenceField, ReferenceMap, ScalarOps, Sort, SortField, StringOps, Where, WithReferences, } from '../content/index.js';
-export { FimoNextProvider } from './provider.js';
-export type { FimoNextProviderProps } from './provider.js';
+export { FimoProvider, useLabels } from './provider.js';
+export type { FimoProviderProps } from './provider.js';
+export type { Labels, LabelsSnapshot } from '../labels/core.js';
 //# sourceMappingURL=client.d.ts.map

package/dist/runtime/next/client.js

@@ -11,5 +11,12 @@ export function createSingletonClient(config) {
 }
 export { createContentCore, createSingletonCore } from '../content/index.js';
 export { FIMO_PARTS, FIMO_SOURCE, FimoBoolean, FimoDate, FimoMedia, FimoRichText, FimoString, getFimoParts, getFimoSource, hasFimoSource, isFimoDate, isFimoString, } from '../content/index.js';
-export { Text } from '../primitives/components/Text.js';
-export { FimoNextProvider } from './provider.js';
+export { Boolean } from '../react/primitives/editable/Boolean.js';
+export { Date } from '../react/primitives/editable/Date.js';
+export { Image } from '../react/primitives/editable/Image.js';
+export { Json } from '../react/primitives/editable/Json.js';
+export { RichText } from '../react/primitives/editable/RichText.js';
+export { StaticImage } from '../react/primitives/renderers/StaticImage.js';
+export { Text } from '../react/primitives/editable/Text.js';
+export { Video } from '../react/primitives/editable/Video.js';
+export { FimoProvider, useLabels } from './provider.js';

package/dist/runtime/next/facade.d.ts

@@ -0,0 +1,8 @@
+import type { ContentClientHandle } from '../content/client/types.js';
+export type NextContentRegistry = Readonly<Record<string, ContentClientHandle>>;
+export interface CreateFimoOptions<TContent extends NextContentRegistry> {
+    content: TContent;
+    locale?: string;
+}
+export declare function createFimo<const TContent extends NextContentRegistry>({ content, locale, }: CreateFimoOptions<TContent>): TContent;
+//# sourceMappingURL=facade.d.ts.map

package/dist/runtime/next/facade.js

@@ -0,0 +1,34 @@
+function withLocale(options, locale) {
+    return { ...options, locale: options?.locale ?? locale };
+}
+function isCollectionClient(client) {
+    return 'list' in client && typeof client.list === 'function';
+}
+function isSingletonClient(client) {
+    return 'get' in client && typeof client.get === 'function';
+}
+function bindLocale(client, locale) {
+    if (isCollectionClient(client)) {
+        return {
+            ...client,
+            getById: (id, options) => client.getById(id, withLocale(options, locale)),
+            getBySlug: (slug, options) => client.getBySlug(slug, withLocale(options, locale)),
+            getByField: (fieldName, value, options) => client.getByField(fieldName, value, withLocale(options, locale)),
+            list: (params) => client.list(withLocale(params, locale)),
+            get: (params) => client.get(withLocale(params, locale)),
+        };
+    }
+    if (isSingletonClient(client)) {
+        return {
+            ...client,
+            get: (options) => client.get(withLocale(options, locale)),
+        };
+    }
+    return client;
+}
+export function createFimo({ content, locale, }) {
+    if (locale === undefined) {
+        return content;
+    }
+    return Object.fromEntries(Object.entries(content).map(([key, client]) => [key, bindLocale(client, locale)]));
+}

package/dist/runtime/next/labels.d.ts

@@ -0,0 +1,7 @@
+import { type GetLabelsOptions } from '../labels/fetch.js';
+/**
+ * Read the labels for an application-resolved locale. When omitted, locale
+ * comes from FIMO_DEFAULT_LOCALE / NEXT_PUBLIC_FIMO_DEFAULT_LOCALE.
+ */
+export declare function getLabels(options?: GetLabelsOptions): Promise<import("./client.js").Labels>;
+//# sourceMappingURL=labels.d.ts.map

package/dist/runtime/next/labels.js

@@ -0,0 +1,9 @@
+import { fetchLabels } from '../labels/fetch.js';
+import { nextServerContentRuntime } from './server-runtime.js';
+/**
+ * Read the labels for an application-resolved locale. When omitted, locale
+ * comes from FIMO_DEFAULT_LOCALE / NEXT_PUBLIC_FIMO_DEFAULT_LOCALE.
+ */
+export function getLabels(options) {
+    return fetchLabels(nextServerContentRuntime, options);
+}

package/dist/runtime/next/{Text.d.ts → primitives/Text.d.ts}

@@ -1,5 +1,5 @@
 import { type ElementType } from 'react';
-import type { TextProps } from '../primitives/components/Text.js';
+import type { TextProps } from '../../react/primitives/contracts.js';
 /**
  * Server-safe text primitive for Next.js Server Components.
  *

package/dist/runtime/next/{Text.js → primitives/Text.js}

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment } from 'react';
-import { getFimoParts, getFimoSource } from '../content/index.js';
+import { getFimoParts, getFimoSource } from '../../content/index.js';
 /**
  * Server-safe text primitive for Next.js Server Components.
  *

package/dist/runtime/next/primitives/server.d.ts

@@ -0,0 +1,9 @@
+import { type ElementType } from 'react';
+import type { BooleanProps, DateProps, ImageProps, JsonProps, RichTextProps, VideoProps } from '../../react/primitives/contracts.js';
+export declare function Boolean<T extends ElementType = 'span'>({ value, as, children, ...props }: BooleanProps<T>): import("react/jsx-runtime").JSX.Element | null;
+export declare function Date({ value, ...props }: DateProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function Image(props: ImageProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function Json<T extends ElementType = 'span'>({ value, as, children, ...props }: JsonProps<T>): import("react/jsx-runtime").JSX.Element | null;
+export declare function RichText({ value, components, ...props }: RichTextProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function Video(props: VideoProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=server.d.ts.map

package/dist/runtime/next/primitives/server.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FIMO_SOURCE, getFimoSource } from '../../content/index.js';
+import { DateRenderer } from '../../react/primitives/renderers/DateRenderer.js';
+import { ImageRenderer } from '../../react/primitives/renderers/ImageRenderer.js';
+import { RichTextRenderer } from '../../react/primitives/renderers/RichTextRenderer.js';
+import { VideoRenderer } from '../../react/primitives/renderers/VideoRenderer.js';
+export function Boolean({ value, as, children, ...props }) {
+    if (!value) {
+        return null;
+    }
+    const Component = as || 'span';
+    const booleanValue = value.valueOf();
+    return (_jsx(Component, { ...props, "data-fimo-source": value[FIMO_SOURCE], children: children ? children(booleanValue) : String(booleanValue) }));
+}
+export function Date({ value, ...props }) {
+    if (!value) {
+        return null;
+    }
+    const source = typeof value === 'object' && FIMO_SOURCE in value ? (value[FIMO_SOURCE] ?? undefined) : undefined;
+    return _jsx(DateRenderer, { ...props, value: value, source: source });
+}
+export function Image(props) {
+    if (!props.value) {
+        return null;
+    }
+    return _jsx(ImageRenderer, { ...props });
+}
+export function Json({ value, as, children, ...props }) {
+    if (value === null || value === undefined) {
+        return null;
+    }
+    const Component = as || 'span';
+    return (_jsx(Component, { ...props, "data-fimo-source": getFimoSource(value), children: children ? children(value) : JSON.stringify(value) }));
+}
+export function RichText({ value, components, ...props }) {
+    if (!value) {
+        return null;
+    }
+    return _jsx(RichTextRenderer, { ...props, document: value.content, source: value[FIMO_SOURCE], components: components });
+}
+export function Video(props) {
+    if (!props.value) {
+        return null;
+    }
+    return _jsx(VideoRenderer, { ...props });
+}

package/dist/runtime/next/provider.d.ts

@@ -1,10 +1,13 @@
 import { QueryClient } from '@tanstack/react-query';
 import { type ReactNode } from 'react';
-export interface FimoNextProviderProps {
+import { type Labels, type LabelsSnapshot } from '../labels/core.js';
+export interface FimoProviderProps {
     children: ReactNode;
+    labels?: LabelsSnapshot;
     locale?: string;
     queryClient?: QueryClient;
 }
-export declare function FimoNextProvider({ children, locale, queryClient }: FimoNextProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function FimoProvider({ children, labels, locale, queryClient }: FimoProviderProps): import("react/jsx-runtime").JSX.Element;
 export declare function useNextContentLocale(requestedLocale: string | undefined, defaultLocale: string): string;
+export declare function useLabels(): Labels;
 //# sourceMappingURL=provider.d.ts.map

package/dist/runtime/next/provider.js

@@ -1,12 +1,25 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { createContext, useContext, useState } from 'react';
-const FimoNextLocaleContext = createContext(undefined);
-export function FimoNextProvider({ children, locale, queryClient }) {
+import { createContext, useContext, useMemo, useState } from 'react';
+import { createLabels } from '../labels/core.js';
+import { nextClientContentRuntime } from './client-runtime.js';
+const FimoNextContext = createContext({});
+export function FimoProvider({ children, labels, locale, queryClient }) {
     const [client] = useState(() => queryClient ?? new QueryClient());
-    return (_jsx(FimoNextLocaleContext.Provider, { value: locale, children: _jsx(QueryClientProvider, { client: client, children: children }) }));
+    const activeLocale = locale?.trim() || labels?.locale;
+    const value = useMemo(() => ({ labels, locale: activeLocale }), [activeLocale, labels]);
+    return (_jsx(FimoNextContext.Provider, { value: value, children: _jsx(QueryClientProvider, { client: client, children: children }) }));
 }
 export function useNextContentLocale(requestedLocale, defaultLocale) {
-    return requestedLocale ?? useContext(FimoNextLocaleContext) ?? defaultLocale;
+    const context = useContext(FimoNextContext);
+    return requestedLocale ?? context.locale ?? defaultLocale;
+}
+export function useLabels() {
+    const context = useContext(FimoNextContext);
+    const locale = context.locale ?? nextClientContentRuntime.defaultLocale();
+    const snapshot = context.labels?.locale === locale
+        ? context.labels
+        : { locale, labels: {}, updatedAt: null };
+    return useMemo(() => createLabels(snapshot), [snapshot]);
 }

package/dist/runtime/next/server.d.ts

@@ -1,5 +1,12 @@
 import type { CollectionContentClient, ContentClientConfig, SingletonContentClient } from '../content/client/types.js';
-export { Text } from './Text.js';
+export { StaticImage } from '../react/primitives/renderers/StaticImage.js';
+export { Text } from './primitives/Text.js';
+export { Boolean, Date, Image, Json, RichText, Video } from './primitives/server.js';
+export { createFimo } from './facade.js';
+export type { CreateFimoOptions, NextContentRegistry } from './facade.js';
+export { getLabels } from './labels.js';
+export type { GetLabelsOptions } from '../labels/fetch.js';
+export type { Labels, LabelsSnapshot } from '../labels/core.js';
 export declare function createContentClient<T extends {
     id: string;
 }, TInput extends object>(config: ContentClientConfig): CollectionContentClient<T, TInput>;

package/dist/runtime/next/server.js

@@ -1,6 +1,10 @@
 import { createServerContentClient, createServerSingletonClient } from '../content/client/server-content-client.js';
 import { nextServerContentRuntime } from './server-runtime.js';
-export { Text } from './Text.js';
+export { StaticImage } from '../react/primitives/renderers/StaticImage.js';
+export { Text } from './primitives/Text.js';
+export { Boolean, Date, Image, Json, RichText, Video } from './primitives/server.js';
+export { createFimo } from './facade.js';
+export { getLabels } from './labels.js';
 export function createContentClient(config) {
     return createServerContentClient(config, nextServerContentRuntime);
 }

package/dist/runtime/primitives/index.d.ts

@@ -1,12 +1,12 @@
-export { Text } from './components/Text.js';
-export { Image } from './components/Image.js';
-export { StaticImage } from './components/StaticImage.js';
-export { Video } from './components/Video.js';
-export { Date } from './components/Date.js';
-export { Boolean } from './components/Boolean.js';
-export { Json } from './components/Json.js';
-export { RichText } from './components/RichText.js';
-export { useLabels, useTranslations } from './translations.js';
-export { FimoString, FimoDate, FimoMedia, FimoBoolean, FimoRichText, type FimoPolymorphicReference, type FimoReference, type FimoSource, type FimoPart, type FimoRichTextContent, type FimoRichTextNodeProps, type FimoRichTextMarkProps, type FimoRichTextComponents, FIMO_SOURCE, FIMO_PARTS, isFimoString, isFimoDate, hasFimoSource, getFimoSource, getFimoParts, fimo, useFimoLiveValue, } from './lib/index.js';
+export { Text } from '../react/primitives/editable/Text.js';
+export { Image, StaticImage } from '../vite/primitives/Images.js';
+export { Video } from '../react/primitives/editable/Video.js';
+export { Date } from '../react/primitives/editable/Date.js';
+export { Boolean } from '../react/primitives/editable/Boolean.js';
+export { Json } from '../react/primitives/editable/Json.js';
+export { RichText } from '../react/primitives/editable/RichText.js';
+export { useLabels, useTranslations } from '../vite/translations.js';
+export { FimoString, FimoDate, FimoMedia, FimoBoolean, FimoRichText, type FimoPolymorphicReference, type FimoReference, type FimoSource, type FimoPart, type FimoRichTextContent, type FimoRichTextNodeProps, type FimoRichTextMarkProps, type FimoRichTextComponents, FIMO_SOURCE, FIMO_PARTS, isFimoString, isFimoDate, hasFimoSource, getFimoSource, getFimoParts, fimo, } from './lib/index.js';
+export { useFimoLiveValue } from '../react/useFimoLiveValue.js';
 export type { BoolOps, DateOps, Field, Fields, FilterFor, NullOnlyOps, NumberOps, Populate, Populated, PopulatedResult, Projected, ProjectedWithPopulate, Query, ReferenceField, ReferenceMap, ScalarOps, Sort, SortField, StringOps, WithReferences, Where, } from './lib/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/runtime/primitives/index.js

@@ -1,15 +1,15 @@
 // Fimo UI — components and primitives for source-tracked inline editing
 // This module is auto-synced and should not be modified by agents or users.
 // Components
-export { Text } from './components/Text.js';
-export { Image } from './components/Image.js';
-export { StaticImage } from './components/StaticImage.js';
-export { Video } from './components/Video.js';
-export { Date } from './components/Date.js';
-export { Boolean } from './components/Boolean.js';
-export { Json } from './components/Json.js';
-export { RichText } from './components/RichText.js';
+export { Text } from '../react/primitives/editable/Text.js';
+export { Image, StaticImage } from '../vite/primitives/Images.js';
+export { Video } from '../react/primitives/editable/Video.js';
+export { Date } from '../react/primitives/editable/Date.js';
+export { Boolean } from '../react/primitives/editable/Boolean.js';
+export { Json } from '../react/primitives/editable/Json.js';
+export { RichText } from '../react/primitives/editable/RichText.js';
 // Labels
-export { useLabels, useTranslations } from './translations.js';
+export { useLabels, useTranslations } from '../vite/translations.js';
 // Primitives & utilities
-export { FimoString, FimoDate, FimoMedia, FimoBoolean, FimoRichText, FIMO_SOURCE, FIMO_PARTS, isFimoString, isFimoDate, hasFimoSource, getFimoSource, getFimoParts, fimo, useFimoLiveValue, } from './lib/index.js';
+export { FimoString, FimoDate, FimoMedia, FimoBoolean, FimoRichText, FIMO_SOURCE, FIMO_PARTS, isFimoString, isFimoDate, hasFimoSource, getFimoSource, getFimoParts, fimo, } from './lib/index.js';
+export { useFimoLiveValue } from '../react/useFimoLiveValue.js';

package/dist/runtime/primitives/lib/image-optimization.d.ts

@@ -1,4 +1,11 @@
 import type { ComponentPropsWithoutRef } from 'react';
+/** Default host suffixes eligible for Cloudflare Image Resizing optimization. */
+export declare const DEFAULT_IMAGE_HOST_SUFFIXES: readonly [".fimo.team", ".fimo.ai", ".fimo.site"];
+/**
+ * Get allowed host suffixes from env or use defaults.
+ * Env format: comma-separated suffixes, e.g. ".fimo.team,.fimo.ai,.fimo.site"
+ */
+export declare function parseImageHostSuffixes(value: string | undefined): readonly string[];
 export declare const DEFAULT_IMAGE_QUALITY = 85;
 export declare const DEFAULT_IMAGE_FIT: "scale-down";
 export declare const DEFAULT_IMAGE_DPRS: readonly [1, 2];
@@ -21,7 +28,7 @@ export declare function toObjectFit(fit: ImageFit): NonNullable<ComponentPropsWi
 /** Parse value to positive integer, or undefined if invalid. */
 export declare function toPositiveInt(value: string | number | undefined): number | undefined;
 /** Check if URL can be optimized (valid http(s) URL on allowed host). */
-export declare function isOptimizableFimoUrl(value: string): value is string;
+export declare function isOptimizableFimoUrl(value: string, hostSuffixes?: readonly string[]): value is string;
 /**
  * Build optimized URL with Cloudflare Image Resizing query params.
  * Adds: w (width), q (quality), fit, f (format=auto), dpr.
@@ -31,6 +38,7 @@ export declare function buildOptimizedUrl(src: string, options: {
     quality: number;
     fit: ImageFit;
     dpr?: number;
+    hostSuffixes?: readonly string[];
 }): string;
 export type ImageOptimizationConfig = {
     generatedSrcSet?: string;
@@ -46,5 +54,6 @@ export declare function computeImageOptimizationConfig(options: {
     renderWidth: number | undefined;
     quality: number;
     fit: ImageFit;
+    hostSuffixes?: readonly string[];
 }): ImageOptimizationConfig;
 //# sourceMappingURL=image-optimization.d.ts.map

package/dist/runtime/primitives/lib/image-optimization.js

@@ -1,14 +1,12 @@
 /** Default host suffixes eligible for Cloudflare Image Resizing optimization. */
-const DEFAULT_IMAGE_HOST_SUFFIXES = ['.fimo.team', '.fimo.ai', '.fimo.site'];
+export const DEFAULT_IMAGE_HOST_SUFFIXES = ['.fimo.team', '.fimo.ai', '.fimo.site'];
 /**
  * Get allowed host suffixes from env or use defaults.
  * Env format: comma-separated suffixes, e.g. ".fimo.team,.fimo.ai,.fimo.site"
  */
-function getImageHostSuffixes() {
-    // @ts-ignore - meta.env is a vite injected variable
-    const envHosts = import.meta.env.VITE_FIMO_IMAGE_HOSTS;
-    if (typeof envHosts === 'string' && envHosts.trim().length > 0) {
-        return envHosts.split(',').map((s) => s.trim());
+export function parseImageHostSuffixes(value) {
+    if (typeof value === 'string' && value.trim().length > 0) {
+        return value.split(',').map((suffix) => suffix.trim());
     }
     return DEFAULT_IMAGE_HOST_SUFFIXES;
 }
@@ -91,14 +89,14 @@ function parseHttpUrl(value) {
     }
 }
 /** Check if hostname is eligible for Cloudflare optimization. */
-function isAllowedHost(hostname) {
+function isAllowedHost(hostname, hostSuffixes) {
     const host = hostname.toLowerCase();
-    return getImageHostSuffixes().some((suffix) => host.endsWith(suffix));
+    return hostSuffixes.some((suffix) => host.endsWith(suffix.toLowerCase()));
 }
 /** Check if URL can be optimized (valid http(s) URL on allowed host). */
-export function isOptimizableFimoUrl(value) {
+export function isOptimizableFimoUrl(value, hostSuffixes = DEFAULT_IMAGE_HOST_SUFFIXES) {
     const url = parseHttpUrl(value);
-    return Boolean(url && isAllowedHost(url.hostname));
+    return Boolean(url && isAllowedHost(url.hostname, hostSuffixes));
 }
 /**
  * Build optimized URL with Cloudflare Image Resizing query params.
@@ -106,7 +104,7 @@ export function isOptimizableFimoUrl(value) {
  */
 export function buildOptimizedUrl(src, options) {
     const parsed = parseHttpUrl(src);
-    if (!parsed || !isAllowedHost(parsed.hostname)) {
+    if (!parsed || !isAllowedHost(parsed.hostname, options.hostSuffixes ?? DEFAULT_IMAGE_HOST_SUFFIXES)) {
         return src;
     }
     const transformed = new URL(parsed.toString());
@@ -152,7 +150,7 @@ function buildWidthSrcSet(src, options, widths) {
         .join(', ');
 }
 export function computeImageOptimizationConfig(options) {
-    const { shouldOptimize, hasSizesAttr, srcSetOverride, originalSrc, mediaWidth, renderWidth, quality, fit } = options;
+    const { shouldOptimize, hasSizesAttr, srcSetOverride, originalSrc, mediaWidth, renderWidth, quality, fit, hostSuffixes, } = options;
     if (!shouldOptimize || srcSetOverride != null) {
         return {
             generatedSrcSet: undefined,
@@ -166,6 +164,7 @@ export function computeImageOptimizationConfig(options) {
             generatedSrcSet: buildWidthSrcSet(originalSrc, {
                 quality,
                 fit,
+                hostSuffixes,
             }, responsiveWidths),
             transformWidth: responsiveWidths[responsiveWidths.length - 1] ?? renderWidth,
             transformDpr: undefined,
@@ -176,6 +175,7 @@ export function computeImageOptimizationConfig(options) {
             width: renderWidth,
             quality,
             fit,
+            hostSuffixes,
         }),
         transformWidth: renderWidth,
         transformDpr: renderWidth ? DEFAULT_IMAGE_DPRS[DEFAULT_IMAGE_DPRS.length - 1] : undefined,

package/dist/runtime/primitives/lib/index.d.ts

@@ -1,5 +1,4 @@
 export { FimoString, FimoDate, FimoMedia, FimoBoolean, FimoRichText, type FimoPolymorphicReference, type FimoReference, type FimoSource, type FimoPart, type FimoRichTextContent, type FimoRichTextNodeProps, type FimoRichTextMarkProps, type FimoRichTextComponents, FIMO_SOURCE, FIMO_PARTS, isFimoString, isFimoDate, hasFimoSource, getFimoSource, getFimoParts, } from './primitives.js';
 export { fimo } from './template.js';
-export { useFimoLiveValue } from './useFimoLiveValue.js';
 export type { BoolOps, DateOps, Field, Fields, FilterFor, NullOnlyOps, NumberOps, Populate, Populated, PopulatedResult, ProjectedWithPopulate, Projected, Query, ReferenceField, ReferenceMap, ScalarOps, Sort, SortField, StringOps, Where, WithReferences, } from './query.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/runtime/primitives/lib/index.js

@@ -1,4 +1,3 @@
 // Fimo - Source tracking for inline editing
 export { FimoString, FimoDate, FimoMedia, FimoBoolean, FimoRichText, FIMO_SOURCE, FIMO_PARTS, isFimoString, isFimoDate, hasFimoSource, getFimoSource, getFimoParts, } from './primitives.js';
 export { fimo } from './template.js';
-export { useFimoLiveValue } from './useFimoLiveValue.js';

package/dist/runtime/react/primitives/contracts.d.ts

@@ -0,0 +1,56 @@
+import type { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';
+import type { ImageFit } from '../../primitives/lib/image-optimization.js';
+import type { FimoBoolean, FimoDate, FimoMedia, FimoRichText, FimoRichTextComponents, FimoString } from '../../primitives/lib/index.js';
+export type BooleanProps<T extends ElementType = 'span'> = {
+    value: FimoBoolean;
+    as?: T;
+    children?: (value: boolean) => ReactNode;
+} & Omit<ComponentPropsWithoutRef<T>, 'value' | 'as' | 'children'>;
+export interface DateProps {
+    value: FimoDate | FimoString | Date | string;
+    children?: (date: Date) => ReactNode;
+    className?: string;
+}
+export interface BaseImageProps extends Omit<ComponentPropsWithoutRef<'img'>, 'src' | 'alt' | 'children'> {
+    quality?: number;
+    fit?: ImageFit;
+    unoptimized?: boolean;
+    overrideSrc?: string;
+    hostSuffixes?: readonly string[];
+}
+export interface ImageProps extends BaseImageProps {
+    value: FimoMedia;
+    alt?: string;
+    children?: (media: FimoMedia) => ReactNode;
+}
+export type JsonProps<T extends ElementType = 'span'> = {
+    value: unknown;
+    as?: T;
+    children?: (value: unknown) => ReactNode;
+} & Omit<ComponentPropsWithoutRef<T>, 'value' | 'as' | 'children'>;
+export interface RichTextProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {
+    value: FimoRichText | null | undefined;
+    components?: FimoRichTextComponents;
+}
+export type StaticImageProps = Omit<ComponentPropsWithoutRef<'img'>, 'children'> & {
+    /** Image quality (1-100). Defaults to 85. */
+    quality?: number;
+    /** Resize fit mode. Also maps to CSS object-fit. Defaults to 'scale-down'. */
+    fit?: ImageFit;
+    /** Skip optimization and use the original URL. */
+    unoptimized?: boolean;
+    hostSuffixes?: readonly string[];
+};
+export type TextProps<T extends ElementType = 'span'> = {
+    value: unknown;
+    as?: T;
+    children?: (value: string) => ReactNode;
+} & Omit<ComponentPropsWithoutRef<T>, 'value' | 'as' | 'children'>;
+export interface BaseVideoProps extends Omit<ComponentPropsWithoutRef<'video'>, 'src' | 'children'> {
+    overrideSrc?: string;
+}
+export interface VideoProps extends BaseVideoProps {
+    value: FimoMedia;
+    children?: (media: FimoMedia) => ReactNode;
+}
+//# sourceMappingURL=contracts.d.ts.map

package/dist/runtime/react/primitives/contracts.js

@@ -0,0 +1 @@
+export {};

package/dist/runtime/react/primitives/editable/Boolean.d.ts

@@ -0,0 +1,5 @@
+import { type ElementType } from 'react';
+import type { BooleanProps } from '../contracts.js';
+export type { BooleanProps } from '../contracts.js';
+export declare function Boolean<T extends ElementType = 'span'>({ value, as, children, ...props }: BooleanProps<T>): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Boolean.d.ts.map

package/dist/runtime/react/primitives/editable/Boolean.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FIMO_SOURCE } from '../../../primitives/lib/index.js';
+import { useFimoLiveValue } from '../../useFimoLiveValue.js';
+export function Boolean({ value, as, children, ...props }) {
+    const Component = as || 'span';
+    const { value: liveValue, ref } = useFimoLiveValue(value ? value.valueOf() : false);
+    if (!value) {
+        return null;
+    }
+    return (_jsx(Component, { ref: ref, ...props, "data-fimo-source": value[FIMO_SOURCE], children: children ? children(liveValue) : String(liveValue) }));
+}

package/dist/runtime/react/primitives/editable/Date.d.ts

@@ -0,0 +1,4 @@
+import type { DateProps } from '../contracts.js';
+export type { DateProps } from '../contracts.js';
+export declare function Date({ value, ...props }: DateProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Date.d.ts.map

package/dist/runtime/react/primitives/editable/Date.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FIMO_SOURCE } from '../../../primitives/lib/index.js';
+import { useFimoLiveValue } from '../../useFimoLiveValue.js';
+import { DateRenderer } from '../renderers/DateRenderer.js';
+export function Date({ value, ...props }) {
+    const { value: liveValue, ref } = useFimoLiveValue(value ?? null);
+    if (!liveValue) {
+        return null;
+    }
+    const source = typeof value === 'object' && FIMO_SOURCE in value ? (value[FIMO_SOURCE] ?? undefined) : undefined;
+    return _jsx(DateRenderer, { ...props, value: liveValue, source: source, elementRef: ref });
+}

package/dist/runtime/react/primitives/editable/Image.d.ts

@@ -0,0 +1,4 @@
+import type { ImageProps } from '../contracts.js';
+export type { BaseImageProps, ImageProps } from '../contracts.js';
+export declare function Image({ value: media, ...props }: ImageProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=Image.d.ts.map