@remkoj/optimizely-cms-react 2.1.0 → 3.1.0

package/dist/components/rich-text/index.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as Utils from './utils.js';
+import { DefaultComponentFactory } from "../../factory/default.js";
+import { DefaultComponents, DefaultTextNode, createHtmlComponent } from "./components.js";
+export * from "./types.js";
+export const RichText = ({ factory, text, className = 'rich-text', as: Wrapper = "div", debug, ...props }) => {
+    const id = Utils.getRandomId("rich-text");
+    const richTextFactory = factory ?? new DefaultComponentFactory(DefaultComponents);
+    try {
+        const data = Utils.processNodeInput(text);
+        return _jsx(Wrapper, { className: className, ...props, children: (data?.children || []).map((child, idx) => {
+                const elementId = id + '::' + idx;
+                return _jsx(RichTextElement, { factory: richTextFactory, node: child, idPrefix: elementId + '::' }, elementId);
+            }) });
+    }
+    catch {
+        if (debug)
+            console.warn('🟠 [Rich Text] Invalid rich text received: ', text);
+        return Object.getOwnPropertyNames(props).length > 0 ? _jsx("div", { className: className, ...props }) : null;
+    }
+};
+//#region Supportive React components
+const RichTextElement = ({ factory, node, idPrefix, debug }) => {
+    if (Utils.isText(node)) {
+        if (node.text.length == 0)
+            return null;
+        const TextComponent = factory?.resolve(`RichText/text`) ?? DefaultTextNode;
+        return _jsx(TextComponent, { node: node });
+    }
+    if (!Utils.isTypedNode(node)) {
+        if (debug)
+            console.warn('🟠 [Rich Text] Invalid rich text element data received:', node);
+        return null;
+    }
+    const childData = node.children?.map((child, idx) => {
+        const elementId = idPrefix + idx;
+        return _jsx(RichTextElement, { factory: factory, node: child, idPrefix: elementId + '::' }, elementId);
+    });
+    if (!factory?.has(`RichText/${node.type}`)) {
+        console.warn('🟠 [Rich Text] No renderer for node type, falling back to "div":', `RichText/${node.type}`);
+        const DivComponent = createHtmlComponent("div", false, { "data-type": node.type });
+        return _jsx(DivComponent, { node: node, children: childData });
+    }
+    const Component = factory?.resolve(`RichText/${node.type}`) ?? 'div';
+    return _jsx(Component, { node: node, children: childData });
+};
+//# sourceMappingURL=index.js.map

package/dist/components/rich-text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/rich-text/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/{rich-text.d.ts → rich-text/types.d.ts}

@@ -1,5 +1,5 @@
-import type { ComponentFactory, ComponentType, ComponentTypeDictionary } from "../types.js";
-import { type FunctionComponent, type PropsWithChildren } from "react";
+import type { ComponentType as ReactComponentType } from "react";
+import type { ComponentFactory, ComponentType } from "../../factory/types.js";
 export type RichTextProps = {
     /**
      * The component factory used for this rich text content
@@ -19,6 +19,10 @@ export type RichTextProps = {
      * element when not defined
      */
     as?: ComponentType;
+    /**
+     * Control the debugging output
+     */
+    debug?: boolean;
 } & ({
     /**
      * The fieldname of this Rich Text, when it is used as part of a block
@@ -38,6 +42,13 @@ export type RichTextProps = {
      */
     cmsId?: never;
 });
