@sitecore-content-sdk/react 2.2.1 → 2.3.0-beta.atoms.20260721120640

package/dist/esm/components/DesignLibrary/StudioComponentServerWrapper.js

@@ -0,0 +1,86 @@
+import React from 'react';
+import { StudioComponentWrapper } from './StudioComponentWrapper';
+import { NativeDataFetcher } from '@sitecore-content-sdk/core';
+import { debug } from '@sitecore-content-sdk/content';
+import { resolveEdgeUrl } from '@sitecore-content-sdk/core/tools';
+/**
+ * Server component for Studio (NCC) components. Fetches the component layout
+ * `Document` from MMS server-side and renders the client `StudioComponentWrapper`.
+ * @param {StudioComponentServerWrapperProps} props incoming props
+ * @returns rendered `StudioComponentWrapper`
+ * @internal
+ */
+export const StudioComponentServerWrapper = async (props) => {
+    const componentRef = props.componentRef || '';
+    if (!componentRef)
+        return null;
+    const path = extractVariantPathFromComponentRef(componentRef, props.fieldNames);
+    if (!path)
+        return null;
+    const document = await fetchDocument(path);
+    if (!document)
+        return null;
+    return React.createElement(StudioComponentWrapper, { document: document, fields: props.fields, params: props.params });
+};
+/**
+ * Extracts the variant path from a component reference.
+ * @param {string} componentRef The component reference string.
+ * @param {string} fieldNames The field names to extract the variant path for.
+ * @returns {string} The variant path.
+ * @internal
+ */
+function extractVariantPathFromComponentRef(componentRef, fieldNames = 'default') {
+    const paths = componentRef.split('|').reduce((acc, part) => {
+        const path = part.trim();
+        const segments = path.split('/');
+        const variant = segments[segments.length - 1];
+        acc.set(variant, path);
+        return acc;
+    }, new Map());
+    const path = paths.get(fieldNames) || paths.get('default') || null;
+    if (!path) {
+        console.warn(`StudioComponentServerWrapper: failed to extract path from ComponentRef "${componentRef}" with fieldNames "${fieldNames}". ` +
+            'Ensure the ComponentRef is in the expected format and that the correct fieldNames are provided.');
+    }
+    return path;
+}
+/**
+ * Prefix for MMS component paths in componentRef. The final URL will be resolved as `${host}/${MMS_COMPONENT_PATH_PREFIX}/${path}`.
+ */
+const MMS_COMPONENT_PATH_PREFIX = 'mms';
+/**
+ * Fetch a Studio component layout `Document` by reference.
+ * @param {string} path extracted component reference (path) from `params.ComponentRef`
+ * @returns {Promise<Document | null>} the resolved component layout, or `null` on missing path, fetch failure, or un-parseable body.
+ */
+async function fetchDocument(path) {
+    let url;
+    try {
+        const pathWithMmsPrefix = path.startsWith('/')
+            ? `/${MMS_COMPONENT_PATH_PREFIX}${path}`
+            : `/${MMS_COMPONENT_PATH_PREFIX}/${path}`;
+        const hostURL = resolveEdgeUrl();
+        url = new URL(pathWithMmsPrefix, hostURL).toString();
+    }
+    catch (err) {
+        console.error(`StudioComponentServerWrapper: failed to resolve component from "${path}"`, err);
+        return null;
+    }
+    let response;
+    try {
+        const fetcher = new NativeDataFetcher({ debugger: debug.layout });
+        response = await fetcher.get(url);
+    }
+    catch (error) {
+        console.error(`StudioComponentServerWrapper: failed to fetch component layout from ${url}`, error);
+        return null;
+    }
+    try {
+        const document = JSON.parse(response.data);
+        return document;
+    }
+    catch (err) {
+        console.error(`StudioComponentServerWrapper: failed to parse component layout response from ${url}`, err);
+        return null;
+    }
+}

package/dist/esm/components/DesignLibrary/StudioComponentWrapper.js

@@ -0,0 +1,25 @@
+'use client';
+import React, { useMemo } from 'react';
+import { createNCC } from '../../atoms';
+import { useSitecore } from '../SitecoreProvider';
+/**
+ * Client component that renders a pre-fetched Studio (NCC) component layout.
+ *
+ * Expects `document` to be provided (fetched server-side by
+ * `StudioComponentServerWrapper`, from Design Library document updates, or any other
+ * preview path that supplies a layout `Document`). Renders `null` when no layout
+ * is available.
+ * @param {StudioComponentWrapperProps} props component props
+ * @internal
+ */
+export const StudioComponentWrapper = ({ document, fields, params, }) => {
+    const { atomsConfig } = useSitecore();
+    const NCComponent = useMemo(() => {
+        if (!document || !atomsConfig)
+            return null;
+        return createNCC(document, atomsConfig.registry);
+    }, [document, atomsConfig]);
+    if (!NCComponent)
+        return null;
+    return React.createElement(NCComponent, { fields: fields, params: params });
+};

