1
1
import { h , cloneElement , render , hydrate } from 'preact' ;
2
2
3
- export default function register ( Component , tagName , propNames ) {
3
+ export default function register ( Component , tagName , propNames , options ) {
4
4
function PreactElement ( ) {
5
5
const inst = Reflect . construct ( HTMLElement , [ ] , PreactElement ) ;
6
6
inst . _vdomComponent = Component ;
7
+ inst . _root = options && options . shadow ? inst . attachShadow ( { mode : 'open' } ) : inst ;
7
8
return inst ;
8
9
}
9
10
PreactElement . prototype = Object . create ( HTMLElement . prototype ) ;
@@ -21,19 +22,19 @@ export default function register(Component, tagName, propNames) {
21
22
22
23
function connectedCallback ( ) {
23
24
this . _vdom = toVdom ( this , this . _vdomComponent ) ;
24
- ( this . hasAttribute ( 'hydrate' ) ? hydrate : render ) ( this . _vdom , this ) ;
25
+ ( this . hasAttribute ( 'hydrate' ) ? hydrate : render ) ( this . _vdom , this . _root ) ;
25
26
}
26
27
27
28
function attributeChangedCallback ( name , oldValue , newValue ) {
28
29
if ( ! this . _vdom ) return ;
29
30
const props = { } ;
30
31
props [ name ] = newValue ;
31
32
this . _vdom = cloneElement ( this . _vdom , props ) ;
32
- render ( this . _vdom , this ) ;
33
+ render ( this . _vdom , this . _root ) ;
33
34
}
34
35
35
36
function detachedCallback ( ) {
36
- render ( this . _vdom = null , this ) ;
37
+ render ( this . _vdom = null , this . _root ) ;
37
38
}
38
39
39
40
function toVdom ( element , nodeName ) {
0 commit comments