@multiplatform.one/forms 6.0.0

package/dist/cjs/fields/Switch/Switch.spec.native.js

@@ -0,0 +1,187 @@
+"use strict";
+
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react_form = require("@tanstack/react-form");
+var import_react = require("@testing-library/react");
+var import_tamagui = require("tamagui");
+var import_vitest = require("vitest");
+var import_test_utils = require("@multiplatform.one/test-utils");
+var import_Button = require("../../Button/index.native.js");
+var import_Form = require("../../Form/index.native.js");
+var import_index = require("./index.native.js");
+(0, import_vitest.describe)("Switch", function () {
+  (0, import_vitest.describe)("without form context", function () {
+    (0, import_vitest.it)("should render with label and helper text correctly", function () {
+      var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+        label: "Enable notifications",
+        helperText: "Receive push notifications",
+        name: "notifications",
+        defaultValue: false
+      }));
+      var switchElement = result.getSwitch();
+      (0, import_vitest.expect)(switchElement === null || switchElement === void 0 ? void 0 : switchElement.getAttribute("aria-checked")).toBe("false");
+      (0, import_vitest.expect)(switchElement === null || switchElement === void 0 ? void 0 : switchElement.hasAttribute("disabled")).toBeFalsy();
+    });
+    (0, import_vitest.it)("should render required label with asterisk", function () {
+      var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+        label: "Required Switch",
+        name: "switch",
+        required: true
+      }));
+      var label = result.container.querySelector("label");
+      (0, import_vitest.expect)(label === null || label === void 0 ? void 0 : label.textContent).toContain("Required Switch");
+      (0, import_vitest.expect)(label === null || label === void 0 ? void 0 : label.textContent).toContain("*");
+    });
+    (0, import_vitest.it)("should handle custom id prop", function () {
+      var customId = "custom-switch-id";
+      var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+        id: customId,
+        label: "Test",
+        defaultValue: false
+      }));
+      var switchElement = result.getSwitch();
+      (0, import_vitest.expect)(switchElement === null || switchElement === void 0 ? void 0 : switchElement.id).toBe(customId);
+    });
+    (0, import_vitest.it)("should handle state transitions", async function () {
+      var onCheckedChange = import_vitest.vi.fn();
+      var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+        name: "switch",
+        defaultValue: false,
+        onCheckedChange
+      }));
+      var switchElement = result.getSwitch();
+      await (0, import_react.act)(async function () {
+        if (switchElement) import_react.fireEvent.click(switchElement);
+      });
+      (0, import_vitest.expect)(onCheckedChange).toHaveBeenCalledWith(true);
+      if (switchElement) import_react.fireEvent.click(switchElement);
+      (0, import_vitest.expect)(onCheckedChange).toHaveBeenCalledWith(false);
+    });
+  });
+  (0, import_vitest.describe)("with form context", function () {
+    var FormExample = function FormExample2(param) {
+      var {
+        defaultValue = false,
+        name = "switch",
+        onSubmit = async function (_value) {}
+      } = param;
+      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_Form.Form, {
+        formOptions: {
+          defaultValues: {
+            [name]: defaultValue
+          }
+        },
+        onSubmit: async function onSubmit1(value) {
+          await onSubmit(value);
+        },
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+          label: "Test Switch",
+          name
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
+          action: "submit",
+          children: "Submit"
+        })]
+      });
+    };
+    (0, import_vitest.it)("should render with form context and handle form submission", async function () {
+      var onSubmit = import_vitest.vi.fn();
+      var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(FormExample, {
+          onSubmit
+        })
+      }));
+      var switchElement = result.getSwitch();
+      var submitButton = result.getSubmitButton();
+      (0, import_vitest.expect)(switchElement === null || switchElement === void 0 ? void 0 : switchElement.getAttribute("aria-checked")).toBe("false");
+      await (0, import_react.act)(async function () {
+        if (submitButton) import_react.fireEvent.click(submitButton);
+      });
+      await (0, import_react.waitFor)(function () {
+        (0, import_vitest.expect)(onSubmit).toHaveBeenCalledWith({
+          switch: false
+        });
+      });
+      await (0, import_react.act)(async function () {
+        if (switchElement) import_react.fireEvent.click(switchElement);
+        if (submitButton) import_react.fireEvent.click(submitButton);
+      });
+      await (0, import_react.waitFor)(function () {
+        (0, import_vitest.expect)(onSubmit).toHaveBeenCalledWith({
+          switch: true
+        });
+      });
+    });
+    (0, import_vitest.it)("should handle disabled state in form context", async function () {
+      var onCheckedChange = import_vitest.vi.fn();
+      var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Form.Form, {
+        formOptions: {
+          defaultValues: {
+            switch: false
+          }
+        },
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+          label: "Test Switch",
+          name: "switch",
+          disabled: true,
+          onCheckedChange
+        })
+      }));
+      var switchElement = result.getSwitch();
+      await (0, import_react.act)(async function () {
+        if (switchElement) import_react.fireEvent.click(switchElement);
+      });
+      (0, import_vitest.expect)(onCheckedChange).not.toHaveBeenCalled();
+      (0, import_vitest.expect)(switchElement === null || switchElement === void 0 ? void 0 : switchElement.getAttribute("aria-checked")).toBe("false");
+      (0, import_vitest.expect)(switchElement === null || switchElement === void 0 ? void 0 : switchElement.getAttribute("aria-disabled")).toBe("true");
+    });
+  });
+  (0, import_vitest.describe)("with useForm hook directly", function () {
+    (0, import_vitest.it)("should handle form submission with useForm", async function () {
+      var onSubmitMock = import_vitest.vi.fn();
+      var TestComponent = function TestComponent2() {
+        var form = (0, import_react_form.useForm)({
+          defaultValues: {
+            notifications: false
+          },
+          onSubmit: async function onSubmit(param) {
+            var {
+              value
+            } = param;
+            onSubmitMock(value);
+          }
+        });
+        return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_Form.Form, {
+          form,
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+            label: "Enable Notifications",
+            name: "notifications"
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
+            action: "submit",
+            children: "Submit"
+          })]
+        });
+      };
+      var result = (0, import_test_utils.renderWithProviders)(/* @__PURE__ */(0, import_jsx_runtime.jsx)(TestComponent, {}));
+      var switchElement = result.getSwitch();
+      var submitButton = result.getSubmitButton();
+      await (0, import_react.act)(async function () {
+        if (submitButton) import_react.fireEvent.click(submitButton);
+      });
+      await (0, import_react.waitFor)(function () {
+        (0, import_vitest.expect)(onSubmitMock).toHaveBeenCalledWith({
+          notifications: false
+        });
+      });
+      await (0, import_react.act)(async function () {
+        if (switchElement) import_react.fireEvent.click(switchElement);
+        if (submitButton) import_react.fireEvent.click(submitButton);
+      });
+      await (0, import_react.waitFor)(function () {
+        (0, import_vitest.expect)(onSubmitMock).toHaveBeenCalledWith({
+          notifications: true
+        });
+      });
+    });
+  });
+});
+//# sourceMappingURL=Switch.spec.native.js.map