package/dist/esm/components/DesignLibrary/index.js

@@ -1,3 +1,4 @@
 export { DesignLibrary } from './DesignLibrary';
+export { DesignLibraryLowCodeComponent } from './DesignLibraryLowCodeComponent';
 export { DesignLibraryErrorBoundary } from './DesignLibraryErrorBoundary';
 export { noopLoadImportMap } from './loadImportMap';

package/dist/esm/components/Image.js

@@ -15,7 +15,7 @@ import { addClassName } from '../utils';
 import { withFieldMetadata } from '../enhancers/withFieldMetadata';
 import { withEmptyFieldEditingComponent } from '../enhancers/withEmptyFieldEditingComponent';
 import { DefaultEmptyFieldEditingComponentImage } from './DefaultEmptyFieldEditingComponents';
-import { isFieldValueEmpty, } from '@sitecore-content-sdk/content/layout';
+import { isFieldValueEmpty } from '@sitecore-content-sdk/content/layout';
 const getImageAttrs = (_a, imageParams, mediaUrlPrefix) => {
     var { src, srcSet } = _a, otherAttrs = __rest(_a, ["src", "srcSet"]);
     if (!src) {

package/dist/esm/components/Link.js

@@ -11,7 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React from 'react';
-import { isFieldValueEmpty, } from '@sitecore-content-sdk/content/layout';
+import { isFieldValueEmpty } from '@sitecore-content-sdk/content/layout';
 import { withFieldMetadata } from '../enhancers/withFieldMetadata';
 import { withEmptyFieldEditingComponent } from '../enhancers/withEmptyFieldEditingComponent';
 import { DefaultEmptyFieldEditingComponentText } from './DefaultEmptyFieldEditingComponents';

package/dist/esm/components/Placeholder/placeholder-utils.js

@@ -5,6 +5,7 @@ import { isDynamicPlaceholder, getDynamicPlaceholderPattern, getRenderingParamSt
 import { HIDDEN_RENDERING_NAME } from '@sitecore-content-sdk/content';
 import { HiddenRendering } from '../HiddenRendering';
 import { FEaaSComponent, FEaaSWrapper, BYOCComponent, BYOCWrapper, BYOC_COMPONENT_RENDERING_NAME, BYOC_WRAPPER_RENDERING_NAME, FEAAS_COMPONENT_RENDERING_NAME, FEAAS_WRAPPER_RENDERING_NAME, } from '../FEaaS';
+import { StudioComponentServerWrapper } from '../DesignLibrary/StudioComponentServerWrapper';
 /**
  * Get the renderings for the specified placeholder from the rendering layout data.
  * @param {ComponentRendering | RouteData } rendering rendering data
@@ -99,7 +100,7 @@ export function getChildComponentProps(placeholderProps, componentRendering) {
  * @returns {ContentSDKComponet | null} component implementation or null if no component map is provided
  */
 export const getComponentForRendering = (renderingDefinition, placeholderName, componentMap, hiddenRenderingComponent, missingComponentComponent) => {
-    var _a, _b;
+    var _a, _b, _c;
     const logUnknownComponentError = (variant) => {
         console.error(`Placeholder ${placeholderName} contains unknown component ${renderingDefinition.componentName}${variant ? ` (${variant})` : ''}. Ensure that a React component exists for it, and that it is registered in your component-map file.`);
     };
@@ -117,6 +118,16 @@ export const getComponentForRendering = (renderingDefinition, placeholderName, c
             componentType: 'universal',
         };
     }
+    if ((_a = renderingDefinition.params) === null || _a === void 0 ? void 0 : _a.ComponentRef) {
+        return {
+            component: (props) => {
+                var _a;
+                return (React.createElement(StudioComponentServerWrapper, { componentRef: props.rendering.params.ComponentRef, fieldNames: (_a = props.rendering.params) === null || _a === void 0 ? void 0 : _a.fieldNames, fields: props.fields, params: props.params }));
+            },
+            isEmpty: false,
+            componentType: 'server',
+        };
+    }
     let component = null;
     if (!componentMap || componentMap.size === 0) {
         console.warn(`No components were available in component map to service request for component ${renderingDefinition}`);
@@ -165,7 +176,7 @@ export const getComponentForRendering = (renderingDefinition, placeholderName, c
         };
     }
     // Render SXA Rendering Variant if available
-    const exportName = (_a = renderingDefinition.params) === null || _a === void 0 ? void 0 : _a.FieldNames;
+    const exportName = (_b = renderingDefinition.params) === null || _b === void 0 ? void 0 : _b.FieldNames;
     const renderedComponent = exportName && exportName !== DEFAULT_EXPORT_NAME
         ? component[exportName]
         : component.default ||
@@ -179,7 +190,7 @@ export const getComponentForRendering = (renderingDefinition, placeholderName, c
             componentType: 'universal',
         };
     }
-    const dynamic = !!((_b = renderedComponent.render) === null || _b === void 0 ? void 0 : _b.preload) ||
+    const dynamic = !!((_c = renderedComponent.render) === null || _c === void 0 ? void 0 : _c.preload) ||
         renderingDefinition.componentName === BYOC_WRAPPER_RENDERING_NAME;
     // all dynamic elements will have a separate render prop
     return {

package/dist/esm/components/SitecoreProvider.js

@@ -16,12 +16,13 @@ export const ImportMapReactContext = React.createContext(undefined);
  * @param {SitecoreProviderProps['page']} props.page - The page data.
  * @param {SitecoreProviderProps['componentMap']} props.componentMap - The component map.
  * @param {SitecoreProviderProps['loadImportMap']} props.loadImportMap - Optional function to load the import map for Design Library variant generation. When omitted, an empty import map is used (ex: code generation is disabled).
+ * @param {SitecoreProviderProps['atomsConfig']} props.atomsConfig - Atoms config (catalog + registry) for rendering low-code components.
  * @param {React.ReactNode} props.children - The children to render.
  * @returns {React.ReactNode} The SitecoreProvider component.
  * @public
  */
 export const SitecoreProvider = (props) => {
-    const { api, page: propsPage, componentMap, loadImportMap = noopLoadImportMap, children } = props;
+    const { api, page: propsPage, componentMap, loadImportMap = noopLoadImportMap, atomsConfig, children, } = props;
     const [page, setPageInternal] = useState(propsPage);
     // Memoize setPage callback
     const setPage = useCallback((value) => {
@@ -40,7 +41,8 @@ export const SitecoreProvider = (props) => {
         api,
         componentMap,
         loadImportMap,
-    }), [page, setPage, api, componentMap, loadImportMap]);
+        atomsConfig,
+    }), [page, setPage, api, componentMap, loadImportMap, atomsConfig]);
     return (React.createElement(SitecoreProviderReactContext.Provider, { value: contextValue }, children));
 };
 SitecoreProvider.displayName = 'SitecoreProvider';

