@@ -9,14 +9,6 @@ import {
9
9
useTarget
10
10
} from '@builder.io/mitosis' ;
11
11
import { DBCheckboxProps , DBCheckboxState } from './model' ;
12
- import {
13
- cls ,
14
- delay ,
15
- getHideProp ,
16
- hasVoiceOver ,
17
- stringPropVisible ,
18
- uuid
19
- } from '../../utils' ;
20
12
import {
21
13
DEFAULT_INVALID_MESSAGE ,
22
14
DEFAULT_INVALID_MESSAGE_ID_SUFFIX ,
@@ -30,6 +22,14 @@ import {
30
22
handleFrameworkEventVue
31
23
} from '../../utils/form-components' ;
32
24
import DBInfotext from '../infotext/infotext.lite' ;
25
+ import {
26
+ cls ,
27
+ delay ,
28
+ getHideProp ,
29
+ hasVoiceOver ,
30
+ stringPropVisible ,
31
+ uuid
32
+ } from '../../utils' ;
33
33
34
34
useMetadata ( {
35
35
angular : {
@@ -135,26 +135,39 @@ export default function DBCheckbox(props: DBCheckboxProps) {
135
135
} , [ state . _id ] ) ;
136
136
137
137
onUpdate ( ( ) => {
138
- if ( state . initialized && document && state . _id ) {
139
- const checkboxElement = document ?. getElementById (
140
- state . _id
141
- ) as HTMLInputElement ;
142
- if ( checkboxElement ) {
143
- // in angular this must be set via native element
144
- if ( props . checked != undefined ) {
145
- checkboxElement . checked = props . checked ;
146
- }
147
-
148
- if ( props . indeterminate !== undefined ) {
149
- // When indeterminate is set, the value of the checked prop only impacts the form submitted values.
150
- // It has no accessibility or UX implications. (https://mui.com/material-ui/react-checkbox/)
151
- checkboxElement . indeterminate = props . indeterminate ;
138
+ if ( _ref ) {
139
+ useTarget ( {
140
+ angular : ( ) => {
141
+ if (
142
+ state . initialized &&
143
+ props . indeterminate !== undefined
144
+ ) {
145
+ // When indeterminate is set, the value of the checked prop only impacts the form submitted values.
146
+ // It has no accessibility or UX implications. (https://mui.com/material-ui/react-checkbox/)
147
+ _ref . indeterminate = props . indeterminate ;
148
+ }
149
+ } ,
150
+ default : ( ) => {
151
+ if ( props . indeterminate !== undefined ) {
152
+ // When indeterminate is set, the value of the checked prop only impacts the form submitted values.
153
+ // It has no accessibility or UX implications. (https://mui.com/material-ui/react-checkbox/)
154
+ _ref . indeterminate = props . indeterminate ;
155
+ }
152
156
}
157
+ } ) ;
158
+ }
159
+ } , [ state . initialized , _ref , props . indeterminate ] ) ;
153
160
154
- state . initialized = false ;
161
+ onUpdate ( ( ) => {
162
+ if ( state . initialized && _ref ) {
163
+ // in angular this must be set via native element
164
+ if ( props . checked != undefined ) {
165
+ _ref . checked = props . checked ;
155
166
}
167
+
168
+ state . initialized = false ;
156
169
}
157
- } , [ state . initialized , props . indeterminate , props . checked ] ) ;
170
+ } , [ state . initialized , _ref , props . checked ] ) ;
158
171
// jscpd:ignore-end
159
172
160
173
return (
0 commit comments