package/dist/cjs/fields/Switch/Switch.spec.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["import_jsx_runtime","require","import_react_form","import_react","import_tamagui","import_vitest","import_test_utils","import_Button","import_Form","import_index","describe","it","result","renderWithProviders","jsx","Switch","label","helperText","name","defaultValue","switchElement","getSwitch","expect","getAttribute","toBe","hasAttribute","toBeFalsy","required","container","querySelector","textContent","toContain","customId","id","onCheckedChange","vi","fn","act","fireEvent","click","toHaveBeenCalledWith","FormExample","FormExample2","param","onSubmit","_value","jsxs","Form","formOptions","defaultValues","onSubmit1","value","children","Button","action","YStack","submitButton","getSubmitButton","waitFor","switch","disabled","not","toHaveBeenCalled","onSubmitMock","TestComponent","TestComponent2","form","useForm","notifications"],"sources":["../../../../src/fields/Switch/Switch.spec.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/fields/Switch/Switch.stories.cjs

@@ -0,0 +1,259 @@
+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 Switch_stories_exports = {};
+__export(Switch_stories_exports, {
+  Basic: () => Basic,
+  Comparison: () => Comparison,
+  Disabled: () => Disabled,
+  Interactive: () => Interactive,
+  Main: () => Main,
+  Pointy: () => Pointy,
+  Sizes: () => Sizes,
+  Standalone: () => Standalone,
+  WithError: () => WithError,
+  default: () => Switch_stories_default
+});
+module.exports = __toCommonJS(Switch_stories_exports);
+var import_storybook = require("@multiplatform.one/storybook");
+var import_react_form = require("@tanstack/react-form");
+var import_react = require("react");
+var import_tamagui = require("tamagui");
+var import_Button = require("../../Button/index.cjs");
+var import_Form = require("../../Form/index.cjs");
+var import_index = require("./index.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+const meta = {
+  title: "Forms/Switch",
+  component: import_index.Switch,
+  parameters: {
+    status: {
+      type: "beta"
+    }
+  },
+  argTypes: {
+    label: {
+      control: "text"
+    },
+    helperText: {
+      control: "text"
+    },
+    error: {
+      control: "text"
+    },
+    required: {
+      control: "boolean"
+    },
+    disabled: {
+      control: "boolean"
+    },
+    size: {
+      control: "select",
+      options: ["$2", "$3", "$4"]
+    },
+    checked: {
+      control: "boolean"
+    }
+  }
+};
+var Switch_stories_default = meta;
+const Main = {
+  name: "Main",
+  render: () => {
+    const FormExample = () => {
+      const form = (0, import_react_form.useForm)({
+        defaultValues: {
+          notifications: true,
+          marketing: false,
+          analytics: true
+        },
+        onSubmit: async ({
+          value
+        }) => {
+          (0, import_storybook.action)("onSubmit")(value);
+        }
+      });
+      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Form.Form, {
+        form,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          gap: "$4",
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+            label: "Push Notifications",
+            name: "notifications",
+            helperText: "Receive notifications about updates"
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+            label: "Marketing Emails",
+            name: "marketing",
+            helperText: "Receive promotional emails"
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+            label: "Analytics Tracking",
+            name: "analytics",
+            helperText: "Help improve our service"
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Button.Button, {
+            action: "submit",
+            children: "Save Preferences"
+          })]
+        })
+      });
+    };
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(FormExample, {});
+  }
+};
+const Standalone = {
+  args: {
+    label: "Dark mode",
+    helperText: "Toggle dark mode",
+    disabled: false,
+    required: false,
+    size: "$3"
+  },
+  render: args => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+    ...args
+  })
+};
+const Basic = {
+  args: {
+    label: "Enable notifications",
+    helperText: "Receive push notifications",
+    defaultValue: false
+  }
+};
+const Disabled = {
+  args: {
+    label: "Disabled Field",
+    disabled: true
+  }
+};
+const WithError = {
+  args: {
+    label: "Field with Error",
+    error: "This field is required",
+    required: true
+  }
+};
+const Pointy = {
+  render: () => /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+    gap: "$4",
+    maxWidth: 400,
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+      label: "Pointy (hard angles)",
+      pointy: true,
+      defaultValue: true
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+      label: "Regular (default)",
+      pointy: false,
+      defaultValue: true
+    })]
+  })
+};
+const Sizes = {
+  render: () => /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+    gap: "$4",
+    maxWidth: 400,
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+      label: "Small",
+      size: "$2"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+      label: "Medium (default)",
+      size: "$3"
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+      label: "Large",
+      size: "$4"
+    })]
+  })
+};
+const Interactive = {
+  render: () => {
+    const InteractiveExample = () => {
+      const [checked, setChecked] = (0, import_react.useState)(false);
+      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+        gap: "$4",
+        maxWidth: 400,
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+          label: "Enable notifications",
+          checked,
+          onCheckedChange: val => {
+            setChecked(!!val);
+            (0, import_storybook.action)("onCheckedChange")(val);
+          }
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.Paragraph, {
+          size: "$2",
+          children: ["Current value: ", checked ? "ON" : "OFF"]
+        })]
+      });
+    };
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(InteractiveExample, {});
+  }
+};
+const Comparison = {
+  render: () => {
+    const ComparisonExample = () => {
+      const [customChecked, setCustomChecked] = (0, import_react.useState)(false);
+      const [tamaguiChecked, setTamaguiChecked] = (0, import_react.useState)(false);
+      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+        gap: "$6",
+        alignItems: "flex-start",
+        padding: "$4",
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          gap: "$3",
+          width: 250,
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
+            size: "$2",
+            color: "$placeholderColor",
+            children: "Custom Switch"
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_index.Switch, {
+            label: "Enable notifications",
+            defaultValue: customChecked,
+            onCheckedChange: val => {
+              setCustomChecked(!!val);
+              (0, import_storybook.action)("custom.onCheckedChange")(val);
+            }
+          })]
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          gap: "$3",
+          width: 250,
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
+            size: "$2",
+            color: "$placeholderColor",
+            children: "Tamagui Switch"
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+            gap: "$2",
+            alignItems: "center",
+            children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Switch, {
+              id: "tamagui-sw",
+              checked: tamaguiChecked,
+              onCheckedChange: val => {
+                setTamaguiChecked(val);
+                (0, import_storybook.action)("tamagui.onCheckedChange")(val);
+              },
+              children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Switch.Thumb, {})
+            }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Label, {
+              htmlFor: "tamagui-sw",
+              children: "Enable notifications"
+            })]
+          })]
+        })]
+      });
+    };
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(ComparisonExample, {});
+  }
+};