+export type RichTextComponent = ReactComponentType<RichTextProps>;
+export type RichTextElementProps = Readonly<{
+    debug?: boolean;
+    factory?: ComponentFactory;
+    node: Readonly<Node>;
+    idPrefix: string;
+}>;
 export type Node = {};
 export type TextNode = Node & {
     text: string;
@@ -57,19 +68,3 @@ export type NodeWithChildren<T extends Node> = T & {
     children?: Array<Node>;
 };
 export type NodeInput = string | RichTextNode | StringNode;
-export declare const Utils: {
-    isText(toTest: Node | null | undefined): toTest is TextNode;
-    isTypedNode(toTest: Node | null | undefined): toTest is TypedNode;
-    processNodeInput(input: NodeInput | null | undefined): RichTextNode | StringNode | undefined;
-    getRandomId(scope?: string): string;
-};
-export declare const RichText: FunctionComponent<RichTextProps>;
-export declare function createHtmlComponent<E extends keyof JSX.IntrinsicElements>(element: E, ignoreChildren?: boolean, defaultProps?: JSX.IntrinsicElements[E] & Record<string, string>): ({ children, node, ...props }: PropsWithChildren<JSX.IntrinsicElements[E] & {
-    node: TypedNode;
-}>) => import("react/jsx-runtime").JSX.Element;
-/**
- * A default component dictionary that allows to serialize the structured HTML
- * into React, using the component library shared across the react SDK.
- */
-export declare const DefaultComponents: ComponentTypeDictionary;
-export default RichText;

package/dist/components/rich-text/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/rich-text/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/rich-text/types.ts"],"names":[],"mappings":""}

package/dist/components/rich-text/utils.d.ts

@@ -0,0 +1,5 @@
+import type { TextNode, TypedNode, Node, NodeInput, RichTextNode, StringNode } from './types.js';
+export declare function isText(toTest: Node | null | undefined): toTest is TextNode;
+export declare function isTypedNode(toTest: Node | null | undefined): toTest is TypedNode;
+export declare function processNodeInput(input: NodeInput | null | undefined): RichTextNode | StringNode | undefined;
+export declare function getRandomId(scope?: string): string;

package/dist/components/rich-text/utils.js

@@ -0,0 +1,24 @@
+export function isText(toTest) {
+    return (typeof toTest == 'object' &&
+        toTest != null &&
+        (typeof toTest.text) == 'string' &&
+        toTest.text.length >= 0);
+}
+export function isTypedNode(toTest) {
+    return (typeof toTest == 'object' &&
+        toTest != null &&
+        (typeof toTest.type) == 'string' &&
+        toTest.type.length > 0);
+}
+export function processNodeInput(input) {
+    if (!input)
+        return undefined;
+    const textObject = typeof input == "string" ? JSON.parse(input) : input;
+    if (textObject?.type != "richText" && textObject?.type != "string")
+        throw new Error('Structured rich text requires a "richText" root node');
+    return textObject;
+}
+export function getRandomId(scope = "richText") {
+    return `${scope}::${Math.round(Math.random() * 100000)}`;
+}
+//# sourceMappingURL=utils.js.map

package/dist/components/rich-text/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/rich-text/utils.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,MAAM,CAAC,MAA+B;IAElD,OAAO,CACH,OAAO,MAAM,IAAI,QAAQ;QACzB,MAAM,IAAI,IAAI;QACd,CAAC,OAAQ,MAAmB,CAAC,IAAI,CAAC,IAAI,QAAQ;QAC7C,MAAmB,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,CACxC,CAAA;AACL,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,MAA+B;IAEvD,OAAO,CACH,OAAO,MAAM,IAAI,QAAQ;QACzB,MAAM,IAAI,IAAI;QACd,CAAC,OAAQ,MAAoB,CAAC,IAAI,CAAC,IAAI,QAAQ;QAC9C,MAAoB,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CACxC,CAAA;AACL,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,KAAmC;IAEhE,IAAI,CAAC,KAAK;QACN,OAAO,SAAS,CAAA;IACpB,MAAM,UAAU,GAAG,OAAO,KAAK,IAAI,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAA8B,CAAC,CAAC,CAAC,KAAK,CAAA;IACpG,IAAI,UAAU,EAAE,IAAI,IAAI,UAAU,IAAI,UAAU,EAAE,IAAI,IAAI,QAAQ;QAC9D,MAAM,IAAI,KAAK,CAAC,sDAAsD,CAAC,CAAA;IAC3E,OAAO,UAAU,CAAA;AACrB,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,QAAgB,UAAU;IAElD,OAAO,GAAG,KAAK,KAAM,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,MAAM,CAAE,EAAE,CAAA;AAC9D,CAAC"}

package/dist/components/rsc.d.ts

@@ -0,0 +1,47 @@
+import "server-only";
+import { type ReactNode, type ComponentType } from 'react';
+import { type PropsWithContext } from '../context/types.js';
+import { type CmsContentAreaComponent } from './cms-content-area/index.js';
+import { type CmsEditableComponent } from './cms-editable/index.js';
+import { type CmsContentComponent } from './cms-content/rsc.js';
+import { type OptimizelyCompositionComponent } from './visual-builder/index.js';
+import { type RichTextComponent } from './rich-text/index.js';
+export * from "./cms-styles/index.js";
+export { isNode, isElementNode, isElementNodeOfType, isStructureNode } from "./visual-builder/functions.js";
+export { DefaultComponents as RichTextComponentDictionary } from './rich-text/components.js';
+/**
+ *  Fallback while RSC hasn't been moved from Canary to Main
+ */
+type ReactServerComponentType<P = any> = ComponentType<P> | ((props: P) => Promise<ReactNode>);
+/**
+ * Wrapper function to turn context dependant components into easy to use
+ * server components
+ *
+ * @param       component       The component where the `ctx` parameter must be fulfilled
+ * @returns     The component, without CTX parameter
+ */
+export declare function serverContextAware<P = any>(component: ReactServerComponentType<PropsWithContext<P>>): ComponentType<P>;
+/**
+ * Client side Optimizely CMS Editable
+ */
+export declare const CmsEditable: CmsEditableComponent;
+/**
+ * Client side Optimizely CMS Content, leveraging the CMS Context to load the
+ * content type and content data when needed
+ */
+export declare const CmsContent: CmsContentComponent;
+/**
+ * Client side Optimizely CMS Content Area, leveraging the CMS Context to infer
+ * the connection to Optimizely Graph and component dictionary.
+ */
+export declare const CmsContentArea: CmsContentAreaComponent;
+/**
+ * Client side Optimizely Composition (e.g. Visual Builder), leveraging the CMS
+ * Context to infer the connection to Optimizely Graph and component
+ * dictionary.
+ */
+export declare const OptimizelyComposition: OptimizelyCompositionComponent;
+/**
+ * Client side renderer for Rich Text
+ */
+export declare const RichText: RichTextComponent;

package/dist/components/rsc.js

@@ -0,0 +1,55 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import "server-only";
+import { getServerContext } from '../context/rsc.js';
+import { cmsContentAware } from './cms-content/utils.js';
+import { CmsContentArea as BaseContentArea } from './cms-content-area/index.js'; // Both RSC & Client capable
+import { CmsEditable as BaseEditable } from './cms-editable/index.js'; // Both RSC & Client capable
+import { CmsContent as BaseCmsContent } from './cms-content/rsc.js'; // Different components for RSC & Client
+import { OptimizelyComposition as BaseOptimizelyComposition } from './visual-builder/index.js'; // Both RSC & Client capable
+import { RichText as BaseRichText } from './rich-text/index.js';
+// Pass through Style functions types
+export * from "./cms-styles/index.js";
+export { isNode, isElementNode, isElementNodeOfType, isStructureNode } from "./visual-builder/functions.js";
+// Export dictionary
+export { DefaultComponents as RichTextComponentDictionary } from './rich-text/components.js';
+/**
+ * Wrapper function to turn context dependant components into easy to use
+ * server components
+ *
+ * @param       component       The component where the `ctx` parameter must be fulfilled
+ * @returns     The component, without CTX parameter
+ */
+export function serverContextAware(component) {
+    const BaseComponent = component;
+    const ServerContextInjector = (props) => {
+        const ctx = getServerContext();
+        return _jsx(BaseComponent, { ctx: ctx, ...props });
+    };
+    ServerContextInjector.displayName = "Server Context Injector";
+    return ServerContextInjector;
+}
+/**
+ * Client side Optimizely CMS Editable
+ */
+export const CmsEditable = serverContextAware(BaseEditable);
+/**
+ * Client side Optimizely CMS Content, leveraging the CMS Context to load the
+ * content type and content data when needed
+ */
+export const CmsContent = serverContextAware(BaseCmsContent);
+/**
+ * Client side Optimizely CMS Content Area, leveraging the CMS Context to infer
+ * the connection to Optimizely Graph and component dictionary.
+ */
+export const CmsContentArea = cmsContentAware(serverContextAware(BaseContentArea), CmsContent);
+/**
+ * Client side Optimizely Composition (e.g. Visual Builder), leveraging the CMS
+ * Context to infer the connection to Optimizely Graph and component
+ * dictionary.
+ */
+export const OptimizelyComposition = cmsContentAware(serverContextAware(BaseOptimizelyComposition), CmsContent);
+/**
+ * Client side renderer for Rich Text
+ */
+export const RichText = BaseRichText;
+//# sourceMappingURL=rsc.js.map

package/dist/components/rsc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rsc.js","sourceRoot":"","sources":["../../src/components/rsc.tsx"],"names":[],"mappings":";AAAA,OAAO,aAAa,CAAA;AAGpB,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAExD,OAAO,EAAE,cAAc,IAAI,eAAe,EAAgC,MAAM,6BAA6B,CAAA,CAAC,4BAA4B;AAC1I,OAAO,EAAE,WAAW,IAAI,YAAY,EAA6B,MAAM,yBAAyB,CAAA,CAAC,4BAA4B;AAC7H,OAAO,EAAE,UAAU,IAAI,cAAc,EAA0D,MAAM,sBAAsB,CAAA,CAAC,wCAAwC;AACpK,OAAO,EAAE,qBAAqB,IAAI,yBAAyB,EAAuC,MAAM,2BAA2B,CAAA,CAAC,4BAA4B;AAChK,OAAO,EAAE,QAAQ,IAAI,YAAY,EAA0B,MAAM,sBAAsB,CAAA;AAEvF,qCAAqC;AACrC,cAAc,uBAAuB,CAAA;AACrC,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAA;AAE3G,oBAAoB;AACpB,OAAO,EAAE,iBAAiB,IAAI,2BAA2B,EAAE,MAAM,2BAA2B,CAAA;AAO5F;;;;;;GAMG;AACH,MAAM,UAAU,kBAAkB,CAAU,SAAwD;IAEhG,MAAM,aAAa,GAAG,SAA+C,CAAA;IACrE,MAAM,qBAAqB,GAAsB,CAAC,KAAQ,EAAE,EAAE;QAC1D,MAAM,GAAG,GAAG,gBAAgB,EAAE,CAAA;QAC9B,OAAO,KAAC,aAAa,IAAC,GAAG,EAAE,GAAG,KAAO,KAAK,GAAK,CAAA;IACnD,CAAC,CAAA;IACD,qBAAqB,CAAC,WAAW,GAAG,yBAAyB,CAAA;IAC7D,OAAO,qBAAqB,CAAA;AAChC,CAAC;AAED;;GAEG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,kBAAkB,CAAC,YAAY,CAAyB,CAAA;AAGnF;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,kBAAkB,CAAC,cAAoD,CAAwB,CAAA;AAEzH;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,eAAe,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,UAAU,CAA4B,CAAA;AAEzH;;;;GAIG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,eAAe,CAAC,kBAAkB,CAAC,yBAAyB,CAAC,EAAE,UAAU,CAAmC,CAAA;AAEjJ;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,YAAiC,CAAA"}

package/dist/{server → components}/type-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"type-utils.js","sourceRoot":"","sources":["../../src/server/type-utils.ts"],"names":[],"mappings":""}
+{"version":3,"file":"type-utils.js","sourceRoot":"","sources":["../../src/components/type-utils.ts"],"names":[],"mappings":""}

