remove commented out code

antpaw · antpaw · commit 699e51a55406 · 2025-04-22T09:46:38.000+02:00
diff --git a/packages/chakra-ui/src/BaseInputTemplate/BaseInputTemplate.tsx b/packages/chakra-ui/src/BaseInputTemplate/BaseInputTemplate.tsx
@@ -37,7 +37,6 @@ export default function BaseInputTemplate<
     disabled,
   } = props;
   const inputProps = getInputProps<T, S, F>(schema, type, options);
-  // const chakraProps = getChakra({ uiSchema });
 
   const _onChange = ({ target: { value } }: ChangeEvent<HTMLInputElement>) =>
     onChange(value === '' ? options.emptyValue : value);
@@ -47,7 +46,6 @@ export default function BaseInputTemplate<
   return (
     <Field
       mb={1}
-      // {...chakraProps}
       disabled={disabled || readonly}
       required={required}
       readOnly={readonly}
diff --git a/packages/chakra-ui/src/ChakraFrameProvider.tsx b/packages/chakra-ui/src/ChakraFrameProvider.tsx
@@ -2,7 +2,6 @@ import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
 import weakMemoize from '@emotion/weak-memoize';
 import { ChakraProvider, defaultSystem } from '@chakra-ui/react';
-// import CSSReset from './CssReset';
 
 /**
  * __createChakraFrameProvider is used to ensure that <Global> emotion components
@@ -24,8 +23,6 @@ const memoizedCreateCacheWithContainer = weakMemoize((container: HTMLElement) =>
   return newCache;
 });
 
-// const system = createSystem(defaultConfig, { preflight: false });
-
 export const __createChakraFrameProvider =
   (props: any) =>
   ({ document }: any) => {
diff --git a/packages/chakra-ui/src/CheckboxWidget/CheckboxWidget.tsx b/packages/chakra-ui/src/CheckboxWidget/CheckboxWidget.tsx
@@ -34,7 +34,6 @@ export default function CheckboxWidget<
     uiSchema,
     schema,
   } = props;
-  // const chakraProps = getChakra({ uiSchema });
   // Because an unchecked checkbox will cause html5 validation to fail, only add
   // the "required" attribute if the field value must be "true", due to the
   // "const" or "enum" keywords
diff --git a/packages/chakra-ui/src/CheckboxesWidget/CheckboxesWidget.tsx b/packages/chakra-ui/src/CheckboxesWidget/CheckboxesWidget.tsx
@@ -1,16 +1,16 @@
-import { FocusEvent } from 'react';
-import { CheckboxGroup, Text, Stack, FieldsetRoot } from '@chakra-ui/react';
+import { CheckboxGroup, FieldsetRoot, Stack, Text } from '@chakra-ui/react';
 import {
   ariaDescribedByIds,
   enumOptionsIndexForValue,
   enumOptionsValueForIndex,
+  FormContextType,
   labelValue,
   optionId,
-  FormContextType,
   RJSFSchema,
   StrictRJSFSchema,
   WidgetProps,
 } from '@rjsf/utils';
+import { FocusEvent } from 'react';
 import { Checkbox } from '../components/ui/checkbox';
 
 export default function CheckboxesWidget<
@@ -33,7 +33,6 @@ export default function CheckboxesWidget<
     rawErrors = [],
   } = props;
   const { enumOptions, enumDisabled, emptyValue } = options;
-  // const chakraProps = getChakra({ uiSchema });
 
   const _onBlur = ({ target }: FocusEvent<HTMLInputElement | any>) =>
     onBlur(id, enumOptionsValueForIndex<S>(target && target.value, enumOptions, emptyValue));
@@ -46,7 +45,6 @@ export default function CheckboxesWidget<
   return (
     <FieldsetRoot
       mb={1}
-      // {...chakraProps}
       disabled={disabled || readonly}
       invalid={rawErrors && rawErrors.length > 0}
     >
diff --git a/packages/chakra-ui/src/RadioWidget/RadioWidget.tsx b/packages/chakra-ui/src/RadioWidget/RadioWidget.tsx
@@ -28,7 +28,6 @@ export default function RadioWidget<T = any, S extends StrictRJSFSchema = RJSFSc
   onFocus,
 }: WidgetProps<T, S, F>) {
   const { enumOptions, enumDisabled, emptyValue } = options;
-  // const chakraProps = getChakra({ uiSchema });
 
   const _onChange = ({ target: { value } }: ChangeEvent<HTMLInputElement>) =>
     onChange(enumOptionsValueForIndex<S>(value, enumOptions, emptyValue));
@@ -43,7 +42,6 @@ export default function RadioWidget<T = any, S extends StrictRJSFSchema = RJSFSc
   return (
     <Field
       mb={1}
-      // {...chakraProps}
       disabled={disabled || readonly}
       required={required}
       readOnly={readonly}
diff --git a/packages/chakra-ui/src/RangeWidget/RangeWidget.tsx b/packages/chakra-ui/src/RangeWidget/RangeWidget.tsx
@@ -25,7 +25,6 @@ export default function RangeWidget<T = any, S extends StrictRJSFSchema = RJSFSc
   hideLabel,
   id,
 }: WidgetProps<T, S, F>) {
-  // const chakraProps = getChakra({ uiSchema });
 
   const sliderWidgetProps = { value, label, id, ...rangeSpec<S>(schema) };
 
diff --git a/packages/chakra-ui/src/SelectNativeWidget/NativeSelectWidget.tsx b/packages/chakra-ui/src/SelectNativeWidget/NativeSelectWidget.tsx
@@ -40,7 +40,6 @@ export default function NativeSelectWidget<
     schema,
   } = props;
   const { enumOptions, enumDisabled, emptyValue } = options;
-  // const chakraProps = getChakra({ uiSchema });
 
   const _onChange = ({ target }: ChangeEvent<HTMLSelectElement>) => {
     return onChange(enumOptionsValueForIndex<S>(target && target.value, enumOptions, emptyValue));
@@ -97,7 +96,6 @@ export default function NativeSelectWidget<
   return (
     <Field
       mb={1}
-      // {...chakraProps}
       disabled={disabled || readonly}
       required={required}
       readOnly={readonly}
diff --git a/packages/chakra-ui/src/SelectWidget/SelectWidget.tsx b/packages/chakra-ui/src/SelectWidget/SelectWidget.tsx
@@ -39,7 +39,6 @@ export default function SelectWidget<T = any, S extends StrictRJSFSchema = RJSFS
     schema,
   } = props;
   const { enumOptions, enumDisabled, emptyValue } = options;
-  // const chakraProps = getChakra({ uiSchema });
 
   const _onMultiChange = ({ value }: SelectValueChangeDetails) => {
     return onChange(
@@ -120,7 +119,6 @@ export default function SelectWidget<T = any, S extends StrictRJSFSchema = RJSFS
     <Field
       ref={containerRef}
       mb={1}
-      // {...chakraProps}
       disabled={disabled || readonly}
       required={required}
       readOnly={readonly}
diff --git a/packages/chakra-ui/src/TextareaWidget/TextareaWidget.tsx b/packages/chakra-ui/src/TextareaWidget/TextareaWidget.tsx
@@ -30,8 +30,6 @@ export default function TextareaWidget<
   required,
   rawErrors,
 }: WidgetProps<T, S, F>) {
-  // const chakraProps = getChakra({ uiSchema });
-
   const _onChange = ({ target: { value } }: ChangeEvent<HTMLTextAreaElement>) =>
     onChange(value === '' ? options.emptyValue : value);
   const _onBlur = ({ target }: FocusEvent<HTMLTextAreaElement>) => onBlur(id, target && target.value);
@@ -40,7 +38,6 @@ export default function TextareaWidget<
   return (
     <Field
       mb={1}
-      // {...chakraProps}
       disabled={disabled || readonly}
       required={required}
       readOnly={readonly}
diff --git a/packages/chakra-ui/src/UpDownWidget/UpDownWidget.tsx b/packages/chakra-ui/src/UpDownWidget/UpDownWidget.tsx
@@ -17,16 +17,13 @@ export default function UpDownWidget<T = any, S extends StrictRJSFSchema = RJSFS
 ) {
   const { id, readonly, disabled, label, hideLabel, value, onChange, onBlur, onFocus, rawErrors, required } = props;
 
-  // const chakraProps = getChakra({ uiSchema }); TODO - adjust getChakra everywhere
-
   const _onChange = ({ value }: NumberInputValueChangeDetails) => onChange(value);
   const _onBlur = ({ target }: FocusEvent<HTMLInputElement | any>) => onBlur(id, target && target.value);
   const _onFocus = ({ target }: FocusEvent<HTMLInputElement | any>) => onFocus(id, target && target.value);
 
   return (
     <Field
       mb={1}
-      // {...chakraProps}
       disabled={disabled || readonly}
       required={required}
       readOnly={readonly}
diff --git a/packages/chakra-ui/src/utils.ts b/packages/chakra-ui/src/utils.ts
@@ -1,28 +1,24 @@
-import { ChakraProps, shouldForwardProp } from '@chakra-ui/system';
+import { Field as ChakraField, defaultSystem } from '@chakra-ui/react';
 import { UiSchema } from '@rjsf/utils';
+import shouldForwardProp from '@emotion/is-prop-valid';
+
+const { isValidProperty } = defaultSystem;
 
 export interface ChakraUiSchema extends Omit<UiSchema, 'ui:options'> {
   'ui:options'?: ChakraUiOptions;
 }
 
-type ChakraUiOptions = UiSchema['ui:options'] & { chakra?: ChakraProps };
-
-interface GetChakraProps {
-  uiSchema?: ChakraUiSchema;
-}
+type ChakraUiOptions = UiSchema['ui:options'] & { chakra?: ChakraField.RootProps };
 
-export function getChakra({ uiSchema = {} }: GetChakraProps): ChakraProps {
+export function getChakra(uiSchema: ChakraUiSchema = {}): ChakraField.RootProps {
   const chakraProps = (uiSchema['ui:options'] && uiSchema['ui:options'].chakra) || {};
 
   Object.keys(chakraProps).forEach((key) => {
     /**
      * Leveraging `shouldForwardProp` to remove props
-     *
-     * This is a utility function that's used in `@chakra-ui/react`'s factory function.
-     * Normally, it prevents ChakraProps from being passed to the DOM.
-     * In this case we just want to delete the unknown props. So we flip the boolean.
+     * https://chakra-ui.com/docs/styling/chakra-factory#forwarding-props
      */
-    if (shouldForwardProp(key)) {
+    if (!isValidProperty(key) || shouldForwardProp(key)) {
       delete (chakraProps as any)[key];
     }
   });
