@multiplatform.one/forms 6.0.0

package/dist/cjs/fields/Signature/Signature.stories.native.js

@@ -0,0 +1,281 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var Signature_stories_exports = {};
+__export(Signature_stories_exports, {
+  Basic: () => Basic,
+  CustomSize: () => CustomSize,
+  Disabled: () => Disabled,
+  Interactive: () => Interactive,
+  Main: () => Main,
+  Sizes: () => Sizes,
+  Standalone: () => Standalone,
+  WithError: () => WithError,
+  default: () => Signature_stories_default
+});
+module.exports = __toCommonJS(Signature_stories_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_storybook = require("@multiplatform.one/storybook");
+var import_react = require("@phosphor-icons/react");
+var import_react_form = require("@tanstack/react-form");
+var import_react2 = require("react");
+var import_tamagui = require("tamagui");
+var import_Button = require("../../Button/index.native.js");
+var import_Form = require("../../Form/index.native.js");
+var import_index = require("./index.native.js");
+var meta = {
+  title: "Forms/Signature",
+  component: import_index.Signature,
+  parameters: {
+    docs: {
+      description: {
+        component: "A signature pad field that captures handwritten signatures as base64 data URLs."
+      }
+    }
+  },
+  argTypes: {
+    label: {
+      control: "text"
+    },
+    helperText: {
+      control: "text"
+    },
+    error: {
+      control: "text"
+    },
+    required: {
+      control: "boolean"
+    },
+    disabled: {
+      control: "boolean"
+    },
+    size: {
+      control: "select",
+      options: ["$2", "$3", "$4"]
+    },
+    penColor: {
+      control: "text",
+      description: "Pen color"
+    },
+    width: {
+      control: "number",
+      description: "Canvas width in pixels"
+    },
+    height: {
+      control: "number",
+      description: "Canvas height in pixels"
+    },
+    backgroundColor: {
+      control: "color",
+      description: "Canvas background"
+    }
+  }
+};
+var Signature_stories_default = meta;
+var Main = {
+  name: "Main",
+  render: function render() {
+    var FormExample = function FormExample2() {
+      var form = (0, import_react_form.useForm)({
+        defaultValues: {
+          signature: ""
+        },
+        onSubmit: async function onSubmit(param) {
+          var {
+            value
+          } = param;
+          (0, import_storybook.action)("onSubmit")(value);
+        }
+      });
+      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Form.Form, {
+        form,
+        maxWidth: 520,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          gap: "$4",
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+            label: "Your Signature",
+            name: "signature",
+            helperText: "Required for submission",
+            required: true,
+            clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+              size: 16
+            })
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
+            action: "submit",
+            children: "Submit"
+          })]
+        })
+      });
+    };
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(FormExample, {});
+  }
+};
+var Standalone = {
+  args: {
+    label: "Signature",
+    helperText: "Sign here"
+  },
+  render: function render2(args) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+      ...args,
+      clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+        size: 16
+      })
+    });
+  }
+};
+var Basic = {
+  args: {
+    label: "Signature",
+    helperText: "Draw your signature above",
+    onChange: (0, import_storybook.action)("onChange")
+  },
+  render: function render3(args) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+      ...args,
+      clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+        size: 16
+      })
+    });
+  }
+};
+var Disabled = {
+  args: {
+    label: "Signature",
+    helperText: "This field is disabled",
+    disabled: true,
+    onChange: (0, import_storybook.action)("onChange")
+  },
+  render: function render4(args) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+      ...args,
+      clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+        size: 16
+      })
+    });
+  }
+};
+var WithError = {
+  args: {
+    label: "Signature",
+    helperText: "Draw your signature above",
+    required: true,
+    error: "Signature is required",
+    onChange: (0, import_storybook.action)("onChange")
+  },
+  render: function render5(args) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+      ...args,
+      clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+        size: 16
+      })
+    });
+  }
+};
+var Sizes = {
+  render: function render6() {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+      gap: "$4",
+      maxWidth: 520,
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+        fontWeight: "bold",
+        children: "Size $2"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+        label: "Small",
+        size: "$2",
+        clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+          size: 16
+        }),
+        onChange: (0, import_storybook.action)("onChange")
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+        fontWeight: "bold",
+        children: "Size $3"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+        label: "Medium",
+        size: "$3",
+        clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+          size: 16
+        }),
+        onChange: (0, import_storybook.action)("onChange")
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+        fontWeight: "bold",
+        children: "Size $4"
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+        label: "Large",
+        size: "$4",
+        clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+          size: 16
+        }),
+        onChange: (0, import_storybook.action)("onChange")
+      })]
+    });
+  }
+};
+var Interactive = {
+  render: function render7() {
+    var InteractiveExample = function InteractiveExample2() {
+      var [value, setValue] = (0, import_react2.useState)("");
+      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+        gap: "$4",
+        maxWidth: 520,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+          label: "Sign Here",
+          helperText: value ? "Signature captured" : "Please sign above",
+          value,
+          onChange: function onChange(v) {
+            setValue(v);
+            (0, import_storybook.action)("onChange")(v ? "[base64 data]" : "");
+          },
+          clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+            size: 16
+          })
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+          label: "Disabled Signature",
+          disabled: true,
+          clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+            size: 16
+          })
+        })]
+      });
+    };
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(InteractiveExample, {});
+  }
+};
+var CustomSize = {
+  args: {
+    label: "Large Signature",
+    width: 600,
+    height: 300,
+    onChange: (0, import_storybook.action)("onChange")
+  },
+  render: function render8(args) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Signature, {
+      ...args,
+      clearIcon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EraserIcon, {
+        size: 16
+      })
+    });
+  }
+};
+//# sourceMappingURL=Signature.stories.native.js.map

package/dist/cjs/fields/Signature/Signature.stories.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","Signature_stories_exports","__export","Basic","CustomSize","Disabled","Interactive","Main","Sizes","Standalone","WithError","default","Signature_stories_default","module","exports","import_jsx_runtime","require","import_storybook","import_react","import_react_form","import_react2","import_tamagui","import_Button","import_Form","import_index","meta","title","component","Signature","parameters","docs","description","argTypes","label","control","helperText","error","required","disabled","size","options","penColor","width","height","backgroundColor","name","render","FormExample","FormExample2","form","useForm","defaultValues","signature","onSubmit","param","action","jsx","Form","maxWidth","children","jsxs","YStack","gap","clearIcon","EraserIcon","Button","args","render2","onChange","render3","render4","render5"],"sources":["../../../../src/fields/Signature/Signature.stories.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}