package/dist/{server/components → components}/visual-builder/functions.d.ts

@@ -1,10 +1,15 @@
-import type { ContentType } from '../../../types.js';
 import type { CompositionNode, LeafPropsFactory, CompositionElementNode, NodePropsFactory, CompositionStructureNode } from './types.js';
 export declare function isElementNode(node: CompositionNode<Record<string, any>>): node is CompositionElementNode<Record<string, any>>;
 export declare function isElementNodeOfType<ET extends Record<string, any>>(node: CompositionNode<Record<string, any>>, test: (data: Record<string, any>) => data is ET): node is CompositionElementNode<ET>;
 export declare function isStructureNode(node: CompositionNode<Record<string, any>>): node is CompositionStructureNode;
+/**
+ * Test if the provided value is a Visual Builder node
+ *
+ * @param       toTest      The value to test
+ * @returns     `true` when the value is a Visual Builder node, `false`
+ *              otherwise
+ */
 export declare function isNode(toTest: any): toTest is CompositionNode;
-export declare function isContentType(toTest: any): toTest is ContentType;
 export declare const defaultPropsFactory: LeafPropsFactory;
 export declare const defaultNodePropsFactory: NodePropsFactory;
 export declare function ucFirst(input: string | undefined | null): string | null;

package/dist/{server/components → components}/visual-builder/functions.js