package/dist/esm/index.js

@@ -6,14 +6,14 @@ export { DefaultRetryStrategy, GraphQLRequestClient, ErrorPage, } from '@sitecor
 export { mediaApi } from '@sitecore-content-sdk/content/media';
 export { Form } from './components/Form';
 export { Placeholder, AppPlaceholder, PlaceholderMetadata, renderEmptyPlaceholder, } from './components/Placeholder';
-export { Image } from './components/Image';
+export { Image, } from './components/Image';
 export { RichText } from './components/RichText';
 export { Text } from './components/Text';
 export { DateField } from './components/Date';
 export { FEaaSComponent, fetchFEaaSComponentServerProps, BYOCComponent, fetchBYOCComponentServerProps, 
 // leaving original names for backward compatibility
 BYOCWrapper, BYOCWrapper as BYOCClientWrapper, FEaaSWrapper, FEaaSWrapper as FEaaSClientWrapper, FEaaSServerWrapper, BYOCServerWrapper, } from './components/FEaaS';
-export { DesignLibrary, DesignLibraryErrorBoundary, noopLoadImportMap, } from './components/DesignLibrary';
+export { DesignLibrary, DesignLibraryLowCodeComponent, DesignLibraryErrorBoundary, noopLoadImportMap, } from './components/DesignLibrary';
 export { Link } from './components/Link';
 export { File } from './components/File';
 export { SitecoreProvider, SitecoreProviderReactContext, useSitecore, } from './components/SitecoreProvider';
