fimo 0.11.1-staging.1 → 0.12.0-staging.2

package/dist/runtime/next/client.js

@@ -0,0 +1,22 @@
+'use client';
+import { createReactContentClient } from '../content/client/react-content-client.js';
+import { createReactSingletonClient } from '../content/client/react-singleton-client.js';
+import { nextClientContentRuntime } from './client-runtime.js';
+import { useNextContentLocale } from './provider.js';
+export function createContentClient(config) {
+    return createReactContentClient(config, nextClientContentRuntime, useNextContentLocale);
+}
+export function createSingletonClient(config) {
+    return createReactSingletonClient(config, nextClientContentRuntime, useNextContentLocale);
+}
+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 { 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 { FimoNextProvider } from './provider.js';

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

@@ -0,0 +1,10 @@
+import { type ElementType } from 'react';
+import type { TextProps } from '../../react/primitives/contracts.js';
+/**
+ * Server-safe text primitive for Next.js Server Components.
+ *
+ * It intentionally shares the same public props as the interactive React
+ * primitive while rendering source metadata without client hooks.
+ */
+export declare function Text<T extends ElementType = 'span'>({ value, as, children, ...props }: TextProps<T>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Text.d.ts.map

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

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment } from 'react';
+import { getFimoParts, getFimoSource } from '../../content/index.js';
+/**
+ * Server-safe text primitive for Next.js Server Components.
+ *
+ * It intentionally shares the same public props as the interactive React
+ * primitive while rendering source metadata without client hooks.
+ */
+export function Text({ value, as, children, ...props }) {
+    const Component = as || 'span';
+    const parts = getFimoParts(value);
+    if (parts && parts.length > 1 && !children) {
+        return (_jsx(Component, { ...props, children: parts.map((part, index) => part.source ? (_jsx("span", { "data-fimo-source": part.source, children: part.text }, index)) : (_jsx(Fragment, { children: part.text }, index))) }));
+    }
+    const text = String(value);
+    return (_jsx(Component, { ...props, "data-fimo-source": getFimoSource(value), children: children ? children(text) : text }));
+}

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

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

package/dist/runtime/next/provider.js

@@ -0,0 +1,12 @@
+'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 }) {
+    const [client] = useState(() => queryClient ?? new QueryClient());
+    return (_jsx(FimoNextLocaleContext.Provider, { value: locale, children: _jsx(QueryClientProvider, { client: client, children: children }) }));
+}
+export function useNextContentLocale(requestedLocale, defaultLocale) {
+    return requestedLocale ?? useContext(FimoNextLocaleContext) ?? defaultLocale;
+}

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

@@ -0,0 +1,3 @@
+import { type ContentRuntime } from '../content/client/runtime.js';
+export declare const nextServerContentRuntime: ContentRuntime;
+//# sourceMappingURL=server-runtime.d.ts.map

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

@@ -0,0 +1,20 @@
+import { requireContentApiUrl } from '../content/client/runtime.js';
+export const nextServerContentRuntime = {
+    apiBase() {
+        return requireContentApiUrl(process.env.FIMO_API_URL ?? process.env.NEXT_PUBLIC_FIMO_API_URL, 'FIMO_API_URL or NEXT_PUBLIC_FIMO_API_URL');
+    },
+    defaultLocale() {
+        return process.env.FIMO_DEFAULT_LOCALE?.trim() || process.env.NEXT_PUBLIC_FIMO_DEFAULT_LOCALE?.trim() || 'en';
+    },
+    headers(extra) {
+        const headers = { ...extra };
+        const env = process.env.FIMO_ENV?.trim() || process.env.NEXT_PUBLIC_FIMO_ENV?.trim();
+        if (env) {
+            headers['X-Fimo-Env'] = env;
+        }
+        return headers;
+    },
+    fetch(input, init) {
+        return globalThis.fetch(input, init);
+    },
+};

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

@@ -0,0 +1,13 @@
+import type { CollectionContentClient, ContentClientConfig, SingletonContentClient } from '../content/client/types.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 declare function createContentClient<T extends {
+    id: string;
+}, TInput extends object>(config: ContentClientConfig): CollectionContentClient<T, TInput>;
+export declare function createSingletonClient<T extends {
+    id: string;
+}, TInput extends object>(config: ContentClientConfig): SingletonContentClient<T, TInput>;
+export type { CollectionContentClient, InfiniteListResult, SingletonContentClient } from '../content/client/types.js';
+export * from '../content/index.js';
+//# sourceMappingURL=server.d.ts.map

package/dist/runtime/next/server.js

@@ -0,0 +1,12 @@
+import { createServerContentClient, createServerSingletonClient } from '../content/client/server-content-client.js';
+import { nextServerContentRuntime } from './server-runtime.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 function createContentClient(config) {
+    return createServerContentClient(config, nextServerContentRuntime);
+}
+export function createSingletonClient(config) {
+    return createServerSingletonClient(config, nextServerContentRuntime);
+}
+export * from '../content/index.js';

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/primitives/lib/query.d.ts

@@ -67,7 +67,7 @@ export type Fields<T> = Field<T> | readonly Field<T>[];
 type SelectedField<TField> = TField extends `__fimo.${string}` ? '__fimo' : TField;
 type SelectedFields<TFields> = TFields extends readonly (infer K)[] ? SelectedField<K> : SelectedField<TFields>;
 type ListItem<TValue> = TValue extends readonly (infer K)[] ? K : TValue;
