Iframe srcdoc and sandbox (#191)

Author: tim-x-y-z

src/npm-fastui/src/components/Iframe.tsx

@@ -3,6 +3,6 @@ import { FC } from 'react'
 import type { Iframe } from '../models'
 
 export const IframeComp: FC<Iframe> = (props) => {
-  const { src, width, height, title } = props
-  return <iframe src={src} width={width} height={height} title={title} />
+  const { src, width, height, title, sandbox, srcdoc } = props
+  return <iframe src={src} width={width} height={height} title={title} sandbox={sandbox} srcDoc={srcdoc} />
 }

src/npm-fastui/src/models.d.ts

@@ -231,6 +231,8 @@ export interface Iframe {
   width?: string | number
   height?: string | number
   className?: ClassName
+  srcdoc?: string
+  sandbox?: string
   type: 'Iframe'
 }
 export interface Video {

src/python-fastui/fastui/components/__init__.py

@@ -254,6 +254,8 @@ class Iframe(_p.BaseModel, extra='forbid'):
     width: _t.Union[str, int, None] = None
     height: _t.Union[str, int, None] = None
     class_name: _class_name.ClassNameField = None
+    srcdoc: _t.Union[str, None] = None
+    sandbox: _t.Union[str, None] = None
     type: _t.Literal['Iframe'] = 'Iframe'
 
 

src/python-fastui/tests/test_components.py

@@ -5,6 +5,7 @@
 that's just testing pydantic!
 """
 from fastui import FastUI, components
+from pydantic_core import Url
 
 
 def test_div_text():
@@ -50,3 +51,13 @@ def test_root_model_single():
             'type': 'Text',
         }
     ]
+
+
+def test_iframe():
+    iframe = components.Iframe(src='https://www.example.com', srcdoc='<p>hello world</p>', sandbox='allow-scripts')
+    assert iframe.model_dump(by_alias=True, exclude_none=True) == {
+        'src': Url('https://www.example.com'),
+        'type': 'Iframe',
+        'srcdoc': '<p>hello world</p>',
+        'sandbox': 'allow-scripts',
+    }