@biznext-ui/react 0.2.8 → 0.3.0

package/dist/index.es.d.ts

@@ -38,6 +38,7 @@ export declare const Form: {
     [x: string]: any;
     controlType: "input" | "select" | "textarea";
     focus?: boolean;
+    onFocus?: boolean;
     sx?: object;
     placeholder?: string;
     isSearchable?: boolean;

package/dist/index.es.js

@@ -1,6 +1,6 @@
 import { jsxs as de, jsx as T, Fragment as Mt } from "react/jsx-runtime";
 import * as R from "react";
-import it, { createContext as Ge, useContext as k, useLayoutEffect as Io, useEffect as Se, useRef as _, useInsertionEffect as Co, useCallback as $, useMemo as be, forwardRef as Gn, Fragment as Nt, createElement as Ju, useId as Wi, Component as xo, useState as fe, cloneElement as Uu, Children as cn, isValidElement as _u, useReducer as Qu } from "react";
+import it, { createContext as Ge, useContext as k, useLayoutEffect as Io, useEffect as ve, useRef as _, useInsertionEffect as Co, useCallback as $, useMemo as be, forwardRef as Gn, Fragment as Nt, createElement as Ju, useId as Wi, Component as xo, useState as fe, cloneElement as Uu, Children as cn, isValidElement as _u, useReducer as Qu } from "react";
 import $u, { createPortal as st } from "react-dom";
 const Ao = Ge({}), Ku = (t, e) => {
   switch (e.type) {
@@ -206,7 +206,7 @@ const Oi = Ge({
   transformPagePoint: (t) => t,
   isStatic: !1,
   reducedMotion: "never"
-}), Dn = Ge({}), Mn = Ge(null), Xi = typeof document < "u", Zi = Xi ? Io : Se, Po = Ge({ strict: !1 }), Nn = (t) => t.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Cc = "framerAppearId", Vo = "data-" + Nn(Cc), xc = {
+}), Dn = Ge({}), Mn = Ge(null), Xi = typeof document < "u", Zi = Xi ? Io : ve, Po = Ge({ strict: !1 }), Nn = (t) => t.replace(/([a-z])([A-Z])/gu, "$1-$2").toLowerCase(), Cc = "framerAppearId", Vo = "data-" + Nn(Cc), xc = {
   skipAnimations: !1,
   useManualTiming: !1
 };
@@ -305,7 +305,7 @@ function Tc(t, e, n, i, r) {
   const f = _(!!(n[Vo] && !window.HandoffComplete));
   return Zi(() => {
     l && (l.updateFeatures(), Hi.render(l.render), f.current && l.animationState && l.animationState.animateChanges());
-  }), Se(() => {
+  }), ve(() => {
     l && (!f.current && l.animationState && l.animationState.animateChanges(), f.current && (f.current = !1, Vr || (Vr = !0, queueMicrotask(Ec))));
   }), l;
 }
@@ -3566,7 +3566,7 @@ function jf() {
   if (t === null)
     return [!0, null];
   const { isPresent: e, onExitComplete: n, register: i } = t, r = Wi();
-  return Se(() => i(r), []), !e && n ? [!1, () => n && n(r)] : [!0];
+  return ve(() => i(r), []), !e && n ? [!1, () => n && n(r)] : [!0];
 }
 const fn = {
   /**
@@ -4838,7 +4838,7 @@ function zh() {
   return /* @__PURE__ */ new Map();
 }
 function jh(t) {
-  return Se(() => () => t(), []);
+  return ve(() => () => t(), []);
 }
 const tt = (t) => t.key || "";
 function Yh(t, e) {
@@ -4919,7 +4919,7 @@ const hr = ({ children: t, custom: e, initial: n = !0, onExitComplete: i, exitBe
   const { id: e, type: n, title: i } = t, { icon: r } = Uh(n), s = 4e3, o = ec(), u = $(() => {
     o.removeToast(e);
   }, [e, o]);
-  return Se(() => {
+  return ve(() => {
     const a = setTimeout(() => {
       setTimeout(() => {
         u();
@@ -4936,7 +4936,7 @@ const hr = ({ children: t, custom: e, initial: n = !0, onExitComplete: i, exitBe
 };
 function Qh(t) {
   const { children: e } = t, [n, i] = fe(!1);
-  Se(() => {
+  ve(() => {
     i(!0);
   }, []);
   const r = document.getElementById("biznext-ui-toast-portal");
@@ -4982,7 +4982,7 @@ function ip() {
 function rp(t) {
   return at({ tag: "svg", attr: { viewBox: "0 0 24 24", fill: "currentColor" }, child: [{ tag: "path", attr: { d: "M7 4V2H17V4H22V6H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V6H2V4H7ZM6 6V20H18V6H6ZM9 9H11V17H9V9ZM13 9H15V17H13V9Z" }, child: [] }] })(t);
 }
-const sp = "biznext-ui-wec4qWkj9NU-c", op = "biznext-ui-mcehjNn9Nl0-9", ap = "biznext-ui-pYq-UQoFMHM-a", up = "biznext-ui-bgVORylkzc0-6", Ce = {
+const sp = "biznext-ui-wec4qWkj9NU-c", op = "biznext-ui-mcehjNn9Nl0-9", ap = "biznext-ui-pYq-UQoFMHM-a", up = "biznext-ui-bgVORylkzc0-6", xe = {
   "confirm-dialog": "biznext-ui-4yyscqDACxw-e",
   "confirm-dialog-overlay": "biznext-ui-ylpaWxEFaTU-c",
   "confirm-dialog-content": "biznext-ui-xwshXokj5ZA-c",
@@ -4999,7 +4999,7 @@ const sp = "biznext-ui-wec4qWkj9NU-c", op = "biznext-ui-mcehjNn9Nl0-9", ap = "bi
 };
 function cp(t) {
   const { children: e } = t, [n, i] = fe(!1);
-  Se(() => {
+  ve(() => {
     i(!0);
   }, []);
   const r = document.getElementById("biznext-ui-confirm-dialog-portal");
@@ -5011,24 +5011,24 @@ const lp = (t) => {
   }, d = () => {
     a(), n();
   };
-  return /* @__PURE__ */ T(cp, { children: /* @__PURE__ */ T("div", { className: Ce["confirm-dialog-wrapper"], children: /* @__PURE__ */ T(hr, { children: e && /* @__PURE__ */ T(Ht.div, { className: Ce["confirm-dialog-overlay"], initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: /* @__PURE__ */ T(
+  return /* @__PURE__ */ T(cp, { children: /* @__PURE__ */ T("div", { className: xe["confirm-dialog-wrapper"], children: /* @__PURE__ */ T(hr, { children: e && /* @__PURE__ */ T(Ht.div, { className: xe["confirm-dialog-overlay"], initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: /* @__PURE__ */ T(
     Ht.div,
     {
-      className: yt(Ce["confirm-dialog"], Ce[r]),
+      className: yt(xe["confirm-dialog"], xe[r]),
       initial: { opacity: 0, scale: 0.95 },
       animate: { opacity: 1, scale: 1 },
       exit: { opacity: 0, scale: 0.95 },
-      children: /* @__PURE__ */ de("div", { className: Ce["confirm-dialog-content"], children: [
-        /* @__PURE__ */ de("div", { className: Ce["confirm-dialog-body"], children: [
-          /* @__PURE__ */ T("div", { className: Ce["confirm-dialog-icon-container"], children: /* @__PURE__ */ T("div", { className: Ce["confirm-dialog-icon"], children: u || /* @__PURE__ */ T(rp, {}) }) }),
+      children: /* @__PURE__ */ de("div", { className: xe["confirm-dialog-content"], children: [
+        /* @__PURE__ */ de("div", { className: xe["confirm-dialog-body"], children: [
+          /* @__PURE__ */ T("div", { className: xe["confirm-dialog-icon-container"], children: /* @__PURE__ */ T("div", { className: xe["confirm-dialog-icon"], children: u || /* @__PURE__ */ T(rp, {}) }) }),
           /* @__PURE__ */ de("div", { children: [
             /* @__PURE__ */ T("h2", { children: s }),
             /* @__PURE__ */ T("p", { children: o })
           ] })
         ] }),
-        /* @__PURE__ */ de("div", { className: Ce["confirm-dialog-footer"], children: [
-          /* @__PURE__ */ T("button", { type: "button", className: Ce["confirm-dialog-footer-close-btn"], onClick: l, children: c && c.onCloseTitle ? c.onCloseTitle : "Cancel" }),
-          /* @__PURE__ */ T("button", { type: "button", className: Ce["confirm-dialog-footer-confirm-btn"], onClick: d, children: c && c.onConfirmTitle ? c.onConfirmTitle : "Confirm" })
+        /* @__PURE__ */ de("div", { className: xe["confirm-dialog-footer"], children: [
+          /* @__PURE__ */ T("button", { type: "button", className: xe["confirm-dialog-footer-close-btn"], onClick: l, children: c && c.onCloseTitle ? c.onCloseTitle : "Cancel" }),
+          /* @__PURE__ */ T("button", { type: "button", className: xe["confirm-dialog-footer-confirm-btn"], onClick: d, children: c && c.onConfirmTitle ? c.onConfirmTitle : "Confirm" })
         ] })
       ] })
     }
@@ -5060,7 +5060,7 @@ const lp = (t) => {
     /* @__PURE__ */ T(lp, { isOpen: m, onClose: b, config: f }),
     t
   ] }) });
-}, Mb = dp, fp = "biznext-ui-Mao59ye15po-3", hp = "biznext-ui-5bDq6-PrHF4-e", pp = "biznext-ui-X9XXG3R3kc4-5", mp = "biznext-ui-g7IKSnXitqg-8", gp = "biznext-ui-T4NhvYHqFMo-4", xe = {
+}, Mb = dp, fp = "biznext-ui-Mao59ye15po-3", hp = "biznext-ui-5bDq6-PrHF4-e", pp = "biznext-ui-X9XXG3R3kc4-5", mp = "biznext-ui-g7IKSnXitqg-8", gp = "biznext-ui-T4NhvYHqFMo-4", Ae = {
   "modal-wrapper": "biznext-ui-n2Vjx4mdikE-9",
   "modal-overlay": "biznext-ui-6sKjk6L11EQ-e",
   modal: fp,
@@ -5089,7 +5089,7 @@ function bp(t) {
 }
 function vp(t) {
   const { children: e } = t, [n, i] = fe(!1);
-  Se(() => {
+  ve(() => {
     i(!0);
   }, []);
   const r = document.getElementById("biznext-ui-modal-portal");
@@ -5097,11 +5097,11 @@ function vp(t) {
 }
 const pr = Ge({ onClose: () => console.warn("Biznext-UI-Modal: Close Function not Implemented!") }), xt = (t) => {
   const { type: e, index: n, height: i, width: r, sx: s, isOpen: o, onClose: u, children: a } = t;
-  return /* @__PURE__ */ T(pr.Provider, { value: { onClose: u }, children: /* @__PURE__ */ T(vp, { children: /* @__PURE__ */ T(hr, { children: o && /* @__PURE__ */ de("div", { className: xe["modal-wrapper"], children: [
+  return /* @__PURE__ */ T(pr.Provider, { value: { onClose: u }, children: /* @__PURE__ */ T(vp, { children: /* @__PURE__ */ T(hr, { children: o && /* @__PURE__ */ de("div", { className: Ae["modal-wrapper"], children: [
     /* @__PURE__ */ T(
       Ht.div,
       {
-        className: xe["modal-overlay"],
+        className: Ae["modal-overlay"],
         style: { zIndex: 9999 + (n || 0) },
         onClick: u,
         initial: { opacity: 0 },
@@ -5113,7 +5113,7 @@ const pr = Ge({ onClose: () => console.warn("Biznext-UI-Modal: Close Function no
       Ht.div,
       {
         initial: { opacity: 0, scale: 0.95 },
-        className: yt(xe.modal, xe[e]),
+        className: yt(Ae.modal, Ae[e]),
         style: { height: i, width: r, zIndex: 99999 + (n || 0), ...s },
         animate: { opacity: 1, scale: 1 },
         exit: { opacity: 0, scale: 0.95 },
@@ -5121,17 +5121,17 @@ const pr = Ge({ onClose: () => console.warn("Biznext-UI-Modal: Close Function no
       }
     )
   ] }) }) }) });
-}, Nb = xt, yp = ({ children: t }) => /* @__PURE__ */ T("div", { className: xe["modal-content"], children: t }), Ip = ({ children: t }) => {
+}, Nb = xt, yp = ({ children: t }) => /* @__PURE__ */ T("div", { className: Ae["modal-content"], children: t }), Ip = ({ children: t }) => {
   const { onClose: e } = k(pr);
-  return /* @__PURE__ */ de("header", { id: "handle", className: xe["modal-header"], children: [
+  return /* @__PURE__ */ de("header", { id: "handle", className: Ae["modal-header"], children: [
     t,
-    /* @__PURE__ */ T("button", { type: "button", className: xe["module-header-close-btn"], onClick: e, children: /* @__PURE__ */ T(bp, {}) })
+    /* @__PURE__ */ T("button", { type: "button", className: Ae["module-header-close-btn"], onClick: e, children: /* @__PURE__ */ T(bp, {}) })
   ] });
-}, Cp = ({ children: t }) => /* @__PURE__ */ T("h2", { className: xe["modal-title"], children: t }), xp = ({ children: t }) => /* @__PURE__ */ T("div", { className: xe["modal-body"], children: t }), Ap = (t) => {
+}, Cp = ({ children: t }) => /* @__PURE__ */ T("h2", { className: Ae["modal-title"], children: t }), xp = ({ children: t }) => /* @__PURE__ */ T("div", { className: Ae["modal-body"], children: t }), Ap = (t) => {
   const { children: e, closeTitle: n } = t, { onClose: i } = k(pr);
-  return /* @__PURE__ */ de("footer", { className: xe["modal-footer"], children: [
+  return /* @__PURE__ */ de("footer", { className: Ae["modal-footer"], children: [
     e,
-    /* @__PURE__ */ T("button", { type: "button", className: xe["modal-footer-close-btn"], onClick: i, children: n || "Cancel" })
+    /* @__PURE__ */ T("button", { type: "button", className: Ae["modal-footer-close-btn"], onClick: i, children: n || "Cancel" })
   ] });
 };
 xt.Content = yp;
@@ -5139,7 +5139,7 @@ xt.Header = Ip;
 xt.Title = Cp;
 xt.Body = xp;
 xt.Footer = Ap;
-const Sp = () => k(eu), Lb = Sp, Tp = "biznext-ui-WgISRe1bJDU-5", Ep = "biznext-ui-S1AWtF9fE-s-4", Ae = {
+const Sp = () => k(eu), Lb = Sp, Tp = "biznext-ui-WgISRe1bJDU-5", Ep = "biznext-ui-S1AWtF9fE-s-4", Se = {
   form: Tp,
   "form-group": "biznext-ui-PDYbgOuoFL0-3",
   "form-input-group": "biznext-ui-7dIDGqcfwy4-e",
@@ -5268,8 +5268,8 @@ function Gp(t) {
   var e = t.defaultInputValue, n = e === void 0 ? "" : e, i = t.defaultMenuIsOpen, r = i === void 0 ? !1 : i, s = t.defaultValue, o = s === void 0 ? null : s, u = t.inputValue, a = t.menuIsOpen, c = t.onChange, l = t.onInputChange, d = t.onMenuClose, f = t.onMenuOpen, h = t.value, m = ke(t, Bp), p = fe(u !== void 0 ? u : n), g = Oe(p, 2), b = g[0], I = g[1], v = fe(a !== void 0 ? a : r), C = Oe(v, 2), y = C[0], A = C[1], S = fe(h !== void 0 ? h : o), x = Oe(S, 2), B = x[0], D = x[1], Z = $(function(Q, Te) {
     typeof c == "function" && c(Q, Te), D(Q);
   }, [c]), j = $(function(Q, Te) {
-    var ve;
-    typeof l == "function" && (ve = l(Q, Te)), I(ve !== void 0 ? ve : Q);
+    var ye;
+    typeof l == "function" && (ye = l(Q, Te)), I(ye !== void 0 ? ye : Q);
   }, [l]), ce = $(function() {
     typeof f == "function" && f(), A(!0);
   }, [f]), ae = $(function() {
@@ -6057,9 +6057,9 @@ function Cm() {
     }
     var y = a, A = c, S = u, x = o, B = e, D = l, Z = i, j = m, ce = h, ae = n, G = s, M = r, ne = d, Q = !1;
     function Te(E) {
-      return Q || (Q = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), ve(E) || C(E) === a;
+      return Q || (Q = !0, console.warn("The ReactIs.isAsyncMode() alias has been deprecated, and will be removed in React 17+. Update your code to use ReactIs.isConcurrentMode() instead. It has the exact same API.")), ye(E) || C(E) === a;
     }
-    function ve(E) {
+    function ye(E) {
       return C(E) === c;
     }
     function ut(E) {
@@ -6071,7 +6071,7 @@ function Cm() {
     function oe(E) {
       return typeof E == "object" && E !== null && E.$$typeof === e;
     }
-    function ye(E) {
+    function Ie(E) {
       return C(E) === l;
     }
     function Ee(E) {
@@ -6083,7 +6083,7 @@ function Cm() {
     function Pe(E) {
       return C(E) === h;
     }
-    function Ie(E) {
+    function Ce(E) {
       return C(E) === n;
     }
     function ct(E) {
@@ -6095,7 +6095,7 @@ function Cm() {
     function $t(E) {
       return C(E) === d;
     }
-    O.AsyncMode = y, O.ConcurrentMode = A, O.ContextConsumer = S, O.ContextProvider = x, O.Element = B, O.ForwardRef = D, O.Fragment = Z, O.Lazy = j, O.Memo = ce, O.Portal = ae, O.Profiler = G, O.StrictMode = M, O.Suspense = ne, O.isAsyncMode = Te, O.isConcurrentMode = ve, O.isContextConsumer = ut, O.isContextProvider = Y, O.isElement = oe, O.isForwardRef = ye, O.isFragment = Ee, O.isLazy = le, O.isMemo = Pe, O.isPortal = Ie, O.isProfiler = ct, O.isStrictMode = Jn, O.isSuspense = $t, O.isValidElementType = v, O.typeOf = C;
+    O.AsyncMode = y, O.ConcurrentMode = A, O.ContextConsumer = S, O.ContextProvider = x, O.Element = B, O.ForwardRef = D, O.Fragment = Z, O.Lazy = j, O.Memo = ce, O.Portal = ae, O.Profiler = G, O.StrictMode = M, O.Suspense = ne, O.isAsyncMode = Te, O.isConcurrentMode = ye, O.isContextConsumer = ut, O.isContextProvider = Y, O.isElement = oe, O.isForwardRef = Ie, O.isFragment = Ee, O.isLazy = le, O.isMemo = Pe, O.isPortal = Ce, O.isProfiler = ct, O.isStrictMode = Jn, O.isSuspense = $t, O.isValidElementType = v, O.typeOf = C;
   }()), O;
 }
 process.env.NODE_ENV === "production" ? Di.exports = Im() : Di.exports = Cm();
@@ -7553,9 +7553,9 @@ var W0 = process.env.NODE_ENV === "production" ? {
   }, [d]), B = be(function() {
     var G = "";
     if (n && x.onChange) {
-      var M = n.option, ne = n.options, Q = n.removedValue, Te = n.removedValues, ve = n.value, ut = function(Ie) {
-        return Array.isArray(Ie) ? null : Ie;
-      }, Y = Q || M || ut(ve), oe = Y ? f(Y) : "", ye = ne || Te || void 0, Ee = ye ? ye.map(f) : [], le = V({
+      var M = n.option, ne = n.options, Q = n.removedValue, Te = n.removedValues, ye = n.value, ut = function(Ce) {
+        return Array.isArray(Ce) ? null : Ce;
+      }, Y = Q || M || ut(ye), oe = Y ? f(Y) : "", Ie = ne || Te || void 0, Ee = Ie ? Ie.map(f) : [], le = V({
         // multiSelected items are usually items that have already been selected
         // or set by the user as a default value so we assume they are not disabled
         isDisabled: Y && p(Y, u),
@@ -7958,7 +7958,7 @@ function Q0(t) {
   }, [h, f, d]), p = $(function(g) {
     g && (g.removeEventListener("wheel", d, !1), g.removeEventListener("touchstart", f, !1), g.removeEventListener("touchmove", h, !1));
   }, [h, f, d]);
-  return Se(function() {
+  return ve(function() {
     if (e) {
       var g = c.current;
       return m(g), function() {
@@ -8018,7 +8018,7 @@ function $0(t) {
       }), c && mo() && (c.removeEventListener("touchmove", fo, lt), a && (a.removeEventListener("touchstart", po, lt), a.removeEventListener("touchmove", ho, lt)));
     }
   }, [i]);
-  return Se(function() {
+  return ve(function() {
     if (e) {
       var a = s.current;
       return o(a), function() {
@@ -9001,26 +9001,26 @@ var Hu = function(e) {
     value: function() {
       var r = this, s = this.getComponents(), o = s.Group, u = s.GroupHeading, a = s.Menu, c = s.MenuList, l = s.MenuPortal, d = s.LoadingMessage, f = s.NoOptionsMessage, h = s.Option, m = this.commonProps, p = this.state.focusedOption, g = this.props, b = g.captureMenuScroll, I = g.inputValue, v = g.isLoading, C = g.loadingMessage, y = g.minMenuHeight, A = g.maxMenuHeight, S = g.menuIsOpen, x = g.menuPlacement, B = g.menuPosition, D = g.menuPortalTarget, Z = g.menuShouldBlockScroll, j = g.menuShouldScrollIntoView, ce = g.noOptionsMessage, ae = g.onMenuScrollToTop, G = g.onMenuScrollToBottom;
       if (!S) return null;
-      var M = function(oe, ye) {
-        var Ee = oe.type, le = oe.data, Pe = oe.isDisabled, Ie = oe.isSelected, ct = oe.label, Jn = oe.value, $t = p === le, E = Pe ? void 0 : function() {
+      var M = function(oe, Ie) {
+        var Ee = oe.type, le = oe.data, Pe = oe.isDisabled, Ce = oe.isSelected, ct = oe.label, Jn = oe.value, $t = p === le, E = Pe ? void 0 : function() {
           return r.onOptionHover(le);
         }, Tt = Pe ? void 0 : function() {
           return r.selectOption(le);
-        }, $e = "".concat(r.getElementId("option"), "-").concat(ye), Kt = {
+        }, $e = "".concat(r.getElementId("option"), "-").concat(Ie), Kt = {
           id: $e,
           onClick: Tt,
           onMouseMove: E,
           onMouseOver: E,
           tabIndex: -1,
           role: "option",
-          "aria-selected": r.isAppleDevice ? void 0 : Ie
+          "aria-selected": r.isAppleDevice ? void 0 : Ce
           // is not supported on Apple devices
         };
         return /* @__PURE__ */ R.createElement(h, F({}, m, {
           innerProps: Kt,
           data: le,
           isDisabled: Pe,
-          isSelected: Ie,
+          isSelected: Ce,
           key: $e,
           label: ct,
           type: Ee,
@@ -9032,19 +9032,19 @@ var Hu = function(e) {
       if (this.hasOptions())
         ne = this.getCategorizedOptions().map(function(Y) {
           if (Y.type === "group") {
-            var oe = Y.data, ye = Y.options, Ee = Y.index, le = "".concat(r.getElementId("group"), "-").concat(Ee), Pe = "".concat(le, "-heading");
+            var oe = Y.data, Ie = Y.options, Ee = Y.index, le = "".concat(r.getElementId("group"), "-").concat(Ee), Pe = "".concat(le, "-heading");
             return /* @__PURE__ */ R.createElement(o, F({}, m, {
               key: le,
               data: oe,
-              options: ye,
+              options: Ie,
               Heading: u,
               headingProps: {
                 id: Pe,
                 data: Y.data
               },
               label: r.formatGroupLabel(Y.data)
-            }), Y.options.map(function(Ie) {
-              return M(Ie, "".concat(Ee, "-").concat(Ie.index));
+            }), Y.options.map(function(Ce) {
+              return M(Ce, "".concat(Ee, "-").concat(Ce.index));
             }));
           } else if (Y.type === "option")
             return M(Y, "".concat(Y.index));
@@ -9062,15 +9062,15 @@ var Hu = function(e) {
         if (Te === null) return null;
         ne = /* @__PURE__ */ R.createElement(f, m, Te);
       }
-      var ve = {
+      var ye = {
         minMenuHeight: y,
         maxMenuHeight: A,
         menuPlacement: x,
         menuPosition: B,
         menuShouldScrollIntoView: j
-      }, ut = /* @__PURE__ */ R.createElement(Sg, F({}, m, ve), function(Y) {
-        var oe = Y.ref, ye = Y.placerProps, Ee = ye.placement, le = ye.maxHeight;
-        return /* @__PURE__ */ R.createElement(a, F({}, m, ve, {
+      }, ut = /* @__PURE__ */ R.createElement(Sg, F({}, m, ye), function(Y) {
+        var oe = Y.ref, Ie = Y.placerProps, Ee = Ie.placement, le = Ie.maxHeight;
+        return /* @__PURE__ */ R.createElement(a, F({}, m, ye, {
           innerRef: oe,
           innerProps: {
             onMouseDown: r.onMenuMouseDown,
@@ -9232,7 +9232,7 @@ var Tb = /* @__PURE__ */ Gn(function(t, e) {
 }), Eb = Tb;
 const St = (t) => {
   const { children: e, sx: n, ...i } = t;
-  return /* @__PURE__ */ T("div", { className: Ae.form, style: n, ...i, children: e });
+  return /* @__PURE__ */ T("div", { className: Se.form, style: n, ...i, children: e });
 }, Wb = St, Pb = {
   menuPortal: (t) => ({ ...t, zIndex: "9999999999 !important" }),
   control: (t, e) => ({
@@ -9292,57 +9292,59 @@ const St = (t) => {
   })
 }, Vb = (t) => {
   const { children: e, sx: n, ...i } = t;
-  return /* @__PURE__ */ T("div", { className: Ae["form-group"], style: n, ...i, children: e });
+  return /* @__PURE__ */ T("div", { className: Se["form-group"], style: n, ...i, children: e });
 }, wb = (t) => {
   const { children: e, sx: n, ...i } = t, r = cn.toArray(e).filter((a) => a.type.displayName === "biznext-ui-input-label"), s = cn.toArray(e).filter((a) => a.type.displayName === "biznext-ui-input-control"), o = cn.toArray(e).filter((a) => a.type.displayName === "biznext-ui-input-error-message"), u = o[0] && o[0].props.children && o[0].props.children.length > 0;
-  return /* @__PURE__ */ de("div", { className: yt(Ae["form-input-group"], u && Ae["validation-error"]), style: n, ...i, children: [
+  return /* @__PURE__ */ de("div", { className: yt(Se["form-input-group"], u && Se["validation-error"]), style: n, ...i, children: [
     r,
-    /* @__PURE__ */ de("div", { className: Ae["form-input-control-group"], children: [
+    /* @__PURE__ */ de("div", { className: Se["form-input-control-group"], children: [
       s,
-      /* @__PURE__ */ T("span", { className: Ae["form-input-group-error-text"], children: o })
+      /* @__PURE__ */ T("span", { className: Se["form-input-group-error-text"], children: o })
     ] })
   ] });
 }, zu = (t) => {
   const { required: e = !1, children: n, sx: i, ...r } = t;
-  return /* @__PURE__ */ T("label", { className: yt(Ae["form-input-group-label"], e && Ae.required), style: i, ...r, children: n });
+  return /* @__PURE__ */ T("label", { className: yt(Se["form-input-group-label"], e && Se.required), style: i, ...r, children: n });
 }, ju = Gn(
   (t, e) => {
-    const { controlType: n, focus: i, sx: r, placeholder: s = "", isSearchable: o = !0, isClearable: u = !0, ...a } = t;
-    let c = /* @__PURE__ */ T(Mt, {});
-    const l = _(null);
-    switch (Se(() => {
-      l.current && l.current.focus();
-    }, [i]), n) {
+    const { controlType: n, focus: i, onFocus: r, sx: s, placeholder: o = "", isSearchable: u = !0, isClearable: a = !0, ...c } = t;
+    let l = /* @__PURE__ */ T(Mt, {});
+    const d = _(null);
+    switch (ve(() => {
+      d.current && d.current.focus();
+    }, [i]), ve(() => {
+      r && d.current && d.current.focus();
+    }, [r]), n) {
       case "input":
-        c = /* @__PURE__ */ T("input", { className: Ae["form-input-control"], placeholder: s, ref: i ? l : e, style: r, ...a });
+        l = /* @__PURE__ */ T("input", { className: Se["form-input-control"], placeholder: o, ref: i ? d : e, style: s, ...c });
         break;
       case "select":
-        c = /* @__PURE__ */ T(
+        l = /* @__PURE__ */ T(
           Eb,
           {
             styles: Pb,
-            className: Ae["form-select-control"],
+            className: Se["form-select-control"],
             classNamePrefix: "biznext-ui-",
             menuPortalTarget: document.body,
             menuPosition: "absolute",
             menuShouldScrollIntoView: !1,
-            ref: i ? l : e,
-            placeholder: s ? `Select ${s}` : "Select...",
-            isSearchable: o,
-            isClearable: u,
+            ref: i ? d : e,
+            placeholder: o ? `Select ${o}` : "Select...",
+            isSearchable: u,
+            isClearable: a,
             noOptionsMessage: () => "No Results Found!",
-            ...a
+            ...c
           }
         );
         break;
       case "textarea":
-        c = /* @__PURE__ */ T("textarea", { className: Ae["form-input-control"], placeholder: s, style: r, ref: i ? l : e, ...a });
+        l = /* @__PURE__ */ T("textarea", { className: Se["form-input-control"], placeholder: o, style: s, ref: i ? d : e, ...c });
         break;
       default:
-        c = /* @__PURE__ */ T(Mt, {});
+        l = /* @__PURE__ */ T(Mt, {});
         break;
     }
-    return c;
+    return l;
   }
 ), Yu = (t) => {
   const { children: e } = t;