@@ -3,10 +3,16 @@ import { useCallback, useEffect, useRef, useState } from 'preact/hooks';
33import  {  useExpressionEvaluation ,  useDeepCompareMemoize ,  usePrevious  }  from  '../../hooks' ; 
44import  {  isObject  }  from  'min-dash' ; 
55import  {  isEqual  }  from  'lodash' ; 
6- import  {  v4  as  uuidv4  }  from  'uuid' ; 
76
87export  function  JSFunctionField ( props )  { 
9-   const  {  field,  onChange,  value }  =  props ; 
8+ 
9+   const  { 
10+     field, 
11+     onChange, 
12+     value, 
13+     domId
14+   }  =  props ; 
15+ 
1016  const  { 
1117    jsFunction : functionDefinition , 
1218    functionParameters : paramsDefinition , 
@@ -16,7 +22,6 @@ export function JSFunctionField(props) {
1622
1723  const  [  sandbox ,  setSandbox  ]  =  useState ( null ) ; 
1824  const  [  hasRunLoad ,  setHasRunLoad  ]  =  useState ( false ) ; 
19-   const  [  iframeContainerId  ]  =  useState ( `fjs-sandbox-iframe-container_${ uuidv4 ( ) }  ` ) ; 
2025  const  iframeContainerRef  =  useRef ( null ) ; 
2126
2227  const  paramsEval  =  useExpressionEvaluation ( paramsDefinition ) ; 
@@ -103,7 +108,7 @@ export function JSFunctionField(props) {
103108  ` ; 
104109
105110    const  _sandbox  =  Sandbox . create ( hostAPI ,  { 
106-       frameContainer : `#${ iframeContainerId }  ` , 
111+       frameContainer : `#${ domId }  ` , 
107112      frameClassName : 'fjs-sandbox-iframe' 
108113    } ) ; 
109114
@@ -119,7 +124,7 @@ export function JSFunctionField(props) {
119124    return  ( )  =>  { 
120125      _sandbox . destroy ( ) ; 
121126    } ; 
122-   } ,  [  clearValue ,  functionDefinition ,  iframeContainerId ,  safeSetValue ,  sandboxError  ] ) ; 
127+   } ,  [  clearValue ,  functionDefinition ,  domId ,  safeSetValue ,  sandboxError  ] ) ; 
123128
124129  const  prevParams  =  usePrevious ( params ) ; 
125130  const  prevSandbox  =  usePrevious ( sandbox ) ; 
@@ -151,7 +156,7 @@ export function JSFunctionField(props) {
151156  } ,  [  params ,  prevParams ,  sandbox ,  prevSandbox ,  field ,  computeOn ,  hasRunLoad ,  interval ,  clearValue ,  safeSetValue  ] ) ; 
152157
153158  return  ( 
154-     < div  ref = {  iframeContainerRef  }  id = {  iframeContainerId  }  className = "fjs-sandbox-iframe-container" > </ div > 
159+     < div  ref = {  iframeContainerRef  }  id = {  domId  }  className = "fjs-sandbox-iframe-container" > </ div > 
155160  ) ; 
156161} 
157162
0 commit comments