@servicetitan/dte-unlayer 0.129.0 → 0.131.0

package/dist/editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../src/editor.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,aAAa,EAOhB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAgB,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAE3E,MAAM,WAAW,kBAAkB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,wBAAwB,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,OAAO,CAAC,IAAI,IAAI,CAAC;IAEjB,QAAQ,CAAC,CAAC,IAAI,EAAE,uBAAuB,GAAG,IAAI,CAAC;IAE/C,cAAc,CAAC,CAAC,IAAI,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAE/C,OAAO,CAAC,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAE/C,OAAO,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpD,SAAS,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,GAAG,IAAI,CAAC;CAC7C;AAED,eAAO,MAAM,aAAa,2DAAwC,CAAC;AAEnE,eAAO,MAAM,aAAa,2GAsGxB,CAAC"}
+{"version":3,"file":"editor.d.ts","sourceRoot":"","sources":["../src/editor.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,aAAa,EAOhB,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAgB,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAE3E,MAAM,WAAW,kBAAkB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,wBAAwB,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,OAAO,CAAC,IAAI,IAAI,CAAC;IAEjB,QAAQ,CAAC,CAAC,IAAI,EAAE,uBAAuB,GAAG,IAAI,CAAC;IAE/C,cAAc,CAAC,CAAC,IAAI,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAE/C,OAAO,CAAC,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAE/C,OAAO,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpD,SAAS,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,GAAG,IAAI,CAAC;CAC7C;AAED,eAAO,MAAM,aAAa,2DAAwC,CAAC;AAEnE,eAAO,MAAM,aAAa,2GAuGxB,CAAC"}

package/dist/editor.js

@@ -117,6 +117,7 @@ export const UnlayerEditor = /*#__PURE__*/ forwardRef((props, ref)=>{
                 ref: containerRef
             }),
             props.opts.displayConditions && /*#__PURE__*/ _jsx(DisplayConditionModal, {
+                portalContainer: props.opts.displayConditionModalPortalContainer,
                 schema: props.opts.schema,
                 onConditionalsOpen: props.opts.onConditionalsOpen,
                 onConditionFormSelect: props.opts.onConditionFormSelect

package/dist/editor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/editor.tsx"],"sourcesContent":["import {\n    CSSProperties,\n    forwardRef,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { DisplayConditionModal } from './display-conditions/DisplayConditionModal';\nimport { UnlayerEditorTwin } from './shared/const';\nimport { UnlayerStore, UnlayerDesignChangeInfo } from './store';\nimport { UnlayerRef, CreateUnlayerEditorProps } from './unlayer-interface';\n\nexport interface UnlayerEditorProps {\n    id?: string;\n    design?: any;\n    opts: CreateUnlayerEditorProps;\n    minHeight?: number;\n    style?: CSSProperties;\n\n    onReady?(): void;\n\n    onChange?(info: UnlayerDesignChangeInfo): void;\n\n    onSnapshotSave?(tool: UnlayerEditorTwin): void;\n\n    onImage?(file: File): Promise<{ url: string }>;\n\n    onError?(title: string, description?: string): void;\n\n    onMessage?(type: string, data: any): void;\n}\n\nexport const useUnlayerRef = () => useRef<UnlayerRef | null>(null);\n\nexport const UnlayerEditor = forwardRef<UnlayerRef, UnlayerEditorProps>((props, ref) => {\n    const [isReady, setIsReady] = useState(false);\n    const containerRef = useRef<HTMLDivElement | null>(null);\n    const store = useMemo(\n        () => new UnlayerStore(props.opts),\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        [],\n    );\n\n    useEffect(() => {\n        if (containerRef.current) {\n            store\n                .init(containerRef.current)\n                .then(() => setIsReady(true))\n                .catch(() => setIsReady(false));\n        }\n\n        return () => store.destroy();\n    }, [store]);\n    useImperativeHandle(ref, () => store.unlayerRef, [store]);\n\n    useEffect(() => {\n        if (isReady) {\n            store.setDesign(props.design);\n        }\n    }, [isReady, props.design, store]);\n\n    useEffect(() => {\n        store.setOnChange(props.onChange);\n\n        return () => store.setOnChange();\n    }, [props.onChange, store]);\n\n    useEffect(() => {\n        store.setOnSnapshotSave(props.onSnapshotSave);\n\n        return () => store.setOnSnapshotSave();\n    }, [props.onSnapshotSave, store]);\n\n    useEffect(() => {\n        if (props.opts.newSnapshot) {\n            store.addTwin(props.opts.newSnapshot);\n        }\n    }, [props.opts.newSnapshot, store]);\n\n    useEffect(() => {\n        store.setOnReady(props.onReady);\n\n        return () => store.setOnReady();\n    }, [props.onReady, store]);\n\n    useEffect(() => {\n        store.setOnImage(props.onImage);\n\n        return () => store.setOnImage();\n    }, [props.onImage, store]);\n\n    useEffect(() => {\n        store.setOnError(props.onError);\n\n        return () => store.setOnError();\n    }, [props.onError, store]);\n\n    useEffect(() => {\n        store.setOnMessage(props.onMessage);\n\n        return () => store.setOnMessage();\n    }, [props.onMessage, store]);\n\n    useEffect(() => {\n        store.setOnFormSelect(props.opts.onFormSelect);\n\n        return () => store.setOnFormSelect();\n    }, [props.opts.onFormSelect, store]);\n\n    useEffect(() => {\n        store.setOnCalcFieldOpen(props.opts.onCalcFieldOpen);\n\n        return () => store.setOnCalcFieldOpen();\n    }, [props.opts.onCalcFieldOpen, store]);\n\n    useEffect(() => {\n        store.setOnCalcFieldSelect(props.opts.onCalcFieldSelect);\n\n        return () => store.setOnCalcFieldSelect();\n    }, [props.opts.onCalcFieldSelect, store]);\n\n    const { minHeight = 800, style = {} } = props;\n\n    return (\n        <div style={{ minHeight, display: 'flex' }}>\n            {!isReady && <p className=\"c-red-500\">error loading editor</p>}\n            <div id={props.id ?? 'editor'} style={style} ref={containerRef} />\n            {props.opts.displayConditions && (\n                <DisplayConditionModal\n                    schema={props.opts.schema}\n                    onConditionalsOpen={props.opts.onConditionalsOpen}\n                    onConditionFormSelect={props.opts.onConditionFormSelect}\n                />\n            )}\n        </div>\n    );\n});\n"],"names":["forwardRef","useEffect","useImperativeHandle","useMemo","useRef","useState","DisplayConditionModal","UnlayerStore","useUnlayerRef","UnlayerEditor","props","ref","isReady","setIsReady","containerRef","store","opts","current","init","then","catch","destroy","unlayerRef","setDesign","design","setOnChange","onChange","setOnSnapshotSave","onSnapshotSave","newSnapshot","addTwin","setOnReady","onReady","setOnImage","onImage","setOnError","onError","setOnMessage","onMessage","setOnFormSelect","onFormSelect","setOnCalcFieldOpen","onCalcFieldOpen","setOnCalcFieldSelect","onCalcFieldSelect","minHeight","style","div","display","p","className","id","displayConditions","schema","onConditionalsOpen","onConditionFormSelect"],"mappings":"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"}
+{"version":3,"sources":["../src/editor.tsx"],"sourcesContent":["import {\n    CSSProperties,\n    forwardRef,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { DisplayConditionModal } from './display-conditions/DisplayConditionModal';\nimport { UnlayerEditorTwin } from './shared/const';\nimport { UnlayerStore, UnlayerDesignChangeInfo } from './store';\nimport { UnlayerRef, CreateUnlayerEditorProps } from './unlayer-interface';\n\nexport interface UnlayerEditorProps {\n    id?: string;\n    design?: any;\n    opts: CreateUnlayerEditorProps;\n    minHeight?: number;\n    style?: CSSProperties;\n\n    onReady?(): void;\n\n    onChange?(info: UnlayerDesignChangeInfo): void;\n\n    onSnapshotSave?(tool: UnlayerEditorTwin): void;\n\n    onImage?(file: File): Promise<{ url: string }>;\n\n    onError?(title: string, description?: string): void;\n\n    onMessage?(type: string, data: any): void;\n}\n\nexport const useUnlayerRef = () => useRef<UnlayerRef | null>(null);\n\nexport const UnlayerEditor = forwardRef<UnlayerRef, UnlayerEditorProps>((props, ref) => {\n    const [isReady, setIsReady] = useState(false);\n    const containerRef = useRef<HTMLDivElement | null>(null);\n    const store = useMemo(\n        () => new UnlayerStore(props.opts),\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        [],\n    );\n\n    useEffect(() => {\n        if (containerRef.current) {\n            store\n                .init(containerRef.current)\n                .then(() => setIsReady(true))\n                .catch(() => setIsReady(false));\n        }\n\n        return () => store.destroy();\n    }, [store]);\n    useImperativeHandle(ref, () => store.unlayerRef, [store]);\n\n    useEffect(() => {\n        if (isReady) {\n            store.setDesign(props.design);\n        }\n    }, [isReady, props.design, store]);\n\n    useEffect(() => {\n        store.setOnChange(props.onChange);\n\n        return () => store.setOnChange();\n    }, [props.onChange, store]);\n\n    useEffect(() => {\n        store.setOnSnapshotSave(props.onSnapshotSave);\n\n        return () => store.setOnSnapshotSave();\n    }, [props.onSnapshotSave, store]);\n\n    useEffect(() => {\n        if (props.opts.newSnapshot) {\n            store.addTwin(props.opts.newSnapshot);\n        }\n    }, [props.opts.newSnapshot, store]);\n\n    useEffect(() => {\n        store.setOnReady(props.onReady);\n\n        return () => store.setOnReady();\n    }, [props.onReady, store]);\n\n    useEffect(() => {\n        store.setOnImage(props.onImage);\n\n        return () => store.setOnImage();\n    }, [props.onImage, store]);\n\n    useEffect(() => {\n        store.setOnError(props.onError);\n\n        return () => store.setOnError();\n    }, [props.onError, store]);\n\n    useEffect(() => {\n        store.setOnMessage(props.onMessage);\n\n        return () => store.setOnMessage();\n    }, [props.onMessage, store]);\n\n    useEffect(() => {\n        store.setOnFormSelect(props.opts.onFormSelect);\n\n        return () => store.setOnFormSelect();\n    }, [props.opts.onFormSelect, store]);\n\n    useEffect(() => {\n        store.setOnCalcFieldOpen(props.opts.onCalcFieldOpen);\n\n        return () => store.setOnCalcFieldOpen();\n    }, [props.opts.onCalcFieldOpen, store]);\n\n    useEffect(() => {\n        store.setOnCalcFieldSelect(props.opts.onCalcFieldSelect);\n\n        return () => store.setOnCalcFieldSelect();\n    }, [props.opts.onCalcFieldSelect, store]);\n\n    const { minHeight = 800, style = {} } = props;\n\n    return (\n        <div style={{ minHeight, display: 'flex' }}>\n            {!isReady && <p className=\"c-red-500\">error loading editor</p>}\n            <div id={props.id ?? 'editor'} style={style} ref={containerRef} />\n            {props.opts.displayConditions && (\n                <DisplayConditionModal\n                    portalContainer={props.opts.displayConditionModalPortalContainer}\n                    schema={props.opts.schema}\n                    onConditionalsOpen={props.opts.onConditionalsOpen}\n                    onConditionFormSelect={props.opts.onConditionFormSelect}\n                />\n            )}\n        </div>\n    );\n});\n"],"names":["forwardRef","useEffect","useImperativeHandle","useMemo","useRef","useState","DisplayConditionModal","UnlayerStore","useUnlayerRef","UnlayerEditor","props","ref","isReady","setIsReady","containerRef","store","opts","current","init","then","catch","destroy","unlayerRef","setDesign","design","setOnChange","onChange","setOnSnapshotSave","onSnapshotSave","newSnapshot","addTwin","setOnReady","onReady","setOnImage","onImage","setOnError","onError","setOnMessage","onMessage","setOnFormSelect","onFormSelect","setOnCalcFieldOpen","onCalcFieldOpen","setOnCalcFieldSelect","onCalcFieldSelect","minHeight","style","div","display","p","className","id","displayConditions","portalContainer","displayConditionModalPortalContainer","schema","onConditionalsOpen","onConditionFormSelect"],"mappings":"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"}

package/dist/unlayer-interface.d.ts

@@ -71,6 +71,8 @@ export interface CreateUnlayerEditorProps {
     hideContentControls?: boolean;
     hideBodyMenuItem?: boolean;
     displayConditions?: boolean;
+    /** Override portal target for the display-conditions dialog (defaults: shadow root when embedded, else `document.body`). */
+    displayConditionModalPortalContainer?: Element | DocumentFragment | null;
     enableHTMLEditing?: boolean;
     enableHTMLEditingReadonly?: boolean;
     imageValidation?: {

package/dist/unlayer-interface.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"unlayer-interface.d.ts","sourceRoot":"","sources":["../src/unlayer-interface.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"unlayer-interface.d.ts","sourceRoot":"","sources":["../src/unlayer-interface.tsx"],"names":[],"mappings":"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"}

package/dist/unlayer-interface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/unlayer-interface.tsx"],"sourcesContent":["import {\n    UnlayerEditorESignRecipientInfo,\n    UnlayerEditorTwin,\n    UnlayerEditorUnit,\n} from './shared/const';\nimport { FormFieldInfo, FormInfo } from './shared/forms';\nimport { SchemaObject } from './shared/schema';\n\nexport interface UnlayerDesignTool {\n    type: string;\n    slug?: string;\n    values: any;\n}\nexport interface UnlayerDesignCustomTool extends UnlayerDesignTool {\n    slug: string;\n}\n\nexport interface UnlayerDesignFormat {\n    body: {\n        rows: {\n            cells: number[];\n            columns: {\n                contents: UnlayerDesignTool[];\n                values?: any;\n            }[];\n            values?: any;\n        }[];\n        values?: any;\n    };\n    counters: Record<string, number>;\n    schemaVersion: number;\n}\n\nexport interface UnlayerExport {\n    html: string;\n    chunks: any;\n    design: UnlayerDesignFormat;\n}\n\nexport interface UnlayerRef {\n    loadDesign(design: any): void;\n    saveDesign(cb: (design: any) => void): void;\n    exportHtml(cb: (data: UnlayerExport) => void): void;\n    sendFormList(forms: FormInfo[]): void;\n    sendFormFields(formId: number, fields: FormFieldInfo[]): void;\n    sendCalcFieldLabels(labels: Record<string, string>): void;\n}\n\nexport interface UnlayerEditorMergeTagInfo {\n    id: string;\n    name: string;\n    propertyPath: string;\n}\n\nexport interface UnlayerEditorCustomTool {\n    key: string;\n    title: string;\n    description?: string;\n    url: string;\n    groupUrl?: string;\n}\n\nexport interface CreateUnlayerEditorProps {\n    tools: UnlayerEditorCustomTool[];\n    newSnapshot?: UnlayerEditorTwin;\n    toolTwins?: UnlayerEditorTwin[];\n    isSnapshotMode?: boolean;\n    dummyData?: any;\n    schema?: SchemaObject;\n    customCSS?: string | string[] | undefined;\n    customJS?: string | string[] | undefined;\n    mergeTags?: UnlayerEditorMergeTagInfo[] | undefined;\n    eSignRecipients?: UnlayerEditorESignRecipientInfo[] | undefined;\n    eSignFieldTypes?: string[] | undefined;\n    genericConfigMode?: boolean;\n    generics?: true | string[];\n    units?: UnlayerEditorUnit[];\n    noCoreTools?: boolean;\n    latest?: boolean;\n    blocks?: boolean;\n    hideAllTools?: boolean;\n    hideContentControls?: boolean;\n    hideBodyMenuItem?: boolean;\n    displayConditions?: boolean;\n    enableHTMLEditing?: boolean;\n    enableHTMLEditingReadonly?: boolean;\n    imageValidation?: {\n        maxWidth?: number;\n        maxHeight?: number;\n        maxFileSize?: number;\n    };\n    holidays?: string[];\n    onFormSelect?: (formId: number) => void;\n    onCalcFieldOpen?: (usedFormIds: number[]) => void;\n    onCalcFieldSelect?: (fieldKeys: string[]) => void;\n    onConditionalsOpen?: (\n        usedFormIds: number[],\n        sendFormList: (forms: FormInfo[]) => void,\n        sendFormFields: (formId: number, fields: FormFieldInfo[]) => void,\n    ) => void;\n    onConditionFormSelect?: (\n        formId: number,\n        sendFormFields: (formId: number, fields: FormFieldInfo[]) => void,\n    ) => void;\n}\n"],"names":[],"mappings":"AA8DA,WA0CC"}
+{"version":3,"sources":["../src/unlayer-interface.tsx"],"sourcesContent":["import {\n    UnlayerEditorESignRecipientInfo,\n    UnlayerEditorTwin,\n    UnlayerEditorUnit,\n} from './shared/const';\nimport { FormFieldInfo, FormInfo } from './shared/forms';\nimport { SchemaObject } from './shared/schema';\n\nexport interface UnlayerDesignTool {\n    type: string;\n    slug?: string;\n    values: any;\n}\nexport interface UnlayerDesignCustomTool extends UnlayerDesignTool {\n    slug: string;\n}\n\nexport interface UnlayerDesignFormat {\n    body: {\n        rows: {\n            cells: number[];\n            columns: {\n                contents: UnlayerDesignTool[];\n                values?: any;\n            }[];\n            values?: any;\n        }[];\n        values?: any;\n    };\n    counters: Record<string, number>;\n    schemaVersion: number;\n}\n\nexport interface UnlayerExport {\n    html: string;\n    chunks: any;\n    design: UnlayerDesignFormat;\n}\n\nexport interface UnlayerRef {\n    loadDesign(design: any): void;\n    saveDesign(cb: (design: any) => void): void;\n    exportHtml(cb: (data: UnlayerExport) => void): void;\n    sendFormList(forms: FormInfo[]): void;\n    sendFormFields(formId: number, fields: FormFieldInfo[]): void;\n    sendCalcFieldLabels(labels: Record<string, string>): void;\n}\n\nexport interface UnlayerEditorMergeTagInfo {\n    id: string;\n    name: string;\n    propertyPath: string;\n}\n\nexport interface UnlayerEditorCustomTool {\n    key: string;\n    title: string;\n    description?: string;\n    url: string;\n    groupUrl?: string;\n}\n\nexport interface CreateUnlayerEditorProps {\n    tools: UnlayerEditorCustomTool[];\n    newSnapshot?: UnlayerEditorTwin;\n    toolTwins?: UnlayerEditorTwin[];\n    isSnapshotMode?: boolean;\n    dummyData?: any;\n    schema?: SchemaObject;\n    customCSS?: string | string[] | undefined;\n    customJS?: string | string[] | undefined;\n    mergeTags?: UnlayerEditorMergeTagInfo[] | undefined;\n    eSignRecipients?: UnlayerEditorESignRecipientInfo[] | undefined;\n    eSignFieldTypes?: string[] | undefined;\n    genericConfigMode?: boolean;\n    generics?: true | string[];\n    units?: UnlayerEditorUnit[];\n    noCoreTools?: boolean;\n    latest?: boolean;\n    blocks?: boolean;\n    hideAllTools?: boolean;\n    hideContentControls?: boolean;\n    hideBodyMenuItem?: boolean;\n    displayConditions?: boolean;\n    /** Override portal target for the display-conditions dialog (defaults: shadow root when embedded, else `document.body`). */\n    displayConditionModalPortalContainer?: Element | DocumentFragment | null;\n    enableHTMLEditing?: boolean;\n    enableHTMLEditingReadonly?: boolean;\n    imageValidation?: {\n        maxWidth?: number;\n        maxHeight?: number;\n        maxFileSize?: number;\n    };\n    holidays?: string[];\n    onFormSelect?: (formId: number) => void;\n    onCalcFieldOpen?: (usedFormIds: number[]) => void;\n    onCalcFieldSelect?: (fieldKeys: string[]) => void;\n    onConditionalsOpen?: (\n        usedFormIds: number[],\n        sendFormList: (forms: FormInfo[]) => void,\n        sendFormFields: (formId: number, fields: FormFieldInfo[]) => void,\n    ) => void;\n    onConditionFormSelect?: (\n        formId: number,\n        sendFormFields: (formId: number, fields: FormFieldInfo[]) => void,\n    ) => void;\n}\n"],"names":[],"mappings":"AA8DA,WA4CC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@servicetitan/dte-unlayer",
-  "version": "0.129.0",
+  "version": "0.131.0",
   "description": "",
   "main": "./dist/index.js",
   "typings": "./dist/index.d.ts",

package/src/display-conditions/DisplayConditionModal.tsx

@@ -1,5 +1,13 @@
 import { Button, Combobox, Dialog, Flex, Text } from '@servicetitan/anvil2';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import {
+    Fragment,
+    useCallback,
+    useEffect,
+    useLayoutEffect,
+    useMemo,
+    useRef,
+    useState,
+} from 'react';
 import { createPortal } from 'react-dom';
 import {
     buildFormFieldKey,
@@ -28,6 +36,15 @@ const BEHAVIOR_OPTIONS = [
 const NUMERIC_VALUE_RE = /^-?(?:\d+\.?\d*|\.\d+)$/;
 type BehaviorOption = (typeof BEHAVIOR_OPTIONS)[number];
 
+/** When the editor runs inside a shadow root (e.g. monolith MFE), portaling to `document.body` escapes the shadow tree and loses bundled styles. */
+function resolveDisplayConditionPortalContainer(anchor: HTMLElement): Element | DocumentFragment {
+    const rootNode = anchor.getRootNode();
+    if (rootNode instanceof ShadowRoot) {
+        return rootNode;
+    }
+    return document.body;
+}
+
 function deriveMatchType(conditionState: DisplayConditionState): MatchType {
     const firstGroup = conditionState.groups[0];
     if (!firstGroup || firstGroup.conditions.length <= 1) {
@@ -59,6 +76,11 @@ function applyMatchTypeToState(
 }
 
 export interface DisplayConditionModalProps {
+    /**
+     * When set, the conditions dialog is portaled here instead of resolving from the DOM anchor.
+     * Use when the host controls stacking context or shadow boundaries explicitly.
+     */
+    portalContainer?: Element | DocumentFragment | null;
     onConditionFormSelect?: (
         formId: number,
         sendFormFields: (formId: number, fields: FormFieldInfo[]) => void,
@@ -72,7 +94,12 @@ export interface DisplayConditionModalProps {
 }
 
 export const DisplayConditionModal = (props: DisplayConditionModalProps) => {
-    const { onConditionFormSelect, onConditionalsOpen, schema } = props;
+    const {
+        onConditionFormSelect,
+        onConditionalsOpen,
+        portalContainer: portalContainerProp,
+        schema,
+    } = props;
     const [request, setRequest] = useState<DisplayConditionRequest | null>(null);
     const [isOpen, setIsOpen] = useState(false);
     const [state, setState] = useState(defaultState);
@@ -144,12 +171,21 @@ export const DisplayConditionModal = (props: DisplayConditionModalProps) => {
         [onConditionFormSelect],
     );
 
-    const portalTarget = useMemo(() => {
-        if (typeof document === 'undefined') {
-            return null;
+    const portalAnchorRef = useRef<HTMLSpanElement>(null);
+    const [resolvedPortalContainer, setResolvedPortalContainer] = useState<
+        Element | DocumentFragment | null
+    >(null);
+
+    useLayoutEffect(() => {
+        if (typeof document === 'undefined' || portalContainerProp !== undefined) {
+            return;
         }
-        return document.body;
-    }, []);
+        const anchor = portalAnchorRef.current;
+        if (!anchor) {
+            return;
+        }
+        setResolvedPortalContainer(resolveDisplayConditionPortalContainer(anchor));
+    }, [portalContainerProp]);
 
     useEffect(() => {
         return onDisplayCondition(nextRequest => {
@@ -274,99 +310,129 @@ export const DisplayConditionModal = (props: DisplayConditionModalProps) => {
         return state.groups.length > 0;
     }, [allFieldOptions, isFieldDataLoading, state.groups]);
 
-    if (!portalTarget || !isOpen) {
-        return null;
-    }
+    const portalTarget =
+        portalContainerProp === undefined ? resolvedPortalContainer : portalContainerProp;
 
-    return createPortal(
-        <Dialog open={isOpen} onClose={handleClose} size="xlarge">
-            <Dialog.Header>Conditions</Dialog.Header>
-            <Dialog.Content>
-                <Flex
-                    direction="column"
-                    gap="4"
+    return (
+        <Fragment>
+            {portalContainerProp === undefined ? (
+                <span
+                    ref={portalAnchorRef}
+                    aria-hidden="true"
                     style={{
-                        maxHeight: MODAL_CONTENT_MAX_HEIGHT,
-                        overflowY: 'auto',
-                        paddingRight: 8,
-                        width: '100%',
+                        position: 'absolute',
+                        width: 0,
+                        height: 0,
+                        clipPath: 'inset(50%)',
+                        overflow: 'hidden',
+                        whiteSpace: 'nowrap',
                     }}
-                >
-                    <ConditionGroupsSection
-                        behaviorSection={
-                            <Flex
-                                direction="row"
-                                alignItems="center"
-                                gap="2"
-                                style={{ flexWrap: 'wrap' }}
-                            >
-                                <Text size="small" subdued variant="body">
-                                    Select to include or exclude selected template/file.
-                                </Text>
-                                <div style={{ width: 90 }}>
-                                    <Combobox.Select
-                                        {...({ disableClearSelection: true } as object)}
-                                        itemToKey={(item: BehaviorOption | null) =>
-                                            item?.value ?? ''
-                                        }
-                                        itemToString={(item: BehaviorOption | null) =>
-                                            item?.label ?? ''
-                                        }
-                                        items={[...BEHAVIOR_OPTIONS]}
-                                        selectedItem={selectedBehavior}
-                                        onChange={handleBehaviorChange}
-                                    >
-                                        <Combobox.SelectTrigger
-                                            label=""
-                                            placeholder="Select..."
-                                            size="small"
-                                        />
-                                        <Combobox.Content>
-                                            {({ items }: { items: BehaviorOption[] }) => (
-                                                <Combobox.List>
-                                                    {items.map((item, i) => (
-                                                        <Combobox.Item
-                                                            index={i}
-                                                            item={item}
-                                                            key={item.value}
-                                                        >
-                                                            {item.label}
-                                                        </Combobox.Item>
-                                                    ))}
-                                                </Combobox.List>
-                                            )}
-                                        </Combobox.Content>
-                                    </Combobox.Select>
-                                </div>
-                            </Flex>
-                        }
-                        dataPointOptions={dataPointOptions}
-                        formFieldOptions={formFieldOptions}
-                        forms={forms}
-                        groups={state.groups}
-                        matchType={matchType}
-                        onFormSelect={handleFormSelect}
-                        onMatchTypeChange={setMatchType}
-                        onUpdateGroup={updateGroup}
-                    />
-                </Flex>
-            </Dialog.Content>
-            <Dialog.Footer sticky>
-                <Flex
-                    justifyContent="flex-end"
-                    alignItems="center"
-                    gap="3"
-                    style={{ width: '100%' }}
-                >
-                    <Button appearance="secondary" onClick={handleClose}>
-                        Cancel
-                    </Button>
-                    <Button appearance="primary" disabled={!canSave} onClick={handleSave}>
-                        Save Changes
-                    </Button>
-                </Flex>
-            </Dialog.Footer>
-        </Dialog>,
-        portalTarget,
+                />
+            ) : null}
+            {portalTarget && isOpen
+                ? createPortal(
+                      <Dialog open={isOpen} onClose={handleClose} size="xlarge">
+                          <Dialog.Header>Conditions</Dialog.Header>
+                          <Dialog.Content>
+                              <Flex
+                                  direction="column"
+                                  gap="4"
+                                  style={{
+                                      maxHeight: MODAL_CONTENT_MAX_HEIGHT,
+                                      overflowY: 'auto',
+                                      paddingRight: 8,
+                                      width: '100%',
+                                  }}
+                              >
+                                  <ConditionGroupsSection
+                                      behaviorSection={
+                                          <Flex
+                                              direction="row"
+                                              alignItems="center"
+                                              gap="2"
+                                              style={{ flexWrap: 'wrap' }}
+                                          >
+                                              <Text size="small" subdued variant="body">
+                                                  Select to include or exclude selected
+                                                  template/file.
+                                              </Text>
+                                              <div style={{ width: 90 }}>
+                                                  <Combobox.Select
+                                                      {...({
+                                                          disableClearSelection: true,
+                                                      } as object)}
+                                                      itemToKey={(item: BehaviorOption | null) =>
+                                                          item?.value ?? ''
+                                                      }
+                                                      itemToString={(item: BehaviorOption | null) =>
+                                                          item?.label ?? ''
+                                                      }
+                                                      items={[...BEHAVIOR_OPTIONS]}
+                                                      selectedItem={selectedBehavior}
+                                                      onChange={handleBehaviorChange}
+                                                  >
+                                                      <Combobox.SelectTrigger
+                                                          label=""
+                                                          placeholder="Select..."
+                                                          size="small"
+                                                      />
+                                                      <Combobox.Content>
+                                                          {({
+                                                              items,
+                                                          }: {
+                                                              items: BehaviorOption[];
+                                                          }) => (
+                                                              <Combobox.List>
+                                                                  {items.map((item, i) => (
+                                                                      <Combobox.Item
+                                                                          index={i}
+                                                                          item={item}
+                                                                          key={item.value}
+                                                                      >
+                                                                          {item.label}
+                                                                      </Combobox.Item>
+                                                                  ))}
+                                                              </Combobox.List>
+                                                          )}
+                                                      </Combobox.Content>
+                                                  </Combobox.Select>
+                                              </div>
+                                          </Flex>
+                                      }
+                                      dataPointOptions={dataPointOptions}
+                                      formFieldOptions={formFieldOptions}
+                                      forms={forms}
+                                      groups={state.groups}
+                                      matchType={matchType}
+                                      onFormSelect={handleFormSelect}
+                                      onMatchTypeChange={setMatchType}
+                                      onUpdateGroup={updateGroup}
+                                  />
+                              </Flex>
+                          </Dialog.Content>
+                          <Dialog.Footer sticky>
+                              <Flex
+                                  justifyContent="flex-end"
+                                  alignItems="center"
+                                  gap="3"
+                                  style={{ width: '100%' }}
+                              >
+                                  <Button appearance="secondary" onClick={handleClose}>
+                                      Cancel
+                                  </Button>
+                                  <Button
+                                      appearance="primary"
+                                      disabled={!canSave}
+                                      onClick={handleSave}
+                                  >
+                                      Save Changes
+                                  </Button>
+                              </Flex>
+                          </Dialog.Footer>
+                      </Dialog>,
+                      portalTarget,
+                  )
+                : null}
+        </Fragment>
     );
 };