geoiq-frontend-ui-kit/dist/index.es129.js

This project is a UI kit for GeoIQ's frontend. It's built with React, TypeScript, and Vite.

import A, { useState as M } from "react";
import { FormValuesContext as v } from "./index.es146.js";
import { FormFieldType as r } from "./index.es147.js";
const G = ({
  children: V,
  initialValues: p = {},
  onSubmit: f,
  onAssetUpload: E,
  onToggleImageEditor: m
}) => {
  const [o, c] = M(p), [g, _] = M({}), b = (s, e) => {
    c((a) => ({ ...a, [s]: e })), g[s] && _((a) => {
      const i = { ...a };
      return delete i[s], i;
    });
  }, P = (s) => {
    c(() => s);
  }, n = (s) => {
    if (s.type === r.REPEATABLE_GROUP_FIELD) {
      const a = `${s.id}||`, i = Object.keys(o).filter((t) => t.startsWith(a));
      if (i.length === 0)
        return { isValid: !1, errorMessage: "This field is required" };
      for (const t of i) {
        const d = { ...s.options.find(
          (O) => O.id === t.split("||")[2]
        ), id: t }, { isValid: u, errorMessage: T } = n(
          d
        );
        if (!u)
          return { isValid: !1, errorMessage: T };
      }
      return { isValid: !0, errorMessage: "" };
    }
    const e = o[s.id];
    if (s.required && e == null)
      return { isValid: !1, errorMessage: "This field is required" };
    if (!s.required && (e == null || e === ""))
      return { isValid: !0, errorMessage: "" };
    switch (s.type) {
      case r.SHORT_TEXT:
      case r.LONG_TEXT:
        if (e === "")
          return { isValid: !1, errorMessage: "This field cannot be empty" };
        break;
      case r.EMAIL:
        if (e === "")
          return { isValid: !1, errorMessage: "Email is required" };
        if (!/^\S+@\S+\.\S+$/.test(e))
          return {
            isValid: !1,
            errorMessage: "Please enter a valid email address"
          };
        break;
      case r.NUMBER:
        if (e === "")
          return { isValid: !1, errorMessage: "Number is required" };
        if (isNaN(Number(e)))
          return { isValid: !1, errorMessage: "Please enter a valid number" };
        break;
      case r.MOBILE_NUMBER:
        if (e === "")
          return { isValid: !1, errorMessage: "Mobile number is required" };
        if (!/^\d{10,15}$/.test(e.replace(/\D/g, "")))
          return {
            isValid: !1,
            errorMessage: "Please enter a valid mobile number"
          };
        break;
      case r.DATE_PICKER:
        if (!e || e === "")
          return { isValid: !1, errorMessage: "Date is required" };
        break;
      case r.SINGLE_COMBOBOX:
        if (!e || e === "")
          return { isValid: !1, errorMessage: "Please select an option" };
        break;
      case r.MULTI_COMBOBOX:
        if (Array.isArray(e)) {
          if (e.length === 0)
            return {
              isValid: !1,
              errorMessage: "Please select at least one option"
            };
        } else if (typeof e == "string" && (!e || e.split(",").filter(Boolean).length === 0))
          return {
            isValid: !1,
            errorMessage: "Please select at least one option"
          };
        break;
      case r.CHECKBOX_GROUP:
      case r.RADIO_GROUP:
        if (!e || e === "")
          return { isValid: !1, errorMessage: "Please select an option" };
        break;
      case r.RADIO_GROUP_WITH_OPTIONAL_INPUT: {
        const a = e;
        if (!a || !a.radio_value)
          return { isValid: !1, errorMessage: "Please select an option" };
        if (a.radio_value === s.inputTriggerOptionValue && !a.input_value)
          return {
            isValid: !1,
            errorMessage: "Please provide additional information for your selection"
          };
        break;
      }
      case r.SINGLE_IMAGE_PICKER:
        if (!e || !e.public_url)
          return { isValid: !1, errorMessage: "Please upload an image" };
        break;
      case r.SINGLE_VIDEO_PICKER:
        if (!e || !e.public_url)
          return { isValid: !1, errorMessage: "Please upload a video" };
        break;
      case r.MULTI_IMAGE_PICKER:
        if (!Array.isArray(e) || e.length === 0)
          return {
            isValid: !1,
            errorMessage: "Please upload at least one image"
          };
        break;
      case r.MULTI_VIDEO_PICKER:
        if (!Array.isArray(e) || e.length === 0)
          return {
            isValid: !1,
            errorMessage: "Please upload at least one video"
          };
        break;
      case r.TAGGABLE_MULTI_IMAGE_PICKER: {
        if (!Array.isArray(e) || e.length === 0)
          return {
            isValid: !1,
            errorMessage: "Please upload at least one image"
          };
        if (e.some((t) => !t.tag))
          return {
            isValid: !1,
            errorMessage: "Please add tags to all uploaded images"
          };
        break;
      }
    }
    return { isValid: !0, errorMessage: "" };
  }, I = {
    values: o,
    errors: g,
    setValue: b,
    setFormValues: P,
    submitForm: () => {
      f && f(o);
    },
    onAssetUpload: E,
    validateField: n,
    validateStep: (s) => {
      let e = !0;
      const a = {}, i = {};
      return s.sections.forEach((t) => {
        t.fields.forEach((l) => {
          i[l.id] = l;
        });
      }), Object.entries(i).forEach(([t, l]) => {
        if (l.required) {
          const { isValid: d, errorMessage: u } = n(l);
          d || (a[l.id] = u, e = !1);
        }
      }), { isStepValid: e, errors: a };
    },
    onToggleImageEditor: m
  };
  return /* @__PURE__ */ A.createElement(v.Provider, { value: I }, V);
};
export {
  G as FormValuesProvider
};
//# sourceMappingURL=index.es129.js.map