mytek-components 1.0.6 → 1.0.8

package/dist/{main.umd.cjs → main.umd.js}

@@ -10545,6 +10545,187 @@ To suppress this warning, you need to explicitly provide the \`palette.${key}Cha
       }
     );
   };
+  function FaCheck(props) {
+    return GenIcon({ "attr": { "viewBox": "0 0 512 512" }, "child": [{ "tag": "path", "attr": { "d": "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" }, "child": [] }] })(props);
+  }
+  function FaChevronDown(props) {
+    return GenIcon({ "attr": { "viewBox": "0 0 448 512" }, "child": [{ "tag": "path", "attr": { "d": "M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z" }, "child": [] }] })(props);
+  }
+  function FaChevronUp(props) {
+    return GenIcon({ "attr": { "viewBox": "0 0 448 512" }, "child": [{ "tag": "path", "attr": { "d": "M240.971 130.524l194.343 194.343c9.373 9.373 9.373 24.569 0 33.941l-22.667 22.667c-9.357 9.357-24.522 9.375-33.901.04L224 227.495 69.255 381.516c-9.379 9.335-24.544 9.317-33.901-.04l-22.667-22.667c-9.373-9.373-9.373-24.569 0-33.941L207.03 130.525c9.372-9.373 24.568-9.373 33.941-.001z" }, "child": [] }] })(props);
+  }
+  const ComboDropdown = ({
+    label,
+    options: options2 = [],
+    placeholder = "",
+    onChange,
+    name,
+    value,
+    error,
+    disabled,
+    height: height2 = "40px",
+    isPassword = false,
+    mode = "both",
+    isRequired = false,
+    optionLabelKey = "label",
+    optionValueKey = "value"
+  }) => {
+    const [inputValue, setInputValue] = React.useState("");
+    const [filteredOptions, setFilteredOptions] = React.useState([]);
+    const [showDropdown, setShowDropdown] = React.useState(false);
+    const [highlightIndex, setHighlightIndex] = React.useState(-1);
+    const inputRef = React.useRef();
+    const wrapperRef = React.useRef();
+    React.useEffect(() => {
+      const selected = options2.find(
+        (opt) => (typeof opt === "object" ? opt[optionValueKey] : opt) === value
+      );
+      if (selected) {
+        const label2 = typeof selected === "object" ? selected[optionLabelKey] : selected;
+        setInputValue(label2);
+      } else {
+        setInputValue("");
+      }
+    }, [value, options2, optionLabelKey, optionValueKey]);
+    React.useEffect(() => {
+      const handleClickOutside = (event) => {
+        if (wrapperRef.current && !wrapperRef.current.contains(event.target)) {
+          setShowDropdown(false);
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }, []);
+    const normalizeOptions = (opts) => opts.map((opt) => {
+      if (typeof opt === "string") return { label: opt, value: opt };
+      return {
+        label: opt[optionLabelKey],
+        value: opt[optionValueKey]
+      };
+    });
+    const handleInputChange = (e) => {
+      const val = e.target.value;
+      setInputValue(val);
+      if (mode !== "select" && onChange) {
+        onChange(name, val);
+      }
+      if (mode !== "type") {
+        const normalized = normalizeOptions(options2);
+        const filtered = normalized.filter(
+          (opt) => {
+            var _a;
+            return (_a = opt.label) == null ? void 0 : _a.toLowerCase().includes(val.toLowerCase());
+          }
+        );
+        setFilteredOptions(filtered);
+        setShowDropdown(true);
+        setHighlightIndex(-1);
+      }
+    };
+    const handleSelect = (val, label2) => {
+      setInputValue(label2);
+      if (onChange) {
+        onChange(name, val);
+      }
+      setShowDropdown(false);
+      setHighlightIndex(-1);
+    };
+    const handleKeyDown = (e) => {
+      if (!showDropdown || filteredOptions.length === 0) return;
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        setHighlightIndex((prev) => prev < filteredOptions.length - 1 ? prev + 1 : 0);
+      }
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        setHighlightIndex((prev) => prev > 0 ? prev - 1 : filteredOptions.length - 1);
+      }
+      if (e.key === "Enter" && highlightIndex >= 0) {
+        e.preventDefault();
+        const selected = filteredOptions[highlightIndex];
+        handleSelect(selected.value, selected.label);
+      }
+    };
+    const getPlaceholder = () => {
+      if (placeholder) return placeholder;
+      if (mode === "select") return "Select an option...";
+      if (mode === "type") return "Type a value...";
+      return "Select or type...";
+    };
+    const toggleDropdown = () => {
+      if (disabled) return;
+      if (!showDropdown && mode !== "type") {
+        setFilteredOptions(normalizeOptions(options2));
+      }
+      setShowDropdown((prev) => {
+        var _a;
+        if (!prev) (_a = inputRef.current) == null ? void 0 : _a.focus();
+        return !prev;
+      });
+    };
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: wrapperRef, className: "mb-4 w-full relative", children: [
+      label && /* @__PURE__ */ jsxRuntimeExports.jsxs("label", { className: "block text-sm font-medium text-gray-700 mb-2", children: [
+        label,
+        " ",
+        isRequired && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text-red-500", children: "*" })
+      ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative flex items-center", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "input",
+          {
+            ref: inputRef,
+            type: isPassword ? "password" : "text",
+            placeholder: getPlaceholder(),
+            className: `w-full border rounded-sm px-3 pr-8 py-2 text-sm focus:outline-none focus:ring-1 focus:ring-green-200 ${error ? "border-red-500" : "border-green-500"} ${disabled ? "bg-gray-100 cursor-not-allowed" : ""}`,
+            name,
+            value: inputValue,
+            onChange: handleInputChange,
+            onFocus: () => {
+              if (mode !== "type") {
+                setFilteredOptions(normalizeOptions(options2));
+                setShowDropdown(true);
+              }
+            },
+            onClick: () => {
+              if (mode !== "type") {
+                setFilteredOptions(normalizeOptions(options2));
+                setShowDropdown(true);
+              }
+            },
+            onKeyDown: handleKeyDown,
+            disabled,
+            readOnly: mode === "select",
+            autoComplete: "off",
+            style: { height: height2 }
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "div",
+          {
+            onClick: toggleDropdown,
+            onMouseDown: (e) => e.preventDefault(),
+            className: "absolute right-2 top-1/2 transform -translate-y-1/2 cursor-pointer text-gray-600",
+            children: showDropdown ? /* @__PURE__ */ jsxRuntimeExports.jsx(FaChevronUp, { size: 12 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(FaChevronDown, { size: 12 })
+          }
+        )
+      ] }),
+      showDropdown && filteredOptions.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "absolute z-10 w-full mt-1 bg-white border border-gray-300 rounded-md max-h-52 overflow-y-auto shadow-md", children: filteredOptions.map((opt, index) => {
+        const isSelected = opt.value === value;
+        const isHighlighted = index === highlightIndex;
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "li",
+          {
+            onMouseDown: (e) => e.preventDefault(),
+            onClick: () => handleSelect(opt.value, opt.label),
+            className: `px-3 py-2 text-sm cursor-pointer ${isHighlighted ? "bg-gray-200" : isSelected ? "" : "bg-white"} ${isSelected ? "bg-[#dee2e6] text-black" : ""}`,
+            children: opt.label
+          },
+          index
+        );
+      }) }),
+      error && /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-red-500 text-sm mt-1", children: error })
+    ] });
+  };
   var classnames = { exports: {} };
   /*!
   	Copyright (c) 2018 Jed Watson.
@@ -10610,34 +10791,23 @@ To suppress this warning, you need to explicitly provide the \`palette.${key}Cha
   }
   var classnamesExports = requireClassnames();
   const classNames = /* @__PURE__ */ getDefaultExportFromCjs(classnamesExports);
-  const propTypes$1 = {
-    /**
-     * Specify whether the feedback is for valid or invalid fields
-     *
-     * @type {('valid'|'invalid')}
-     */
-    type: PropTypes.string,
-    /** Display feedback as a tooltip. */
-    tooltip: PropTypes.bool,
-    as: PropTypes.elementType
-  };
-  const Feedback = /* @__PURE__ */ React__namespace.forwardRef(
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    ({
-      as: Component = "div",
-      className,
-      type = "valid",
-      tooltip = false,
-      ...props
-    }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-      ...props,
-      ref,
-      className: classNames(className, `${type}-${tooltip ? "tooltip" : "feedback"}`)
-    })
-  );
-  Feedback.displayName = "Feedback";
-  Feedback.propTypes = propTypes$1;
-  const FormContext = /* @__PURE__ */ React__namespace.createContext({});
+  function useUncontrolledProp(propValue, defaultValue, handler) {
+    var wasPropRef = React.useRef(propValue !== void 0);
+    var _useState = React.useState(defaultValue), stateValue = _useState[0], setState = _useState[1];
+    var isProp = propValue !== void 0;
+    var wasProp = wasPropRef.current;
+    wasPropRef.current = isProp;
+    if (!isProp && wasProp && stateValue !== defaultValue) {
+      setState(defaultValue);
+    }
+    return [isProp ? propValue : stateValue, React.useCallback(function(value) {
+      for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+        args[_key - 1] = arguments[_key];
+      }
+      if (handler) handler.apply(void 0, [value].concat(args));
+      setState(value);
+    }, [handler])];
+  }
   const DEFAULT_BREAKPOINTS = ["xxl", "xl", "lg", "md", "sm", "xs"];
   const DEFAULT_MIN_BREAKPOINT = "xs";
   const ThemeContext = /* @__PURE__ */ React__namespace.createContext({
@@ -10673,1286 +10843,715 @@ To suppress this warning, you need to explicitly provide the \`palette.${key}Cha
     } = React.useContext(ThemeContext);
     return dir === "rtl";
   }
-  const FormCheckInput = /* @__PURE__ */ React__namespace.forwardRef(({
-    id,
-    bsPrefix,
-    className,
-    type = "checkbox",
-    isValid = false,
-    isInvalid = false,
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    as: Component = "input",
-    ...props
-  }, ref) => {
-    const {
-      controlId
-    } = React.useContext(FormContext);
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-check-input");
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-      ...props,
-      ref,
-      type,
-      id: id || controlId,
-      className: classNames(className, bsPrefix, isValid && "is-valid", isInvalid && "is-invalid")
-    });
-  });
-  FormCheckInput.displayName = "FormCheckInput";
-  const FormCheckLabel = /* @__PURE__ */ React__namespace.forwardRef(({
-    bsPrefix,
-    className,
-    htmlFor,
-    ...props
-  }, ref) => {
-    const {
-      controlId
-    } = React.useContext(FormContext);
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-check-label");
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("label", {
-      ...props,
-      ref,
-      htmlFor: htmlFor || controlId,
-      className: classNames(className, bsPrefix)
-    });
-  });
-  FormCheckLabel.displayName = "FormCheckLabel";
-  function hasChildOfType(children, type) {
-    return React__namespace.Children.toArray(children).some((child) => /* @__PURE__ */ React__namespace.isValidElement(child) && child.type === type);
+  function ownerDocument(node) {
+    return node && node.ownerDocument || document;
   }
-  const FormCheck = /* @__PURE__ */ React__namespace.forwardRef(({
-    id,
-    bsPrefix,
-    bsSwitchPrefix,
-    inline = false,
-    reverse = false,
-    disabled = false,
-    isValid = false,
-    isInvalid = false,
-    feedbackTooltip = false,
-    feedback,
-    feedbackType,
-    className,
-    style: style2,
-    title = "",
-    type = "checkbox",
-    label,
-    children,
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    as = "input",
-    ...props
-  }, ref) => {
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-check");
-    bsSwitchPrefix = useBootstrapPrefix(bsSwitchPrefix, "form-switch");
-    const {
-      controlId
-    } = React.useContext(FormContext);
-    const innerFormContext = React.useMemo(() => ({
-      controlId: id || controlId
-    }), [controlId, id]);
-    const hasLabel = !children && label != null && label !== false || hasChildOfType(children, FormCheckLabel);
-    const input = /* @__PURE__ */ jsxRuntimeExports.jsx(FormCheckInput, {
-      ...props,
-      type: type === "switch" ? "checkbox" : type,
-      ref,
-      isValid,
-      isInvalid,
-      disabled,
-      as
-    });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(FormContext.Provider, {
-      value: innerFormContext,
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-        style: style2,
-        className: classNames(className, hasLabel && bsPrefix, inline && `${bsPrefix}-inline`, reverse && `${bsPrefix}-reverse`, type === "switch" && bsSwitchPrefix),
-        children: children || /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
-          children: [input, hasLabel && /* @__PURE__ */ jsxRuntimeExports.jsx(FormCheckLabel, {
-            title,
-            children: label
-          }), feedback && /* @__PURE__ */ jsxRuntimeExports.jsx(Feedback, {
-            type: feedbackType,
-            tooltip: feedbackTooltip,
-            children: feedback
-          })]
-        })
-      })
-    });
-  });
-  FormCheck.displayName = "FormCheck";
-  const FormCheck$1 = Object.assign(FormCheck, {
-    Input: FormCheckInput,
-    Label: FormCheckLabel
-  });
-  var warning_1;
-  var hasRequiredWarning;
-  function requireWarning() {
-    if (hasRequiredWarning) return warning_1;
-    hasRequiredWarning = 1;
-    var __DEV__ = process.env.NODE_ENV !== "production";
-    var warning2 = function() {
-    };
-    if (__DEV__) {
-      var printWarning = function printWarning2(format, args) {
-        var len = arguments.length;
-        args = new Array(len > 1 ? len - 1 : 0);
-        for (var key = 1; key < len; key++) {
-          args[key - 1] = arguments[key];
-        }
-        var argIndex = 0;
-        var message = "Warning: " + format.replace(/%s/g, function() {
-          return args[argIndex++];
-        });
-        if (typeof console !== "undefined") {
-          console.error(message);
-        }
-        try {
-          throw new Error(message);
-        } catch (x) {
-        }
-      };
-      warning2 = function(condition, format, args) {
-        var len = arguments.length;
-        args = new Array(len > 2 ? len - 2 : 0);
-        for (var key = 2; key < len; key++) {
-          args[key - 2] = arguments[key];
-        }
-        if (format === void 0) {
-          throw new Error(
-            "`warning(condition, format, ...args)` requires a warning message argument"
-          );
-        }
-        if (!condition) {
-          printWarning.apply(null, [format].concat(args));
-        }
-      };
-    }
-    warning_1 = warning2;
-    return warning_1;
+  function ownerWindow(node) {
+    var doc = ownerDocument(node);
+    return doc && doc.defaultView || window;
   }
-  var warningExports = requireWarning();
-  const warning = /* @__PURE__ */ getDefaultExportFromCjs(warningExports);
-  const FormControl = /* @__PURE__ */ React__namespace.forwardRef(({
-    bsPrefix,
-    type,
-    size,
-    htmlSize,
-    id,
-    className,
-    isValid = false,
-    isInvalid = false,
-    plaintext,
-    readOnly,
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    as: Component = "input",
-    ...props
-  }, ref) => {
-    const {
-      controlId
-    } = React.useContext(FormContext);
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-control");
-    process.env.NODE_ENV !== "production" ? warning(controlId == null || !id, "`controlId` is ignored on `<FormControl>` when `id` is specified.") : void 0;
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-      ...props,
-      type,
-      size: htmlSize,
-      ref,
-      readOnly,
-      id: id || controlId,
-      className: classNames(className, plaintext ? `${bsPrefix}-plaintext` : bsPrefix, size && `${bsPrefix}-${size}`, type === "color" && `${bsPrefix}-color`, isValid && "is-valid", isInvalid && "is-invalid")
-    });
-  });
-  FormControl.displayName = "FormControl";
-  const FormControl$1 = Object.assign(FormControl, {
-    Feedback
-  });
-  const FormFloating = /* @__PURE__ */ React__namespace.forwardRef(({
-    className,
-    bsPrefix,
-    as: Component = "div",
-    ...props
-  }, ref) => {
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-floating");
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-      ref,
-      className: classNames(className, bsPrefix),
-      ...props
-    });
-  });
-  FormFloating.displayName = "FormFloating";
-  const FormGroup = /* @__PURE__ */ React__namespace.forwardRef(({
-    controlId,
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    as: Component = "div",
-    ...props
-  }, ref) => {
-    const context2 = React.useMemo(() => ({
-      controlId
-    }), [controlId]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(FormContext.Provider, {
-      value: context2,
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-        ...props,
-        ref
-      })
-    });
-  });
-  FormGroup.displayName = "FormGroup";
-  function useCol({
-    as,
-    bsPrefix,
-    className,
-    ...props
-  }) {
-    bsPrefix = useBootstrapPrefix(bsPrefix, "col");
-    const breakpoints = useBootstrapBreakpoints();
-    const minBreakpoint = useBootstrapMinBreakpoint();
-    const spans = [];
-    const classes = [];
-    breakpoints.forEach((brkPoint) => {
-      const propValue = props[brkPoint];
-      delete props[brkPoint];
-      let span;
-      let offset2;
-      let order2;
-      if (typeof propValue === "object" && propValue != null) {
-        ({
-          span,
-          offset: offset2,
-          order: order2
-        } = propValue);
+  function getComputedStyle(node, psuedoElement) {
+    return ownerWindow(node).getComputedStyle(node, psuedoElement);
+  }
+  var rUpper = /([A-Z])/g;
+  function hyphenate(string) {
+    return string.replace(rUpper, "-$1").toLowerCase();
+  }
+  var msPattern = /^ms-/;
+  function hyphenateStyleName(string) {
+    return hyphenate(string).replace(msPattern, "-ms-");
+  }
+  var supportedTransforms = /^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i;
+  function isTransform(value) {
+    return !!(value && supportedTransforms.test(value));
+  }
+  function style(node, property) {
+    var css = "";
+    var transforms = "";
+    if (typeof property === "string") {
+      return node.style.getPropertyValue(hyphenateStyleName(property)) || getComputedStyle(node).getPropertyValue(hyphenateStyleName(property));
+    }
+    Object.keys(property).forEach(function(key) {
+      var value = property[key];
+      if (!value && value !== 0) {
+        node.style.removeProperty(hyphenateStyleName(key));
+      } else if (isTransform(key)) {
+        transforms += key + "(" + value + ") ";
       } else {
-        span = propValue;
+        css += hyphenateStyleName(key) + ": " + value + ";";
       }
-      const infix = brkPoint !== minBreakpoint ? `-${brkPoint}` : "";
-      if (span) spans.push(span === true ? `${bsPrefix}${infix}` : `${bsPrefix}${infix}-${span}`);
-      if (order2 != null) classes.push(`order${infix}-${order2}`);
-      if (offset2 != null) classes.push(`offset${infix}-${offset2}`);
     });
-    return [{
-      ...props,
-      className: classNames(className, ...spans, ...classes)
-    }, {
-      as,
-      bsPrefix,
-      spans
-    }];
+    if (transforms) {
+      css += "transform: " + transforms + ";";
+    }
+    node.style.cssText += ";" + css;
   }
-  const Col = /* @__PURE__ */ React__namespace.forwardRef(
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    (props, ref) => {
-      const [{
-        className,
-        ...colProps
-      }, {
-        as: Component = "div",
-        bsPrefix,
-        spans
-      }] = useCol(props);
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-        ...colProps,
-        ref,
-        className: classNames(className, !spans.length && bsPrefix)
-      });
+  function isEscKey(e) {
+    return e.code === "Escape" || e.keyCode === 27;
+  }
+  function getReactVersion() {
+    const parts = React__namespace.version.split(".");
+    return {
+      major: +parts[0],
+      minor: +parts[1],
+      patch: +parts[2]
+    };
+  }
+  function getChildRef(element) {
+    if (!element || typeof element === "function") {
+      return null;
     }
-  );
-  Col.displayName = "Col";
-  const FormLabel = /* @__PURE__ */ React__namespace.forwardRef(({
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    as: Component = "label",
-    bsPrefix,
-    column = false,
-    visuallyHidden = false,
-    className,
-    htmlFor,
-    ...props
-  }, ref) => {
     const {
-      controlId
-    } = React.useContext(FormContext);
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-label");
-    let columnClass = "col-form-label";
-    if (typeof column === "string") columnClass = `${columnClass} ${columnClass}-${column}`;
-    const classes = classNames(className, bsPrefix, visuallyHidden && "visually-hidden", column && columnClass);
-    process.env.NODE_ENV !== "production" ? warning(controlId == null || !htmlFor, "`controlId` is ignored on `<FormLabel>` when `htmlFor` is specified.") : void 0;
-    htmlFor = htmlFor || controlId;
-    if (column) return /* @__PURE__ */ jsxRuntimeExports.jsx(Col, {
-      ref,
-      as: "label",
-      className: classes,
-      htmlFor,
-      ...props
-    });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-      ref,
-      className: classes,
-      htmlFor,
-      ...props
+      major
+    } = getReactVersion();
+    const childRef = major >= 19 ? element.props.ref : element.ref;
+    return childRef;
+  }
+  const canUseDOM = !!(typeof window !== "undefined" && window.document && window.document.createElement);
+  var optionsSupported = false;
+  var onceSupported = false;
+  try {
+    var options = {
+      get passive() {
+        return optionsSupported = true;
+      },
+      get once() {
+        return onceSupported = optionsSupported = true;
+      }
+    };
+    if (canUseDOM) {
+      window.addEventListener("test", options, options);
+      window.removeEventListener("test", options, true);
+    }
+  } catch (e) {
+  }
+  function addEventListener(node, eventName, handler, options2) {
+    if (options2 && typeof options2 !== "boolean" && !onceSupported) {
+      var once = options2.once, capture = options2.capture;
+      var wrappedHandler = handler;
+      if (!onceSupported && once) {
+        wrappedHandler = handler.__once || function onceHandler(event) {
+          this.removeEventListener(eventName, onceHandler, capture);
+          handler.call(this, event);
+        };
+        handler.__once = wrappedHandler;
+      }
+      node.addEventListener(eventName, wrappedHandler, optionsSupported ? options2 : capture);
+    }
+    node.addEventListener(eventName, handler, options2);
+  }
+  function removeEventListener(node, eventName, handler, options2) {
+    var capture = options2 && typeof options2 !== "boolean" ? options2.capture : options2;
+    node.removeEventListener(eventName, handler, capture);
+    if (handler.__once) {
+      node.removeEventListener(eventName, handler.__once, capture);
+    }
+  }
+  function listen(node, eventName, handler, options2) {
+    addEventListener(node, eventName, handler, options2);
+    return function() {
+      removeEventListener(node, eventName, handler, options2);
+    };
+  }
+  function triggerEvent(node, eventName, bubbles, cancelable) {
+    if (cancelable === void 0) {
+      cancelable = true;
+    }
+    if (node) {
+      var event = document.createEvent("HTMLEvents");
+      event.initEvent(eventName, bubbles, cancelable);
+      node.dispatchEvent(event);
+    }
+  }
+  function parseDuration$1(node) {
+    var str = style(node, "transitionDuration") || "";
+    var mult = str.indexOf("ms") === -1 ? 1e3 : 1;
+    return parseFloat(str) * mult;
+  }
+  function emulateTransitionEnd(element, duration2, padding2) {
+    if (padding2 === void 0) {
+      padding2 = 5;
+    }
+    var called = false;
+    var handle = setTimeout(function() {
+      if (!called) triggerEvent(element, "transitionend", true);
+    }, duration2 + padding2);
+    var remove = listen(element, "transitionend", function() {
+      called = true;
+    }, {
+      once: true
     });
-  });
-  FormLabel.displayName = "FormLabel";
-  const FormRange = /* @__PURE__ */ React__namespace.forwardRef(({
-    bsPrefix,
-    className,
-    id,
+    return function() {
+      clearTimeout(handle);
+      remove();
+    };
+  }
+  function transitionEnd(element, handler, duration2, padding2) {
+    if (duration2 == null) duration2 = parseDuration$1(element) || 0;
+    var removeEmulate = emulateTransitionEnd(element, duration2, padding2);
+    var remove = listen(element, "transitionend", handler);
+    return function() {
+      removeEmulate();
+      remove();
+    };
+  }
+  function parseDuration(node, property) {
+    const str = style(node, property) || "";
+    const mult = str.indexOf("ms") === -1 ? 1e3 : 1;
+    return parseFloat(str) * mult;
+  }
+  function transitionEndListener(element, handler) {
+    const duration2 = parseDuration(element, "transitionDuration");
+    const delay = parseDuration(element, "transitionDelay");
+    const remove = transitionEnd(element, (e) => {
+      if (e.target === element) {
+        remove();
+        handler(e);
+      }
+    }, duration2 + delay);
+  }
+  function triggerBrowserReflow(node) {
+    node.offsetHeight;
+  }
+  const toFnRef$1 = (ref) => !ref || typeof ref === "function" ? ref : (value) => {
+    ref.current = value;
+  };
+  function mergeRefs$1(refA, refB) {
+    const a = toFnRef$1(refA);
+    const b = toFnRef$1(refB);
+    return (value) => {
+      if (a) a(value);
+      if (b) b(value);
+    };
+  }
+  function useMergedRefs$1(refA, refB) {
+    return React.useMemo(() => mergeRefs$1(refA, refB), [refA, refB]);
+  }
+  function safeFindDOMNode(componentOrElement) {
+    if (componentOrElement && "setState" in componentOrElement) {
+      return ReactDOM.findDOMNode(componentOrElement);
+    }
+    return componentOrElement != null ? componentOrElement : null;
+  }
+  const TransitionWrapper = /* @__PURE__ */ React.forwardRef(({
+    onEnter,
+    onEntering,
+    onEntered,
+    onExit,
+    onExiting,
+    onExited,
+    addEndListener,
+    children,
+    childRef,
     ...props
   }, ref) => {
-    const {
-      controlId
-    } = React.useContext(FormContext);
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-range");
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("input", {
-      ...props,
-      type: "range",
+    const nodeRef = React.useRef(null);
+    const mergedRef = useMergedRefs$1(nodeRef, childRef);
+    const attachRef = (r2) => {
+      mergedRef(safeFindDOMNode(r2));
+    };
+    const normalize = (callback) => (param) => {
+      if (callback && nodeRef.current) {
+        callback(nodeRef.current, param);
+      }
+    };
+    const handleEnter = React.useCallback(normalize(onEnter), [onEnter]);
+    const handleEntering = React.useCallback(normalize(onEntering), [onEntering]);
+    const handleEntered = React.useCallback(normalize(onEntered), [onEntered]);
+    const handleExit = React.useCallback(normalize(onExit), [onExit]);
+    const handleExiting = React.useCallback(normalize(onExiting), [onExiting]);
+    const handleExited = React.useCallback(normalize(onExited), [onExited]);
+    const handleAddEndListener = React.useCallback(normalize(addEndListener), [addEndListener]);
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(Transition, {
       ref,
-      className: classNames(className, bsPrefix),
-      id: id || controlId
-    });
-  });
-  FormRange.displayName = "FormRange";
-  const FormSelect = /* @__PURE__ */ React__namespace.forwardRef(({
-    bsPrefix,
-    size,
-    htmlSize,
-    className,
-    isValid = false,
-    isInvalid = false,
-    id,
-    ...props
-  }, ref) => {
-    const {
-      controlId
-    } = React.useContext(FormContext);
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-select");
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("select", {
       ...props,
-      size: htmlSize,
-      ref,
-      className: classNames(className, bsPrefix, size && `${bsPrefix}-${size}`, isValid && `is-valid`, isInvalid && `is-invalid`),
-      id: id || controlId
+      onEnter: handleEnter,
+      onEntered: handleEntered,
+      onEntering: handleEntering,
+      onExit: handleExit,
+      onExited: handleExited,
+      onExiting: handleExiting,
+      addEndListener: handleAddEndListener,
+      nodeRef,
+      children: typeof children === "function" ? (status, innerProps) => (
+        // TODO: Types for RTG missing innerProps, so need to cast.
+        children(status, {
+          ...innerProps,
+          ref: attachRef
+        })
+      ) : /* @__PURE__ */ React.cloneElement(children, {
+        ref: attachRef
+      })
     });
   });
-  FormSelect.displayName = "FormSelect";
-  const FormText = /* @__PURE__ */ React__namespace.forwardRef(
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    ({
-      bsPrefix,
-      className,
-      as: Component = "small",
-      muted,
-      ...props
-    }, ref) => {
-      bsPrefix = useBootstrapPrefix(bsPrefix, "form-text");
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-        ...props,
-        ref,
-        className: classNames(className, bsPrefix, muted && "text-muted")
-      });
-    }
-  );
-  FormText.displayName = "FormText";
-  const Switch = /* @__PURE__ */ React__namespace.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(FormCheck$1, {
-    ...props,
-    ref,
-    type: "switch"
-  }));
-  Switch.displayName = "Switch";
-  const Switch$1 = Object.assign(Switch, {
-    Input: FormCheck$1.Input,
-    Label: FormCheck$1.Label
-  });
-  const FloatingLabel = /* @__PURE__ */ React__namespace.forwardRef(({
-    bsPrefix,
+  TransitionWrapper.displayName = "TransitionWrapper";
+  function useCommittedRef$1(value) {
+    const ref = React.useRef(value);
+    React.useEffect(() => {
+      ref.current = value;
+    }, [value]);
+    return ref;
+  }
+  function useEventCallback$1(fn) {
+    const ref = useCommittedRef$1(fn);
+    return React.useCallback(function(...args) {
+      return ref.current && ref.current(...args);
+    }, [ref]);
+  }
+  function useCallbackRef() {
+    return React.useState(null);
+  }
+  function useCommittedRef(value) {
+    const ref = React.useRef(value);
+    React.useEffect(() => {
+      ref.current = value;
+    }, [value]);
+    return ref;
+  }
+  function useEventCallback(fn) {
+    const ref = useCommittedRef(fn);
+    return React.useCallback(function(...args) {
+      return ref.current && ref.current(...args);
+    }, [ref]);
+  }
+  function useMounted$1() {
+    const mounted = React.useRef(true);
+    const isMounted = React.useRef(() => mounted.current);
+    React.useEffect(() => {
+      mounted.current = true;
+      return () => {
+        mounted.current = false;
+      };
+    }, []);
+    return isMounted.current;
+  }
+  const isReactNative$1 = typeof global !== "undefined" && // @ts-ignore
+  global.navigator && // @ts-ignore
+  global.navigator.product === "ReactNative";
+  const isDOM$1 = typeof document !== "undefined";
+  const useIsomorphicEffect$1 = isDOM$1 || isReactNative$1 ? React.useLayoutEffect : React.useEffect;
+  const fadeStyles = {
+    [ENTERING]: "show",
+    [ENTERED]: "show"
+  };
+  const Fade = /* @__PURE__ */ React__namespace.forwardRef(({
     className,
     children,
-    controlId,
-    label,
-    ...props
+    transitionClasses = {},
+    onEnter,
+    ...rest
   }, ref) => {
-    bsPrefix = useBootstrapPrefix(bsPrefix, "form-floating");
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs(FormGroup, {
+    const props = {
+      in: false,
+      timeout: 300,
+      mountOnEnter: false,
+      unmountOnExit: false,
+      appear: false,
+      ...rest
+    };
+    const handleEnter = React.useCallback((node, isAppearing) => {
+      triggerBrowserReflow(node);
+      onEnter == null || onEnter(node, isAppearing);
+    }, [onEnter]);
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(TransitionWrapper, {
       ref,
-      className: classNames(className, bsPrefix),
-      controlId,
+      addEndListener: transitionEndListener,
       ...props,
-      children: [children, /* @__PURE__ */ jsxRuntimeExports.jsx("label", {
-        htmlFor: controlId,
-        children: label
-      })]
+      onEnter: handleEnter,
+      childRef: getChildRef(children),
+      children: (status, innerProps) => /* @__PURE__ */ React__namespace.cloneElement(children, {
+        ...innerProps,
+        className: classNames("fade", className, children.props.className, fadeStyles[status], transitionClasses[status])
+      })
     });
   });
-  FloatingLabel.displayName = "FloatingLabel";
-  const propTypes = {
-    /**
-     * The Form `ref` will be forwarded to the underlying element,
-     * which means, unless it's rendered `as` a composite component,
-     * it will be a DOM node, when resolved.
-     *
-     * @type {ReactRef}
-     * @alias ref
-     */
-    _ref: PropTypes.any,
-    /**
-     * Mark a form as having been validated. Setting it to `true` will
-     * toggle any validation styles on the forms elements.
-     */
-    validated: PropTypes.bool,
-    as: PropTypes.elementType
-  };
-  const Form = /* @__PURE__ */ React__namespace.forwardRef(({
-    className,
-    validated,
-    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
-    as: Component = "form",
-    ...props
-  }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
-    ...props,
-    ref,
-    className: classNames(className, validated && "was-validated")
-  }));
-  Form.displayName = "Form";
-  Form.propTypes = propTypes;
-  const Form$1 = Object.assign(Form, {
-    Group: FormGroup,
-    Control: FormControl$1,
-    Floating: FormFloating,
-    Check: FormCheck$1,
-    Switch: Switch$1,
-    Label: FormLabel,
-    Text: FormText,
-    Range: FormRange,
-    Select: FormSelect,
-    FloatingLabel
-  });
-  function FaCheck(props) {
-    return GenIcon({ "attr": { "viewBox": "0 0 512 512" }, "child": [{ "tag": "path", "attr": { "d": "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" }, "child": [] }] })(props);
+  Fade.displayName = "Fade";
+  function useMounted() {
+    const mounted = React.useRef(true);
+    const isMounted = React.useRef(() => mounted.current);
+    React.useEffect(() => {
+      mounted.current = true;
+      return () => {
+        mounted.current = false;
+      };
+    }, []);
+    return isMounted.current;
   }
-  function FaChevronDown(props) {
-    return GenIcon({ "attr": { "viewBox": "0 0 448 512" }, "child": [{ "tag": "path", "attr": { "d": "M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z" }, "child": [] }] })(props);
+  function useUpdatedRef(value) {
+    const valueRef = React.useRef(value);
+    valueRef.current = value;
+    return valueRef;
   }
-  function FaChevronUp(props) {
-    return GenIcon({ "attr": { "viewBox": "0 0 448 512" }, "child": [{ "tag": "path", "attr": { "d": "M240.971 130.524l194.343 194.343c9.373 9.373 9.373 24.569 0 33.941l-22.667 22.667c-9.357 9.357-24.522 9.375-33.901.04L224 227.495 69.255 381.516c-9.379 9.335-24.544 9.317-33.901-.04l-22.667-22.667c-9.373-9.373-9.373-24.569 0-33.941L207.03 130.525c9.372-9.373 24.568-9.373 33.941-.001z" }, "child": [] }] })(props);
+  function useWillUnmount(fn) {
+    const onUnmount = useUpdatedRef(fn);
+    React.useEffect(() => () => onUnmount.current(), []);
   }
-  const ComboDropdown = ({
-    label,
-    options: options2 = [],
-    placeholder = "",
-    onChange,
-    name,
-    value,
-    error,
-    disabled,
-    height: height2 = "40px",
-    isPassword = false,
-    mode = "both",
-    // 'select' | 'type' | 'both'
-    isRequired = false,
-    selectedBgColor = "#dee2e6",
-    selectedTextColor = "black",
-    optionLabelKey = "label",
-    optionValueKey = "value"
-  }) => {
-    const [inputValue, setInputValue] = React.useState("");
-    const [filteredOptions, setFilteredOptions] = React.useState([]);
-    const [showDropdown, setShowDropdown] = React.useState(false);
-    const [highlightIndex, setHighlightIndex] = React.useState(-1);
-    const inputRef = React.useRef();
-    const wrapperRef = React.useRef();
-    React.useEffect(() => {
-      const matchedOption = options2.find(
-        (opt) => typeof opt === "string" ? opt === value : opt[optionValueKey] === value
-      );
-      const label2 = typeof matchedOption === "string" ? matchedOption : (matchedOption == null ? void 0 : matchedOption[optionLabelKey]) || "";
-      setInputValue(label2);
-      if (mode !== "type") {
-        setFilteredOptions(normalizeOptions(options2));
-      }
-    }, [value, options2]);
-    const normalizeOptions = (opts) => {
-      return opts.map((opt) => {
-        if (typeof opt === "string") {
-          return { label: opt, value: opt };
-        }
-        return {
-          label: opt[optionLabelKey],
-          value: opt[optionValueKey]
-        };
-      });
-    };
-    const handleInputChange = (e) => {
-      const val = e.target.value;
-      setInputValue(val);
-      if (mode !== "select") {
-        if (name) onChange(name, val);
-        else onChange(val);
-      }
-      if (mode !== "type") {
-        const normalized = normalizeOptions(options2);
-        const filtered = normalized.filter(
-          (opt) => {
-            var _a;
-            return (_a = opt.label) == null ? void 0 : _a.toLowerCase().includes(val.toLowerCase());
-          }
-        );
-        setFilteredOptions(filtered);
-        setShowDropdown(true);
-        setHighlightIndex(-1);
-      }
-    };
-    const handleSelect = (val, label2) => {
-      setInputValue(label2);
-      if (name) {
-        onChange(name, val);
-      } else {
-        onChange(val);
-      }
-      setShowDropdown(false);
-      setHighlightIndex(-1);
-    };
-    const handleKeyDown = (e) => {
-      if (!showDropdown || filteredOptions.length === 0) return;
-      if (e.key === "ArrowDown") {
-        e.preventDefault();
-        setHighlightIndex(
-          (prev) => prev < filteredOptions.length - 1 ? prev + 1 : 0
-        );
-      }
-      if (e.key === "ArrowUp") {
-        e.preventDefault();
-        setHighlightIndex(
-          (prev) => prev > 0 ? prev - 1 : filteredOptions.length - 1
-        );
-      }
-      if (e.key === "Enter") {
-        e.preventDefault();
-        if (highlightIndex >= 0) {
-          const selected = filteredOptions[highlightIndex];
-          handleSelect(selected.value, selected.label);
+  const MAX_DELAY_MS = 2 ** 31 - 1;
+  function setChainedTimeout(handleRef, fn, timeoutAtMs) {
+    const delayMs = timeoutAtMs - Date.now();
+    handleRef.current = delayMs <= MAX_DELAY_MS ? setTimeout(fn, delayMs) : setTimeout(() => setChainedTimeout(handleRef, fn, timeoutAtMs), MAX_DELAY_MS);
+  }
+  function useTimeout() {
+    const isMounted = useMounted();
+    const handleRef = React.useRef();
+    useWillUnmount(() => clearTimeout(handleRef.current));
+    return React.useMemo(() => {
+      const clear = () => clearTimeout(handleRef.current);
+      function set(fn, delayMs = 0) {
+        if (!isMounted()) return;
+        clear();
+        if (delayMs <= MAX_DELAY_MS) {
+          handleRef.current = setTimeout(fn, delayMs);
+        } else {
+          setChainedTimeout(handleRef, fn, Date.now() + delayMs);
         }
       }
-    };
-    const getPlaceholder = () => {
-      if (placeholder) return placeholder;
-      if (mode === "select") return "Select an option...";
-      if (mode === "type") return "Type a value...";
-      return "Select or type...";
-    };
-    const toggleDropdown = () => {
-      if (disabled) return;
-      if (!showDropdown && mode !== "type") {
-        setFilteredOptions(normalizeOptions(options2));
-      }
-      setShowDropdown((prev) => {
-        var _a;
-        const willShow = !prev;
-        if (willShow) (_a = inputRef.current) == null ? void 0 : _a.focus();
-        return willShow;
-      });
-    };
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs(Form$1.Group, { ref: wrapperRef, className: "mb-3 position-relative", children: [
-      label && /* @__PURE__ */ jsxRuntimeExports.jsxs(Form$1.Label, { style: { display: "flex", fontWeight: "500", fontSize: "14px", lineHeight: "20px", color: "#212529", textTransform: "capitalize", marginBottom: "0.5rem" }, children: [
-        label,
-        isRequired && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { color: "red" }, children: "*" })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "d-flex position-relative", children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          Form$1.Control,
-          {
-            ref: inputRef,
-            type: isPassword ? "password" : "text",
-            placeholder: getPlaceholder(),
-            style: {
-              borderColor: "#12AB5B",
-              height: height2,
-              paddingRight: "2rem"
-            },
-            name,
-            value: inputValue,
-            onChange: handleInputChange,
-            onFocus: () => {
-              if (mode !== "type") {
-                setFilteredOptions(normalizeOptions(options2));
-                setShowDropdown(true);
-              }
-            },
-            onClick: () => {
-              if (mode !== "type") {
-                setFilteredOptions(normalizeOptions(options2));
-                setShowDropdown(true);
-              }
-            },
-            onKeyDown: handleKeyDown,
-            isInvalid: !!error,
-            disabled,
-            readOnly: mode === "select",
-            autoComplete: "off"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntimeExports.jsx(
-          "div",
-          {
-            className: "position-absolute end-0 top-0 d-flex align-items-center justify-content-center",
-            onMouseDown: (e) => e.preventDefault(),
-            onClick: toggleDropdown,
-            style: {
-              width: "2rem",
-              height: height2,
-              cursor: "pointer",
-              border: "1px solid #12AB5B",
-              borderLeft: "none",
-              borderTopRightRadius: "0.375rem",
-              borderBottomRightRadius: "0.375rem",
-              background: "#fff"
-            },
-            children: showDropdown ? /* @__PURE__ */ jsxRuntimeExports.jsx(FaChevronUp, { size: 12 }) : /* @__PURE__ */ jsxRuntimeExports.jsx(FaChevronDown, { size: 12 })
-          }
-        )
-      ] }),
-      showDropdown && filteredOptions.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "ul",
-        {
-          className: "list-group position-absolute w-100 z-3",
-          style: { maxHeight: "200px", overflowY: "auto", boxShadow: "5px 5px 15px lightgray" },
-          children: filteredOptions.map((opt, index) => {
-            const isSelected = opt.value === value;
-            const isHighlighted = index === highlightIndex;
-            return /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "li",
-              {
-                className: "list-group-item list-group-item-action",
-                onMouseDown: (e) => e.preventDefault(),
-                onClick: () => handleSelect(opt.value, opt.label),
-                style: {
-                  cursor: "pointer",
-                  fontSize: "12px",
-                  textAlign: "left",
-                  backgroundColor: isHighlighted ? "#e9ecef" : isSelected ? selectedBgColor : "white",
-                  color: isSelected ? selectedTextColor : "black",
-                  padding: "8px 12px"
-                },
-                children: opt.label
-              },
-              index
-            );
-          })
-        }
-      ),
-      error && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "invalid-feedback d-block", children: error })
-    ] });
-  };
-  function useUncontrolledProp(propValue, defaultValue, handler) {
-    var wasPropRef = React.useRef(propValue !== void 0);
-    var _useState = React.useState(defaultValue), stateValue = _useState[0], setState = _useState[1];
-    var isProp = propValue !== void 0;
-    var wasProp = wasPropRef.current;
-    wasPropRef.current = isProp;
-    if (!isProp && wasProp && stateValue !== defaultValue) {
-      setState(defaultValue);
-    }
-    return [isProp ? propValue : stateValue, React.useCallback(function(value) {
-      for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-        args[_key - 1] = arguments[_key];
-      }
-      if (handler) handler.apply(void 0, [value].concat(args));
-      setState(value);
-    }, [handler])];
-  }
-  function ownerDocument(node) {
-    return node && node.ownerDocument || document;
-  }
-  function ownerWindow(node) {
-    var doc = ownerDocument(node);
-    return doc && doc.defaultView || window;
-  }
-  function getComputedStyle(node, psuedoElement) {
-    return ownerWindow(node).getComputedStyle(node, psuedoElement);
-  }
-  var rUpper = /([A-Z])/g;
-  function hyphenate(string) {
-    return string.replace(rUpper, "-$1").toLowerCase();
-  }
-  var msPattern = /^ms-/;
-  function hyphenateStyleName(string) {
-    return hyphenate(string).replace(msPattern, "-ms-");
+      return {
+        set,
+        clear,
+        handleRef
+      };
+    }, []);
   }
-  var supportedTransforms = /^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i;
-  function isTransform(value) {
-    return !!(value && supportedTransforms.test(value));
+  function hasChildOfType(children, type) {
+    return React__namespace.Children.toArray(children).some((child) => /* @__PURE__ */ React__namespace.isValidElement(child) && child.type === type);
   }
-  function style(node, property) {
-    var css = "";
-    var transforms = "";
-    if (typeof property === "string") {
-      return node.style.getPropertyValue(hyphenateStyleName(property)) || getComputedStyle(node).getPropertyValue(hyphenateStyleName(property));
-    }
-    Object.keys(property).forEach(function(key) {
-      var value = property[key];
-      if (!value && value !== 0) {
-        node.style.removeProperty(hyphenateStyleName(key));
-      } else if (isTransform(key)) {
-        transforms += key + "(" + value + ") ";
+  function useCol({
+    as,
+    bsPrefix,
+    className,
+    ...props
+  }) {
+    bsPrefix = useBootstrapPrefix(bsPrefix, "col");
+    const breakpoints = useBootstrapBreakpoints();
+    const minBreakpoint = useBootstrapMinBreakpoint();
+    const spans = [];
+    const classes = [];
+    breakpoints.forEach((brkPoint) => {
+      const propValue = props[brkPoint];
+      delete props[brkPoint];
+      let span;
+      let offset2;
+      let order2;
+      if (typeof propValue === "object" && propValue != null) {
+        ({
+          span,
+          offset: offset2,
+          order: order2
+        } = propValue);
       } else {
-        css += hyphenateStyleName(key) + ": " + value + ";";
+        span = propValue;
       }
+      const infix = brkPoint !== minBreakpoint ? `-${brkPoint}` : "";
+      if (span) spans.push(span === true ? `${bsPrefix}${infix}` : `${bsPrefix}${infix}-${span}`);
+      if (order2 != null) classes.push(`order${infix}-${order2}`);
+      if (offset2 != null) classes.push(`offset${infix}-${offset2}`);
     });
-    if (transforms) {
-      css += "transform: " + transforms + ";";
-    }
-    node.style.cssText += ";" + css;
-  }
-  function isEscKey(e) {
-    return e.code === "Escape" || e.keyCode === 27;
-  }
-  function getReactVersion() {
-    const parts = React__namespace.version.split(".");
-    return {
-      major: +parts[0],
-      minor: +parts[1],
-      patch: +parts[2]
-    };
+    return [{
+      ...props,
+      className: classNames(className, ...spans, ...classes)
+    }, {
+      as,
+      bsPrefix,
+      spans
+    }];
   }
-  function getChildRef(element) {
-    if (!element || typeof element === "function") {
-      return null;
+  const Col = /* @__PURE__ */ React__namespace.forwardRef(
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    (props, ref) => {
+      const [{
+        className,
+        ...colProps
+      }, {
+        as: Component = "div",
+        bsPrefix,
+        spans
+      }] = useCol(props);
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+        ...colProps,
+        ref,
+        className: classNames(className, !spans.length && bsPrefix)
+      });
     }
-    const {
-      major
-    } = getReactVersion();
-    const childRef = major >= 19 ? element.props.ref : element.ref;
-    return childRef;
-  }
-  const canUseDOM = !!(typeof window !== "undefined" && window.document && window.document.createElement);
-  var optionsSupported = false;
-  var onceSupported = false;
-  try {
-    var options = {
-      get passive() {
-        return optionsSupported = true;
-      },
-      get once() {
-        return onceSupported = optionsSupported = true;
-      }
-    };
-    if (canUseDOM) {
-      window.addEventListener("test", options, options);
-      window.removeEventListener("test", options, true);
+  );
+  Col.displayName = "Col";
+  var has = Object.prototype.hasOwnProperty;
+  function find(iter, tar, key) {
+    for (key of iter.keys()) {
+      if (dequal(key, tar)) return key;
     }
-  } catch (e) {
   }
-  function addEventListener(node, eventName, handler, options2) {
-    if (options2 && typeof options2 !== "boolean" && !onceSupported) {
-      var once = options2.once, capture = options2.capture;
-      var wrappedHandler = handler;
-      if (!onceSupported && once) {
-        wrappedHandler = handler.__once || function onceHandler(event) {
-          this.removeEventListener(eventName, onceHandler, capture);
-          handler.call(this, event);
-        };
-        handler.__once = wrappedHandler;
+  function dequal(foo, bar) {
+    var ctor, len, tmp;
+    if (foo === bar) return true;
+    if (foo && bar && (ctor = foo.constructor) === bar.constructor) {
+      if (ctor === Date) return foo.getTime() === bar.getTime();
+      if (ctor === RegExp) return foo.toString() === bar.toString();
+      if (ctor === Array) {
+        if ((len = foo.length) === bar.length) {
+          while (len-- && dequal(foo[len], bar[len])) ;
+        }
+        return len === -1;
+      }
+      if (ctor === Set) {
+        if (foo.size !== bar.size) {
+          return false;
+        }
+        for (len of foo) {
+          tmp = len;
+          if (tmp && typeof tmp === "object") {
+            tmp = find(bar, tmp);
+            if (!tmp) return false;
+          }
+          if (!bar.has(tmp)) return false;
+        }
+        return true;
+      }
+      if (ctor === Map) {
+        if (foo.size !== bar.size) {
+          return false;
+        }
+        for (len of foo) {
+          tmp = len[0];
+          if (tmp && typeof tmp === "object") {
+            tmp = find(bar, tmp);
+            if (!tmp) return false;
+          }
+          if (!dequal(len[1], bar.get(tmp))) {
+            return false;
+          }
+        }
+        return true;
+      }
+      if (ctor === ArrayBuffer) {
+        foo = new Uint8Array(foo);
+        bar = new Uint8Array(bar);
+      } else if (ctor === DataView) {
+        if ((len = foo.byteLength) === bar.byteLength) {
+          while (len-- && foo.getInt8(len) === bar.getInt8(len)) ;
+        }
+        return len === -1;
+      }
+      if (ArrayBuffer.isView(foo)) {
+        if ((len = foo.byteLength) === bar.byteLength) {
+          while (len-- && foo[len] === bar[len]) ;
+        }
+        return len === -1;
+      }
+      if (!ctor || typeof foo === "object") {
+        len = 0;
+        for (ctor in foo) {
+          if (has.call(foo, ctor) && ++len && !has.call(bar, ctor)) return false;
+          if (!(ctor in bar) || !dequal(foo[ctor], bar[ctor])) return false;
+        }
+        return Object.keys(bar).length === len;
       }
-      node.addEventListener(eventName, wrappedHandler, optionsSupported ? options2 : capture);
-    }
-    node.addEventListener(eventName, handler, options2);
-  }
-  function removeEventListener(node, eventName, handler, options2) {
-    var capture = options2 && typeof options2 !== "boolean" ? options2.capture : options2;
-    node.removeEventListener(eventName, handler, capture);
-    if (handler.__once) {
-      node.removeEventListener(eventName, handler.__once, capture);
-    }
-  }
-  function listen(node, eventName, handler, options2) {
-    addEventListener(node, eventName, handler, options2);
-    return function() {
-      removeEventListener(node, eventName, handler, options2);
-    };
-  }
-  function triggerEvent(node, eventName, bubbles, cancelable) {
-    if (cancelable === void 0) {
-      cancelable = true;
-    }
-    if (node) {
-      var event = document.createEvent("HTMLEvents");
-      event.initEvent(eventName, bubbles, cancelable);
-      node.dispatchEvent(event);
     }
+    return foo !== foo && bar !== bar;
   }
-  function parseDuration$1(node) {
-    var str = style(node, "transitionDuration") || "";
-    var mult = str.indexOf("ms") === -1 ? 1e3 : 1;
-    return parseFloat(str) * mult;
+  function useSafeState(state) {
+    const isMounted = useMounted$1();
+    return [state[0], React.useCallback((nextState) => {
+      if (!isMounted()) return;
+      return state[1](nextState);
+    }, [isMounted, state[1]])];
   }
-  function emulateTransitionEnd(element, duration2, padding2) {
-    if (padding2 === void 0) {
-      padding2 = 5;
+  const createPopper = popperGenerator({
+    defaultModifiers: [hide$1, popperOffsets$1, computeStyles$1, eventListeners, offset$1, flip$1, preventOverflow$1, arrow$1]
+  });
+  const _excluded$2 = ["enabled", "placement", "strategy", "modifiers"];
+  function _objectWithoutPropertiesLoose$2(r2, e) {
+    if (null == r2) return {};
+    var t = {};
+    for (var n in r2) if ({}.hasOwnProperty.call(r2, n)) {
+      if (e.indexOf(n) >= 0) continue;
+      t[n] = r2[n];
     }
-    var called = false;
-    var handle = setTimeout(function() {
-      if (!called) triggerEvent(element, "transitionend", true);
-    }, duration2 + padding2);
-    var remove = listen(element, "transitionend", function() {
-      called = true;
-    }, {
-      once: true
-    });
-    return function() {
-      clearTimeout(handle);
-      remove();
-    };
-  }
-  function transitionEnd(element, handler, duration2, padding2) {
-    if (duration2 == null) duration2 = parseDuration$1(element) || 0;
-    var removeEmulate = emulateTransitionEnd(element, duration2, padding2);
-    var remove = listen(element, "transitionend", handler);
-    return function() {
-      removeEmulate();
-      remove();
-    };
-  }
-  function parseDuration(node, property) {
-    const str = style(node, property) || "";
-    const mult = str.indexOf("ms") === -1 ? 1e3 : 1;
-    return parseFloat(str) * mult;
-  }
-  function transitionEndListener(element, handler) {
-    const duration2 = parseDuration(element, "transitionDuration");
-    const delay = parseDuration(element, "transitionDelay");
-    const remove = transitionEnd(element, (e) => {
-      if (e.target === element) {
-        remove();
-        handler(e);
-      }
-    }, duration2 + delay);
-  }
-  function triggerBrowserReflow(node) {
-    node.offsetHeight;
+    return t;
   }
-  const toFnRef$1 = (ref) => !ref || typeof ref === "function" ? ref : (value) => {
-    ref.current = value;
+  const disabledApplyStylesModifier = {
+    name: "applyStyles",
+    enabled: false,
+    phase: "afterWrite",
+    fn: () => void 0
   };
-  function mergeRefs$1(refA, refB) {
-    const a = toFnRef$1(refA);
-    const b = toFnRef$1(refB);
-    return (value) => {
-      if (a) a(value);
-      if (b) b(value);
-    };
-  }
-  function useMergedRefs$1(refA, refB) {
-    return React.useMemo(() => mergeRefs$1(refA, refB), [refA, refB]);
-  }
-  function safeFindDOMNode(componentOrElement) {
-    if (componentOrElement && "setState" in componentOrElement) {
-      return ReactDOM.findDOMNode(componentOrElement);
+  const ariaDescribedByModifier = {
+    name: "ariaDescribedBy",
+    enabled: true,
+    phase: "afterWrite",
+    effect: ({
+      state
+    }) => () => {
+      const {
+        reference: reference2,
+        popper: popper2
+      } = state.elements;
+      if ("removeAttribute" in reference2) {
+        const ids = (reference2.getAttribute("aria-describedby") || "").split(",").filter((id) => id.trim() !== popper2.id);
+        if (!ids.length) reference2.removeAttribute("aria-describedby");
+        else reference2.setAttribute("aria-describedby", ids.join(","));
+      }
+    },
+    fn: ({
+      state
+    }) => {
+      var _popper$getAttribute;
+      const {
+        popper: popper2,
+        reference: reference2
+      } = state.elements;
+      const role = (_popper$getAttribute = popper2.getAttribute("role")) == null ? void 0 : _popper$getAttribute.toLowerCase();
+      if (popper2.id && role === "tooltip" && "setAttribute" in reference2) {
+        const ids = reference2.getAttribute("aria-describedby");
+        if (ids && ids.split(",").indexOf(popper2.id) !== -1) {
+          return;
+        }
+        reference2.setAttribute("aria-describedby", ids ? `${ids},${popper2.id}` : popper2.id);
+      }
     }
-    return componentOrElement != null ? componentOrElement : null;
-  }
-  const TransitionWrapper = /* @__PURE__ */ React.forwardRef(({
-    onEnter,
-    onEntering,
-    onEntered,
-    onExit,
-    onExiting,
-    onExited,
-    addEndListener,
-    children,
-    childRef,
-    ...props
-  }, ref) => {
-    const nodeRef = React.useRef(null);
-    const mergedRef = useMergedRefs$1(nodeRef, childRef);
-    const attachRef = (r2) => {
-      mergedRef(safeFindDOMNode(r2));
-    };
-    const normalize = (callback) => (param) => {
-      if (callback && nodeRef.current) {
-        callback(nodeRef.current, param);
+  };
+  const EMPTY_MODIFIERS = [];
+  function usePopper(referenceElement, popperElement, _ref = {}) {
+    let {
+      enabled = true,
+      placement = "bottom",
+      strategy = "absolute",
+      modifiers = EMPTY_MODIFIERS
+    } = _ref, config2 = _objectWithoutPropertiesLoose$2(_ref, _excluded$2);
+    const prevModifiers = React.useRef(modifiers);
+    const popperInstanceRef = React.useRef();
+    const update = React.useCallback(() => {
+      var _popperInstanceRef$cu;
+      (_popperInstanceRef$cu = popperInstanceRef.current) == null ? void 0 : _popperInstanceRef$cu.update();
+    }, []);
+    const forceUpdate = React.useCallback(() => {
+      var _popperInstanceRef$cu2;
+      (_popperInstanceRef$cu2 = popperInstanceRef.current) == null ? void 0 : _popperInstanceRef$cu2.forceUpdate();
+    }, []);
+    const [popperState, setState] = useSafeState(React.useState({
+      placement,
+      update,
+      forceUpdate,
+      attributes: {},
+      styles: {
+        popper: {},
+        arrow: {}
       }
-    };
-    const handleEnter = React.useCallback(normalize(onEnter), [onEnter]);
-    const handleEntering = React.useCallback(normalize(onEntering), [onEntering]);
-    const handleEntered = React.useCallback(normalize(onEntered), [onEntered]);
-    const handleExit = React.useCallback(normalize(onExit), [onExit]);
-    const handleExiting = React.useCallback(normalize(onExiting), [onExiting]);
-    const handleExited = React.useCallback(normalize(onExited), [onExited]);
-    const handleAddEndListener = React.useCallback(normalize(addEndListener), [addEndListener]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(Transition, {
-      ref,
-      ...props,
-      onEnter: handleEnter,
-      onEntered: handleEntered,
-      onEntering: handleEntering,
-      onExit: handleExit,
-      onExited: handleExited,
-      onExiting: handleExiting,
-      addEndListener: handleAddEndListener,
-      nodeRef,
-      children: typeof children === "function" ? (status, innerProps) => (
-        // TODO: Types for RTG missing innerProps, so need to cast.
-        children(status, {
-          ...innerProps,
-          ref: attachRef
-        })
-      ) : /* @__PURE__ */ React.cloneElement(children, {
-        ref: attachRef
-      })
-    });
-  });
-  TransitionWrapper.displayName = "TransitionWrapper";
-  function useCommittedRef$1(value) {
-    const ref = React.useRef(value);
-    React.useEffect(() => {
-      ref.current = value;
-    }, [value]);
-    return ref;
-  }
-  function useEventCallback$1(fn) {
-    const ref = useCommittedRef$1(fn);
-    return React.useCallback(function(...args) {
-      return ref.current && ref.current(...args);
-    }, [ref]);
-  }
-  function useCallbackRef() {
-    return React.useState(null);
-  }
-  function useCommittedRef(value) {
-    const ref = React.useRef(value);
-    React.useEffect(() => {
-      ref.current = value;
-    }, [value]);
-    return ref;
-  }
-  function useEventCallback(fn) {
-    const ref = useCommittedRef(fn);
-    return React.useCallback(function(...args) {
-      return ref.current && ref.current(...args);
-    }, [ref]);
-  }
-  function useMounted$1() {
-    const mounted = React.useRef(true);
-    const isMounted = React.useRef(() => mounted.current);
+    }));
+    const updateModifier = React.useMemo(() => ({
+      name: "updateStateModifier",
+      enabled: true,
+      phase: "write",
+      requires: ["computeStyles"],
+      fn: ({
+        state
+      }) => {
+        const styles = {};
+        const attributes = {};
+        Object.keys(state.elements).forEach((element) => {
+          styles[element] = state.styles[element];
+          attributes[element] = state.attributes[element];
+        });
+        setState({
+          state,
+          styles,
+          attributes,
+          update,
+          forceUpdate,
+          placement: state.placement
+        });
+      }
+    }), [update, forceUpdate, setState]);
+    const nextModifiers = React.useMemo(() => {
+      if (!dequal(prevModifiers.current, modifiers)) {
+        prevModifiers.current = modifiers;
+      }
+      return prevModifiers.current;
+    }, [modifiers]);
     React.useEffect(() => {
-      mounted.current = true;
-      return () => {
-        mounted.current = false;
-      };
-    }, []);
-    return isMounted.current;
-  }
-  const isReactNative$1 = typeof global !== "undefined" && // @ts-ignore
-  global.navigator && // @ts-ignore
-  global.navigator.product === "ReactNative";
-  const isDOM$1 = typeof document !== "undefined";
-  const useIsomorphicEffect$1 = isDOM$1 || isReactNative$1 ? React.useLayoutEffect : React.useEffect;
-  const fadeStyles = {
-    [ENTERING]: "show",
-    [ENTERED]: "show"
-  };
-  const Fade = /* @__PURE__ */ React__namespace.forwardRef(({
-    className,
-    children,
-    transitionClasses = {},
-    onEnter,
-    ...rest
-  }, ref) => {
-    const props = {
-      in: false,
-      timeout: 300,
-      mountOnEnter: false,
-      unmountOnExit: false,
-      appear: false,
-      ...rest
-    };
-    const handleEnter = React.useCallback((node, isAppearing) => {
-      triggerBrowserReflow(node);
-      onEnter == null || onEnter(node, isAppearing);
-    }, [onEnter]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(TransitionWrapper, {
-      ref,
-      addEndListener: transitionEndListener,
-      ...props,
-      onEnter: handleEnter,
-      childRef: getChildRef(children),
-      children: (status, innerProps) => /* @__PURE__ */ React__namespace.cloneElement(children, {
-        ...innerProps,
-        className: classNames("fade", className, children.props.className, fadeStyles[status], transitionClasses[status])
-      })
-    });
-  });
-  Fade.displayName = "Fade";
-  function useMounted() {
-    const mounted = React.useRef(true);
-    const isMounted = React.useRef(() => mounted.current);
+      if (!popperInstanceRef.current || !enabled) return;
+      popperInstanceRef.current.setOptions({
+        placement,
+        strategy,
+        modifiers: [...nextModifiers, updateModifier, disabledApplyStylesModifier]
+      });
+    }, [strategy, placement, updateModifier, enabled, nextModifiers]);
     React.useEffect(() => {
-      mounted.current = true;
+      if (!enabled || referenceElement == null || popperElement == null) {
+        return void 0;
+      }
+      popperInstanceRef.current = createPopper(referenceElement, popperElement, Object.assign({}, config2, {
+        placement,
+        strategy,
+        modifiers: [...nextModifiers, ariaDescribedByModifier, updateModifier]
+      }));
       return () => {
-        mounted.current = false;
-      };
-    }, []);
-    return isMounted.current;
-  }
-  function useUpdatedRef(value) {
-    const valueRef = React.useRef(value);
-    valueRef.current = value;
-    return valueRef;
-  }
-  function useWillUnmount(fn) {
-    const onUnmount = useUpdatedRef(fn);
-    React.useEffect(() => () => onUnmount.current(), []);
-  }
-  const MAX_DELAY_MS = 2 ** 31 - 1;
-  function setChainedTimeout(handleRef, fn, timeoutAtMs) {
-    const delayMs = timeoutAtMs - Date.now();
-    handleRef.current = delayMs <= MAX_DELAY_MS ? setTimeout(fn, delayMs) : setTimeout(() => setChainedTimeout(handleRef, fn, timeoutAtMs), MAX_DELAY_MS);
-  }
-  function useTimeout() {
-    const isMounted = useMounted();
-    const handleRef = React.useRef();
-    useWillUnmount(() => clearTimeout(handleRef.current));
-    return React.useMemo(() => {
-      const clear = () => clearTimeout(handleRef.current);
-      function set(fn, delayMs = 0) {
-        if (!isMounted()) return;
-        clear();
-        if (delayMs <= MAX_DELAY_MS) {
-          handleRef.current = setTimeout(fn, delayMs);
-        } else {
-          setChainedTimeout(handleRef, fn, Date.now() + delayMs);
+        if (popperInstanceRef.current != null) {
+          popperInstanceRef.current.destroy();
+          popperInstanceRef.current = void 0;
+          setState((s) => Object.assign({}, s, {
+            attributes: {},
+            styles: {
+              popper: {}
+            }
+          }));
         }
-      }
-      return {
-        set,
-        clear,
-        handleRef
       };
-    }, []);
+    }, [enabled, referenceElement, popperElement]);
+    return popperState;
   }
-  var has = Object.prototype.hasOwnProperty;
-  function find(iter, tar, key) {
-    for (key of iter.keys()) {
-      if (dequal(key, tar)) return key;
-    }
+  function contains(context2, node) {
+    if (context2.contains) return context2.contains(node);
+    if (context2.compareDocumentPosition) return context2 === node || !!(context2.compareDocumentPosition(node) & 16);
   }
-  function dequal(foo, bar) {
-    var ctor, len, tmp;
-    if (foo === bar) return true;
-    if (foo && bar && (ctor = foo.constructor) === bar.constructor) {
-      if (ctor === Date) return foo.getTime() === bar.getTime();
-      if (ctor === RegExp) return foo.toString() === bar.toString();
-      if (ctor === Array) {
-        if ((len = foo.length) === bar.length) {
-          while (len-- && dequal(foo[len], bar[len])) ;
+  var warning_1;
+  var hasRequiredWarning;
+  function requireWarning() {
+    if (hasRequiredWarning) return warning_1;
+    hasRequiredWarning = 1;
+    var __DEV__ = process.env.NODE_ENV !== "production";
+    var warning2 = function() {
+    };
+    if (__DEV__) {
+      var printWarning = function printWarning2(format, args) {
+        var len = arguments.length;
+        args = new Array(len > 1 ? len - 1 : 0);
+        for (var key = 1; key < len; key++) {
+          args[key - 1] = arguments[key];
         }
-        return len === -1;
-      }
-      if (ctor === Set) {
-        if (foo.size !== bar.size) {
-          return false;
+        var argIndex = 0;
+        var message = "Warning: " + format.replace(/%s/g, function() {
+          return args[argIndex++];
+        });
+        if (typeof console !== "undefined") {
+          console.error(message);
         }
-        for (len of foo) {
-          tmp = len;
-          if (tmp && typeof tmp === "object") {
-            tmp = find(bar, tmp);
-            if (!tmp) return false;
-          }
-          if (!bar.has(tmp)) return false;
+        try {
+          throw new Error(message);
+        } catch (x) {
         }
-        return true;
-      }
-      if (ctor === Map) {
-        if (foo.size !== bar.size) {
-          return false;
+      };
+      warning2 = function(condition, format, args) {
+        var len = arguments.length;
+        args = new Array(len > 2 ? len - 2 : 0);
+        for (var key = 2; key < len; key++) {
+          args[key - 2] = arguments[key];
         }
-        for (len of foo) {
-          tmp = len[0];
-          if (tmp && typeof tmp === "object") {
-            tmp = find(bar, tmp);
-            if (!tmp) return false;
-          }
-          if (!dequal(len[1], bar.get(tmp))) {
-            return false;
-          }
+        if (format === void 0) {
+          throw new Error(
+            "`warning(condition, format, ...args)` requires a warning message argument"
+          );
         }
-        return true;
-      }
-      if (ctor === ArrayBuffer) {
-        foo = new Uint8Array(foo);
-        bar = new Uint8Array(bar);
-      } else if (ctor === DataView) {
-        if ((len = foo.byteLength) === bar.byteLength) {
-          while (len-- && foo.getInt8(len) === bar.getInt8(len)) ;
-        }
-        return len === -1;
-      }
-      if (ArrayBuffer.isView(foo)) {
-        if ((len = foo.byteLength) === bar.byteLength) {
-          while (len-- && foo[len] === bar[len]) ;
-        }
-        return len === -1;
-      }
-      if (!ctor || typeof foo === "object") {
-        len = 0;
-        for (ctor in foo) {
-          if (has.call(foo, ctor) && ++len && !has.call(bar, ctor)) return false;
-          if (!(ctor in bar) || !dequal(foo[ctor], bar[ctor])) return false;
-        }
-        return Object.keys(bar).length === len;
-      }
-    }
-    return foo !== foo && bar !== bar;
-  }
-  function useSafeState(state) {
-    const isMounted = useMounted$1();
-    return [state[0], React.useCallback((nextState) => {
-      if (!isMounted()) return;
-      return state[1](nextState);
-    }, [isMounted, state[1]])];
-  }
-  const createPopper = popperGenerator({
-    defaultModifiers: [hide$1, popperOffsets$1, computeStyles$1, eventListeners, offset$1, flip$1, preventOverflow$1, arrow$1]
-  });
-  const _excluded$2 = ["enabled", "placement", "strategy", "modifiers"];
-  function _objectWithoutPropertiesLoose$2(r2, e) {
-    if (null == r2) return {};
-    var t = {};
-    for (var n in r2) if ({}.hasOwnProperty.call(r2, n)) {
-      if (e.indexOf(n) >= 0) continue;
-      t[n] = r2[n];
-    }
-    return t;
-  }
-  const disabledApplyStylesModifier = {
-    name: "applyStyles",
-    enabled: false,
-    phase: "afterWrite",
-    fn: () => void 0
-  };
-  const ariaDescribedByModifier = {
-    name: "ariaDescribedBy",
-    enabled: true,
-    phase: "afterWrite",
-    effect: ({
-      state
-    }) => () => {
-      const {
-        reference: reference2,
-        popper: popper2
-      } = state.elements;
-      if ("removeAttribute" in reference2) {
-        const ids = (reference2.getAttribute("aria-describedby") || "").split(",").filter((id) => id.trim() !== popper2.id);
-        if (!ids.length) reference2.removeAttribute("aria-describedby");
-        else reference2.setAttribute("aria-describedby", ids.join(","));
-      }
-    },
-    fn: ({
-      state
-    }) => {
-      var _popper$getAttribute;
-      const {
-        popper: popper2,
-        reference: reference2
-      } = state.elements;
-      const role = (_popper$getAttribute = popper2.getAttribute("role")) == null ? void 0 : _popper$getAttribute.toLowerCase();
-      if (popper2.id && role === "tooltip" && "setAttribute" in reference2) {
-        const ids = reference2.getAttribute("aria-describedby");
-        if (ids && ids.split(",").indexOf(popper2.id) !== -1) {
-          return;
-        }
-        reference2.setAttribute("aria-describedby", ids ? `${ids},${popper2.id}` : popper2.id);
-      }
-    }
-  };
-  const EMPTY_MODIFIERS = [];
-  function usePopper(referenceElement, popperElement, _ref = {}) {
-    let {
-      enabled = true,
-      placement = "bottom",
-      strategy = "absolute",
-      modifiers = EMPTY_MODIFIERS
-    } = _ref, config2 = _objectWithoutPropertiesLoose$2(_ref, _excluded$2);
-    const prevModifiers = React.useRef(modifiers);
-    const popperInstanceRef = React.useRef();
-    const update = React.useCallback(() => {
-      var _popperInstanceRef$cu;
-      (_popperInstanceRef$cu = popperInstanceRef.current) == null ? void 0 : _popperInstanceRef$cu.update();
-    }, []);
-    const forceUpdate = React.useCallback(() => {
-      var _popperInstanceRef$cu2;
-      (_popperInstanceRef$cu2 = popperInstanceRef.current) == null ? void 0 : _popperInstanceRef$cu2.forceUpdate();
-    }, []);
-    const [popperState, setState] = useSafeState(React.useState({
-      placement,
-      update,
-      forceUpdate,
-      attributes: {},
-      styles: {
-        popper: {},
-        arrow: {}
-      }
-    }));
-    const updateModifier = React.useMemo(() => ({
-      name: "updateStateModifier",
-      enabled: true,
-      phase: "write",
-      requires: ["computeStyles"],
-      fn: ({
-        state
-      }) => {
-        const styles = {};
-        const attributes = {};
-        Object.keys(state.elements).forEach((element) => {
-          styles[element] = state.styles[element];
-          attributes[element] = state.attributes[element];
-        });
-        setState({
-          state,
-          styles,
-          attributes,
-          update,
-          forceUpdate,
-          placement: state.placement
-        });
-      }
-    }), [update, forceUpdate, setState]);
-    const nextModifiers = React.useMemo(() => {
-      if (!dequal(prevModifiers.current, modifiers)) {
-        prevModifiers.current = modifiers;
-      }
-      return prevModifiers.current;
-    }, [modifiers]);
-    React.useEffect(() => {
-      if (!popperInstanceRef.current || !enabled) return;
-      popperInstanceRef.current.setOptions({
-        placement,
-        strategy,
-        modifiers: [...nextModifiers, updateModifier, disabledApplyStylesModifier]
-      });
-    }, [strategy, placement, updateModifier, enabled, nextModifiers]);
-    React.useEffect(() => {
-      if (!enabled || referenceElement == null || popperElement == null) {
-        return void 0;
-      }
-      popperInstanceRef.current = createPopper(referenceElement, popperElement, Object.assign({}, config2, {
-        placement,
-        strategy,
-        modifiers: [...nextModifiers, ariaDescribedByModifier, updateModifier]
-      }));
-      return () => {
-        if (popperInstanceRef.current != null) {
-          popperInstanceRef.current.destroy();
-          popperInstanceRef.current = void 0;
-          setState((s) => Object.assign({}, s, {
-            attributes: {},
-            styles: {
-              popper: {}
-            }
-          }));
+        if (!condition) {
+          printWarning.apply(null, [format].concat(args));
         }
       };
-    }, [enabled, referenceElement, popperElement]);
-    return popperState;
-  }
-  function contains(context2, node) {
-    if (context2.contains) return context2.contains(node);
-    if (context2.compareDocumentPosition) return context2 === node || !!(context2.compareDocumentPosition(node) & 16);
+    }
+    warning_1 = warning2;
+    return warning_1;
   }
+  var warningExports = requireWarning();
+  const warning = /* @__PURE__ */ getDefaultExportFromCjs(warningExports);
   const noop$1 = () => {
   };
   function isLeftClickEvent(event) {
@@ -12095,6 +11694,372 @@ To suppress this warning, you need to explicitly provide the \`palette.${key}Cha
   const useIsomorphicEffect = isDOM || isReactNative ? React.useLayoutEffect : React.useEffect;
   const context = /* @__PURE__ */ React__namespace.createContext(null);
   context.displayName = "InputGroupContext";
+  const propTypes$1 = {
+    /**
+     * Specify whether the feedback is for valid or invalid fields
+     *
+     * @type {('valid'|'invalid')}
+     */
+    type: PropTypes.string,
+    /** Display feedback as a tooltip. */
+    tooltip: PropTypes.bool,
+    as: PropTypes.elementType
+  };
+  const Feedback = /* @__PURE__ */ React__namespace.forwardRef(
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    ({
+      as: Component = "div",
+      className,
+      type = "valid",
+      tooltip = false,
+      ...props
+    }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+      ...props,
+      ref,
+      className: classNames(className, `${type}-${tooltip ? "tooltip" : "feedback"}`)
+    })
+  );
+  Feedback.displayName = "Feedback";
+  Feedback.propTypes = propTypes$1;
+  const FormContext = /* @__PURE__ */ React__namespace.createContext({});
+  const FormCheckInput = /* @__PURE__ */ React__namespace.forwardRef(({
+    id,
+    bsPrefix,
+    className,
+    type = "checkbox",
+    isValid = false,
+    isInvalid = false,
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    as: Component = "input",
+    ...props
+  }, ref) => {
+    const {
+      controlId
+    } = React.useContext(FormContext);
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-check-input");
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+      ...props,
+      ref,
+      type,
+      id: id || controlId,
+      className: classNames(className, bsPrefix, isValid && "is-valid", isInvalid && "is-invalid")
+    });
+  });
+  FormCheckInput.displayName = "FormCheckInput";
+  const FormCheckLabel = /* @__PURE__ */ React__namespace.forwardRef(({
+    bsPrefix,
+    className,
+    htmlFor,
+    ...props
+  }, ref) => {
+    const {
+      controlId
+    } = React.useContext(FormContext);
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-check-label");
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("label", {
+      ...props,
+      ref,
+      htmlFor: htmlFor || controlId,
+      className: classNames(className, bsPrefix)
+    });
+  });
+  FormCheckLabel.displayName = "FormCheckLabel";
+  const FormCheck = /* @__PURE__ */ React__namespace.forwardRef(({
+    id,
+    bsPrefix,
+    bsSwitchPrefix,
+    inline = false,
+    reverse = false,
+    disabled = false,
+    isValid = false,
+    isInvalid = false,
+    feedbackTooltip = false,
+    feedback,
+    feedbackType,
+    className,
+    style: style2,
+    title = "",
+    type = "checkbox",
+    label,
+    children,
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    as = "input",
+    ...props
+  }, ref) => {
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-check");
+    bsSwitchPrefix = useBootstrapPrefix(bsSwitchPrefix, "form-switch");
+    const {
+      controlId
+    } = React.useContext(FormContext);
+    const innerFormContext = React.useMemo(() => ({
+      controlId: id || controlId
+    }), [controlId, id]);
+    const hasLabel = !children && label != null && label !== false || hasChildOfType(children, FormCheckLabel);
+    const input = /* @__PURE__ */ jsxRuntimeExports.jsx(FormCheckInput, {
+      ...props,
+      type: type === "switch" ? "checkbox" : type,
+      ref,
+      isValid,
+      isInvalid,
+      disabled,
+      as
+    });
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(FormContext.Provider, {
+      value: innerFormContext,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+        style: style2,
+        className: classNames(className, hasLabel && bsPrefix, inline && `${bsPrefix}-inline`, reverse && `${bsPrefix}-reverse`, type === "switch" && bsSwitchPrefix),
+        children: children || /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+          children: [input, hasLabel && /* @__PURE__ */ jsxRuntimeExports.jsx(FormCheckLabel, {
+            title,
+            children: label
+          }), feedback && /* @__PURE__ */ jsxRuntimeExports.jsx(Feedback, {
+            type: feedbackType,
+            tooltip: feedbackTooltip,
+            children: feedback
+          })]
+        })
+      })
+    });
+  });
+  FormCheck.displayName = "FormCheck";
+  const FormCheck$1 = Object.assign(FormCheck, {
+    Input: FormCheckInput,
+    Label: FormCheckLabel
+  });
+  const FormControl = /* @__PURE__ */ React__namespace.forwardRef(({
+    bsPrefix,
+    type,
+    size,
+    htmlSize,
+    id,
+    className,
+    isValid = false,
+    isInvalid = false,
+    plaintext,
+    readOnly,
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    as: Component = "input",
+    ...props
+  }, ref) => {
+    const {
+      controlId
+    } = React.useContext(FormContext);
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-control");
+    process.env.NODE_ENV !== "production" ? warning(controlId == null || !id, "`controlId` is ignored on `<FormControl>` when `id` is specified.") : void 0;
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+      ...props,
+      type,
+      size: htmlSize,
+      ref,
+      readOnly,
+      id: id || controlId,
+      className: classNames(className, plaintext ? `${bsPrefix}-plaintext` : bsPrefix, size && `${bsPrefix}-${size}`, type === "color" && `${bsPrefix}-color`, isValid && "is-valid", isInvalid && "is-invalid")
+    });
+  });
+  FormControl.displayName = "FormControl";
+  const FormControl$1 = Object.assign(FormControl, {
+    Feedback
+  });
+  const FormFloating = /* @__PURE__ */ React__namespace.forwardRef(({
+    className,
+    bsPrefix,
+    as: Component = "div",
+    ...props
+  }, ref) => {
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-floating");
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+      ref,
+      className: classNames(className, bsPrefix),
+      ...props
+    });
+  });
+  FormFloating.displayName = "FormFloating";
+  const FormGroup = /* @__PURE__ */ React__namespace.forwardRef(({
+    controlId,
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    as: Component = "div",
+    ...props
+  }, ref) => {
+    const context2 = React.useMemo(() => ({
+      controlId
+    }), [controlId]);
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(FormContext.Provider, {
+      value: context2,
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+        ...props,
+        ref
+      })
+    });
+  });
+  FormGroup.displayName = "FormGroup";
+  const FormLabel = /* @__PURE__ */ React__namespace.forwardRef(({
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    as: Component = "label",
+    bsPrefix,
+    column = false,
+    visuallyHidden = false,
+    className,
+    htmlFor,
+    ...props
+  }, ref) => {
+    const {
+      controlId
+    } = React.useContext(FormContext);
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-label");
+    let columnClass = "col-form-label";
+    if (typeof column === "string") columnClass = `${columnClass} ${columnClass}-${column}`;
+    const classes = classNames(className, bsPrefix, visuallyHidden && "visually-hidden", column && columnClass);
+    process.env.NODE_ENV !== "production" ? warning(controlId == null || !htmlFor, "`controlId` is ignored on `<FormLabel>` when `htmlFor` is specified.") : void 0;
+    htmlFor = htmlFor || controlId;
+    if (column) return /* @__PURE__ */ jsxRuntimeExports.jsx(Col, {
+      ref,
+      as: "label",
+      className: classes,
+      htmlFor,
+      ...props
+    });
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+      ref,
+      className: classes,
+      htmlFor,
+      ...props
+    });
+  });
+  FormLabel.displayName = "FormLabel";
+  const FormRange = /* @__PURE__ */ React__namespace.forwardRef(({
+    bsPrefix,
+    className,
+    id,
+    ...props
+  }, ref) => {
+    const {
+      controlId
+    } = React.useContext(FormContext);
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-range");
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("input", {
+      ...props,
+      type: "range",
+      ref,
+      className: classNames(className, bsPrefix),
+      id: id || controlId
+    });
+  });
+  FormRange.displayName = "FormRange";
+  const FormSelect = /* @__PURE__ */ React__namespace.forwardRef(({
+    bsPrefix,
+    size,
+    htmlSize,
+    className,
+    isValid = false,
+    isInvalid = false,
+    id,
+    ...props
+  }, ref) => {
+    const {
+      controlId
+    } = React.useContext(FormContext);
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-select");
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("select", {
+      ...props,
+      size: htmlSize,
+      ref,
+      className: classNames(className, bsPrefix, size && `${bsPrefix}-${size}`, isValid && `is-valid`, isInvalid && `is-invalid`),
+      id: id || controlId
+    });
+  });
+  FormSelect.displayName = "FormSelect";
+  const FormText = /* @__PURE__ */ React__namespace.forwardRef(
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    ({
+      bsPrefix,
+      className,
+      as: Component = "small",
+      muted,
+      ...props
+    }, ref) => {
+      bsPrefix = useBootstrapPrefix(bsPrefix, "form-text");
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+        ...props,
+        ref,
+        className: classNames(className, bsPrefix, muted && "text-muted")
+      });
+    }
+  );
+  FormText.displayName = "FormText";
+  const Switch = /* @__PURE__ */ React__namespace.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(FormCheck$1, {
+    ...props,
+    ref,
+    type: "switch"
+  }));
+  Switch.displayName = "Switch";
+  const Switch$1 = Object.assign(Switch, {
+    Input: FormCheck$1.Input,
+    Label: FormCheck$1.Label
+  });
+  const FloatingLabel = /* @__PURE__ */ React__namespace.forwardRef(({
+    bsPrefix,
+    className,
+    children,
+    controlId,
+    label,
+    ...props
+  }, ref) => {
+    bsPrefix = useBootstrapPrefix(bsPrefix, "form-floating");
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs(FormGroup, {
+      ref,
+      className: classNames(className, bsPrefix),
+      controlId,
+      ...props,
+      children: [children, /* @__PURE__ */ jsxRuntimeExports.jsx("label", {
+        htmlFor: controlId,
+        children: label
+      })]
+    });
+  });
+  FloatingLabel.displayName = "FloatingLabel";
+  const propTypes = {
+    /**
+     * The Form `ref` will be forwarded to the underlying element,
+     * which means, unless it's rendered `as` a composite component,
+     * it will be a DOM node, when resolved.
+     *
+     * @type {ReactRef}
+     * @alias ref
+     */
+    _ref: PropTypes.any,
+    /**
+     * Mark a form as having been validated. Setting it to `true` will
+     * toggle any validation styles on the forms elements.
+     */
+    validated: PropTypes.bool,
+    as: PropTypes.elementType
+  };
+  const Form = /* @__PURE__ */ React__namespace.forwardRef(({
+    className,
+    validated,
+    // Need to define the default "as" during prop destructuring to be compatible with styled-components github.com/react-bootstrap/react-bootstrap/issues/3595
+    as: Component = "form",
+    ...props
+  }, ref) => /* @__PURE__ */ jsxRuntimeExports.jsx(Component, {
+    ...props,
+    ref,
+    className: classNames(className, validated && "was-validated")
+  }));
+  Form.displayName = "Form";
+  Form.propTypes = propTypes;
+  const Form$1 = Object.assign(Form, {
+    Group: FormGroup,
+    Control: FormControl$1,
+    Floating: FormFloating,
+    Check: FormCheck$1,
+    Switch: Switch$1,
+    Label: FormLabel,
+    Text: FormText,
+    Range: FormRange,
+    Select: FormSelect,
+    FloatingLabel
+  });
   const InputGroupText = /* @__PURE__ */ React__namespace.forwardRef(({
     className,
     bsPrefix,
@@ -17216,4 +17181,4 @@ To suppress this warning, you need to explicitly provide the \`palette.${key}Cha
   exports2.Mytekbutton = Mytekbutton;
   Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });
 });
-//# sourceMappingURL=main.umd.cjs.map
+//# sourceMappingURL=main.umd.js.map