@@ -1,3 +1,4 @@
+import { isContentType } from '../../utilities.js';
 import { isContentLink, isInlineContentLink } from '@remkoj/optimizely-graph-client';
 export function isElementNode(node) {
     return node.layoutType == "element";
@@ -10,6 +11,13 @@ export function isElementNodeOfType(node, test) {
 export function isStructureNode(node) {
     return !isElementNode(node);
 }
+/**
+ * Test if the provided value is a Visual Builder node
+ *
+ * @param       toTest      The value to test
+ * @returns     `true` when the value is a Visual Builder node, `false`
+ *              otherwise
+ */
 export function isNode(toTest) {
     if (typeof (toTest) != 'object' || toTest == null)
         return false;
@@ -18,9 +26,6 @@ export function isNode(toTest) {
     const hasValidType = typeof toTest.layoutType == 'string' && nodeTypes.includes(toTest.layoutType);
     return hasValidName && hasValidType;
 }
-export function isContentType(toTest) {
-    return Array.isArray(toTest) && toTest.every(x => typeof (x) == 'string' && x.length > 0);
-}
 export const defaultPropsFactory = (node) => {
     const contentType = node.element?._metadata?.types;
     if (!isContentType(contentType))

package/dist/components/visual-builder/functions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"functions.js","sourceRoot":"","sources":["../../../src/components/visual-builder/functions.ts"],"names":[],"mappings":"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"}

package/dist/{server/components/visual-builder/Composition.d.ts → components/visual-builder/index.d.ts}

@@ -1,10 +1,11 @@
-import 'server-only';
-import type { OptimizelyCompositionProps } from './types.js';
+import { ReactNode } from 'react';
+import type { BaseOptimizelyCompositionProps } from './types.js';
+export type * from './types.js';
 /**
  * Render the composition as made available through Optimizely Graph for Visual Builder
  *
  * @param param0
  * @returns     The
  */
-export declare function OptimizelyComposition({ node, leafPropsFactory, nodePropsFactory }: OptimizelyCompositionProps): Promise<JSX.Element>;
+export declare function OptimizelyComposition({ node, leafPropsFactory, nodePropsFactory, ctx, cmsContent: CmsContent }: BaseOptimizelyCompositionProps): ReactNode;
 export default OptimizelyComposition;

package/dist/{server/components/visual-builder/Composition.js → components/visual-builder/index.js}

@@ -1,44 +1,35 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import 'server-only';
 import { isElementNode, defaultNodePropsFactory, defaultPropsFactory } from './functions.js';
-import { CmsContent } from '../cms-content.js';
-import getServerContext from '../../context.js';
 /**
  * Render the composition as made available through Optimizely Graph for Visual Builder
  *
  * @param param0
  * @returns     The
  */
-export async function OptimizelyComposition({ node, leafPropsFactory = defaultPropsFactory, nodePropsFactory = defaultNodePropsFactory }) {
-    const { factory, isDebug } = getServerContext();
+export function OptimizelyComposition({ node, leafPropsFactory = defaultPropsFactory, nodePropsFactory = defaultNodePropsFactory, ctx, cmsContent: CmsContent }) {
+    const { factory, isDebug } = ctx;
+    // Render the element
     if (isElementNode(node)) {
         if (isDebug)
             console.log(`⚪ [VisualBuilder] Rendering element node ${JSON.stringify(node)}`);
         const [contentLink, contentType, fragmentData, layoutProps] = leafPropsFactory(node);
-        //@ts-expect-error CmsContent is an Asynchronous server component, which isn't supported by the generic React Typings
         return _jsx(CmsContent, { contentLink: contentLink, contentType: contentType, fragmentData: fragmentData, layoutProps: layoutProps });
     }
+    // Debug
     if (isDebug)
         console.log(`⚪ [VisualBuilder] Rendering structure node ${JSON.stringify(node)}`);
+    // Ensure we've got a factory
     if (!factory)
         throw new Error("🟡 [VisualBuilder] [OptimizelyComposition] The factory must be defined within the serverContext");
     const [contentLink, contentTypes, fragmentData, layoutProps] = nodePropsFactory(node);
-    const firstExistingType = contentTypes.map(ct => {
-        const reversed = [...ct].reverse();
-        const hasType = factory.has(reversed);
-        if (!hasType && isDebug)
-            console.log(`🟡 [VisualBuilder] [OptimizelyComposition] Content type ${reversed.join('/')} not found within factory`);
-        return hasType;
-    }).indexOf(true);
+    const firstExistingType = contentTypes.map(ct => factory.has([...ct].reverse())).indexOf(true);
     const contentType = contentTypes[firstExistingType];
     if (!contentType)
-        throw new Error("🟡 [VisualBuilder] [OptimizelyComposition] The factory must have a definition for Component/Node");
-    //@ts-expect-error CmsContent is an Asynchronous server component, which isn't supported by the generic React Typings
+        throw new Error(`🟡 [VisualBuilder] [OptimizelyComposition] The factory must have a definition for one of these types: ${contentTypes.map(x => x.join('/')).join(', ')}`);
     return _jsx(CmsContent, { contentType: contentType, contentLink: contentLink, fragmentData: fragmentData, layoutProps: layoutProps, noDataLoad: true, children: (node.nodes ?? []).map((child) => {
             const childKey = child.key ? child.key : `vb::${JSON.stringify(child)}`;
-            //@ts-expect-error OptimizelyComposition is an Asynchronous server component, which isn't supported by the generic React Typings
-            return _jsx(OptimizelyComposition, { node: child, leafPropsFactory: leafPropsFactory, nodePropsFactory: nodePropsFactory }, childKey);
+            return _jsx(OptimizelyComposition, { node: child, leafPropsFactory: leafPropsFactory, nodePropsFactory: nodePropsFactory, ctx: ctx, cmsContent: CmsContent }, childKey);
         }) });
 }
 export default OptimizelyComposition;
-//# sourceMappingURL=Composition.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/visual-builder/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/visual-builder/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,uBAAuB,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAA;AAI5F;;;;;GAKG;AACH,MAAM,UAAU,qBAAqB,CAAC,EAAE,IAAI,EAAE,gBAAgB,GAAG,mBAAmB,EAAE,gBAAgB,GAAG,uBAAuB,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,EAAkC;IAE3L,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,GAAG,CAAA;IAEhC,qBAAqB;IACrB,IAAI,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC;QACtB,IAAI,OAAO;YACP,OAAO,CAAC,GAAG,CAAC,4CAA6C,IAAI,CAAC,SAAS,CAAC,IAAI,CAAE,EAAE,CAAC,CAAA;QACrF,MAAM,CAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,WAAW,CAAE,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAA;QACtF,OAAO,KAAC,UAAU,IAAC,WAAW,EAAG,WAAW,EAAG,WAAW,EAAG,WAAW,EAAG,YAAY,EAAG,YAAY,EAAG,WAAW,EAAG,WAAW,GAAK,CAAA;IAC3I,CAAC;IAED,QAAQ;IACR,IAAI,OAAO;QACP,OAAO,CAAC,GAAG,CAAC,8CAA+C,IAAI,CAAC,SAAS,CAAC,IAAI,CAAE,EAAE,CAAC,CAAA;IAEvF,6BAA6B;IAC7B,IAAI,CAAC,OAAO;QACR,MAAM,IAAI,KAAK,CAAC,iGAAiG,CAAC,CAAA;IAEtH,MAAM,CAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,CAAE,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAA;IACvF,MAAM,iBAAiB,GAAG,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IAC9F,MAAM,WAAW,GAAG,YAAY,CAAC,iBAAiB,CAAC,CAAA;IACnD,IAAI,CAAC,WAAW;QACZ,MAAM,IAAI,KAAK,CAAC,yGAA0G,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;IAE9K,OAAO,KAAC,UAAU,IAAC,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,UAAU,kBAClI,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;YAC9B,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,OAAQ,IAAI,CAAC,SAAS,CAAE,KAAK,CAAE,EAAE,CAAA;YAC1E,OAAO,KAAC,qBAAqB,IAAkB,IAAI,EAAG,KAAK,EAAG,gBAAgB,EAAG,gBAAgB,EAAG,gBAAgB,EAAG,gBAAgB,EAAG,GAAG,EAAG,GAAG,EAAG,UAAU,EAAG,UAAU,IAAzI,QAAQ,CAAqI,CAAA;QACrL,CAAC,CAAC,GACO,CAAA;AACjB,CAAC;AAED,eAAe,qBAAqB,CAAA"}

package/dist/{server/components → components}/visual-builder/types.d.ts

@@ -1,6 +1,8 @@
 import { type ComponentType, type PropsWithChildren } from "react";
-import { type ContentType } from "../../../types.js";
 import { type InlineContentLinkWithLocale, type ContentLinkWithLocale } from "@remkoj/optimizely-graph-client";
+import { type ContentType } from "../../types.js";
+import { type PropsWithContext } from "../../context/types.js";
+import { type PropsWithCmsContent } from "../cms-content/types.js";
 export declare enum StructureNodeTypes {
     Experience = "experience",
     Section = "section",
@@ -50,3 +52,6 @@ export type OptimizelyCompositionProps = JSX.IntrinsicAttributes & {
      */
     nodePropsFactory?: NodePropsFactory;
 };
+export type BaseOptimizelyCompositionProps = PropsWithCmsContent<PropsWithContext<OptimizelyCompositionProps>>;
+export type OptimizelyCompositionComponent = ComponentType<OptimizelyCompositionProps>;
+export type OptimizelyCompositionBaseComponent = ComponentType<BaseOptimizelyCompositionProps>;

package/dist/components/visual-builder/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/visual-builder/types.ts"],"names":[],"mappings":"AAMA,MAAM,CAAN,IAAY,kBAKX;AALD,WAAY,kBAAkB;IAC1B,+CAAyB,CAAA;IACzB,yCAAmB,CAAA;IACnB,iCAAW,CAAA;IACX,uCAAiB,CAAA;AACrB,CAAC,EALW,kBAAkB,KAAlB,kBAAkB,QAK7B"}

package/dist/components.d.ts

@@ -0,0 +1,27 @@
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export { RichText } from "./components/rich-text/index.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export { DefaultComponents, DefaultTextNode, createHtmlComponent } from "./components/rich-text/components.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export * as Utils from "./components/rich-text/utils.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export type * from "./components/rich-text/types.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export type { BaseStyleDefinition, ElementStyleDefinition, LayoutProps, LayoutPropsSetting, LayoutPropsSettingChoices, LayoutPropsSettingKeys, LayoutPropsSettingValues, NodeStyleDefinition, StyleDefinition, StyleSetting } from "./components/cms-styles/index.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export { extractSettings, readSetting } from "./components/cms-styles/index.js";

package/dist/components.js

@@ -0,0 +1,20 @@
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export { RichText } from "./components/rich-text/index.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export { DefaultComponents, DefaultTextNode, createHtmlComponent } from "./components/rich-text/components.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export * as Utils from "./components/rich-text/utils.js";
+/**
+ * @deprecated The `@remkoj/optimizely-cms-react/components` export has been deprecated
+ */
+export { extractSettings, readSetting } from "./components/cms-styles/index.js";
+//# sourceMappingURL=components.js.map

package/dist/components.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"AAAA;;GAEG;AAGH;;GAEG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAC1D;;GAEG;AACH,OAAO,EAAE,iBAAiB,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAA;AAC9G;;GAEG;AACH,OAAO,KAAK,KAAK,MAAM,iCAAiC,CAAA;AASxD;;GAEG;AACH,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAA"}

package/dist/context/client.d.ts

@@ -0,0 +1,70 @@
+import { type FunctionComponent, type PropsWithChildren, type Dispatch, type SetStateAction } from "react";
+import { type OptimizelyGraphConfig, type IOptiGraphClient } from "@remkoj/optimizely-graph-client";
+import { type GenericContext } from "./types.js";
+import { type ComponentTypeDictionary, type ComponentFactory } from "../factory/index.js";
+export declare const enum OptimizelyCmsMode {
+    default = "default",
+    edit = "edit",
+    preview = "preview"
+}
+export interface ClientContext extends GenericContext {
+    setLocale: Dispatch<SetStateAction<string | undefined>>;
+    setMode: Dispatch<SetStateAction<OptimizelyCmsMode>>;
+}
+export type OptimizelyCmsProps = {
+    /**
+     * The Optimizely Graph Client to use, provide either an instance of the
+     * client, or the configuration used to create the instance. In case you
+     * provide no parameters, the Client will try to infer the configuration
+     * from the environment variables.
+     */
+    client?: null | OptimizelyGraphConfig | IOptiGraphClient;
+    /**
+     * The authentication token to use for the Optimizely Graph Client. This
+     * token will be applied to the client after it has been resolved from the
+     * `client` property. If not provided the current authentication data of
+     * the client will not be affected.
+     */
+    clientToken?: string;
+    /**
+     * Marker to indicate if the debug mode should be activated. If not provided
+     * it will be read from the Optimizely Graph Client, inferred by the `client`
+     * property.
+     */
+    isDebug?: boolean;
+    /**
+     * Marker to indicate if the development mode should be activated. If not
+     * provided, it will be read from the `process.env.NODE_ENV` variable. If
+     * this variable is not set it assumes it to be "production".
+     */
+    isDevelopment?: boolean;
+    /**
+     * The default mode to initialize the context with, after initialization the
+     * current mode will be state managed using `useState`.
+     */
+    initialMode?: OptimizelyCmsMode;
+} & ({
+    /**
+     * The component factory to be used to resolve content within the scope
+     * of this provider.
+     */
+    factory: ComponentFactory;
+    /**
+     * The defaults components to apply when there's no factory provided. If a
+     * factory is provided, these components will not be added to the factory.
+     */
+    initialComponents?: never;
+} | {
+    /**
+     * The component factory to be used to resolve content within the scope
+     * of this provider.
+     */
+    factory?: never;
+    /**
+     * The defaults components to apply when there's no factory provided. If a
+     * factory is provided, these components will not be added to the factory.
+     */
+    initialComponents: ComponentTypeDictionary;
+});
+export declare const OptimizelyCms: FunctionComponent<PropsWithChildren<OptimizelyCmsProps>>;
+export declare const useOptimizelyCms: () => ClientContext;

package/dist/context/client.js

@@ -0,0 +1,78 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useState, useMemo } from "react";
+import { isOptiGraphClient, isOptiGraphConfig, createClient } from "@remkoj/optimizely-graph-client";
+import { getFactory } from "../factory/index.js";
+import { UndefinedComponentFactory } from "../factory/undef.js";
+export var OptimizelyCmsMode;
+(function (OptimizelyCmsMode) {
+    OptimizelyCmsMode["default"] = "default";
+    OptimizelyCmsMode["edit"] = "edit";
+    OptimizelyCmsMode["preview"] = "preview";
+})(OptimizelyCmsMode || (OptimizelyCmsMode = {}));
+const _clientContext = createContext({
+    factory: new UndefinedComponentFactory(),
+    inEditMode: false,
+    inPreviewMode: false,
+    isDebug: false,
+    isDebugOrDevelopment: false,
+    isDevelopment: false,
+    setLocale: () => { throw new Error("Not implemented"); },
+    setMode: () => { throw new Error("Not implemented"); }
+});
+_clientContext.displayName = "Optimizely CMS Provider";
+export const OptimizelyCms = ({ factory, client, clientToken, children, isDebug, isDevelopment, initialMode = OptimizelyCmsMode.default, initialComponents = [] }) => {
+    const CtxProvider = _clientContext.Provider;
+    //#region React State
+    const [locale, setLocale] = useState();
+    const [mode, setMode] = useState(initialMode);
+    //#endregion
+    //#region Memoized Optimizely Graph Client
+    const graphClient = useMemo(() => {
+        const gc = isOptiGraphClient(client) ? client : createClient(isOptiGraphConfig(client) ? client : undefined);
+        if (clientToken)
+            gc.updateAuthentication(clientToken);
+        return gc;
+    }, [client, clientToken]);
+    //#endregion
+    //#region Memoized Debug and Development flags
+    const isDev = useMemo(() => isDevelopment == undefined ? getNodeEnv() == 'development' : isDevelopment, [isDevelopment]);
+    const isDbg = useMemo(() => isDebug == undefined ? graphClient.debug : isDebug, [isDebug, graphClient]);
+    //#endregion
+    //#region Memoized Component Factory
+    const ctxFactory = useMemo(() => {
+        if (factory)
+            return factory;
+        const newFactory = getFactory();
+        newFactory.registerAll(initialComponents);
+        return newFactory;
+    }, [factory]);
+    //#endregion
+    const ctxValue = {
+        client: graphClient,
+        factory: ctxFactory,
+        isDebug: isDbg,
+        isDevelopment: isDev,
+        isDebugOrDevelopment: isDbg || isDev,
+        inEditMode: mode == OptimizelyCmsMode.edit,
+        inPreviewMode: mode == OptimizelyCmsMode.preview,
+        locale,
+        setLocale,
+        setMode
+    };
+    return _jsx(CtxProvider, { value: ctxValue, children: children });
+};
+export const useOptimizelyCms = () => {
+    return useContext(_clientContext);
+};
+function getNodeEnv() {
+    let env;
+    try {
+        env = process.env.NODE_ENV;
+    }
+    catch {
+        // Ignored on purpose
+    }
+    return env || 'production';
+}
+//# sourceMappingURL=client.js.map

package/dist/context/client.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.js","sourceRoot":"","sources":["../../src/context/client.tsx"],"names":[],"mappings":"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"}