New sivan

packages/example/src/Wizards/AllOfExamples.tsx

@@ -213,7 +213,7 @@ const CustomField: Field = ({ inputProps }) => {
 };
 
 const customField = {
-    key: 'clicker',
+    key: 'Switch',
     label: 'Click Me',
     type: 'custom',
     defaultValue: 0,

packages/shadcn-ui/src/exports/Fields/RadioField.tsx

@@ -1,28 +1,45 @@
-import React from 'react';
-import { Radio, RadioGroup as MuiRadioGroup, FormControlLabel, Grid } from '@mui/material';
+
+import React, { useState } from 'react';
+import { Label } from "../../components/ui/label"
+import { RadioGroup, RadioGroupItem } from "../../components/ui/radio-group"
+
+
 import { Option, Field } from '@tutim/types';
 import { FieldWrapper } from './FieldWrapper';
 
+
 export const RadioField: Field = (props) => {
   const { fieldConfig, inputProps, fieldState } = props;
   const { value, onChange } = inputProps;
   const { options = [], custom } = fieldConfig;
 
   const isHorizontal = custom?.orientation === 'vertical' ? false : true;
 
+
+
   const childOptions = options.map((option: Option) => (
-    <Grid item key={option.value}>
-      <FormControlLabel value={option.value} disabled={option.disabled} control={<Radio />} label={option.label} />
-    </Grid>
+
+      <div className={`item`} key={option.value}>
+        <RadioGroupItem
+          value={option.value.toString()}
+          disabled={option.disabled}
+          style={option.disabled ? { opacity: '0.8' , backgroundColor: '#CBD5E0'} : {}}
+        />     
+      <Label htmlFor={option.label}>{option.label}</Label>  
+
+    </div>
   ));
 
   return (
-    <FieldWrapper fieldConfig={fieldConfig} fieldState={fieldState}>
-      <MuiRadioGroup value={value} onChange={onChange} row={isHorizontal}>
-        <Grid container direction={isHorizontal ? 'row' : 'column'} alignItems={isHorizontal ? 'center' : 'flex-start'}>
-          {childOptions}
-        </Grid>
-      </MuiRadioGroup>
-    </FieldWrapper>
+    <div className="space-x-2 ">
+      <FieldWrapper fieldConfig={fieldConfig} fieldState={fieldState} >
+        <RadioGroup onValueChange={onChange} orientation={custom?.orientation} >
+          <div className={`container mx-auto ${isHorizontal ? 'center' : 'flex-start'} ${isHorizontal ? 'flex-row' : 'flex-col'}`}>
+            {childOptions}
+          </div>
+
+        </RadioGroup>
+      </FieldWrapper>
+    </div>
   );
-};
+};

packages/shadcn-ui/src/exports/Fields/SwitchField.tsx

@@ -1,13 +1,23 @@
 import { Field } from '@tutim/types';
-import { Switch, FormControlLabel } from '@mui/material';
+
+import { Label } from "../../components/ui/label"
+import { Switch } from '../../components/ui/switch';
+
 import { FieldWrapper } from './FieldWrapper';
 
+
+
+
+
 export const SwitchField: Field = ({ fieldConfig, inputProps: { value = false, onChange }, fieldState }) => {
   const { key, label } = fieldConfig;
 
   return (
-    <FieldWrapper fieldConfig={fieldConfig} fieldState={fieldState}>
-      <FormControlLabel label={label} control={<Switch key={key} checked={value} onChange={onChange} />} />
-    </FieldWrapper>
+    <div className="flex items-center space-x-2">
+      <FieldWrapper fieldConfig={fieldConfig} fieldState={fieldState}  >
+        <Switch id= 'Switch field' onCheckedChange={onChange} key={key} checked={value} />
+          <Label htmlFor={label} >{label}</Label>
+      </FieldWrapper >
+    </div>
   );
 };