@multiplatform.one/forms 6.0.0

package/dist/esm/fields/PhoneInput/PhoneInput.spec.native.js

@@ -0,0 +1,365 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useForm } from "@tanstack/react-form";
+import { act, fireEvent, waitFor } from "@testing-library/react";
+import { YStack } from "tamagui";
+import { describe, expect, it, vi } from "vitest";
+import { renderWithProviders } from "@multiplatform.one/test-utils";
+import { Form } from "../../Form/index.native.js";
+import { Button } from "../../Button/index.native.js";
+import { PhoneInput } from "./index.native.js";
+describe("PhoneInput", function () {
+  describe("basic rendering", function () {
+    it("should render input field", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Phone",
+        name: "phone"
+      }));
+      var input = result.container.querySelector("input");
+      expect(input).toBeDefined();
+    });
+  });
+  describe("phone number formatting", function () {
+    it("should prevent invalid characters", async function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Valid Phone",
+        name: "valid"
+      }));
+      var input = result.container.querySelector("input");
+      if (input) {
+        await act(async function () {
+          fireEvent.change(input, {
+            target: {
+              value: "abc"
+            }
+          });
+        });
+        expect(input.value).not.toContain("a");
+        expect(input.value).not.toContain("b");
+        expect(input.value).not.toContain("c");
+      }
+    });
+  });
+  describe("country selection", function () {
+    it("should render default country dial code", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Country",
+        name: "country"
+      }));
+      var input = result.container.querySelector("input");
+      expect(input === null || input === void 0 ? void 0 : input.value).toContain("+1");
+    });
+  });
+  describe("value handling", function () {
+    it("should initialize from form default value", async function () {
+      var onSubmit = vi.fn();
+      var result = renderWithProviders(/* @__PURE__ */_jsxs(Form, {
+        formOptions: {
+          defaultValues: {
+            phone: "+447123456789"
+          }
+        },
+        onSubmit: async function onSubmit1(value) {
+          await onSubmit(value);
+        },
+        children: [/* @__PURE__ */_jsx(PhoneInput, {
+          label: "Phone Value",
+          name: "phone"
+        }), /* @__PURE__ */_jsx(Button, {
+          action: "submit",
+          children: "Submit"
+        })]
+      }));
+      var submitButton = result.getButton("Submit");
+      if (submitButton) {
+        await act(async function () {
+          fireEvent.click(submitButton);
+        });
+      }
+      await waitFor(function () {
+        expect(onSubmit).toHaveBeenCalledWith({
+          phone: "+447123456789"
+        });
+      });
+    });
+  });
+  describe("styling and theming", function () {
+    it("should render required label with asterisk", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Required Phone",
+        name: "required",
+        required: true
+      }));
+      var label = result.container.querySelector("label");
+      expect(label === null || label === void 0 ? void 0 : label.textContent).toContain("Required Phone");
+      expect(label === null || label === void 0 ? void 0 : label.textContent).toContain("*");
+    });
+  });
+  describe("form integration", function () {
+    describe("without form context", function () {
+      it("should render helper text", function () {
+        var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+          label: "Phone Input",
+          name: "phoneInput",
+          helperText: "Include country code"
+        }));
+        expect(result.findTextElement("Include country code")).toBeDefined();
+      });
+    });
+    describe("with form context", function () {
+      var FormExample = function FormExample2(param) {
+        var {
+          defaultValue = "",
+          name = "phone",
+          onSubmit = async function (_value) {}
+        } = param;
+        return /* @__PURE__ */_jsxs(Form, {
+          formOptions: {
+            defaultValues: {
+              [name]: defaultValue
+            }
+          },
+          onSubmit: async function onSubmit1(value) {
+            await onSubmit(value);
+          },
+          children: [/* @__PURE__ */_jsx(PhoneInput, {
+            label: "Phone Number",
+            name
+          }), /* @__PURE__ */_jsx(Button, {
+            action: "submit",
+            children: "Submit"
+          })]
+        });
+      };
+      it("should render with form context and handle form submission", async function () {
+        var onSubmit = vi.fn();
+        var result = renderWithProviders(/* @__PURE__ */_jsx(YStack, {
+          children: /* @__PURE__ */_jsx(FormExample, {
+            onSubmit
+          })
+        }));
+        var submitButton = result.getButton("Submit");
+        expect(submitButton).toBeDefined();
+        if (submitButton) {
+          await act(async function () {
+            fireEvent.click(submitButton);
+          });
+          await waitFor(function () {
+            expect(onSubmit).toHaveBeenCalledWith({
+              phone: ""
+            });
+          });
+        }
+      });
+      it("should handle form submission with phone value", async function () {
+        var onSubmit = vi.fn();
+        var result = renderWithProviders(/* @__PURE__ */_jsx(YStack, {
+          children: /* @__PURE__ */_jsx(FormExample, {
+            defaultValue: "+1234567890",
+            onSubmit
+          })
+        }));
+        var submitButton = result.getButton("Submit");
+        expect(submitButton).toBeDefined();
+        if (submitButton) {
+          await act(async function () {
+            fireEvent.click(submitButton);
+          });
+          await waitFor(function () {
+            expect(onSubmit).toHaveBeenCalledWith({
+              phone: "+1234567890"
+            });
+          });
+        }
+      });
+    });
+    describe("with useForm hook directly", function () {
+      it("should handle form submission with useForm", async function () {
+        var onSubmitMock = vi.fn();
+        var TestComponent = function TestComponent2() {
+          var form = useForm({
+            defaultValues: {
+              contactPhone: "+1987654321"
+            },
+            onSubmit: async function onSubmit(param) {
+              var {
+                value
+              } = param;
+              onSubmitMock(value);
+            }
+          });
+          return /* @__PURE__ */_jsxs(Form, {
+            form,
+            children: [/* @__PURE__ */_jsx(PhoneInput, {
+              label: "Contact Phone",
+              name: "contactPhone"
+            }), /* @__PURE__ */_jsx(Button, {
+              action: "submit",
+              children: "Save"
+            })]
+          });
+        };
+        var result = renderWithProviders(/* @__PURE__ */_jsx(TestComponent, {}));
+        var submitButton = result.getButton("Save");
+        expect(submitButton).toBeDefined();
+        if (submitButton) {
+          await act(async function () {
+            fireEvent.click(submitButton);
+          });
+          await waitFor(function () {
+            expect(onSubmitMock).toHaveBeenCalledWith({
+              contactPhone: "+1987654321"
+            });
+          });
+        }
+      });
+    });
+  });
+  describe("field integration", function () {
+    it("should handle field with errors", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Invalid Phone",
+        name: "invalid",
+        error: "Phone number format is invalid",
+        helperText: "This should be hidden"
+      }));
+      expect(result.findTextElement("Phone number format is invalid")).toBeDefined();
+      expect(result.findTextElement("This should be hidden")).toBeFalsy();
+    });
+  });
+  describe("validation", function () {
+    it("should render explicit error message", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Validation Phone",
+        name: "validation",
+        error: "Invalid phone number"
+      }));
+      expect(result.findTextElement("Invalid phone number")).toBeDefined();
+    });
+  });
+  describe("accessibility", function () {
+    it("should expose an interactive input element", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Accessible Phone",
+        name: "a11yPhone"
+      }));
+      var input = result.container.querySelector("input");
+      expect(input).toBeDefined();
+      expect(input === null || input === void 0 ? void 0 : input.getAttribute("aria-disabled")).not.toBe("true");
+    });
+  });
+  describe("edge cases", function () {
+    it("should handle empty value", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Empty Phone",
+        name: "empty"
+      }));
+      var input = result.container.querySelector("input");
+      expect(input === null || input === void 0 ? void 0 : input.value).toBeDefined();
+    });
+    it("should handle different input types", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Tel Input",
+        name: "tel"
+      }));
+      var input = result.container.querySelector("input");
+      expect(input === null || input === void 0 ? void 0 : input.type).toBeDefined();
+    });
+  });
+  describe("disabled state", function () {
+    it("should handle disabled state", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Disabled Phone",
+        name: "disabled",
+        disabled: true
+      }));
+      var input = result.container.querySelector("input");
+      var isDisabled = (input === null || input === void 0 ? void 0 : input.hasAttribute("disabled")) || (input === null || input === void 0 ? void 0 : input.getAttribute("aria-disabled")) === "true";
+      expect(isDisabled).toBeTruthy();
+    });
+    it("should prevent input changes when disabled", async function () {
+      var onChange = vi.fn();
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Disabled Changes",
+        name: "disabledChanges",
+        disabled: true
+      }));
+      var input = result.container.querySelector("input");
+      if (input) {
+        await act(async function () {
+          fireEvent.change(input, {
+            target: {
+              value: "123"
+            }
+          });
+        });
+        expect(onChange).not.toHaveBeenCalled();
+      }
+    });
+  });
+  describe("form validation", function () {
+    it("should show helper text when no error is set", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Form Valid Phone",
+        name: "validPhone",
+        helperText: "Use international format"
+      }));
+      expect(result.findTextElement("Use international format")).toBeDefined();
+    });
+  });
+  describe("performance", function () {
+    it("should handle rapid input changes", async function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx(PhoneInput, {
+        label: "Performance Phone",
+        name: "performance"
+      }));
+      var input = result.container.querySelector("input");
+      if (input) {
+        await act(async function () {
+          fireEvent.change(input, {
+            target: {
+              value: "1"
+            }
+          });
+        });
+        await act(async function () {
+          fireEvent.change(input, {
+            target: {
+              value: "12"
+            }
+          });
+        });
+        await act(async function () {
+          fireEvent.change(input, {
+            target: {
+              value: "123"
+            }
+          });
+        });
+        await act(async function () {
+          fireEvent.change(input, {
+            target: {
+              value: "1234"
+            }
+          });
+        });
+        expect(input.value).toBeTruthy();
+      }
+    });
+  });
+  describe("responsive behavior", function () {
+    it("should render in narrow container", function () {
+      var result = renderWithProviders(/* @__PURE__ */_jsx("div", {
+        style: {
+          width: 240
+        },
+        children: /* @__PURE__ */_jsx(PhoneInput, {
+          label: "Responsive Phone",
+          name: "responsivePhone"
+        })
+      }));
+      var input = result.container.querySelector("input");
+      expect(input).toBeDefined();
+    });
+  });
+});
+//# sourceMappingURL=PhoneInput.spec.native.js.map

