@trackunit/react-form-wizard 1.0.48 → 1.0.49

package/index.cjs.js

@@ -350,6 +350,18 @@ const cvaStepContainer = cssClassVarianceUtilities.cvaMerge(["h-full", "grid", "
 /**
  * The FormWizard component is used for forms in multiple steps.
  * Use the useFormWizard hook to generate the props for this component.
+ *
+ * The useFormWizard hook takes a form schema which is a zod schema that contains all the steps.
+ * Each step will get a prop that is the form for that step and can be used to register inputs.
+ * This allows for a coherent form structure that can be used to validate the form as steps and as a whole.
+ *
+ * The FormWizard component is a wrapper that renders the sidebar and the step wrapper.
+ * The sidebar is a list of steps that can be navigated to.
+ * The step wrapper is a list of steps that are rendered.
+ *
+ * The FormWizard component also handles the navigation between steps.
+ *
+ * ** In production code, the schema should be returned from a hook, to allow the use of translations for error messages in the schema. **
  */
 const FormWizard = ({ lastStepPrimaryActionLabel, isEdit, steps, fullFormSchema, onCancel, className, dataTestId, basePath, }) => {
     const navigate = reactRouter.useNavigate();

package/index.esm.js

@@ -348,6 +348,18 @@ const cvaStepContainer = cvaMerge(["h-full", "grid", "bg-white", "overflow-hidde
 /**
  * The FormWizard component is used for forms in multiple steps.
  * Use the useFormWizard hook to generate the props for this component.
+ *
+ * The useFormWizard hook takes a form schema which is a zod schema that contains all the steps.
+ * Each step will get a prop that is the form for that step and can be used to register inputs.
+ * This allows for a coherent form structure that can be used to validate the form as steps and as a whole.
+ *
+ * The FormWizard component is a wrapper that renders the sidebar and the step wrapper.
+ * The sidebar is a list of steps that can be navigated to.
+ * The step wrapper is a list of steps that are rendered.
+ *
+ * The FormWizard component also handles the navigation between steps.
+ *
+ * ** In production code, the schema should be returned from a hook, to allow the use of translations for error messages in the schema. **
  */
 const FormWizard = ({ lastStepPrimaryActionLabel, isEdit, steps, fullFormSchema, onCancel, className, dataTestId, basePath, }) => {
     const navigate = useNavigate();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-form-wizard",
-  "version": "1.0.48",
+  "version": "1.0.49",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "dependencies": {
@@ -9,10 +9,10 @@
     "@hookform/resolvers": "^3.3.4",
     "react-hook-form": "7.53.1",
     "@tanstack/react-router": "1.47.1",
-    "@trackunit/shared-utils": "1.2.21",
-    "@trackunit/css-class-variance-utilities": "1.0.24",
-    "@trackunit/react-components": "1.1.30",
-    "@trackunit/i18n-library-translation": "1.0.33"
+    "@trackunit/shared-utils": "1.2.22",
+    "@trackunit/css-class-variance-utilities": "1.0.25",
+    "@trackunit/react-components": "1.1.31",
+    "@trackunit/i18n-library-translation": "1.0.34"
   },
   "engines": {
     "node": ">=20.x",

package/src/FormWizard/FormWizard.d.ts

@@ -7,5 +7,17 @@ export type FormWizardStepFormReturnMap<TFullSchema extends AnyZodObject> = Part
 /**
  * The FormWizard component is used for forms in multiple steps.
  * Use the useFormWizard hook to generate the props for this component.
+ *
+ * The useFormWizard hook takes a form schema which is a zod schema that contains all the steps.
+ * Each step will get a prop that is the form for that step and can be used to register inputs.
+ * This allows for a coherent form structure that can be used to validate the form as steps and as a whole.
+ *
+ * The FormWizard component is a wrapper that renders the sidebar and the step wrapper.
+ * The sidebar is a list of steps that can be navigated to.
+ * The step wrapper is a list of steps that are rendered.
+ *
+ * The FormWizard component also handles the navigation between steps.
+ *
+ * ** In production code, the schema should be returned from a hook, to allow the use of translations for error messages in the schema. **
  */
 export declare const FormWizard: <TFullSchema extends AnyZodObject, TComponentStepDefinitions extends StepDefinitions<TFullSchema>>({ lastStepPrimaryActionLabel, isEdit, steps, fullFormSchema, onCancel, className, dataTestId, basePath, }: FromWizardComponentProps<TFullSchema, TComponentStepDefinitions>) => import("react/jsx-runtime").JSX.Element;

package/src/FormWizard/FormWizard.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from "@storybook/react";
+import { FormWizard } from "./FormWizard";
+type Story = StoryObj<typeof FormWizard>;
+declare const meta: Meta<typeof FormWizard>;
+export default meta;
+export declare const packageName: () => import("react/jsx-runtime").JSX.Element;
+export declare const Default: Story;