Skip to content

v0.0.20

Choose a tag to compare

@TrueWinter TrueWinter released this 12 Jun 15:44
· 86 commits to main since this release

This release contains breaking changes.

  • Added the defaultSettings property to the Input interface to allow for better default settings handling
Required changes (example)
renderInput: ({
     name, description, settings, value, onChange, registerValidator, unregisterValidator
   }) => {
     const { maxLength, required } = settings;
     const error = useInputValidator((v) => {
       if (required && !v) return `${name} is required`;
       if (maxLength && maxLength !== 0 && v.length > maxLength) {
         return `${name} has a maximum length of ${maxLength}`;
       }
       return null;
     }, registerValidator, unregisterValidator);

     return (
       <TextInput
         label={name}
         description={description}
         required={required}
         maxLength={maxLength > 1 ? maxLength : null}
         error={error}
         value={value}
         onChange={(v) => onChange(v.target.value)} />
     );
   },

+  defaultSettings: {
+    maxLength: 0,
+    required: true
+  },
+
   renderSettings: ({ settings, onChange, registerValidator, unregisterValidator }) => {
     const errors = useInputValidator<TextInputSettings>(
       (v) => ({
         maxLength: v.maxLength < 0 ? 'Max length must be positive' : null
       }),
       registerValidator,
       unregisterValidator
     );

-    const [merged, changeSetting] = useSettingsHandler({
-      maxLength: settings?.maxLength || 0,
-      required: settings?.required ?? true
-    }, settings, onChange);
+    const changeSetting = useSettingsHandler(settings, onChange);

     return (
       <Stack>
         <NumberInput label="Max Length" allowDecimal={false}
           description="Set to 0 to disable length limit" required
-          error={errors?.maxLength} value={merged.maxLength}
+          error={errors?.maxLength} value={settings.maxLength}
           onChange={(v: number) => changeSetting('maxLength', v)} />
         <Checkbox label="Required" error={errors?.required}
-          checked={merged.required}
+          checked={settings.required}
           onChange={(v) => changeSetting('required', v.target.checked)} />
       </Stack>
     );
   },