@@ -29,3 +29,4 @@ export { EditingScripts } from './components/EditingScripts';
 export { DefaultEmptyFieldEditingComponentText, DefaultEmptyFieldEditingComponentImage, } from './components/DefaultEmptyFieldEditingComponents';
 export { ClientEditingChromesUpdate } from './components/ClientEditingChromesUpdate';
 export { SitePathService } from '@sitecore-content-sdk/content/site';
+export { useBoundProp, defineAtomsCatalog, defineAtomsRegistry, withPropMeta, textFieldSchema, richTextFieldSchema, dateFieldSchema, linkFieldSchema, imageFieldSchema, fileFieldSchema, } from './atoms';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sitecore-content-sdk/react",
-  "version": "2.2.1",
+  "version": "2.3.0-beta.atoms.20260721120640",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "sideEffects": false,
@@ -32,7 +32,7 @@
     "url": "https://github.com/sitecore/content-sdk/issues"
   },
   "devDependencies": {
-    "@sitecore-content-sdk/analytics-core": "^2.1.1",
+    "@sitecore-content-sdk/analytics-core": "2.1.1-beta.atoms.20260721120640",
     "@sitecore-feaas/clientside": "^0.6.0",
     "@stylistic/eslint-plugin": "^5.2.2",
     "@testing-library/dom": "^10.4.0",
@@ -71,16 +71,18 @@
     "typescript": "~5.8.3"
   },
   "peerDependencies": {
-    "@sitecore-content-sdk/analytics-core": "^2.1.1",
-    "@sitecore-content-sdk/events": "^2.1.1",
+    "@sitecore-content-sdk/analytics-core": "2.1.1-beta.atoms.20260721120640",
+    "@sitecore-content-sdk/events": "2.1.1-beta.atoms.20260721120640",
     "@sitecore-feaas/clientside": "^0.6.0",
     "react": "^19.2.1",
     "react-dom": "^19.2.1"
   },
   "dependencies": {
-    "@sitecore-content-sdk/content": "^2.2.1",
-    "@sitecore-content-sdk/core": "^2.1.2",
-    "@sitecore-content-sdk/search": "^0.3.0",
+    "@json-render/core": "0.19.0",
+    "@json-render/react": "0.19.0",
+    "@sitecore-content-sdk/content": "2.3.0-beta.atoms.20260721120640",
+    "@sitecore-content-sdk/core": "2.1.2-beta.atoms.20260721120640",
+    "@sitecore-content-sdk/search": "0.3.1-beta.atoms.20260721120640",
     "fast-deep-equal": "^3.1.3"
   },
   "description": "",

package/types/atoms/catalog-serializer.d.ts

@@ -0,0 +1,11 @@
+import type { Catalog } from '@json-render/core';
+import { AtomsCatalogInput } from './types';
+import { SerializedCatalog } from '@sitecore-content-sdk/content/atoms';
+/**
+ * Serialize a json-render Catalog into the payload shape expected by Design Studio.
+ * @param { Catalog<any, AtomsCatalogInput> } catalog - The json-render Catalog to serialize
+ * @returns Serialized catalog for the Design Library event
+ * @internal
+ */
+export declare function serializeCatalog(catalog: Catalog<any, AtomsCatalogInput>): SerializedCatalog;
+//# sourceMappingURL=catalog-serializer.d.ts.map

package/types/atoms/catalog-serializer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-serializer.d.ts","sourceRoot":"","sources":["../../src/atoms/catalog-serializer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAC5C,OAAO,EAGL,iBAAiB,EAClB,MAAM,qCAAqC,CAAC;AAE7C;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,GAAG,EAAE,iBAAiB,CAAC,GAAG,iBAAiB,CA0C5F"}

package/types/atoms/create-ncc.d.ts

@@ -0,0 +1,24 @@
+import { type FC } from 'react';
+import type { DefineRegistryResult } from '@json-render/react';
+import { Document } from '@sitecore-content-sdk/content/atoms';
+import type { ChildComponentProps } from '../components/Placeholder/models';
+/**
+ * Props accepted by the NCC component created by `createNCC`.
+ * @internal
+ */
+type NCCProps = {
+    [key: string]: unknown;
+    fields?: ChildComponentProps['fields'];
+    params?: ChildComponentProps['params'];
+};
+/**
+ * Creates a React functional component that renders the given Component Layout document
+ * using json-render's Renderer. The document's flat element map is passed as a spec.
+ * @param {Document} doc - Component Layout document (flat spec format)
+ * @param {DefineRegistryResult} registryResult - The registry from defineAtomsRegistry
+ * @returns {FC<NCCProps>} FC that accepts runtime props merged into spec state
+ * @internal
+ */
+export declare function createNCC(doc: Document, registryResult: DefineRegistryResult): FC<NCCProps>;
+export {};
+//# sourceMappingURL=create-ncc.d.ts.map