package/dist/esm/fields/PhoneInput/PhoneInput.spec.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","useForm","act","fireEvent","waitFor","YStack","describe","expect","it","vi","renderWithProviders","Form","Button","PhoneInput","result","label","name","input","container","querySelector","toBeDefined","change","target","value","not","toContain","onSubmit","fn","formOptions","defaultValues","phone","onSubmit1","children","action","submitButton","getButton","click","toHaveBeenCalledWith","required","textContent","helperText","findTextElement","FormExample","FormExample2","param","defaultValue","_value","onSubmitMock","TestComponent","TestComponent2","form","contactPhone","error","toBeFalsy","getAttribute","toBe","type","disabled","isDisabled","hasAttribute","toBeTruthy","onChange"],"sources":["../../../../src/fields/PhoneInput/PhoneInput.spec.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/fields/PhoneInput/PhoneInput.stories.mjs

@@ -0,0 +1,196 @@
+import { useState } from "react";
+import { action } from "@multiplatform.one/storybook";
+import { useForm } from "@tanstack/react-form";
+import { Text, YStack } from "tamagui";
+import { Button } from "../../Button/index.mjs";
+import { Form } from "../../Form/index.mjs";
+import { PhoneInput } from "./index.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+const meta = {
+  title: "Forms/PhoneInput",
+  component: PhoneInput,
+  parameters: {
+    docs: {
+      description: {
+        component: "A phone number input component with country selection and international formatting."
+      }
+    }
+  },
+  argTypes: {
+    label: {
+      control: "text",
+      description: "Label for the phone input"
+    },
+    placeholder: {
+      control: "text",
+      description: "Placeholder text for the input"
+    },
+    helperText: {
+      control: "text",
+      description: "Helper text displayed below the phone input"
+    },
+    error: {
+      control: "text",
+      description: "Error message to display"
+    },
+    required: {
+      control: "boolean",
+      description: "Whether the phone input is required"
+    },
+    disabled: {
+      control: "boolean",
+      description: "Whether the phone input is disabled"
+    },
+    size: {
+      control: "select",
+      options: ["$2", "$3", "$4"],
+      description: "Size of the phone input"
+    },
+    defaultCountry: {
+      control: "text",
+      description: "Default country code (e.g., 'US', 'GB', 'CA')"
+    }
+  }
+};
+var PhoneInput_stories_default = meta;
+const Main = {
+  name: "Main",
+  render: () => {
+    const FormExample = () => {
+      const form = useForm({
+        defaultValues: {
+          primaryPhone: "",
+          secondaryPhone: ""
+        },
+        onSubmit: async ({
+          value
+        }) => {
+          action("onSubmit")(value);
+        }
+      });
+      return /* @__PURE__ */jsx(Form, {
+        form,
+        className: "max-w-md",
+        children: /* @__PURE__ */jsxs(YStack, {
+          gap: "$4",
+          children: [/* @__PURE__ */jsx(PhoneInput, {
+            label: "Primary Phone",
+            name: "primaryPhone",
+            helperText: "Your main contact number",
+            required: true
+          }), /* @__PURE__ */jsx(PhoneInput, {
+            label: "Secondary Phone",
+            name: "secondaryPhone",
+            helperText: "Alternative contact number (optional)"
+          }), /* @__PURE__ */jsx(Button, {
+            action: "submit",
+            children: "Save Contact Info"
+          })]
+        })
+      });
+    };
+    return /* @__PURE__ */jsx(FormExample, {});
+  }
+};
+const Standalone = {
+  args: {
+    label: "Phone Number",
+    placeholder: "Enter phone number",
+    helperText: "Include country code",
+    defaultCountry: "US"
+  },
+  render: args => /* @__PURE__ */jsx(PhoneInput, {
+    ...args
+  })
+};
+const Basic = {
+  args: {
+    label: "Phone Number",
+    helperText: "Enter your phone number",
+    name: "phone",
+    defaultCountry: "US"
+  }
+};
+const Disabled = {
+  args: {
+    label: "Disabled Phone",
+    disabled: true,
+    defaultCountry: "US"
+  }
+};
+const WithError = {
+  args: {
+    label: "Phone with Error",
+    error: "This field is required",
+    required: true,
+    defaultCountry: "US"
+  }
+};
+const Sizes = {
+  render: () => /* @__PURE__ */jsxs(YStack, {
+    gap: "$4",
+    maxWidth: 400,
+    children: [/* @__PURE__ */jsx(PhoneInput, {
+      label: "Small",
+      size: "$2",
+      defaultCountry: "US"
+    }), /* @__PURE__ */jsx(PhoneInput, {
+      label: "Medium (default)",
+      size: "$3",
+      defaultCountry: "US"
+    }), /* @__PURE__ */jsx(PhoneInput, {
+      label: "Large",
+      size: "$4",
+      defaultCountry: "US"
+    })]
+  })
+};
+const Interactive = {
+  render: () => {
+    const InteractiveExample = () => {
+      const [value, setValue] = useState("");
+      return /* @__PURE__ */jsxs(YStack, {
+        gap: "$4",
+        maxWidth: 400,
+        children: [/* @__PURE__ */jsx(PhoneInput, {
+          label: "Phone Number",
+          defaultCountry: "US",
+          value,
+          onChange: setValue
+        }), /* @__PURE__ */jsxs(Text, {
+          children: ["Current value: ", value || "Empty"]
+        })]
+      });
+    };
+    return /* @__PURE__ */jsx(InteractiveExample, {});
+  }
+};
+const DifferentCountries = {
+  render: () => /* @__PURE__ */jsxs(YStack, {
+    gap: "$4",
+    padding: "$4",
+    children: [/* @__PURE__ */jsx(PhoneInput, {
+      label: "US Phone Number",
+      name: "usPhone",
+      defaultCountry: "US",
+      helperText: "United States format"
+    }), /* @__PURE__ */jsx(PhoneInput, {
+      label: "UK Phone Number",
+      name: "ukPhone",
+      defaultCountry: "GB",
+      helperText: "United Kingdom format"
+    }), /* @__PURE__ */jsx(PhoneInput, {
+      label: "Canada Phone Number",
+      name: "caPhone",
+      defaultCountry: "CA",
+      helperText: "Canada format"
+    }), /* @__PURE__ */jsx(PhoneInput, {
+      label: "Germany Phone Number",
+      name: "dePhone",
+      defaultCountry: "DE",
+      helperText: "Germany format"
+    })]
+  })
+};
+export { Basic, DifferentCountries, Disabled, Interactive, Main, Sizes, Standalone, WithError, PhoneInput_stories_default as default };
+//# sourceMappingURL=PhoneInput.stories.mjs.map

package/dist/esm/fields/PhoneInput/PhoneInput.stories.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","action","useForm","Text","YStack","Button","Form","PhoneInput","jsx","jsxs","meta","title","component","parameters","docs","description","argTypes","label","control","placeholder","helperText","error","required","disabled","size","options","defaultCountry","PhoneInput_stories_default","Main","name","render","FormExample","form","defaultValues","primaryPhone","secondaryPhone","onSubmit","value","className","children","gap","Standalone","args","Basic","Disabled","WithError","Sizes","maxWidth","Interactive","InteractiveExample","setValue","onChange","DifferentCountries","padding"],"sources":["../../../../src/fields/PhoneInput/PhoneInput.stories.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}