@bigbinary/neeto-molecules 1.1.44 → 1.1.46

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigbinary/neeto-molecules",
-  "version": "1.1.44",
+  "version": "1.1.46",
   "description": "A package of reusable molecular components for neeto products.",
   "repository": "git@github.com:bigbinary/neeto-molecules.git",
   "author": "Amaljith K <amaljith.k@bigbinary.com>",

package/types/InlineInput.d.ts

@@ -1,4 +1,23 @@
 import React from "react";
+import { InputProps, ButtonProps } from "@bigbinary/neetoui";
+export interface InlineInput extends InputProps {
+  className?: string;
+  value?: string;
+  nullable?: boolean;
+  isSaving?: boolean;
+  saveOnBlur?: boolean;
+  clearOnSave?: boolean;
+  submitButtonProps?: ButtonProps;
+  cancelButtonProps?: ButtonProps;
+  handleSubmit: (value: string) => void;
+  handleCancel: (value: string) => void;
+}
+export interface FormikInlineInputProps extends InlineInputProps {
+  name: string;
+  handleSubmit?: (value: string) => void;
+  handleCancel?: (value: string) => void;
+}
+export
 /**
  *
  * An input field with built-in functionality for handling saving and cancelling
@@ -38,15 +57,29 @@ import React from "react";
  *   );
  * };
  * @endexample
+ * The InlineInput component wrapped in Formik.
+ *
+ * @example 
+ *
+ * import { FormikInlineInput } from "@bigbinary/neeto-molecules/InlineInput";
+ * import { Form } from "@bigbinary/neetoui/formik";
+ * 
+ * const App = () => (
+ *   return (
+ *     <Form
+ *       formikProps={{
+ *         initialValues: { taskName: "task" },
+ *         validationSchema: yup.object({ taskName: yup
+ *         .string()
+ *         .matches(/^[a-z]+$/, "All letters should be lowercase") }),
+ *         onSubmit: handleSubmit,
+ *       }}
+ *     >
+ *       <FormikInlineInput name="taskName" />
+ *     </Form>
+ *   );
+ * );
+ * @endexample
 */
-const InlineInput: React.FC<{
-  className?: string;
-  value?: string;
-  nullable?: boolean;
-  isSaving?: boolean;
-  saveOnBlur?: boolean;
-  clearOnSave?: boolean;
-  handleSubmit: (value: string) => void;
-  handleCancel: (value: string) => void;
-}>;
-export default InlineInput;
+const InlineInput: React.ForwardRefExoticComponent<InlineInputProps>;
+export const FormikInlineInput: React.ForwardRefExoticComponent<FormikInlineInputProps>;