package/types/atoms/create-ncc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-ncc.d.ts","sourceRoot":"","sources":["../../src/atoms/create-ncc.tsx"],"names":[],"mappings":"AACA,OAAc,EAAE,KAAK,EAAE,EAAuB,MAAM,OAAO,CAAC;AAQ5D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAG/D,OAAO,EAAE,QAAQ,EAAE,MAAM,qCAAqC,CAAC;AAE/D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAE5E;;;GAGG;AACH,KAAK,QAAQ,GAAG;IACd,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACvC,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;CACxC,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,GAAG,EAAE,QAAQ,EAAE,cAAc,EAAE,oBAAoB,GAAG,EAAE,CAAC,QAAQ,CAAC,CAmD3F"}

package/types/atoms/define-atoms-catalog.d.ts

@@ -0,0 +1,65 @@
+import type { AtomsCatalogInput, RestrictFieldKey, Exact } from './types';
+/**
+ * Define an atoms catalog from component and action definitions.
+ *
+ * Pass component/action definitions exactly as json-render expects them.
+ * The returned catalog carries full type information so `defineAtomsRegistry`
+ * can infer props per component.
+ * @param {T} input - Catalog input with `components` and optionally `actions`
+ * @returns A typed json-render Catalog
+ * @example
+ * ```ts
+ * import { z } from 'zod';
+ * import { defineAtomsCatalog } from '@sitecore-content-sdk/react';
+ *
+ * const catalog = defineAtomsCatalog({
+ *   components: {
+ *     Button: {
+ *       props: z.object({ label: z.string(), variant: z.enum(['primary', 'secondary']) }),
+ *       description: 'A clickable button',
+ *       slots: ['default'],
+ *     },
+ *     Card: {
+ *       props: z.object({ title: z.string() }),
+ *       description: 'A content card',
+ *       slots: ['default'],
+ *     },
+ *   },
+ *   actions: {
+ *     submit: {
+ *       params: z.object({ formId: z.string() }),
+ *       description: 'Submit a form',
+ *     },
+ *   },
+ * });
+ * ```
+ * @public
+ */
+export declare function defineAtomsCatalog<T extends AtomsCatalogInput>(input: Exact<T, AtomsCatalogInput> & {
+    components: RestrictFieldKey<T['components'], 'props', 'className'>;
+}): import("@json-render/core").Catalog<{
+    spec: import("@json-render/core").SchemaType<"object", {
+        root: import("@json-render/core").SchemaType<"string", unknown>;
+        elements: import("@json-render/core").SchemaType<"record", import("@json-render/core").SchemaType<"object", {
+            type: import("@json-render/core").SchemaType<"ref", string>;
+            props: import("@json-render/core").SchemaType<"propsOf", string>;
+            children: import("@json-render/core").SchemaType<"array", import("@json-render/core").SchemaType<"string", unknown>>;
+            visible: import("@json-render/core").SchemaType<"any", unknown>;
+        }>>;
+    }>;
+    catalog: import("@json-render/core").SchemaType<"object", {
+        components: import("@json-render/core").SchemaType<"map", {
+            props: import("@json-render/core").SchemaType<"zod", unknown>;
+            slots: import("@json-render/core").SchemaType<"array", import("@json-render/core").SchemaType<"string", unknown>>;
+            description: import("@json-render/core").SchemaType<"string", unknown>;
+            example: import("@json-render/core").SchemaType<"any", unknown>;
+        }>;
+        actions: import("@json-render/core").SchemaType<"map", {
+            params: import("@json-render/core").SchemaType<"zod", unknown>;
+            description: import("@json-render/core").SchemaType<"string", unknown>;
+        }>;
+    }>;
+}, T & Record<Exclude<keyof T, "components" | "actions" | "version">, never> & {
+    components: RestrictFieldKey<T["components"], "props", "className">;
+}>;
+//# sourceMappingURL=define-atoms-catalog.d.ts.map

