@lets-events/react 12.1.4 → 12.1.5

package/.turbo/turbo-build.log

@@ -1,6 +1,6 @@
 
 
-> @lets-events/react@12.1.4 build
+> @lets-events/react@12.1.5 build
 > tsup src/index.tsx  --format esm,cjs --dts --external react
 
 CLI Building entry: src/index.tsx
@@ -10,14 +10,14 @@
 CLI Target: es6
 ESM Build start
 CJS Build start
-ESM dist/QuillComponent-A5KIFPCL.mjs 13.19 KB
+CJS dist/index.js 374.46 KB
+CJS ⚡️ Build success in 337ms
 ESM dist/chunk-TU7LKUXZ.mjs          61.98 KB
-ESM dist/index.mjs                   276.08 KB
-ESM ⚡️ Build success in 340ms
-CJS dist/index.js 373.37 KB
-CJS ⚡️ Build success in 340ms
+ESM dist/QuillComponent-A5KIFPCL.mjs 13.19 KB
+ESM dist/index.mjs                   277.01 KB
+ESM ⚡️ Build success in 339ms
 DTS Build start
-DTS ⚡️ Build success in 6489ms
-DTS dist/index.d.mts 379.15 KB
-DTS dist/index.d.ts  379.15 KB
+DTS ⚡️ Build success in 5967ms
+DTS dist/index.d.mts 379.43 KB
+DTS dist/index.d.ts  379.43 KB
 ⠙

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @lets-events/react
 
+## 12.1.5
+
+### Patch Changes
+
+- SwitchFormField
+
 ## 12.1.4
 
 ### Patch Changes

package/dist/index.d.mts

@@ -14319,6 +14319,14 @@ type SelectFormFieldProps = {
 };
 declare const SelectFormField: ({ name, label, required, placeholder, options, validation, validationErrorMessage, defaultValue, }: SelectFormFieldProps) => react_jsx_runtime.JSX.Element;
 