-type EntryIdentityField<T> = Extract<'id' | 'entryId' | 'documentId' | 'locale', keyof T>;
+type EntryIdentityField<T> = Extract<'id' | 'entryId' | 'documentId' | 'locale' | '__fimo', keyof T>;
 export type Projected<T extends {
     id: string;
 }, TFields extends Fields<T> | undefined> = [TFields] extends [undefined] ? T : Pick<T, EntryIdentityField<T> | Extract<SelectedFields<TFields>, keyof T>>;

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

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

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useFimoLiveValue } from '../../useFimoLiveValue.js';
+import { ImageRenderer } from '../renderers/ImageRenderer.js';
+export function Image({ value: media, ...props }) {
+    const { value: liveMedia, ref } = useFimoLiveValue(media ?? null);
+    if (!liveMedia) {
+        return null;
+    }
+    return _jsx(ImageRenderer, { ...props, value: liveMedia, elementRef: ref });
+}

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

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

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

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { getFimoSource } from '../../../primitives/lib/index.js';
+import { useFimoLiveValue } from '../../useFimoLiveValue.js';
+export function Json({ value, as, children, ...props }) {
+    const Component = as || 'span';
+    const { value: liveValue, ref } = useFimoLiveValue(value);
+    if (value === null || value === undefined) {
+        return null;
+    }
+    return (_jsx(Component, { ref: ref, ...props, "data-fimo-source": getFimoSource(value), children: children ? children(liveValue) : JSON.stringify(liveValue) }));
+}

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

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

package/dist/runtime/react/primitives/editable/RichText.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';
+import { RichTextRenderer } from '../renderers/RichTextRenderer.js';
+export function RichText({ value, components, ...props }) {
+    const { value: liveContent, ref } = useFimoLiveValue(value?.content ?? null);
+    if (!value) {
+        return null;
+    }
+    return (_jsx(RichTextRenderer, { ...props, document: liveContent, source: value[FIMO_SOURCE], components: components, elementRef: ref }));
+}

package/dist/runtime/{primitives/components → react/primitives/editable}/Text.d.ts

@@ -1,9 +1,6 @@
-import { type ComponentPropsWithoutRef, type ElementType, type ReactNode } from 'react';
-type TextProps<T extends ElementType = 'span'> = {
-    value: unknown;
-    as?: T;
-    children?: (value: string) => ReactNode;
-} & Omit<ComponentPropsWithoutRef<T>, 'value' | 'as' | 'children'>;
+import { type ElementType } from 'react';
+import type { TextProps } from '../contracts.js';
+export type { TextProps } from '../contracts.js';
 /**
  * Text component for rendering text with source tracking
  *
@@ -20,5 +17,4 @@ type TextProps<T extends ElementType = 'span'> = {
  * <Text value={product.price}>{(p) => `$${Number(p).toLocaleString()}`}</Text>
  */
 export declare function Text<T extends ElementType = 'span'>({ value, as, children, ...props }: TextProps<T>): import("react/jsx-runtime").JSX.Element;
-export {};
 //# sourceMappingURL=Text.d.ts.map

package/dist/runtime/{primitives/components → react/primitives/editable}/Text.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment } from 'react';
-import { getFimoParts, getFimoSource, useFimoLiveValue } from '../lib/index.js';
+import { getFimoParts, getFimoSource } from '../../../primitives/lib/index.js';
+import { useFimoLiveValue } from '../../useFimoLiveValue.js';
 /**
  * Text component for rendering text with source tracking
  *

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

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

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

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useFimoLiveValue } from '../../useFimoLiveValue.js';
+import { VideoRenderer } from '../renderers/VideoRenderer.js';
+export function Video({ value: media, ...props }) {
+    const { value: liveMedia, ref } = useFimoLiveValue(media ?? null);
+    if (!liveMedia) {
+        return null;
+    }
+    return _jsx(VideoRenderer, { ...props, value: liveMedia, elementRef: ref });
+}

package/dist/runtime/react/primitives/renderers/DateRenderer.d.ts

@@ -0,0 +1,11 @@
+import { type ReactNode, type Ref } from 'react';
+import type { FimoDate, FimoString } from '../../../primitives/lib/index.js';
+export interface DateRendererProps {
+    value: FimoDate | FimoString | Date | string | number;
+    source: string | undefined;
+    children?: (date: Date) => ReactNode;
+    className?: string;
+    elementRef?: Ref<HTMLTimeElement>;
+}
+export declare function DateRenderer({ value, source, children, className, elementRef }: DateRendererProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DateRenderer.d.ts.map

package/dist/runtime/react/primitives/renderers/DateRenderer.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function DateRenderer({ value, source, children, className, elementRef }) {
+    const rawValue = value instanceof String ? value.toString() : value;
+    const dateValue = new globalThis.Date(rawValue);
+    const isoDate = dateValue.toISOString().split('T')[0];
+    const content = children
+        ? children(dateValue)
+        : dateValue.toLocaleDateString(undefined, {
+            year: 'numeric',
+            month: 'short',
+            day: 'numeric',
+        });
+    return (_jsx("time", { ref: elementRef, dateTime: isoDate, className: className, "data-fimo-source": source, children: content }));
+}

package/dist/runtime/react/primitives/renderers/ImageRenderer.d.ts

@@ -0,0 +1,8 @@
+import { type RefObject } from 'react';
+import type { ImageProps } from '../contracts.js';
+interface ImageRendererProps extends ImageProps {
+    elementRef?: RefObject<HTMLElement | null>;
+}
+export declare function ImageRenderer({ value: media, children, quality, unoptimized, fit, width, height, alt: altOverride, overrideSrc, srcSet: srcSetOverride, sizes, style, hostSuffixes, elementRef, ...imgProps }: ImageRendererProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ImageRenderer.d.ts.map