package/types/atoms/define-atoms-catalog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"define-atoms-catalog.d.ts","sourceRoot":"","sources":["../../src/atoms/define-atoms-catalog.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAE1E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,iBAAiB,EAC5D,KAAK,EAAE,KAAK,CAAC,CAAC,EAAE,iBAAiB,CAAC,GAAG;IACnC,UAAU,EAAE,gBAAgB,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,OAAO,EAAE,WAAW,CAAC,CAAC;CACrE;;;;;;;;;;;;;;;;;;;;;;;gBADa,gBAAgB,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,OAAO,EAAE,WAAW,CAAC;GAItE"}

package/types/atoms/define-atoms-registry.d.ts

@@ -0,0 +1,33 @@
+import { defineRegistry } from '@json-render/react';
+/**
+ * Define an atoms registry that maps catalog definitions to React implementations.
+ *
+ * Each component receives `{ props, children, emit, on, bindings, loading }`
+ * @param catalog - The catalog created by defineAtomsCatalog
+ * @param options - Component and action implementations
+ * @returns Registry result with component registry and action handlers
+ * @example
+ *
+ * ```tsx
+ * import { defineAtomsRegistry } from '@sitecore-content-sdk/react';
+ *
+ * const { registry, handlers, executeAction } = defineAtomsRegistry(catalog, {
+ *   components: {
+ *     Button: ({ props, children, emit }) => (
+ *       <button onClick={() => emit('press')}>{props.label}{children}</button>
+ *     ),
+ *     Card: ({ props, children }) => (
+ *       <div className="card"><h2>{props.title}</h2>{children}</div>
+ *     ),
+ *   },
+ *   actions: {
+ *     submit: async (params) => {
+ *       await fetch('/api/submit', { method: 'POST', body: JSON.stringify(params) });
+ *     },
+ *   },
+ * });
+ * ```
+ * @public
+ */
+export declare const defineAtomsRegistry: typeof defineRegistry;
+//# sourceMappingURL=define-atoms-registry.d.ts.map

package/types/atoms/define-atoms-registry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"define-atoms-registry.d.ts","sourceRoot":"","sources":["../../src/atoms/define-atoms-registry.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,mBAAmB,uBAAiB,CAAC"}

package/types/atoms/field-schemas.d.ts