+type SwitchFormFieldProps = {
+    name: string;
+    label: string;
+    defaultValue?: boolean;
+    watch?: boolean;
+};
+declare const SwitchFormField: ({ name, label, defaultValue, watch, }: SwitchFormFieldProps) => react_jsx_runtime.JSX.Element;
+
 type EmailFormFieldProps = {
     name: string;
     label?: string;
@@ -14435,4 +14443,4 @@ declare const useImageUpload: (options: UseImageUploadOptions) => {
     reset: () => void;
 };
 
-export { AddressFormFields, Alert, AlertDialogCompleteStyled, AlertDialogDescriptionStyled, AlertDialogRowStyled, AlertDialogSimpleStyled, AlertDialogSubtitleStyled, AlertDialogTitleStyled, AlertDialoghrStyled, type AlertProps, Avatar, type AvatarProps, AvatarStyled, Badge, type BadgeProps, BadgeStyled, BirthDateFormField, Box, Button, ButtonGroup, type ButtonGroupProps, ButtonGroupStyled, ButtonItem, type ButtonItemProps, ButtonItemStyled, type ButtonProps, CNPJFormField, CPFFormField, Calendar, CalendarFormField, type CalendarFormFieldProps, type CalendarProps, Card, type CardProps, CardStyled, CheckboxGroup, CheckboxGroupFormField, type CheckboxGroupFormFieldProps, type CheckboxGroupProps, CheckboxGroupStyled, CheckboxItem, type CheckboxItemProps, Container, type ContainerProps, ContainerStyled, CountryFormField, Drawer, type DrawerProps, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, EmailFormField, type EmailFormFieldProps, ErrorFormMessage, type ErrorFormMessageProps, Filter, FilterItem, type FilterItemProps, type FilterProps, Flex, type FlexProps, FlexStyled, Form, FormLabel, type FormLabelProps, type FormProps, Grid, type GridProps, GridStyled, Icon, IdentityDocumentNumberFormField, InputStyled, MenuDropdown, type MenuDropdownProps, Modal, type ModalProps, MultiSelect, MultiSelectFormField, type MultiSelectFormFieldProps, type MultiSelectProps, PhoneFormField, type PhoneFormFieldProps, RadioGroup, RadioGroupFormField, type RadioGroupFormFieldProps, type RadioGroupProps, RadioGroupStyled, RadioItem, type RadioItemProps, RichEditor, RichEditorFormField, type RichEditorFormFieldProps, type RichEditorProps, Section, type SectionProps, SectionStyled, SelectFormField, type SelectFormFieldProps, Step, StepContent, StepList, type StepProps, StepStyled, StepTrigger, StepWrapper, Switch, type SwitchProps, SwitchStyled, Text, TextAreaFormField, type TextAreaFormFieldProps, TextField, type TextFieldProps, TextFieldSlot, type TextFieldSlotProps, TextFieldSlotStyled, TextFieldStyled, TextFormField, type TextFormFieldProps, type TextProps, TextStyle, TextareaField, type TextareaFieldProps, TextareaFieldStyle, TimePicker, TimePickerButtonStyled, TimePickerDropdownStyled, TimePickerFooterStyled, TimePickerFormField, type TimePickerFormFieldProps, type TimePickerProps, TimePickerStyled, TimerPickerContentStyled, type Toast, type ToastComponentProps, type ToastConfig, type ToastContextType, ToastItem, type ToastOptions, ToastProvider, type ToastProviderProps, type ToastType, type ToasterShowOptions, Tooltip, TooltipContent, type TooltipProps, TooltipProvider, TooltipRoot, TooltipTrigger, type UploadConfig, UploadService, isValidCNPJ, maskFormat, maskUnformat, useImageUpload, useToast };
+export { AddressFormFields, Alert, AlertDialogCompleteStyled, AlertDialogDescriptionStyled, AlertDialogRowStyled, AlertDialogSimpleStyled, AlertDialogSubtitleStyled, AlertDialogTitleStyled, AlertDialoghrStyled, type AlertProps, Avatar, type AvatarProps, AvatarStyled, Badge, type BadgeProps, BadgeStyled, BirthDateFormField, Box, Button, ButtonGroup, type ButtonGroupProps, ButtonGroupStyled, ButtonItem, type ButtonItemProps, ButtonItemStyled, type ButtonProps, CNPJFormField, CPFFormField, Calendar, CalendarFormField, type CalendarFormFieldProps, type CalendarProps, Card, type CardProps, CardStyled, CheckboxGroup, CheckboxGroupFormField, type CheckboxGroupFormFieldProps, type CheckboxGroupProps, CheckboxGroupStyled, CheckboxItem, type CheckboxItemProps, Container, type ContainerProps, ContainerStyled, CountryFormField, Drawer, type DrawerProps, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, EmailFormField, type EmailFormFieldProps, ErrorFormMessage, type ErrorFormMessageProps, Filter, FilterItem, type FilterItemProps, type FilterProps, Flex, type FlexProps, FlexStyled, Form, FormLabel, type FormLabelProps, type FormProps, Grid, type GridProps, GridStyled, Icon, IdentityDocumentNumberFormField, InputStyled, MenuDropdown, type MenuDropdownProps, Modal, type ModalProps, MultiSelect, MultiSelectFormField, type MultiSelectFormFieldProps, type MultiSelectProps, PhoneFormField, type PhoneFormFieldProps, RadioGroup, RadioGroupFormField, type RadioGroupFormFieldProps, type RadioGroupProps, RadioGroupStyled, RadioItem, type RadioItemProps, RichEditor, RichEditorFormField, type RichEditorFormFieldProps, type RichEditorProps, Section, type SectionProps, SectionStyled, SelectFormField, type SelectFormFieldProps, Step, StepContent, StepList, type StepProps, StepStyled, StepTrigger, StepWrapper, Switch, SwitchFormField, type SwitchFormFieldProps, type SwitchProps, SwitchStyled, Text, TextAreaFormField, type TextAreaFormFieldProps, TextField, type TextFieldProps, TextFieldSlot, type TextFieldSlotProps, TextFieldSlotStyled, TextFieldStyled, TextFormField, type TextFormFieldProps, type TextProps, TextStyle, TextareaField, type TextareaFieldProps, TextareaFieldStyle, TimePicker, TimePickerButtonStyled, TimePickerDropdownStyled, TimePickerFooterStyled, TimePickerFormField, type TimePickerFormFieldProps, type TimePickerProps, TimePickerStyled, TimerPickerContentStyled, type Toast, type ToastComponentProps, type ToastConfig, type ToastContextType, ToastItem, type ToastOptions, ToastProvider, type ToastProviderProps, type ToastType, type ToasterShowOptions, Tooltip, TooltipContent, type TooltipProps, TooltipProvider, TooltipRoot, TooltipTrigger, type UploadConfig, UploadService, isValidCNPJ, maskFormat, maskUnformat, useImageUpload, useToast };

package/dist/index.d.ts

@@ -14319,6 +14319,14 @@ type SelectFormFieldProps = {
 };
 declare const SelectFormField: ({ name, label, required, placeholder, options, validation, validationErrorMessage, defaultValue, }: SelectFormFieldProps) => react_jsx_runtime.JSX.Element;
 
+type SwitchFormFieldProps = {
+    name: string;
+    label: string;
+    defaultValue?: boolean;
+    watch?: boolean;
+};
+declare const SwitchFormField: ({ name, label, defaultValue, watch, }: SwitchFormFieldProps) => react_jsx_runtime.JSX.Element;
+
 type EmailFormFieldProps = {
     name: string;
     label?: string;
@@ -14435,4 +14443,4 @@ declare const useImageUpload: (options: UseImageUploadOptions) => {
     reset: () => void;
 };
 
-export { AddressFormFields, Alert, AlertDialogCompleteStyled, AlertDialogDescriptionStyled, AlertDialogRowStyled, AlertDialogSimpleStyled, AlertDialogSubtitleStyled, AlertDialogTitleStyled, AlertDialoghrStyled, type AlertProps, Avatar, type AvatarProps, AvatarStyled, Badge, type BadgeProps, BadgeStyled, BirthDateFormField, Box, Button, ButtonGroup, type ButtonGroupProps, ButtonGroupStyled, ButtonItem, type ButtonItemProps, ButtonItemStyled, type ButtonProps, CNPJFormField, CPFFormField, Calendar, CalendarFormField, type CalendarFormFieldProps, type CalendarProps, Card, type CardProps, CardStyled, CheckboxGroup, CheckboxGroupFormField, type CheckboxGroupFormFieldProps, type CheckboxGroupProps, CheckboxGroupStyled, CheckboxItem, type CheckboxItemProps, Container, type ContainerProps, ContainerStyled, CountryFormField, Drawer, type DrawerProps, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, EmailFormField, type EmailFormFieldProps, ErrorFormMessage, type ErrorFormMessageProps, Filter, FilterItem, type FilterItemProps, type FilterProps, Flex, type FlexProps, FlexStyled, Form, FormLabel, type FormLabelProps, type FormProps, Grid, type GridProps, GridStyled, Icon, IdentityDocumentNumberFormField, InputStyled, MenuDropdown, type MenuDropdownProps, Modal, type ModalProps, MultiSelect, MultiSelectFormField, type MultiSelectFormFieldProps, type MultiSelectProps, PhoneFormField, type PhoneFormFieldProps, RadioGroup, RadioGroupFormField, type RadioGroupFormFieldProps, type RadioGroupProps, RadioGroupStyled, RadioItem, type RadioItemProps, RichEditor, RichEditorFormField, type RichEditorFormFieldProps, type RichEditorProps, Section, type SectionProps, SectionStyled, SelectFormField, type SelectFormFieldProps, Step, StepContent, StepList, type StepProps, StepStyled, StepTrigger, StepWrapper, Switch, type SwitchProps, SwitchStyled, Text, TextAreaFormField, type TextAreaFormFieldProps, TextField, type TextFieldProps, TextFieldSlot, type TextFieldSlotProps, TextFieldSlotStyled, TextFieldStyled, TextFormField, type TextFormFieldProps, type TextProps, TextStyle, TextareaField, type TextareaFieldProps, TextareaFieldStyle, TimePicker, TimePickerButtonStyled, TimePickerDropdownStyled, TimePickerFooterStyled, TimePickerFormField, type TimePickerFormFieldProps, type TimePickerProps, TimePickerStyled, TimerPickerContentStyled, type Toast, type ToastComponentProps, type ToastConfig, type ToastContextType, ToastItem, type ToastOptions, ToastProvider, type ToastProviderProps, type ToastType, type ToasterShowOptions, Tooltip, TooltipContent, type TooltipProps, TooltipProvider, TooltipRoot, TooltipTrigger, type UploadConfig, UploadService, isValidCNPJ, maskFormat, maskUnformat, useImageUpload, useToast };
+export { AddressFormFields, Alert, AlertDialogCompleteStyled, AlertDialogDescriptionStyled, AlertDialogRowStyled, AlertDialogSimpleStyled, AlertDialogSubtitleStyled, AlertDialogTitleStyled, AlertDialoghrStyled, type AlertProps, Avatar, type AvatarProps, AvatarStyled, Badge, type BadgeProps, BadgeStyled, BirthDateFormField, Box, Button, ButtonGroup, type ButtonGroupProps, ButtonGroupStyled, ButtonItem, type ButtonItemProps, ButtonItemStyled, type ButtonProps, CNPJFormField, CPFFormField, Calendar, CalendarFormField, type CalendarFormFieldProps, type CalendarProps, Card, type CardProps, CardStyled, CheckboxGroup, CheckboxGroupFormField, type CheckboxGroupFormFieldProps, type CheckboxGroupProps, CheckboxGroupStyled, CheckboxItem, type CheckboxItemProps, Container, type ContainerProps, ContainerStyled, CountryFormField, Drawer, type DrawerProps, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, EmailFormField, type EmailFormFieldProps, ErrorFormMessage, type ErrorFormMessageProps, Filter, FilterItem, type FilterItemProps, type FilterProps, Flex, type FlexProps, FlexStyled, Form, FormLabel, type FormLabelProps, type FormProps, Grid, type GridProps, GridStyled, Icon, IdentityDocumentNumberFormField, InputStyled, MenuDropdown, type MenuDropdownProps, Modal, type ModalProps, MultiSelect, MultiSelectFormField, type MultiSelectFormFieldProps, type MultiSelectProps, PhoneFormField, type PhoneFormFieldProps, RadioGroup, RadioGroupFormField, type RadioGroupFormFieldProps, type RadioGroupProps, RadioGroupStyled, RadioItem, type RadioItemProps, RichEditor, RichEditorFormField, type RichEditorFormFieldProps, type RichEditorProps, Section, type SectionProps, SectionStyled, SelectFormField, type SelectFormFieldProps, Step, StepContent, StepList, type StepProps, StepStyled, StepTrigger, StepWrapper, Switch, SwitchFormField, type SwitchFormFieldProps, type SwitchProps, SwitchStyled, Text, TextAreaFormField, type TextAreaFormFieldProps, TextField, type TextFieldProps, TextFieldSlot, type TextFieldSlotProps, TextFieldSlotStyled, TextFieldStyled, TextFormField, type TextFormFieldProps, type TextProps, TextStyle, TextareaField, type TextareaFieldProps, TextareaFieldStyle, TimePicker, TimePickerButtonStyled, TimePickerDropdownStyled, TimePickerFooterStyled, TimePickerFormField, type TimePickerFormFieldProps, type TimePickerProps, TimePickerStyled, TimerPickerContentStyled, type Toast, type ToastComponentProps, type ToastConfig, type ToastContextType, ToastItem, type ToastOptions, ToastProvider, type ToastProviderProps, type ToastType, type ToasterShowOptions, Tooltip, TooltipContent, type TooltipProps, TooltipProvider, TooltipRoot, TooltipTrigger, type UploadConfig, UploadService, isValidCNPJ, maskFormat, maskUnformat, useImageUpload, useToast };

package/dist/index.js

@@ -2034,7 +2034,7 @@ var QuillComponent_exports = {};
 __export(QuillComponent_exports, {
   default: () => QuillComponent_default
 });
-var import_react20, import_react_quilljs, import_quill_snow, import_jsx_runtime50, QuillComponent, QuillComponent_default;
+var import_react20, import_react_quilljs, import_quill_snow, import_jsx_runtime51, QuillComponent, QuillComponent_default;
 var init_QuillComponent = __esm({
   "src/components/RichEditor/QuillComponent.tsx"() {
     "use strict";
@@ -2046,7 +2046,7 @@ var init_QuillComponent = __esm({
     init_useToast();
     init_uploadService();
     init_styledComponents();
-    import_jsx_runtime50 = require("react/jsx-runtime");
+    import_jsx_runtime51 = require("react/jsx-runtime");
     QuillComponent = ({
       value = "",
       onChange,
@@ -2265,9 +2265,9 @@ var init_QuillComponent = __esm({
         document.addEventListener("mousedown", handleClickOutside);
         return () => document.removeEventListener("mousedown", handleClickOutside);
       }, [showVideoModal, showLinkModal, handleVideoCancel, handleLinkCancel]);
-      return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(QuillContainer, { className, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(QuillEditor, { style: { position: "relative" }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { ref: quillRef }),
-        showVideoModal && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(QuillContainer, { className, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(QuillEditor, { style: { position: "relative" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { ref: quillRef }),
+        showVideoModal && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
           "div",
           {
             ref: videoModalRef,
@@ -2284,15 +2284,15 @@ var init_QuillComponent = __esm({
               zIndex: 1e3,
               width: "fit-content"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Flex2, { gap: 8, align: "center", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(Flex2, { gap: 8, align: "center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 Text,
                 {
                   style: { fontSize: "14px", fontWeight: "500", color: "#333" },
                   children: "V\xEDdeo:"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 "input",
                 {
                   type: "text",
@@ -2316,7 +2316,7 @@ var init_QuillComponent = __esm({
                   autoFocus: true
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 "button",
                 {
                   onClick: handleVideoSubmit,
@@ -2337,7 +2337,7 @@ var init_QuillComponent = __esm({
             ] })
           }
         ),
-        showLinkModal && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+        showLinkModal && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
           "div",
           {
             ref: linkModalRef,
@@ -2354,15 +2354,15 @@ var init_QuillComponent = __esm({
               zIndex: 1e3,
               width: "fit-content"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Flex2, { gap: 8, align: "center", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(Flex2, { gap: 8, align: "center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 Text,
                 {
                   style: { fontSize: "14px", fontWeight: "500", color: "#333" },
                   children: "Link:"
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 "input",
                 {
                   type: "text",
@@ -2387,7 +2387,7 @@ var init_QuillComponent = __esm({
                   autoFocus: true
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
                 "button",
                 {
                   onClick: handleLinkSubmit,
@@ -2487,6 +2487,7 @@ __export(index_exports, {
   StepTrigger: () => StepTrigger,
   StepWrapper: () => StepWrapper,
   Switch: () => Switch,
+  SwitchFormField: () => SwitchFormField,
   SwitchStyled: () => SwitchStyled,
   Text: () => Text,
   TextAreaFormField: () => TextAreaFormField,
@@ -11662,15 +11663,53 @@ var CheckboxGroupFormField = ({
   ] });
 };
 
-// src/components/FormFields/EmailFormField.tsx
+// src/components/FormFields/SwitchFormField.tsx
+var import_react_hook_form11 = require("react-hook-form");
+init_Flex();
+init_Text();
 var import_jsx_runtime49 = require("react/jsx-runtime");
+var SwitchFormField = ({
+  name,
+  label,
+  defaultValue = false,
+  watch = false
+}) => {
+  const {
+    control,
+    watch: watchForm
+  } = (0, import_react_hook_form11.useFormContext)();
+  if (watch) {
+    watchForm(name);
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(Flex2, { justify: "between", style: { margin: "1rem 0" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Text, { typography: "labelMedium", fontWeight: "regular", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      import_react_hook_form11.Controller,
+      {
+        control,
+        name,
+        defaultValue,
+        render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+          Switch,
+          {
+            checked: field.value,
+            onCheckedChange: field.onChange
+          }
+        )
+      }
+    )
+  ] });
+};
+
+// src/components/FormFields/EmailFormField.tsx
+var import_jsx_runtime50 = require("react/jsx-runtime");
 var EmailFormField = ({
   name,
   label,
   required,
   placeholder
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
     TextFormField,
     {
       name,
@@ -11684,12 +11723,12 @@ var EmailFormField = ({
 };
 
 // src/components/FormFields/RichEditorFormField.tsx
-var import_react_hook_form11 = require("react-hook-form");
+var import_react_hook_form12 = require("react-hook-form");
 init_Flex();
 
 // src/components/RichEditor/RichEditor.tsx
 var import_react21 = require("react");
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var QuillComponent2 = (0, import_react21.lazy)(() => Promise.resolve().then(() => (init_QuillComponent(), QuillComponent_exports)));
 var RichEditor = (props) => {
   const [isClient, setIsClient] = (0, import_react21.useState)(false);
@@ -11697,12 +11736,12 @@ var RichEditor = (props) => {
     setIsClient(typeof window !== "undefined");
   }, []);
   if (!isClient) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ToastProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_react21.Suspense, { fallback: null, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(QuillComponent2, __spreadValues({}, props)) }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(ToastProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_react21.Suspense, { fallback: null, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(QuillComponent2, __spreadValues({}, props)) }) }) });
 };
 var RichEditor_default = RichEditor;
 
 // src/components/FormFields/RichEditorFormField.tsx
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime53 = require("react/jsx-runtime");
 var RichEditorFormField = (_a) => {
   var _b = _a, {
     name,
@@ -11717,7 +11756,7 @@ var RichEditorFormField = (_a) => {
     "validate",
     "validationErrorMessage"
   ]);
-  const { field, fieldState } = (0, import_react_hook_form11.useController)({
+  const { field, fieldState } = (0, import_react_hook_form12.useController)({
     name,
     rules: {
       required: required ? validationErrorMessage : false,
@@ -11733,8 +11772,8 @@ var RichEditorFormField = (_a) => {
   const fieldError = fieldState.error;
   const haveError = !!fieldError;
   const errorMsg = fieldError == null ? void 0 : fieldError.message;
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Flex2, { direction: "column", children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Flex2, { direction: "column", children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       FormLabel,
       {
         name,
@@ -11743,7 +11782,7 @@ var RichEditorFormField = (_a) => {
         haveError
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
       RichEditor_default,
       __spreadProps(__spreadValues({}, props), {
         value: field.value,
@@ -11751,15 +11790,15 @@ var RichEditorFormField = (_a) => {
         "aria-labelledby": `${name}-label`
       })
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(ErrorFormMessage, { message: errorMsg })
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ErrorFormMessage, { message: errorMsg })
   ] });
 };
 
 // src/components/FormFields/CalendarFormField.tsx
-var import_react_hook_form12 = require("react-hook-form");
+var import_react_hook_form13 = require("react-hook-form");
 init_Flex();
 var import_react22 = require("react");
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var CalendarFormField = (_a) => {
   var _b = _a, {
     name,
@@ -11791,7 +11830,7 @@ var CalendarFormField = (_a) => {
     },
     [validate, required, validationErrorMessage]
   );
-  const { field, fieldState } = (0, import_react_hook_form12.useController)({
+  const { field, fieldState } = (0, import_react_hook_form13.useController)({
     name,
     rules: __spreadValues({
       required: required ? validationErrorMessage : false,
@@ -11806,8 +11845,8 @@ var CalendarFormField = (_a) => {
   const handleCalendarChange = (date) => {
     setSelected(date);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Flex2, { direction: "column", style: { flex: "1" }, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Flex2, { direction: "column", style: { flex: "1" }, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       FormLabel,
       {
         name,
@@ -11816,7 +11855,7 @@ var CalendarFormField = (_a) => {
         haveError
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
       Calendar,
       __spreadValues({
         selected,
@@ -11828,15 +11867,15 @@ var CalendarFormField = (_a) => {
         allowPastDates
       }, calendarProps)
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ErrorFormMessage, { message: errorMsg })
+    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ErrorFormMessage, { message: errorMsg })
   ] });
 };
 
 // src/components/FormFields/TimePickerFormField.tsx
-var import_react_hook_form13 = require("react-hook-form");
+var import_react_hook_form14 = require("react-hook-form");
 init_Flex();
 var import_react23 = require("react");
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 var TimePickerFormField = (_a) => {
   var _b = _a, {
     name,
@@ -11864,7 +11903,7 @@ var TimePickerFormField = (_a) => {
     },
     [validate, required, validationErrorMessage]
   );
-  const { field, fieldState } = (0, import_react_hook_form13.useController)({
+  const { field, fieldState } = (0, import_react_hook_form14.useController)({
     name,
     rules: __spreadValues({
       required: required ? validationErrorMessage : false,
@@ -11879,8 +11918,8 @@ var TimePickerFormField = (_a) => {
   const handleTimePickerChange = (time) => {
     setSelected(time);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(Flex2, { direction: "column", style: { flex: "1" }, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(Flex2, { direction: "column", style: { flex: "1" }, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
       FormLabel,
       {
         name,
@@ -11889,7 +11928,7 @@ var TimePickerFormField = (_a) => {
         haveError
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
       TimePicker,
       __spreadValues({
         selected,
@@ -11900,7 +11939,7 @@ var TimePickerFormField = (_a) => {
         hasError: haveError
       }, timePickerProps)
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(ErrorFormMessage, { message: errorMsg })
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ErrorFormMessage, { message: errorMsg })
   ] });
 };
 
@@ -12079,6 +12118,7 @@ init_uploadService();
   StepTrigger,
   StepWrapper,
   Switch,
+  SwitchFormField,
   SwitchStyled,
   Text,
   TextAreaFormField,

package/dist/index.mjs

@@ -9094,15 +9094,51 @@ var CheckboxGroupFormField = ({
   ] });
 };
 
+// src/components/FormFields/SwitchFormField.tsx
+import { useFormContext as useFormContext10, Controller as Controller5 } from "react-hook-form";
+import { jsx as jsx44, jsxs as jsxs23 } from "react/jsx-runtime";
+var SwitchFormField = ({
+  name,
+  label,
+  defaultValue = false,
+  watch = false
+}) => {
+  const {
+    control,
+    watch: watchForm
+  } = useFormContext10();
+  if (watch) {
+    watchForm(name);
+  }
+  return /* @__PURE__ */ jsxs23(Flex, { justify: "between", style: { margin: "1rem 0" }, children: [
+    /* @__PURE__ */ jsx44(Text, { typography: "labelMedium", fontWeight: "regular", children: label }),
+    /* @__PURE__ */ jsx44(
+      Controller5,
+      {
+        control,
+        name,
+        defaultValue,
+        render: ({ field }) => /* @__PURE__ */ jsx44(
+          Switch,
+          {
+            checked: field.value,
+            onCheckedChange: field.onChange
+          }
+        )
+      }
+    )
+  ] });
+};
+
 // src/components/FormFields/EmailFormField.tsx
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { jsx as jsx45 } from "react/jsx-runtime";
 var EmailFormField = ({
   name,
   label,
   required,
   placeholder
 }) => {
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx45(
     TextFormField,
     {
       name,
@@ -9120,7 +9156,7 @@ import { useController as useController3 } from "react-hook-form";
 
 // src/components/RichEditor/RichEditor.tsx
 import { lazy, useEffect as useEffect6, useState as useState7, Suspense } from "react";
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx46 } from "react/jsx-runtime";
 var QuillComponent = lazy(() => import("./QuillComponent-A5KIFPCL.mjs"));
 var RichEditor = (props) => {
   const [isClient, setIsClient] = useState7(false);
@@ -9128,12 +9164,12 @@ var RichEditor = (props) => {
     setIsClient(typeof window !== "undefined");
   }, []);
   if (!isClient) return null;
-  return /* @__PURE__ */ jsx45("div", { children: /* @__PURE__ */ jsx45(ToastProvider, { children: /* @__PURE__ */ jsx45(Suspense, { fallback: null, children: /* @__PURE__ */ jsx45(QuillComponent, __spreadValues({}, props)) }) }) });
+  return /* @__PURE__ */ jsx46("div", { children: /* @__PURE__ */ jsx46(ToastProvider, { children: /* @__PURE__ */ jsx46(Suspense, { fallback: null, children: /* @__PURE__ */ jsx46(QuillComponent, __spreadValues({}, props)) }) }) });
 };
 var RichEditor_default = RichEditor;
 
 // src/components/FormFields/RichEditorFormField.tsx
-import { jsx as jsx46, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs24 } from "react/jsx-runtime";
 var RichEditorFormField = (_a) => {
   var _b = _a, {
     name,
@@ -9164,8 +9200,8 @@ var RichEditorFormField = (_a) => {
   const fieldError = fieldState.error;
   const haveError = !!fieldError;
   const errorMsg = fieldError == null ? void 0 : fieldError.message;
-  return /* @__PURE__ */ jsxs23(Flex, { direction: "column", children: [
-    label && /* @__PURE__ */ jsx46(
+  return /* @__PURE__ */ jsxs24(Flex, { direction: "column", children: [
+    label && /* @__PURE__ */ jsx47(
       FormLabel,
       {
         name,
@@ -9174,7 +9210,7 @@ var RichEditorFormField = (_a) => {
         haveError
       }
     ),
-    /* @__PURE__ */ jsx46(
+    /* @__PURE__ */ jsx47(
       RichEditor_default,
       __spreadProps(__spreadValues({}, props), {
         value: field.value,
@@ -9182,14 +9218,14 @@ var RichEditorFormField = (_a) => {
         "aria-labelledby": `${name}-label`
       })
     ),
-    /* @__PURE__ */ jsx46(ErrorFormMessage, { message: errorMsg })
+    /* @__PURE__ */ jsx47(ErrorFormMessage, { message: errorMsg })
   ] });
 };
 
 // src/components/FormFields/CalendarFormField.tsx
 import { useController as useController4 } from "react-hook-form";
 import { useCallback as useCallback4 } from "react";
-import { jsx as jsx47, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs25 } from "react/jsx-runtime";
 var CalendarFormField = (_a) => {
   var _b = _a, {
     name,
@@ -9236,8 +9272,8 @@ var CalendarFormField = (_a) => {
   const handleCalendarChange = (date) => {
     setSelected(date);
   };
-  return /* @__PURE__ */ jsxs24(Flex, { direction: "column", style: { flex: "1" }, children: [
-    label && /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsxs25(Flex, { direction: "column", style: { flex: "1" }, children: [
+    label && /* @__PURE__ */ jsx48(
       FormLabel,
       {
         name,
@@ -9246,7 +9282,7 @@ var CalendarFormField = (_a) => {
         haveError
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx48(
       Calendar,
       __spreadValues({
         selected,
@@ -9258,14 +9294,14 @@ var CalendarFormField = (_a) => {
         allowPastDates
       }, calendarProps)
     ),
-    /* @__PURE__ */ jsx47(ErrorFormMessage, { message: errorMsg })
+    /* @__PURE__ */ jsx48(ErrorFormMessage, { message: errorMsg })
   ] });
 };
 
 // src/components/FormFields/TimePickerFormField.tsx
 import { useController as useController5 } from "react-hook-form";
 import { useCallback as useCallback5 } from "react";
-import { jsx as jsx48, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs26 } from "react/jsx-runtime";
 var TimePickerFormField = (_a) => {
   var _b = _a, {
     name,
@@ -9308,8 +9344,8 @@ var TimePickerFormField = (_a) => {
   const handleTimePickerChange = (time) => {
     setSelected(time);
   };
-  return /* @__PURE__ */ jsxs25(Flex, { direction: "column", style: { flex: "1" }, children: [
-    label && /* @__PURE__ */ jsx48(
+  return /* @__PURE__ */ jsxs26(Flex, { direction: "column", style: { flex: "1" }, children: [
+    label && /* @__PURE__ */ jsx49(
       FormLabel,
       {
         name,
@@ -9318,7 +9354,7 @@ var TimePickerFormField = (_a) => {
         haveError
       }
     ),
-    /* @__PURE__ */ jsx48(
+    /* @__PURE__ */ jsx49(
       TimePicker,
       __spreadValues({
         selected,
@@ -9329,7 +9365,7 @@ var TimePickerFormField = (_a) => {
         hasError: haveError
       }, timePickerProps)
     ),
-    /* @__PURE__ */ jsx48(ErrorFormMessage, { message: errorMsg })
+    /* @__PURE__ */ jsx49(ErrorFormMessage, { message: errorMsg })
   ] });
 };
 
@@ -9503,6 +9539,7 @@ export {
   StepTrigger,
   StepWrapper,
   Switch,
+  SwitchFormField,
   SwitchStyled,
   Text,
   TextAreaFormField,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lets-events/react",
-  "version": "12.1.4",
+  "version": "12.1.5",
   "description": "",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/components/FormFields/SwitchFormField.tsx

@@ -0,0 +1,46 @@
+import { useFormContext, Controller } from "react-hook-form";
+import { Flex } from "../Flex";
+import { Switch } from "../Switch";
+import { Text } from "../Text";
+
+
+export type SwitchFormFieldProps = {
+    name: string;
+    label: string;
+    defaultValue?: boolean;
+    watch?: boolean;
+};
+
+export const SwitchFormField = ({
+    name,
+    label,
+    defaultValue = false,
+    watch = false,
+}: SwitchFormFieldProps) => {
+    const {
+        control,
+        watch: watchForm,
+    } = useFormContext();
+
+    if (watch) {
+        watchForm(name);
+    }
+    return (
+        <Flex justify="between" style={{ margin: '1rem 0' }}>
+            <Text typography="labelMedium" fontWeight="regular">
+                {label}
+            </Text>
+            <Controller
+                control={control}
+                name={name}
+                defaultValue={defaultValue}
+                render={({ field }) => (
+                    <Switch
+                        checked={field.value}
+                        onCheckedChange={field.onChange}
+                    />
+                )}
+            />
+        </Flex>
+    );
+};

package/src/index.tsx

@@ -52,6 +52,7 @@ export * from "./components/FormFields/RadioGroupFormField";
 export * from "./components/FormFields/CheckboxGroupFormField";
 export * from "./components/FormFields/AddressFormFields/CountryFormField";
 export * from "./components/FormFields/SelectFormField";
+export * from "./components/FormFields/SwitchFormField";
 export * from "./components/FormFields/EmailFormField";
 export * from "./components/FormFields/RichEditorFormField";
 export * from "./components/FormFields/CalendarFormField";