aport-tools 4.5.0 → 4.6.0

package/dist/index.esm.js

@@ -1,1493 +0,0 @@
-/*! aport-tools v4.5.0 | ISC */
-import React, { useContext, useState, createContext, useRef, useEffect, useMemo, useCallback } from 'react';
-import { StyleSheet, Text as Text$1, Animated, View, TouchableOpacity, Image, TextInput, Modal, Pressable, FlatList, Keyboard, Platform, Alert, ActivityIndicator } from 'react-native';
-import { ThemeContext } from 'aport-themes';
-import * as ImagePicker from 'expo-image-picker';
-
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
-
-
-var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-
-function __rest(s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-}
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-function __generator(thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-}
-
-function __spreadArray(to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-}
-
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-    var e = new Error(message);
-    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
-
-// src/fonts/Text.tsx
-/**
- * A dynamic Text component that supports HTML-like formatting.
- * Integrates with the Theme system for consistent styling.
- *
- * @param children - The content to be displayed inside the Text component.
- * @param size - Size of the text. Defaults to 'medium'.
- * @param b - If true, applies bold styling.
- * @param i - If true, applies italic styling.
- * @param type - Type of Text component. Defaults to 'text'.
- * @param typeFont - Type of Font component. Defaults to 'body'.
- * @param u - If true, applies underline styling.
- * @param align - Paragraph alignment. Defaults to 'left'.
- * @param h - Header level. Accepts 0 (none), 1, 2, or 3. Defaults to 0.
- * @param style - Additional styles to apply.
- */
-var Text = function Text(_a) {
-  var _b;
-  var children = _a.children,
-    _c = _a.size,
-    size = _c === void 0 ? 14 : _c,
-    _d = _a.b,
-    b = _d === void 0 ? false : _d,
-    _e = _a.i,
-    i = _e === void 0 ? false : _e,
-    _f = _a.u,
-    u = _f === void 0 ? false : _f,
-    _g = _a.align,
-    align = _g === void 0 ? 'left' : _g,
-    _h = _a.type,
-    type = _h === void 0 ? 'text' : _h,
-    _j = _a.typeFont,
-    typeFont = _j === void 0 ? 'body' : _j,
-    _k = _a.h,
-    h = _k === void 0 ? 0 : _k,
-    style = _a.style;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors,
-    fonts = theme.fonts;
-  // Determine font family and size based on 'typeFont'
-  var fontSettings = fonts[typeFont] || fonts.body;
-  var fontFamily = fontSettings.fontFamily;
-  var fontSize = fontSettings.fontSize || size;
-  // Calculate header size based on 'h' prop
-  if (h === 1) fontSize = 32;else if (h === 2) fontSize = 24;else if (h === 3) fontSize = 18;
-  // Define font weight based on bold prop
-  var fontWeight = b ? '700' : fontSettings.fontWeight || '400';
-  // Define font style based on italic prop
-  var fontStyle = i ? 'italic' : 'normal';
-  // Define text decoration based on underline prop
-  var textDecorationLine = u ? 'underline' : 'none';
-  // Define text alignment
-  var textAlign = align;
-  // Map the 'type' prop to the correct color from the theme
-  var textColor = ((_b = colors[type]) === null || _b === void 0 ? void 0 : _b.hex) || colors.text.hex;
-  // Combine all styles
-  var textStyles = {
-    fontSize: fontSize,
-    fontWeight: fontWeight,
-    fontFamily: fontFamily,
-    fontStyle: fontStyle,
-    textDecorationLine: textDecorationLine,
-    textAlign: textAlign,
-    color: textColor
-  };
-  return /*#__PURE__*/React.createElement(Text$1, {
-    style: [textStyles, style]
-  }, children);
-};
-StyleSheet.create({
-  // Define any default styles if needed
-});
-
-var Stepper = function Stepper(_a) {
-  var steps = _a.steps,
-    currentStep = _a.currentStep,
-    _b = _a.presseable,
-    presseable = _b === void 0 ? false : _b,
-    onPress = _a.onPress,
-    _c = _a.stepStyle,
-    stepStyle = _c === void 0 ? "circular" : _c,
-    totalSteps = _a.totalSteps,
-    _d = _a.stepType,
-    stepType = _d === void 0 ? "number" : _d,
-    icon = _a.icon;
-  var progressAnim = React.useRef(new Animated.Value(0)).current;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  var _e = useFormContext(),
-    formValues = _e.formValues,
-    handleFormSubmit = _e.handleFormSubmit;
-  var _f = useState(false),
-    errorBack = _f[0],
-    seterrorBack = _f[1];
-  var handleStepPress = function handleStepPress(stepIndex) {
-    return __awaiter(void 0, void 0, void 0, function () {
-      var targetStep, errors;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            if (!presseable || stepIndex === currentStep) return [2 /*return*/];
-            targetStep = stepIndex > currentStep ? currentStep + 1 : currentStep - 1;
-            if (!(targetStep > currentStep)) return [3 /*break*/, 2];
-            return [4 /*yield*/, handleFormSubmit(formValues)];
-          case 1:
-            errors = _a.sent();
-            if (Object.keys(errors).length > 0) {
-              console.log("Validation failed at step ".concat(currentStep, ". Cannot proceed to step ").concat(targetStep, "."));
-              seterrorBack(true);
-              return [2 /*return*/]; // Stop if current step has errors
-            }
-            _a.label = 2;
-          case 2:
-            // Update step
-            seterrorBack(false);
-            onPress === null || onPress === void 0 ? void 0 : onPress(targetStep);
-            return [2 /*return*/];
-        }
-      });
-    });
-  };
-  React.useEffect(function () {
-    Animated.timing(progressAnim, {
-      toValue: currentStep,
-      duration: 500,
-      useNativeDriver: false
-    }).start();
-  }, [currentStep]);
-  React.useEffect(function () {
-    if (stepType === "icon") {
-      if (!icon) {
-        console.error("Stepper: `icon` is required when stepType is 'icon'.");
-      } else if (Array.isArray(icon) && icon.length !== totalSteps) {
-        console.error("Stepper: Number of icons (".concat(icon.length, ") must match totalSteps (").concat(totalSteps, ")."));
-      }
-    }
-  }, [stepType, icon, totalSteps]);
-  var getSeparatorWidth = function getSeparatorWidth(index) {
-    if (currentStep > index && currentStep < index + 1) {
-      // Return the fractional percentage for odd steps
-      return "".concat(((currentStep - index) * 100).toFixed(0), "%");
-    }
-    return currentStep > index ? "100%" : "0%";
-  };
-  var renderStepContent = function renderStepContent(index) {
-    switch (stepType) {
-      case "icon":
-        if (Array.isArray(icon)) {
-          var stepIcon = icon[index];
-          if (typeof stepIcon === "string") {
-            return /*#__PURE__*/React.createElement(Image, {
-              source: {
-                uri: stepIcon
-              },
-              style: {
-                width: 24,
-                height: 24
-              },
-              resizeMode: "contain"
-            });
-          } else {
-            console.error("Invalid icon value for step ".concat(index, ". Expected a string URI."));
-            return null;
-          }
-        }
-        if (typeof icon === "string") {
-          return /*#__PURE__*/React.createElement(Image, {
-            source: {
-              uri: icon
-            },
-            style: {
-              width: 24,
-              height: 24
-            },
-            resizeMode: "contain"
-          });
-        }
-        console.error("Icon prop must be a string or an array of strings.");
-        return null;
-      case "empty":
-        return null;
-      case "number":
-      default:
-        return /*#__PURE__*/React.createElement(Text, {
-          b: true,
-          typeFont: "primary",
-          style: [currentStep >= index ? {
-            color: colors.textButton.hex
-          } : {
-            color: colors.text.hex
-          }]
-        }, index + 1);
-    }
-  };
-  return /*#__PURE__*/React.createElement(View, {
-    style: styles$9.container
-  }, Array.from({
-    length: totalSteps
-  }, function (_, index) {
-    return /*#__PURE__*/React.createElement(React.Fragment, {
-      key: index
-    }, /*#__PURE__*/React.createElement(TouchableOpacity, {
-      style: [styles$9.stepContainer, presseable && {
-        cursor: "pointer"
-      }],
-      disabled: !presseable,
-      onPress: function onPress() {
-        return handleStepPress(index);
-      }
-    }, /*#__PURE__*/React.createElement(View, {
-      style: [styles$9.step, stepStyle === "square" && styles$9.squareStep, {
-        backgroundColor: currentStep >= index ? !errorBack ? colors.primary.hex : colors.error.hex : colors.body.hex
-      }]
-    }, renderStepContent(index)), steps && /*#__PURE__*/React.createElement(Text, {
-      style: styles$9.stepText
-    }, steps[index])), index < totalSteps - 1 && (/*#__PURE__*/React.createElement(View, {
-      style: styles$9.separatorContainer
-    }, /*#__PURE__*/React.createElement(View, {
-      style: styles$9.separatorBackground
-    }), /*#__PURE__*/React.createElement(Animated.View, {
-      style: [styles$9.separatorProgress, {
-        width: getSeparatorWidth(index),
-        backgroundColor: colors.primary.hex
-      }]
-    }))));
-  }));
-};
-var styles$9 = StyleSheet.create({
-  container: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    marginBottom: 16
-  },
-  stepContainer: {
-    alignItems: "center",
-    flex: 1
-  },
-  step: {
-    width: 30,
-    height: 30,
-    borderRadius: 15,
-    // Default to circular
-    alignItems: "center",
-    justifyContent: "center",
-    marginBottom: 4
-  },
-  squareStep: {
-    borderRadius: 5 // Square shape
-  },
-  stepLabel: {
-    color: "#ffffff",
-    fontWeight: "bold"
-  },
-  stepText: {
-    fontSize: 12,
-    textAlign: "center",
-    marginTop: 4
-  },
-  separatorContainer: {
-    flex: 1,
-    height: 4,
-    marginHorizontal: 8,
-    position: "relative"
-  },
-  separatorBackground: {
-    position: "absolute",
-    width: "100%",
-    height: "100%",
-    backgroundColor: "#aaaaaa",
-    borderRadius: 2
-  },
-  separatorProgress: {
-    position: "absolute",
-    height: "100%",
-    borderRadius: 2
-  }
-});
-
-// src/forms/FormContext.tsx
-// Utility to use `setFormValue` globally
-var setFormValueGlobal = function setFormValueGlobal(name, value, firstValue) {
-  {
-    console.warn("setFormValueGlobal was called before the Form was rendered.");
-  }
-};
-var FormContext = /*#__PURE__*/createContext(undefined);
-var useFormContext = function useFormContext() {
-  var context = useContext(FormContext);
-  if (!context) {
-    throw new Error("useFormContext must be used within a Form");
-  }
-  return context;
-};
-var Form = function Form(_a) {
-  var children = _a.children,
-    onSubmit = _a.onSubmit,
-    stepper = _a.stepper;
-  var _b = useState({}),
-    formValues = _b[0],
-    setFormValues = _b[1];
-  var _c = useState({}),
-    errors = _c[0],
-    setErrors = _c[1];
-  var _d = useState({}),
-    firstValues = _d[0],
-    setFirstValues = _d[1]; // Track firstValues
-  var setFormValue = function setFormValue(name, value, firstValue) {
-    // Update formValues with the latest value
-    setFormValues(function (prev) {
-      var _a;
-      return __assign(__assign({}, prev), (_a = {}, _a[name] = value, _a));
-    });
-    // If firstValue exists and is not empty, set it in firstValues
-    if (firstValue !== undefined && firstValue !== null && firstValue !== "") {
-      setFirstValues(function (prev) {
-        var _a;
-        return __assign(__assign({}, prev), (_a = {}, _a[name] = firstValue, _a));
-      });
-    }
-  };
-  var handleSubmit = function handleSubmit() {
-    return __awaiter(void 0, void 0, void 0, function () {
-      var modifiedValues, validationErrors;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            modifiedValues = Object.keys(formValues).reduce(function (result, key) {
-              var hasFirstValue = key in firstValues;
-              var isModified = hasFirstValue && formValues[key] !== firstValues[key];
-              var isNewValue = !hasFirstValue;
-              // If the field was modified or is a new value, include it in the modified values
-              if (isModified || isNewValue) {
-                result[key] = formValues[key];
-              } else {
-                // If there were no changes, use the firstValue
-                if (hasFirstValue && firstValues[key] !== undefined) {
-                  result[key] = firstValues[key];
-                }
-              }
-              return result;
-            }, {});
-            return [4 /*yield*/, onSubmit(modifiedValues)];
-          case 1:
-            validationErrors = _a.sent();
-            // Set the validation errors in state
-            setErrors(validationErrors);
-            // Prevent submission if there are any errors
-            if (Object.keys(validationErrors).length > 0) {
-              return [2 /*return*/]; // Prevent submission
-            }
-            return [2 /*return*/];
-        }
-      });
-    });
-  };
-  var handleFormSubmit = function handleFormSubmit(formValues) {
-    return __awaiter(void 0, void 0, void 0, function () {
-      var validationErrors;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            return [4 /*yield*/, onSubmit(formValues)];
-          case 1:
-            validationErrors = _a.sent();
-            setErrors(validationErrors);
-            return [2 /*return*/, validationErrors];
-        }
-      });
-    });
-  };
-  return /*#__PURE__*/React.createElement(FormContext.Provider, {
-    value: {
-      formValues: formValues,
-      setFormValue: setFormValue,
-      errors: errors,
-      setErrors: setErrors,
-      handleSubmit: handleSubmit,
-      handleFormSubmit: handleFormSubmit
-    }
-  }, stepper && (/*#__PURE__*/React.createElement(Stepper, {
-    steps: stepper.steps,
-    currentStep: stepper.currentStep,
-    presseable: stepper.presseable,
-    onPress: stepper.onPress,
-    totalSteps: stepper.totalSteps,
-    stepType: stepper.stepType,
-    icon: stepper.icon,
-    stepStyle: stepper.stepStyle
-  })), children);
-};
-
-// src/forms/ErrorList.tsx
-var ErrorList = function ErrorList(_a) {
-  var errors = _a.errors;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  return /*#__PURE__*/React.createElement(View, {
-    style: styles$8.container
-  }, errors.map(function (error, index) {
-    return /*#__PURE__*/React.createElement(View, {
-      key: index,
-      style: styles$8.errorItem
-    }, /*#__PURE__*/React.createElement(Text, {
-      style: [styles$8.bullet, {
-        color: colors.error.hex
-      }]
-    }, "\u2022"), /*#__PURE__*/React.createElement(Text, {
-      style: [styles$8.errorText, {
-        color: colors.error.hex
-      }]
-    }, error));
-  }));
-};
-var styles$8 = StyleSheet.create({
-  container: {
-    marginTop: 4
-  },
-  errorItem: {
-    flexDirection: 'row',
-    alignItems: 'flex-start',
-    marginBottom: 2
-  },
-  bullet: {
-    marginRight: 4,
-    fontSize: 12
-  },
-  errorText: {
-    flex: 1,
-    fontSize: 12
-  }
-});
-
-// src/forms/Input.tsx
-/**
- * Input component that supports labels, error messages, and integrates with the Theme system.
- *
- * @param {InputProps} props - Props passed to the component.
- * @returns {JSX.Element} The rendered Input component.
- *
- * @example
- * <Input
- *   name="email"
- *   label="Email"
- *   keyboardType="email-address"
- *   inputType="id"
- * />
- */
-var Input = function Input(_a) {
-  var name = _a.name,
-    label = _a.label,
-    inputType = _a.inputType,
-    firstValue = _a.firstValue,
-    _b = _a.editable,
-    editable = _b === void 0 ? true : _b,
-    style = _a.style,
-    rest = __rest(_a, ["name", "label", "inputType", "firstValue", "editable", "style"]);
-  var _c = useFormContext(),
-    formValues = _c.formValues,
-    setFormValue = _c.setFormValue,
-    formErrors = _c.errors;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  var _d = useState(""),
-    internalValue = _d[0],
-    setInternalValue = _d[1];
-  var isFirstRender = useRef(true); // Track the first render
-  // Initialize the internal value when `firstValue` changes or on first render
-  useEffect(function () {
-    if (isFirstRender.current) {
-      isFirstRender.current = false;
-      if (firstValue !== undefined) {
-        firstValue = firstValue.toString();
-        setInternalValue(firstValue);
-        setFormValue(name, firstValue, firstValue); // Pass firstValue here
-      } else {
-        setInternalValue(formValues[name] || "");
-      }
-    }
-  }, [firstValue]);
-  /**
-   * Handles text changes in the input field, applying formatting based on the inputType.
-   *
-   * @param {string} text - The current text input by the user.
-   */
-  var handleChange = function handleChange(text) {
-    var formattedText = text;
-    // Apply different formatting based on inputType
-    switch (inputType) {
-      case "phone":
-        // Remove all non-digit characters
-        formattedText = text.replace(/\D/g, "");
-        // Insert hyphens to format as xxx-xxx-xxxx
-        if (formattedText.length > 3 && formattedText.length <= 6) {
-          formattedText = "".concat(formattedText.slice(0, 3), "-").concat(formattedText.slice(3));
-        } else if (formattedText.length > 6) {
-          formattedText = "".concat(formattedText.slice(0, 3), "-").concat(formattedText.slice(3, 6), "-").concat(formattedText.slice(6, 10));
-        }
-        break;
-      case "id":
-      case "uppercase":
-        // Convert all input to uppercase
-        formattedText = text.toUpperCase();
-        break;
-      case "numeric":
-        // Allow only numeric input
-        formattedText = text.replace(/\D/g, "");
-        break;
-    }
-    setInternalValue(formattedText);
-    setFormValue(name, formattedText);
-  };
-  return /*#__PURE__*/React.createElement(View, {
-    style: styles$7.container
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: [styles$7.label, {
-      color: colors.text.hex
-    }]
-  }, label), /*#__PURE__*/React.createElement(TextInput, __assign({
-    style: [styles$7.input, {
-      backgroundColor: colors.body.hex,
-      borderColor: formErrors[name] ? colors.error.hex : "#CCC",
-      color: colors.text.hex
-    }, style],
-    value: internalValue,
-    onChangeText: handleChange,
-    placeholder: label,
-    editable: editable,
-    placeholderTextColor: colors.placeHolder.hex
-  }, rest)), formErrors[name] && formErrors[name].length > 0 && (/*#__PURE__*/React.createElement(ErrorList, {
-    errors: formErrors[name]
-  })));
-};
-var styles$7 = StyleSheet.create({
-  container: {
-    marginBottom: 16
-  },
-  label: {
-    marginBottom: 4,
-    fontSize: 14
-  },
-  input: {
-    height: 40,
-    borderWidth: 1,
-    borderRadius: 4,
-    paddingHorizontal: 8
-  }
-});
-
-// src/forms/TextArea.tsx
-var TextArea = function TextArea(_a) {
-  var name = _a.name,
-    label = _a.label;
-    _a.errors;
-    var firstValue = _a.firstValue,
-    _b = _a.editable,
-    editable = _b === void 0 ? true : _b,
-    style = _a.style,
-    rest = __rest(_a, ["name", "label", "errors", "firstValue", "editable", "style"]);
-  var _c = useFormContext(),
-    formValues = _c.formValues,
-    setFormValue = _c.setFormValue,
-    formErrors = _c.errors;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  var _d = useState(""),
-    internalValue = _d[0],
-    setInternalValue = _d[1];
-  var isFirstRender = useRef(true); // Track the first render
-  // Initialize the internal value when `firstValue` changes or on first render
-  useEffect(function () {
-    if (isFirstRender.current) {
-      isFirstRender.current = false;
-      if (firstValue !== undefined) {
-        setInternalValue(firstValue);
-        setFormValue(name, firstValue, firstValue); // Pass firstValue here
-      } else {
-        setInternalValue(formValues[name] || "");
-      }
-    }
-  }, [firstValue]);
-  var handleChange = function handleChange(text) {
-    setInternalValue(text);
-    setFormValue(name, text);
-  };
-  return /*#__PURE__*/React.createElement(View, {
-    style: styles$6.container
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: [styles$6.label, {
-      color: colors.text.hex
-    }]
-  }, label), /*#__PURE__*/React.createElement(TextInput, __assign({
-    style: [styles$6.textArea, style, {
-      backgroundColor: colors.body.hex,
-      color: colors.text.hex,
-      borderColor: formErrors[name] ? colors.error.hex : "#CCC"
-    }],
-    value: internalValue,
-    onChangeText: handleChange,
-    placeholder: label,
-    placeholderTextColor: colors.placeHolder.hex,
-    multiline: true,
-    editable: editable,
-    numberOfLines: 4,
-    textAlignVertical: "top"
-  }, rest)), formErrors[name] && formErrors[name].length > 0 && (/*#__PURE__*/React.createElement(ErrorList, {
-    errors: formErrors[name]
-  })));
-};
-var styles$6 = StyleSheet.create({
-  container: {
-    marginBottom: 16
-  },
-  label: {
-    marginBottom: 4
-  },
-  textArea: {
-    height: 100,
-    borderWidth: 1,
-    borderRadius: 4,
-    paddingHorizontal: 8,
-    paddingVertical: 8
-  }
-});
-
-// src/forms/Label.tsx
-var Label = function Label(_a) {
-  var text = _a.text,
-    style = _a.style;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  return /*#__PURE__*/React.createElement(Text, {
-    style: [styles$5.label, style, {
-      color: colors.text.hex
-    }]
-  }, text);
-};
-var styles$5 = StyleSheet.create({
-  label: {
-    marginBottom: 4,
-    fontWeight: '500'
-  }
-});
-
-/**
- * InputList component - A custom dropdown list component for React Native with multi-selection support,
- * customizable styling, sorting, and configurable close behavior on selection or scrolling.
- *
- * @param {string} placeholder - Placeholder text for the input.
- * @param {object} style - Custom styles for the component.
- * @param {Option[]} options - Array of options to display in the dropdown.
- * @param {boolean} multi - Enables multi-selection mode.
- * @param {boolean} disabled - Disables the dropdown input.
- * @param {keyof Option} sortBy - Key to sort options by (e.g., 'id').
- * @param {boolean} separator - If true, adds a separator line between options.
- * @param {boolean} closeOnScroll - Closes the dropdown if the user scrolls the list.
- * @param {boolean} closeOnSelect - Closes the dropdown on selection in single-select mode.
- * @param {number} maxSelection - Maximum number of items selectable in multi-select mode.
- */
-var InputList = function InputList(_a) {
-  var name = _a.name,
-    _b = _a.placeholder,
-    placeholder = _b === void 0 ? "Choose value/s" : _b,
-    style = _a.style,
-    options = _a.options,
-    _c = _a.multi,
-    multi = _c === void 0 ? false : _c,
-    _d = _a.disabled,
-    disabled = _d === void 0 ? false : _d,
-    sortBy = _a.sortBy,
-    _e = _a.firstValue,
-    firstValue = _e === void 0 ? [] : _e,
-    _f = _a.separator,
-    separator = _f === void 0 ? false : _f,
-    _g = _a.closeOnScroll,
-    closeOnScroll = _g === void 0 ? false : _g,
-    _h = _a.closeOnSelect,
-    closeOnSelect = _h === void 0 ? true : _h,
-    maxSelection = _a.maxSelection,
-    onChange = _a.onChange;
-  var _j = useFormContext();
-    _j.formValues;
-    var setFormValue = _j.setFormValue,
-    formErrors = _j.errors;
-  var _k = useState(false),
-    isDropdownVisible = _k[0],
-    setIsDropdownVisible = _k[1];
-  // Memoize sorted options for performance
-  var sortedOptions = useMemo(function () {
-    return sortBy ? __spreadArray([], options, true).sort(function (a, b) {
-      return a[sortBy] > b[sortBy] ? 1 : -1;
-    }) : options;
-  }, [options, sortBy]);
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  // Initialize selected options based on firstValue
-  // Filter initial selections from options based on `firstValue`
-  var initialSelections = useMemo(function () {
-    return options.filter(function (opt) {
-      return firstValue.includes(opt.value);
-    });
-  }, [options, firstValue]);
-  // State for selected options
-  var _l = useState(multi ? initialSelections : initialSelections[0] || null),
-    selectedOptions = _l[0],
-    setSelectedOptions = _l[1];
-  // Update form value when firstValue changes
-  useEffect(function () {
-    if (!firstValue || firstValue.length === 0) return;
-    var matchedSelections = options.filter(function (opt) {
-      return firstValue.includes(opt.value);
-    });
-    if (multi) {
-      setSelectedOptions(matchedSelections);
-      setFormValue(name, matchedSelections, matchedSelections);
-    } else {
-      var singleValue = matchedSelections[0] || null;
-      setSelectedOptions(singleValue);
-      setFormValue(name, singleValue, singleValue);
-    }
-  }, [firstValue, multi]);
-  // Handle option selection
-  var handleSelectOption = function handleSelectOption(option) {
-    var updatedSelections;
-    if (multi) {
-      var selectedArray = Array.isArray(selectedOptions) ? selectedOptions : [];
-      var alreadySelected = selectedArray.some(function (opt) {
-        return opt.id === option.id;
-      });
-      updatedSelections = alreadySelected ? selectedArray.filter(function (opt) {
-        return opt.id !== option.id;
-      }) : __spreadArray(__spreadArray([], selectedArray, true), [option], false);
-      if (!alreadySelected && maxSelection && updatedSelections.length >= maxSelection) {
-        setIsDropdownVisible(false);
-      }
-      setFormValue(name, updatedSelections);
-    } else {
-      updatedSelections = option;
-      setFormValue(name, option);
-      if (closeOnSelect) setIsDropdownVisible(false);
-    }
-    setSelectedOptions(updatedSelections);
-    if (onChange) onChange(updatedSelections);
-  };
-  var isItemDisabled = function isItemDisabled(option) {
-    if (!multi) return false; // Disable check only applies for multi-select
-    // Ensure selectedOptions is treated as an array
-    var selectedArray = Array.isArray(selectedOptions) ? selectedOptions : [];
-    return maxSelection && selectedArray.length >= maxSelection && !selectedArray.some(function (opt) {
-      return opt.id === option.id;
-    });
-  };
-  var renderSelectedText = function renderSelectedText() {
-    if (multi) {
-      // Ensure selectedOptions is treated as an array
-      var selectedArray = Array.isArray(selectedOptions) ? selectedOptions : [];
-      return selectedArray.map(function (opt) {
-        return opt.label;
-      }).join(', ') || placeholder;
-    }
-    return (selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions.label) || placeholder;
-  };
-  var toggleDropdown = function toggleDropdown() {
-    if (!disabled) {
-      setIsDropdownVisible(!isDropdownVisible);
-      if (!isDropdownVisible) Keyboard.dismiss();
-    }
-  };
-  var handleCloseDropdown = useCallback(function () {
-    if (isDropdownVisible) setIsDropdownVisible(false);
-  }, [isDropdownVisible]);
-  /**
-   * Renders selected options as a comma-separated string or the placeholder if none selected.
-   * @returns {string} - The display text for selected options or placeholder.
-   */
-  // Conditionally render item as disabled if max selection reached and item is unselected
-  return /*#__PURE__*/React.createElement(View, {
-    style: [styles$4.container, style]
-  }, /*#__PURE__*/React.createElement(Text$1, {
-    style: {
-      color: colors.text.hex,
-      marginBottom: 4
-    }
-  }, name), /*#__PURE__*/React.createElement(TouchableOpacity, {
-    style: [styles$4.inputContainer, {
-      borderColor: formErrors[name] ? colors.error.hex : "#CCC"
-    }],
-    onPress: toggleDropdown,
-    disabled: disabled
-  }, /*#__PURE__*/React.createElement(Text$1, {
-    style: {
-      color: colors.text.hex
-    }
-  }, renderSelectedText())), formErrors[name] && formErrors[name].length > 0 && (/*#__PURE__*/React.createElement(ErrorList, {
-    errors: formErrors[name]
-  })), /*#__PURE__*/React.createElement(Modal, {
-    visible: isDropdownVisible,
-    transparent: true,
-    animationType: "fade"
-  }, /*#__PURE__*/React.createElement(Pressable, {
-    style: styles$4.overlay,
-    onPress: handleCloseDropdown
-  }), /*#__PURE__*/React.createElement(View, {
-    style: [styles$4.dropdownContainer, {
-      backgroundColor: colors.body.hex
-    }]
-  }, /*#__PURE__*/React.createElement(FlatList, {
-    data: sortedOptions,
-    keyExtractor: function keyExtractor(item) {
-      return item.id.toString();
-    },
-    renderItem: function renderItem(_a) {
-      var item = _a.item;
-      var isSelected = multi ? Array.isArray(selectedOptions) && selectedOptions.some(function (opt) {
-        return opt.id === item.id;
-      }) : selectedOptions && 'id' in selectedOptions && selectedOptions.id === item.id;
-      var isDisabled = isItemDisabled(item);
-      return /*#__PURE__*/React.createElement(TouchableOpacity, {
-        onPress: function onPress() {
-          return handleSelectOption(item);
-        },
-        style: [styles$4.optionItem, isSelected ? {
-          backgroundColor: colors.primary.hex
-        } : {}, isDisabled ? {
-          backgroundColor: colors.placeHolder.hex
-        } : {}],
-        disabled: !!isDisabled
-      }, /*#__PURE__*/React.createElement(Text$1, {
-        style: [isSelected ? {
-          color: colors.body.hex
-        } : {
-          color: colors.text.hex
-        }, isDisabled ? styles$4.disabledText : {}]
-      }, item.label));
-    },
-    ItemSeparatorComponent: function ItemSeparatorComponent() {
-      return separator ? /*#__PURE__*/React.createElement(View, {
-        style: styles$4.separator
-      }) : null;
-    },
-    scrollEnabled: !closeOnScroll
-  }))));
-};
-var styles$4 = StyleSheet.create({
-  container: {
-    marginVertical: 10
-  },
-  inputContainer: {
-    padding: 12,
-    borderWidth: 1,
-    borderRadius: 5
-  },
-  dropdownContainer: {
-    position: 'absolute',
-    top: '30%',
-    // Center the dropdown vertically
-    alignSelf: 'center',
-    width: '90%',
-    backgroundColor: '#fff',
-    borderRadius: 8,
-    elevation: 5,
-    paddingVertical: 10
-  },
-  optionItem: {
-    padding: 12
-  },
-  disabledText: {
-    color: '#999'
-  },
-  separator: {
-    height: 1,
-    backgroundColor: '#ddd',
-    marginHorizontal: 8
-  },
-  overlay: {
-    flex: 1,
-    backgroundColor: 'rgba(0,0,0,0.3)'
-  }
-});
-
-// src/cards/Card.tsx
-/**
- * Card component that adapts its styles based on the current theme.
- * Supports dynamic styling, shadows, and press animations.
- *
- * @param children - The content to be displayed inside the Card.
- * @param style - Additional styles to apply to the Card.
- * @param onPress - Function to execute when the Card is pressed.
- * @param pressable - Determines if the Card is pressable. Defaults to false.
- * @param borderRadius - Border radius of the Card. Defaults to 12.
- * @param elevation - Elevation for Android shadow. Overrides default.
- * @param shadowProps - Custom shadow properties for iOS. Overrides defaults.
- */
-var Card = function Card(_a) {
-  var children = _a.children,
-    style = _a.style,
-    onPress = _a.onPress,
-    _b = _a.pressable,
-    pressable = _b === void 0 ? false : _b,
-    _c = _a.borderRadius,
-    borderRadius = _c === void 0 ? 12 : _c,
-    _d = _a.elevation,
-    elevation = _d === void 0 ? 4 : _d,
-    _e = _a.shadowProps,
-    shadowProps = _e === void 0 ? {} : _e;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  // Animation state for pressable effect
-  // Default shadow styles (improved platform-specific handling)
-  var defaultShadow = Platform.select({
-    ios: {
-      shadowColor: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowColor) || colors.text.hex,
-      // Defaulting to theme text color
-      shadowOffset: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowOffset) || {
-        width: 0,
-        height: 2
-      },
-      shadowOpacity: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowOpacity) || 0.1,
-      shadowRadius: (shadowProps === null || shadowProps === void 0 ? void 0 : shadowProps.shadowRadius) || 4
-    },
-    android: {
-      elevation: elevation // Only applies to Android
-    }
-  });
-  var cardStyles = [styles$3.container, {
-    borderRadius: borderRadius,
-    backgroundColor: colors.background.hex
-  }, defaultShadow,
-  // Dynamic shadows based on platform
-  style // External styles
-  ];
-  return pressable ? (/*#__PURE__*/React.createElement(TouchableOpacity, {
-    activeOpacity: 0.8,
-    onPress: onPress,
-    style: cardStyles
-  }, children)) : (/*#__PURE__*/React.createElement(View, {
-    style: cardStyles
-  }, children));
-};
-var styles$3 = StyleSheet.create({
-  container: {
-    padding: 16,
-    borderRadius: 12
-    // Shadows handled dynamically with platform logic
-  }
-});
-
-var InputCheck = function InputCheck(_a) {
-  var name = _a.name,
-    options = _a.options,
-    _b = _a.multi,
-    multi = _b === void 0 ? false : _b,
-    max = _a.max,
-    _c = _a.rowAmount,
-    rowAmount = _c === void 0 ? 3 : _c,
-    firstValue = _a.firstValue,
-    _d = _a.iconPosition,
-    iconPosition = _d === void 0 ? "row" : _d,
-    _e = _a.disabled,
-    disabled = _e === void 0 ? false : _e;
-  var _f = useFormContext();
-    _f.formValues;
-    var setFormValue = _f.setFormValue,
-    formErrors = _f.errors;
-  var _g = useState([]),
-    selectedValues = _g[0],
-    setSelectedValues = _g[1];
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  var isFirstRender = useRef(true);
-  // Initialize selectedValues on first render if firstValue is provided
-  useEffect(function () {
-    if (isFirstRender.current && firstValue) {
-      var initialSelectedValues = options.filter(function (option) {
-        return firstValue.some(function (fv) {
-          return fv.value === option.value;
-        });
-      });
-      setSelectedValues(initialSelectedValues);
-      setFormValue(name, initialSelectedValues, initialSelectedValues); // Update form context
-      isFirstRender.current = false; // Prevent subsequent updates
-    }
-  }, [firstValue, name, options, setFormValue]);
-  var handleSelect = function handleSelect(id, value) {
-    if (disabled) return;
-    var updatedSelection;
-    if (multi) {
-      var alreadySelected = selectedValues.find(function (item) {
-        return item.id === id;
-      });
-      if (alreadySelected) {
-        updatedSelection = selectedValues.filter(function (item) {
-          return item.id !== id;
-        });
-      } else {
-        if (max && selectedValues.length >= max) return; // Prevent selection beyond max
-        updatedSelection = __spreadArray(__spreadArray([], selectedValues, true), [{
-          id: id,
-          value: value
-        }], false);
-      }
-    } else {
-      updatedSelection = [{
-        id: id,
-        value: value
-      }];
-    }
-    setSelectedValues(updatedSelection);
-    setFormValue(name, updatedSelection);
-  };
-  var renderItem = function renderItem(_a) {
-    var item = _a.item;
-    var isSelected = selectedValues.some(function (selected) {
-      return selected.id === item.id.toString();
-    });
-    return /*#__PURE__*/React.createElement(Card, {
-      pressable: true,
-      onPress: function onPress() {
-        return handleSelect(item.id.toString(), item.value);
-      },
-      style: [styles$2.card, isSelected && {
-        backgroundColor: colors.primary.hex
-      },
-      // Replace with colors.primary.hex if available
-      disabled && styles$2.cardDisabled]
-    }, item.icon && (/*#__PURE__*/React.createElement(Image, {
-      source: {
-        uri: item.icon
-      },
-      style: [styles$2.icon, iconPosition === "column" && styles$2.iconColumn]
-    })), item.label && (/*#__PURE__*/React.createElement(Text, {
-      style: [styles$2.label, {
-        color: isSelected ? colors.textButton.hex : colors.text.hex
-      }]
-    }, item.label)));
-  };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
-    style: styles$2.title
-  }, name), /*#__PURE__*/React.createElement(FlatList, {
-    data: options,
-    renderItem: renderItem,
-    keyExtractor: function keyExtractor(item) {
-      return item.id;
-    },
-    numColumns: rowAmount,
-    columnWrapperStyle: rowAmount > 1 ? styles$2.row : undefined,
-    scrollEnabled: false
-  }), formErrors[name] && formErrors[name].length > 0 && (/*#__PURE__*/React.createElement(ErrorList, {
-    errors: formErrors[name]
-  })));
-};
-var styles$2 = StyleSheet.create({
-  card: {
-    flex: 1,
-    margin: 5,
-    padding: 10,
-    borderWidth: 1,
-    borderColor: "#ccc",
-    borderRadius: 8,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  title: {
-    marginBottom: 4,
-    fontSize: 14
-  },
-  cardDisabled: {
-    opacity: 0.5
-  },
-  icon: {
-    width: 40,
-    height: 40,
-    marginBottom: 5
-  },
-  iconColumn: {
-    marginBottom: 10
-  },
-  label: {
-    fontSize: 14,
-    textAlign: "center"
-  },
-  row: {
-    justifyContent: "space-between"
-  }
-});
-
-// src/components/InputAttach.tsx
-var InputAttach = function InputAttach(_a) {
-  var name = _a.name,
-    _b = _a.type,
-    type = _b === void 0 ? ["png", "jpg", "jpeg"] : _b,
-    _c = _a.amount,
-    amount = _c === void 0 ? 1 : _c,
-    _d = _a.disabled,
-    disabled = _d === void 0 ? false : _d,
-    _e = _a.placeholder,
-    placeholder = _e === void 0 ? "Upload an image" : _e,
-    _f = _a.firstValue,
-    firstValue = _f === void 0 ? [] : _f;
-  var _g = useFormContext(),
-    setFormValue = _g.setFormValue,
-    formErrors = _g.errors;
-  var _h = useState([]),
-    selectedFiles = _h[0],
-    setSelectedFiles = _h[1];
-  // Ref to track initialization
-  var isInitialized = useRef(false);
-  // Sync firstValue with selectedFiles when it changes
-  useEffect(function () {
-    if (!isInitialized.current) {
-      setSelectedFiles(firstValue);
-      setFormValue(name, firstValue, firstValue); // Pass firstValue here
-      isInitialized.current = true;
-    }
-  }, [firstValue, name, setFormValue]);
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  var pickImage = function pickImage() {
-    return __awaiter(void 0, void 0, void 0, function () {
-      var permissionResult, result, selectedAssets, newFiles, invalidFiles, updatedFiles;
-      return __generator(this, function (_a) {
-        switch (_a.label) {
-          case 0:
-            if (disabled) return [2 /*return*/];
-            return [4 /*yield*/, ImagePicker.requestMediaLibraryPermissionsAsync()];
-          case 1:
-            permissionResult = _a.sent();
-            if (!permissionResult.granted) {
-              Alert.alert("Permission Required", "We need access to your photos to upload images.");
-              return [2 /*return*/];
-            }
-            return [4 /*yield*/, ImagePicker.launchImageLibraryAsync({
-              mediaTypes: ["images"],
-              // Updated usage
-              allowsEditing: true,
-              allowsMultipleSelection: amount > 1,
-              quality: 1
-            })];
-          case 2:
-            result = _a.sent();
-            if (!result.canceled) {
-              selectedAssets = result.assets || [result];
-              newFiles = selectedAssets.map(function (asset) {
-                return {
-                  uri: asset.uri,
-                  name: asset.fileName || "unknown.jpg",
-                  type: asset.mimeType || "image/jpeg"
-                };
-              });
-              invalidFiles = newFiles.filter(function (file) {
-                return !type.some(function (ext) {
-                  return file.name.toLowerCase().endsWith(ext);
-                });
-              });
-              if (invalidFiles.length > 0) {
-                Alert.alert("Invalid File Type", "Please upload files of type: ".concat(type.join(", ")));
-                return [2 /*return*/];
-              }
-              // Check max amount
-              if (selectedFiles.length + newFiles.length > amount) {
-                Alert.alert("Limit Exceeded", "You can upload up to ".concat(amount, " files."));
-                return [2 /*return*/];
-              }
-              updatedFiles = __spreadArray(__spreadArray([], selectedFiles, true), newFiles, true).slice(0, amount);
-              setSelectedFiles(updatedFiles);
-              setFormValue(name, updatedFiles); // Update form context
-            }
-            return [2 /*return*/];
-        }
-      });
-    });
-  };
-  var removeFile = function removeFile(index) {
-    var updatedFiles = selectedFiles.filter(function (_, i) {
-      return i !== index;
-    });
-    setSelectedFiles(updatedFiles);
-    setFormValue(name, updatedFiles); // Update form context
-  };
-  return /*#__PURE__*/React.createElement(View, {
-    style: styles$1.container
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: [styles$1.label, {
-      color: colors.text.hex
-    }]
-  }, placeholder), /*#__PURE__*/React.createElement(View, {
-    style: styles$1.fileContainer
-  }, selectedFiles.map(function (file, index) {
-    return /*#__PURE__*/React.createElement(View, {
-      key: index,
-      style: styles$1.fileItem
-    }, /*#__PURE__*/React.createElement(Image, {
-      source: {
-        uri: file.uri
-      },
-      style: styles$1.imagePreview
-    }), /*#__PURE__*/React.createElement(TouchableOpacity, {
-      onPress: function onPress() {
-        return removeFile(index);
-      },
-      style: [styles$1.removeButton, {
-        backgroundColor: colors.error.hex
-      }]
-    }, /*#__PURE__*/React.createElement(Text, {
-      style: styles$1.removeButtonText
-    }, "X")));
-  }), selectedFiles.length < amount && (/*#__PURE__*/React.createElement(TouchableOpacity, {
-    onPress: pickImage,
-    style: [styles$1.addButton, {
-      backgroundColor: colors.body.hex,
-      borderColor: formErrors[name] && colors.error.hex
-    }],
-    disabled: disabled
-  }, /*#__PURE__*/React.createElement(Text, {
-    style: [styles$1.addButtonText, {
-      color: colors.placeHolder.hex
-    }]
-  }, "+")))), formErrors[name] && formErrors[name].length > 0 && (/*#__PURE__*/React.createElement(ErrorList, {
-    errors: formErrors[name]
-  })));
-};
-var styles$1 = StyleSheet.create({
-  container: {
-    marginVertical: 10
-  },
-  label: {
-    marginTop: 5
-  },
-  fileContainer: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 10
-  },
-  fileItem: {
-    position: "relative",
-    width: 100,
-    height: 100,
-    marginRight: 10
-  },
-  imagePreview: {
-    width: "100%",
-    height: "100%",
-    borderRadius: 5
-  },
-  removeButton: {
-    position: "absolute",
-    top: 0,
-    right: 0,
-    width: 20,
-    height: 20,
-    justifyContent: "center",
-    alignItems: "center",
-    borderRadius: 10
-  },
-  removeButtonText: {
-    color: "#fff",
-    fontWeight: "bold"
-  },
-  addButton: {
-    width: 100,
-    height: 100,
-    justifyContent: "center",
-    alignItems: "center",
-    borderRadius: 5
-  },
-  addButtonText: {
-    fontSize: 24
-  },
-  error: {
-    marginTop: 5
-  }
-});
-
-// src/components/Button.tsx
-/**
- * Determines the styles based on the button type and whether it is disabled.
- *
- * @param type - The type of the button ('submit', 'button', 'cancel').
- * @param disabled - Whether the button is disabled.
- * @param themeColors - The theme colors.
- * @returns The computed style for the button.
- */
-function typeStyles(type, disabled, themeColors) {
-  switch (type) {
-    case 'submit':
-      return {
-        backgroundColor: "rgba(".concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.r, ", ").concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.g, ", ").concat(themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.rgb.b, ", ").concat(disabled ? 0.5 : 1, ")"),
-        borderWidth: 2,
-        borderColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.hex
-      };
-    case 'button':
-      return {
-        backgroundColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.primary.hex,
-        borderColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.secondary.hex,
-        opacity: disabled ? 0.5 : 1,
-        borderWidth: 2
-      };
-    case 'cancel':
-      return {
-        backgroundColor: themeColors === null || themeColors === void 0 ? void 0 : themeColors.background.hex,
-        borderWidth: 0
-      };
-    default:
-      return {};
-  }
-}
-/**
- * Button component that adapts its styles based on the current theme.
- * Supports dynamic styling, full-width option, rounded corners, and different types.
- *
- * @param disabled - If true, the button is disabled and not pressable.
- * @param isFullWidth - If true, the button expands to full width of its container.
- * @param children - Text content of the button.
- * @param onPress - Function to call when the button is pressed.
- * @param rounded - If true, the button has rounded corners.
- * @param borderRadius - Custom border radius value. Overrides the `rounded` prop if provided.
- * @param type - Specifies the button type for styling ('submit', 'button', 'cancel').
- */
-var Button = function Button(_a) {
-  var children = _a.children,
-    _b = _a.disabled,
-    disabled = _b === void 0 ? false : _b,
-    _c = _a.type,
-    type = _c === void 0 ? 'button' : _c,
-    _d = _a.rounded,
-    rounded = _d === void 0 ? true : _d,
-    _e = _a.borderRadius,
-    borderRadius = _e === void 0 ? 30 : _e,
-    _f = _a.isFullWidth,
-    isFullWidth = _f === void 0 ? false : _f,
-    _g = _a.loading,
-    loading = _g === void 0 ? false : _g,
-    onPress = _a.onPress;
-  var theme = useContext(ThemeContext).theme;
-  var colors = theme.colors;
-  var computedStyles = useMemo(function () {
-    return StyleSheet.flatten([styles.button, typeStyles(type, disabled, colors), rounded && {
-      borderRadius: borderRadius
-    }, isFullWidth && {
-      width: '100%'
-    }, (disabled || loading) && styles.disabled]);
-  }, [type, disabled, loading, rounded, borderRadius, isFullWidth, colors]);
-  var textColor = useMemo(function () {
-    return type === "cancel" ? {
-      color: colors.text.hex
-    } : {
-      color: colors.textButton.hex
-    };
-  }, [type, colors]);
-  // Safely try to access handleSubmit from the form context
-  var formContext = function () {
-    try {
-      return useFormContext();
-    } catch (_a) {
-      return null;
-    }
-  }();
-  var handlePress = function handlePress() {
-    if (type === 'submit' && (formContext === null || formContext === void 0 ? void 0 : formContext.handleSubmit)) {
-      console.log("Its submit type");
-      formContext.handleSubmit();
-    } else if (onPress) {
-      onPress();
-    }
-  };
-  return /*#__PURE__*/React.createElement(TouchableOpacity, {
-    style: computedStyles,
-    disabled: disabled || loading,
-    onPress: handlePress,
-    activeOpacity: 0.7
-  }, loading ? (
-  /*#__PURE__*/
-  // Show loading spinner if loading
-  React.createElement(ActivityIndicator, {
-    size: "small",
-    color: colors.textButton.hex
-  })) : (/*#__PURE__*/React.createElement(Text$1, {
-    style: textColor
-  }, Array.isArray(children) ? children.join('').toUpperCase() : children === null || children === void 0 ? void 0 : children.toUpperCase())));
-};
-var styles = StyleSheet.create({
-  button: {
-    justifyContent: 'center',
-    alignItems: 'center',
-    paddingVertical: 10,
-    paddingHorizontal: 20
-  },
-  disabled: {
-    opacity: 0.6
-  }
-});
-
-export { Button, Card, ErrorList, Form, Input, InputAttach, InputCheck, InputList, Label, Text, TextArea, setFormValueGlobal, useFormContext };
-//# sourceMappingURL=index.esm.js.map