@@ -0,0 +1,120 @@
+/** Zod schemas for Sitecore field types, for use in defineAtomsCatalog prop definitions. */
+import { z } from 'zod';
+/**
+ * Zod schema for a Sitecore Single-Line Text.
+ * Mirrors the Sitecore Text component (`Text.tsx` in `@sitecore-content-sdk/react`).
+ * @param {z.ZodRawShape} [extra] - Optional additional shape to merge into the schema.
+ * @returns A ZodObject with `value?: string | number` and DS control/fieldType hints attached.
+ * @public
+ */
+export declare const textFieldSchema: (extra?: z.ZodRawShape) => z.ZodObject<{
+    value: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodNumber]>>;
+}, z.core.$strip>;
+/**
+ * Zod schema for a Sitecore Rich Text field.
+ * Mirrors the Sitecore Rich Text component (`RichText.tsx` in `@sitecore-content-sdk/react`).
+ * @param {z.ZodRawShape} [extra] - Optional additional shape to merge into the schema.
+ * @returns A ZodObject with `value?: string` and DS control/fieldType hints attached.
+ * @public
+ */
+export declare const richTextFieldSchema: (extra?: z.ZodRawShape) => z.ZodObject<{
+    value: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+/**
+ * Zod schema for a Sitecore Date field.
+ * Mirrors the field shape used in the Date component (`Date.tsx` in `@sitecore-content-sdk/react`).
+ * @param {z.ZodRawShape} [extra] - Optional additional shape to merge into the schema.
+ * @returns A ZodObject with `value?: string` and DS control/fieldType hints attached.
+ * @public
+ */
+export declare const dateFieldSchema: (extra?: z.ZodRawShape) => z.ZodObject<{
+    value: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+/**
+ * Zod schema for a Sitecore Link field.
+ * Mirrors the Sitecore Link component (`Link.tsx` in `@sitecore-content-sdk/react`).
+ * The inner value object uses `z.looseObject` to allow arbitrary Sitecore-added attributes,
+ * matching the `[attributeName: string]: unknown` index signature on `LinkFieldValue`.
+ * @param {z.ZodRawShape} [extra] - Optional additional shape to merge into the outer schema.
+ * @returns A ZodObject with `value: LinkFieldValue` and DS control/fieldType hints attached.
+ * @public
+ */
+export declare const linkFieldSchema: (extra?: z.ZodRawShape) => z.ZodObject<{
+    value: z.ZodObject<{
+        href: z.ZodOptional<z.ZodString>;
+        className: z.ZodOptional<z.ZodString>;
+        class: z.ZodOptional<z.ZodString>;
+        title: z.ZodOptional<z.ZodString>;
+        target: z.ZodOptional<z.ZodString>;
+        text: z.ZodOptional<z.ZodString>;
+        anchor: z.ZodOptional<z.ZodString>;
+        querystring: z.ZodOptional<z.ZodString>;
+        linktype: z.ZodOptional<z.ZodString>;
+    }, z.core.$loose>;
+}, z.core.$strip>;
+/**
+ * Zod schema for a Sitecore Image field.
+ * Mirrors the Sitecore Image component (`Image.tsx` in `@sitecore-content-sdk/react`).
+ * The inner value object uses `z.looseObject` to allow arbitrary HTML attributes,
+ * matching the `[attributeName: string]: unknown` index signature on `ImageFieldValue`.
+ * @param {z.ZodRawShape} [extra] - Optional additional shape to merge into the outer schema.
+ * @returns A ZodObject with `value?: ImageFieldValue` and DS control/fieldType hints attached.
+ * @public
+ */
+export declare const imageFieldSchema: (extra?: z.ZodRawShape) => z.ZodObject<{
+    value: z.ZodOptional<z.ZodObject<{
+        src: z.ZodOptional<z.ZodString>;
+        alt: z.ZodOptional<z.ZodString>;
+        width: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodNumber]>>;
+        height: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodNumber]>>;
+        class: z.ZodOptional<z.ZodString>;
+    }, z.core.$loose>>;
+}, z.core.$strip>;
+/**
+ * Zod schema for a Sitecore File field.
+ * Mirrors the Sitecore File component (`File.tsx` in `@sitecore-content-sdk/react`).
+ * The inner value object uses `z.looseObject` to allow arbitrary extra properties,
+ * matching the `[propName: string]: unknown` index signature on `FileFieldValue`.
+ * @param {z.ZodRawShape} [extra] - Optional additional shape to merge into the outer schema.
+ * @returns A ZodObject with `value: FileFieldValue` and DS control/fieldType hints attached.
+ * @public
+ */
+export declare const fileFieldSchema: (extra?: z.ZodRawShape) => z.ZodObject<{
+    value: z.ZodObject<{
+        src: z.ZodOptional<z.ZodString>;
+        title: z.ZodOptional<z.ZodString>;
+        displayName: z.ZodOptional<z.ZodString>;
+    }, z.core.$loose>;
+}, z.core.$strip>;
+/**
+ * Inferred type for a Sitecore Single-Line Text / Multi-Line Text field prop.
+ * Use this to type component props that accept a text field.
+ * @public
+ */
+export type TextFieldSchema = z.infer<ReturnType<typeof textFieldSchema>>;
+/**
+ * Inferred type for a Sitecore Rich Text field prop.
+ * @public
+ */
+export type RichTextFieldSchema = z.infer<ReturnType<typeof richTextFieldSchema>>;
+/**
+ * Inferred type for a Sitecore Date field prop.
+ * @public
+ */
+export type DateFieldSchema = z.infer<ReturnType<typeof dateFieldSchema>>;
+/**
+ * Inferred type for a Sitecore General Link field prop.
+ * @public
+ */
+export type LinkFieldSchema = z.infer<ReturnType<typeof linkFieldSchema>>;
+/**
+ * Inferred type for a Sitecore Image field prop.
+ * @public
+ */
+export type ImageFieldSchema = z.infer<ReturnType<typeof imageFieldSchema>>;
+/**
+ * Inferred type for a Sitecore File field prop.
+ * @public
+ */
+export type FileFieldSchema = z.infer<ReturnType<typeof fileFieldSchema>>;
+//# sourceMappingURL=field-schemas.d.ts.map

package/types/atoms/field-schemas.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-schemas.d.ts","sourceRoot":"","sources":["../../src/atoms/field-schemas.ts"],"names":[],"mappings":"AAAA,4FAA4F;AAC5F,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAGxB;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,GAAI,QAAQ,CAAC,CAAC,WAAW;;iBAOlD,CAAC;AAEJ;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,GAAI,QAAQ,CAAC,CAAC,WAAW;;iBAOtD,CAAC;AAEJ;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,GAAI,QAAQ,CAAC,CAAC,WAAW;;iBAOlD,CAAC;AAEJ;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,GAAI,QAAQ,CAAC,CAAC,WAAW;;;;;;;;;;;;iBAiBlD,CAAC;AAEJ;;;;;;;;GAQG;AACH,eAAO,MAAM,gBAAgB,GAAI,QAAQ,CAAC,CAAC,WAAW;;;;;;;;iBAenD,CAAC;AAEJ;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,GAAI,QAAQ,CAAC,CAAC,WAAW;;;;;;iBAWlD,CAAC;AAEJ;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC;AAE1E;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAC,CAAC;AAElF;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC;AAE1E;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC;AAE1E;;;GAGG;AACH,MAAM,MAAM,gBAAgB,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC;AAE5E;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC"}

