Refine getInitialMeta.

eBay · May 22, 2024 · 08a4354 · 08a4354
1 parent d1f0dea
commit 08a4354
Show file tree

Hide file tree

Showing 3 changed files with 116 additions and 114 deletions.
diff --git a/packages/examples-antd/src/examples/Wizard.tsx b/packages/examples-antd/src/examples/Wizard.tsx
@@ -21,64 +21,65 @@ interface WizardMeta {
   steps: Step[];
 }
 
-const wizardMeta: WizardMeta = {
-  steps: [
-    {
-      title: 'Personal Information',
-      formMeta: {
-        columns: 2,
-        fields: [
-          { key: 'name.first', label: 'First Name', initialValue: 'Nate', required: true },
-          { key: 'name.last', label: 'Last Name', initialValue: 'Wang', required: true },
-          { key: 'dob', label: 'Date of Birth', widget: 'date-picker', viewWidget: 'date-view' },
-          {
-            key: 'noAccountInfo',
-            label: 'No Account Info',
-            widget: 'switch',
-            // dynamic: true,
-            tooltip: 'Switch on to remove account step',
-          },
-        ],
+const getInitialMeta = () => {
+  const wizardMeta: WizardMeta = {
+    steps: [
+      {
+        title: 'Personal Information',
+        formMeta: {
+          columns: 2,
+          fields: [
+            { key: 'name.first', label: 'First Name', initialValue: 'Nate', required: true },
+            { key: 'name.last', label: 'Last Name', initialValue: 'Wang', required: true },
+            { key: 'dob', label: 'Date of Birth', widget: 'date-picker', viewWidget: 'date-view' },
+            {
+              key: 'noAccountInfo',
+              label: 'No Account Info',
+              widget: 'switch',
+              // dynamic: true,
+              tooltip: 'Switch on to remove account step',
+            },
+          ],
+        },
       },
-    },
-    {
-      title: 'Account Information',
-      formMeta: {
-        columns: 2,
-        fields: [
-          {
-            key: 'email',
-            label: 'Email',
-            clear: 'right',
-            rules: [{ type: 'email', message: 'Invalid email' }],
-          },
-          {
-            key: 'security',
-            label: 'Security Question',
-            widget: 'select',
-            placeholder: 'Select a question...',
-            options: ["What's your pet's name?", 'Your nick name?'],
-          },
-          { key: 'answer', label: 'Security Answer' },
-        ],
+      {
+        title: 'Account Information',
+        formMeta: {
+          columns: 2,
+          fields: [
+            {
+              key: 'email',
+              label: 'Email',
+              clear: 'right',
+              rules: [{ type: 'email', message: 'Invalid email' }],
+            },
+            {
+              key: 'security',
+              label: 'Security Question',
+              widget: 'select',
+              placeholder: 'Select a question...',
+              options: ["What's your pet's name?", 'Your nick name?'],
+            },
+            { key: 'answer', label: 'Security Answer' },
+          ],
+        },
       },
-    },
-    {
-      title: 'Contact Information',
-      formMeta: {
-        columns: 2,
-        fields: [
-          { key: 'address', label: 'Address', colSpan: 2 },
-          { key: 'city', label: 'City' },
-          { key: 'phone', label: 'phone' },
-        ],
+      {
+        title: 'Contact Information',
+        formMeta: {
+          columns: 2,
+          fields: [
+            { key: 'address', label: 'Address', colSpan: 2 },
+            { key: 'city', label: 'City' },
+            { key: 'phone', label: 'phone' },
+          ],
+        },
       },
-    },
-  ],
+    ],
+  };
+  return wizardMeta;
 };
 
-const getInitialMeta = () =>  ({...wizardMeta, steps: wizardMeta.steps.map((s: Step) => s)});
-
 export default () => {
   const [form] = Form.useForm();
   const updateOnChange = NiceForm.useUpdateOnChange('*');

diff --git a/packages/examples-formik/src/examples/Wizard.tsx b/packages/examples-formik/src/examples/Wizard.tsx
@@ -15,7 +15,7 @@ import {
 } from '@ebay/nice-form-react/adapters/formikMuiAdapter';
 const DateView = ({ value }: { value: Dayjs }) => (value ? value.format('MMM Do YYYY') : 'N/A');
 
-NiceForm.defineWidget('date-view', DateView, ({ field }) => field);
+NiceForm.defineWidget('date-view', DateView);
 
 interface StepItem {
   title: string;
@@ -37,70 +37,71 @@ interface FormValues {
   phone: string;
 }
 
-const wizardMeta = {
-  steps: [
-    {
-      title: 'Personal Information',
-      formMeta: {
-        columns: 2,
-        rowGap: 18,
-        columnGap: 18,
-        fields: [
-          { key: 'name.first', label: 'First Name', initialValue: 'Nate', required: true },
-          { key: 'name.last', label: 'Last Name', initialValue: 'Wang', required: true },
-          { key: 'dob', label: 'Date of Birth', widget: 'date-picker', viewWidget: 'date-view' },
-          {
-            key: 'noAccountInfo',
-            label: 'No Account Info',
-            widget: 'switch',
-            tooltip: 'Switch on to remove account step',
-          },
-        ],
+const getInitialMeta = () =>  {
+  const wizardMeta = {
+    steps: [
+      {
+        title: 'Personal Information',
+        formMeta: {
+          columns: 2,
+          rowGap: 18,
+          columnGap: 18,
+          fields: [
+            { key: 'name.first', label: 'First Name', initialValue: 'Nate', required: true },
+            { key: 'name.last', label: 'Last Name', initialValue: 'Wang', required: true },
+            { key: 'dob', label: 'Date of Birth', widget: 'date-picker', viewWidget: 'date-view' },
+            {
+              key: 'noAccountInfo',
+              label: 'No Account Info',
+              widget: 'switch',
+              tooltip: 'Switch on to remove account step',
+            },
+          ],
+        },
       },
-    },
-    {
-      title: 'Account Information',
-      formMeta: {
-        columns: 2,
-        rowGap: 18,
-        columnGap: 18,
-        fields: [
-          {
-            key: 'email',
-            label: 'Email',
-            clear: 'right',
-            rules: [{ type: 'email', message: 'Invalid email' }],
-          },
-          {
-            key: 'security',
-            label: 'Security Question',
-            widget: 'select',
-            fullWidth: true,
-            placeholder: 'Select a question...',
-            options: ["What's your pet's name?", 'Your nick name?'],
-          },
-          { key: 'answer', label: 'Security Answer' },
-        ],
+      {
+        title: 'Account Information',
+        formMeta: {
+          columns: 2,
+          rowGap: 18,
+          columnGap: 18,
+          fields: [
+            {
+              key: 'email',
+              label: 'Email',
+              clear: 'right',
+              rules: [{ type: 'email', message: 'Invalid email' }],
+            },
+            {
+              key: 'security',
+              label: 'Security Question',
+              widget: 'select',
+              fullWidth: true,
+              placeholder: 'Select a question...',
+              options: ["What's your pet's name?", 'Your nick name?'],
+            },
+            { key: 'answer', label: 'Security Answer' },
+          ],
+        },
       },
-    },
-    {
-      title: 'Contact Information',
-      formMeta: {
-        columns: 2,
-        rowGap: 18,
-        columnGap: 18,
-        fields: [
-          { key: 'address', label: 'Address', colSpan: 2 },
-          { key: 'city', label: 'City' },
-          { key: 'phone', label: 'phone' },
-        ],
+      {
+        title: 'Contact Information',
+        formMeta: {
+          columns: 2,
+          rowGap: 18,
+          columnGap: 18,
+          fields: [
+            { key: 'address', label: 'Address', colSpan: 2 },
+            { key: 'city', label: 'City' },
+            { key: 'phone', label: 'phone' },
+          ],
+        },
       },
-    },
-  ],
+    ] as StepItem[],
+  };
+  return wizardMeta;
 };
 
-const getInitialMeta = () =>  ({...wizardMeta, steps: wizardMeta.steps.map(((s: StepItem) => s),)});
-
 const Wizard = () => {
   const [currentStep, setCurrentStep] = useState(0);
   // Clone the meta for dynamic change

diff --git a/packages/nice-form-react/src/NiceForm.tsx b/packages/nice-form-react/src/NiceForm.tsx
@@ -141,7 +141,7 @@ NiceForm.addAdapter = (adapter: NiceFormAdapter) => {
 NiceForm.defineWidget = (
   name: string,
   widget: ReactComponent,
-  metaConverter: FieldMetaConverter,
+  metaConverter?: FieldMetaConverter,
 ) => {
   config.defineWidget(name, widget, metaConverter);
 };