package/types/atoms/index.d.ts

@@ -0,0 +1,9 @@
+export type { AtomComponentDefinition, AtomActionDefinition, AtomsCatalogInput, AtomsComponentsMap, AtomActionHandler, AtomsActionsMap, AtomsConfig, Exact, } from './types';
+export { defineAtomsCatalog } from './define-atoms-catalog';
+export { defineAtomsRegistry } from './define-atoms-registry';
+export { serializeCatalog } from './catalog-serializer';
+export { withPropMeta, type PropMeta } from './schema-utils';
+export { textFieldSchema, richTextFieldSchema, dateFieldSchema, linkFieldSchema, imageFieldSchema, fileFieldSchema, type TextFieldSchema, type RichTextFieldSchema, type DateFieldSchema, type LinkFieldSchema, type ImageFieldSchema, type FileFieldSchema, } from './field-schemas';
+export { createNCC } from './create-ncc';
+export * from './re-exports';
+//# sourceMappingURL=index.d.ts.map

package/types/atoms/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/atoms/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,uBAAuB,EACvB,oBAAoB,EACpB,iBAAiB,EACjB,kBAAkB,EAClB,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,KAAK,GACN,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,KAAK,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,eAAe,EACf,eAAe,EACf,gBAAgB,EAChB,eAAe,EACf,KAAK,eAAe,EACpB,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,gBAAgB,EACrB,KAAK,eAAe,GACrB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,cAAc,cAAc,CAAC"}

package/types/atoms/re-exports.d.ts

@@ -0,0 +1,22 @@
+import { useBoundProp as useBoundPropInternal } from '@json-render/react';
+/**
+ * Hook for two-way bound props. Returns `[value, setValue]` where:
+ *
+ * - `value` is the already-resolved prop value (passed through from render props)
+ * - `setValue` writes back to the bound state path (no-op if not bound)
+ *
+ * Designed to work with the `bindings` map that the renderer provides when
+ * a prop uses `{ $bindState: "/path" }` or `{ $bindItem: "field" }`.
+ * @example
+ * ```tsx
+ * import { useBoundProp } from '@sitecore-content-sdk/react';
+ *
+ * const Input: ComponentRenderer = ({ props, bindings }) => {
+ *   const [value, setValue] = useBoundProp<string>(props.value, bindings?.value);
+ *   return <input value={value ?? ""} onChange={(e) => setValue(e.target.value)} />;
+ * };
+ * ```
+ * @public
+ */
+export declare const useBoundProp: typeof useBoundPropInternal;
+//# sourceMappingURL=re-exports.d.ts.map

package/types/atoms/re-exports.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"re-exports.d.ts","sourceRoot":"","sources":["../../src/atoms/re-exports.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,IAAI,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAE1E;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,YAAY,6BAAuB,CAAC"}

package/types/atoms/schema-utils.d.ts

@@ -0,0 +1,20 @@
+/** Schema metadata for atom props/events. */
+import { z } from 'zod';
+/**
+ * Prop metadata (e.g. control hint and field type for Design Studio).
+ *  @public
+ */
+export type PropMeta = {
+    control?: string;
+    fieldType?: string;
+};
+/**
+ * Attach editor hint (e.g. control type, fieldType) to a prop schema. Metadata is stored under a key that
+ * survives JSON Schema conversion for Design Studio.
+ * @param {import('zod').ZodType} schema - Zod type for the prop
+ * @param {PropMeta} meta - Editor metadata (e.g. control, fieldType)
+ * @returns The same Zod type with meta attached (or schema unchanged if .meta is not callable)
+ * @public
+ */
+export declare function withPropMeta<T extends z.ZodType>(schema: T, meta: PropMeta): T;
+//# sourceMappingURL=schema-utils.d.ts.map

package/types/atoms/schema-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema-utils.d.ts","sourceRoot":"","sources":["../../src/atoms/schema-utils.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG;IAAE,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAIhE;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,QAAQ,GAAG,CAAC,CAM9E"}