@northlight/ui 2.9.0 → 2.9.2

package/dist/es/northlight.mjs

@@ -39,6 +39,24 @@ import AvatarEditor from 'react-avatar-editor';
 import { randomColor } from '@chakra-ui/theme-tools';
 import InputMask from 'react-input-mask';
 
+var __defProp$25 = Object.defineProperty;
+var __getOwnPropSymbols$25 = Object.getOwnPropertySymbols;
+var __hasOwnProp$25 = Object.prototype.hasOwnProperty;
+var __propIsEnum$25 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$25 = (obj, key, value) => key in obj ? __defProp$25(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$25 = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$25.call(b, prop))
+      __defNormalProp$25(a, prop, b[prop]);
+  if (__getOwnPropSymbols$25)
+    for (var prop of __getOwnPropSymbols$25(b)) {
+      if (__propIsEnum$25.call(b, prop))
+        __defNormalProp$25(a, prop, b[prop]);
+    }
+  return a;
+};
+const Accordion = (props) => /* @__PURE__ */ React.createElement(Accordion$1, __spreadValues$25({}, props));
+
 var __defProp$24 = Object.defineProperty;
 var __getOwnPropSymbols$24 = Object.getOwnPropertySymbols;
 var __hasOwnProp$24 = Object.prototype.hasOwnProperty;
@@ -55,7 +73,7 @@ var __spreadValues$24 = (a, b) => {
     }
   return a;
 };
-const Accordion = (props) => /* @__PURE__ */ React.createElement(Accordion$1, __spreadValues$24({}, props));
+const AccordionButton = (props) => /* @__PURE__ */ React.createElement(AccordionButton$1, __spreadValues$24({}, props));
 
 var __defProp$23 = Object.defineProperty;
 var __getOwnPropSymbols$23 = Object.getOwnPropertySymbols;
@@ -73,7 +91,7 @@ var __spreadValues$23 = (a, b) => {
     }
   return a;
 };
-const AccordionButton = (props) => /* @__PURE__ */ React.createElement(AccordionButton$1, __spreadValues$23({}, props));
+const AccordionPanel = (props) => /* @__PURE__ */ React.createElement(AccordionPanel$1, __spreadValues$23({}, props));
 
 var __defProp$22 = Object.defineProperty;
 var __getOwnPropSymbols$22 = Object.getOwnPropertySymbols;
@@ -91,7 +109,7 @@ var __spreadValues$22 = (a, b) => {
     }
   return a;
 };
-const AccordionPanel = (props) => /* @__PURE__ */ React.createElement(AccordionPanel$1, __spreadValues$22({}, props));
+const AccordionItem = (props) => /* @__PURE__ */ React.createElement(AccordionItem$1, __spreadValues$22({}, props));
 
 var __defProp$21 = Object.defineProperty;
 var __getOwnPropSymbols$21 = Object.getOwnPropertySymbols;
@@ -109,32 +127,14 @@ var __spreadValues$21 = (a, b) => {
     }
   return a;
 };
-const AccordionItem = (props) => /* @__PURE__ */ React.createElement(AccordionItem$1, __spreadValues$21({}, props));
-
-var __defProp$20 = Object.defineProperty;
-var __getOwnPropSymbols$20 = Object.getOwnPropertySymbols;
-var __hasOwnProp$20 = Object.prototype.hasOwnProperty;
-var __propIsEnum$20 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$20 = (obj, key, value) => key in obj ? __defProp$20(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$20 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$20.call(b, prop))
-      __defNormalProp$20(a, prop, b[prop]);
-  if (__getOwnPropSymbols$20)
-    for (var prop of __getOwnPropSymbols$20(b)) {
-      if (__propIsEnum$20.call(b, prop))
-        __defNormalProp$20(a, prop, b[prop]);
-    }
-  return a;
-};
-var __objRest$1t = (source, exclude) => {
+var __objRest$1u = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$20.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$21.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$20)
-    for (var prop of __getOwnPropSymbols$20(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$20.call(source, prop))
+  if (source != null && __getOwnPropSymbols$21)
+    for (var prop of __getOwnPropSymbols$21(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$21.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -144,7 +144,7 @@ const OrganizationLogo = (_a) => {
     name,
     image,
     variant = "square"
-  } = _b, rest = __objRest$1t(_b, [
+  } = _b, rest = __objRest$1u(_b, [
     "name",
     "image",
     "variant"
@@ -153,7 +153,7 @@ const OrganizationLogo = (_a) => {
   const {
     container,
     text
-  } = useMultiStyleConfig("Avatar", __spreadValues$20({ variant, image }, rest));
+  } = useMultiStyleConfig("Avatar", __spreadValues$21({ variant, image }, rest));
   return /* @__PURE__ */ React.createElement(
     chakra.div,
     {
@@ -170,30 +170,30 @@ const OrganizationLogo = (_a) => {
   );
 };
 
-var __defProp$1$ = Object.defineProperty;
-var __getOwnPropSymbols$1$ = Object.getOwnPropertySymbols;
-var __hasOwnProp$1$ = Object.prototype.hasOwnProperty;
-var __propIsEnum$1$ = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1$ = (obj, key, value) => key in obj ? __defProp$1$(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1$ = (a, b) => {
+var __defProp$20 = Object.defineProperty;
+var __getOwnPropSymbols$20 = Object.getOwnPropertySymbols;
+var __hasOwnProp$20 = Object.prototype.hasOwnProperty;
+var __propIsEnum$20 = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$20 = (obj, key, value) => key in obj ? __defProp$20(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$20 = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$1$.call(b, prop))
-      __defNormalProp$1$(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1$)
-    for (var prop of __getOwnPropSymbols$1$(b)) {
-      if (__propIsEnum$1$.call(b, prop))
-        __defNormalProp$1$(a, prop, b[prop]);
+    if (__hasOwnProp$20.call(b, prop))
+      __defNormalProp$20(a, prop, b[prop]);
+  if (__getOwnPropSymbols$20)
+    for (var prop of __getOwnPropSymbols$20(b)) {
+      if (__propIsEnum$20.call(b, prop))
+        __defNormalProp$20(a, prop, b[prop]);
     }
   return a;
 };
-var __objRest$1s = (source, exclude) => {
+var __objRest$1t = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1$.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$20.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1$)
-    for (var prop of __getOwnPropSymbols$1$(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1$.call(source, prop))
+  if (source != null && __getOwnPropSymbols$20)
+    for (var prop of __getOwnPropSymbols$20(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$20.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -202,12 +202,30 @@ const Alert$1 = (_a) => {
   var _b = _a, {
     variant = "success",
     children
-  } = _b, rest = __objRest$1s(_b, [
+  } = _b, rest = __objRest$1t(_b, [
     "variant",
     "children"
   ]);
-  return /* @__PURE__ */ React.createElement(Alert$2, __spreadValues$1$({ variant }, rest), children);
+  return /* @__PURE__ */ React.createElement(Alert$2, __spreadValues$20({ variant }, rest), children);
+};
+
+var __defProp$1$ = Object.defineProperty;
+var __getOwnPropSymbols$1$ = Object.getOwnPropertySymbols;
+var __hasOwnProp$1$ = Object.prototype.hasOwnProperty;
+var __propIsEnum$1$ = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1$ = (obj, key, value) => key in obj ? __defProp$1$(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1$ = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1$.call(b, prop))
+      __defNormalProp$1$(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1$)
+    for (var prop of __getOwnPropSymbols$1$(b)) {
+      if (__propIsEnum$1$.call(b, prop))
+        __defNormalProp$1$(a, prop, b[prop]);
+    }
+  return a;
 };
+const AspectRatio = (props) => /* @__PURE__ */ React.createElement(AspectRatio$1, __spreadValues$1$({}, props));
 
 var __defProp$1_ = Object.defineProperty;
 var __getOwnPropSymbols$1_ = Object.getOwnPropertySymbols;
@@ -225,32 +243,14 @@ var __spreadValues$1_ = (a, b) => {
     }
   return a;
 };
-const AspectRatio = (props) => /* @__PURE__ */ React.createElement(AspectRatio$1, __spreadValues$1_({}, props));
-
-var __defProp$1Z = Object.defineProperty;
-var __getOwnPropSymbols$1Z = Object.getOwnPropertySymbols;
-var __hasOwnProp$1Z = Object.prototype.hasOwnProperty;
-var __propIsEnum$1Z = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1Z = (obj, key, value) => key in obj ? __defProp$1Z(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1Z = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1Z.call(b, prop))
-      __defNormalProp$1Z(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1Z)
-    for (var prop of __getOwnPropSymbols$1Z(b)) {
-      if (__propIsEnum$1Z.call(b, prop))
-        __defNormalProp$1Z(a, prop, b[prop]);
-    }
-  return a;
-};
-var __objRest$1r = (source, exclude) => {
+var __objRest$1s = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1Z.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$1_.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1Z)
-    for (var prop of __getOwnPropSymbols$1Z(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1Z.call(source, prop))
+  if (source != null && __getOwnPropSymbols$1_)
+    for (var prop of __getOwnPropSymbols$1_(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1_.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -261,7 +261,7 @@ const Icon$1 = forwardRef((_a, ref) => {
     size,
     color,
     boxSize
-  } = _b, rest = __objRest$1r(_b, [
+  } = _b, rest = __objRest$1s(_b, [
     "as",
     "size",
     "color",
@@ -271,7 +271,7 @@ const Icon$1 = forwardRef((_a, ref) => {
   const styles = useStyleConfig("Icon", { size, color, boxSize });
   return /* @__PURE__ */ React.createElement(
     Icon$2,
-    __spreadValues$1Z({
+    __spreadValues$1_({
       ref,
       sx: styles
     }, rest),
@@ -360,6 +360,24 @@ function getFieldError(name, errors) {
   return fieldError;
 }
 
+var __defProp$1Z = Object.defineProperty;
+var __getOwnPropSymbols$1Z = Object.getOwnPropertySymbols;
+var __hasOwnProp$1Z = Object.prototype.hasOwnProperty;
+var __propIsEnum$1Z = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1Z = (obj, key, value) => key in obj ? __defProp$1Z(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1Z = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1Z.call(b, prop))
+      __defNormalProp$1Z(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1Z)
+    for (var prop of __getOwnPropSymbols$1Z(b)) {
+      if (__propIsEnum$1Z.call(b, prop))
+        __defNormalProp$1Z(a, prop, b[prop]);
+    }
+  return a;
+};
+const passPropsToChild = (child, styles) => isValidElement(child) ? cloneElement(child, __spreadValues$1Z({}, styles)) : child;
+
 var __defProp$1Y = Object.defineProperty;
 var __getOwnPropSymbols$1Y = Object.getOwnPropertySymbols;
 var __hasOwnProp$1Y = Object.prototype.hasOwnProperty;
@@ -376,27 +394,9 @@ var __spreadValues$1Y = (a, b) => {
     }
   return a;
 };
-const passPropsToChild = (child, styles) => isValidElement(child) ? cloneElement(child, __spreadValues$1Y({}, styles)) : child;
-
-var __defProp$1X = Object.defineProperty;
-var __getOwnPropSymbols$1X = Object.getOwnPropertySymbols;
-var __hasOwnProp$1X = Object.prototype.hasOwnProperty;
-var __propIsEnum$1X = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1X = (obj, key, value) => key in obj ? __defProp$1X(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1X = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1X.call(b, prop))
-      __defNormalProp$1X(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1X)
-    for (var prop of __getOwnPropSymbols$1X(b)) {
-      if (__propIsEnum$1X.call(b, prop))
-        __defNormalProp$1X(a, prop, b[prop]);
-    }
-  return a;
-};
 const getChildrenWithProps = (children, styles, predicate = T) => {
   const childrenAsArr = Children.toArray(children);
-  const childrenWithoutFocus = childrenAsArr.map((child, i) => predicate(child, i) ? passPropsToChild(child, __spreadValues$1X({}, styles)) : child);
+  const childrenWithoutFocus = childrenAsArr.map((child, i) => predicate(child, i) ? passPropsToChild(child, __spreadValues$1Y({}, styles)) : child);
   return childrenWithoutFocus;
 };
 
@@ -430,30 +430,30 @@ const AvatarBadge = ({
   return /* @__PURE__ */ React.createElement(chakra.span, { sx: badge }, notificationCount > 999 ? "999+" : notificationCount);
 };
 
-var __defProp$1W = Object.defineProperty;
-var __getOwnPropSymbols$1W = Object.getOwnPropertySymbols;
-var __hasOwnProp$1W = Object.prototype.hasOwnProperty;
-var __propIsEnum$1W = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1W = (obj, key, value) => key in obj ? __defProp$1W(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1W = (a, b) => {
+var __defProp$1X = Object.defineProperty;
+var __getOwnPropSymbols$1X = Object.getOwnPropertySymbols;
+var __hasOwnProp$1X = Object.prototype.hasOwnProperty;
+var __propIsEnum$1X = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1X = (obj, key, value) => key in obj ? __defProp$1X(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1X = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$1W.call(b, prop))
-      __defNormalProp$1W(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1W)
-    for (var prop of __getOwnPropSymbols$1W(b)) {
-      if (__propIsEnum$1W.call(b, prop))
-        __defNormalProp$1W(a, prop, b[prop]);
+    if (__hasOwnProp$1X.call(b, prop))
+      __defNormalProp$1X(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1X)
+    for (var prop of __getOwnPropSymbols$1X(b)) {
+      if (__propIsEnum$1X.call(b, prop))
+        __defNormalProp$1X(a, prop, b[prop]);
     }
   return a;
 };
-var __objRest$1q = (source, exclude) => {
+var __objRest$1r = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1W.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$1X.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1W)
-    for (var prop of __getOwnPropSymbols$1W(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1W.call(source, prop))
+  if (source != null && __getOwnPropSymbols$1X)
+    for (var prop of __getOwnPropSymbols$1X(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1X.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -465,7 +465,7 @@ const Avatar$1 = (_a) => {
     name,
     image,
     size
-  } = _b, rest = __objRest$1q(_b, [
+  } = _b, rest = __objRest$1r(_b, [
     "variant",
     "notificationCount",
     "name",
@@ -478,7 +478,7 @@ const Avatar$1 = (_a) => {
     size,
     name
   });
-  return /* @__PURE__ */ React.createElement(Box, __spreadValues$1W({ __css: container, "data-testid": "avatar-test-id" }, rest), image ? /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues$1X({ __css: container, "data-testid": "avatar-test-id" }, rest), image ? /* @__PURE__ */ React.createElement(
     chakra.img,
     {
       alt: name,
@@ -495,6 +495,53 @@ const Avatar$1 = (_a) => {
   ), notificationCount > 0 && /* @__PURE__ */ React.createElement(AvatarBadge, { notificationCount }));
 };
 
+var __defProp$1W = Object.defineProperty;
+var __getOwnPropSymbols$1W = Object.getOwnPropertySymbols;
+var __hasOwnProp$1W = Object.prototype.hasOwnProperty;
+var __propIsEnum$1W = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1W = (obj, key, value) => key in obj ? __defProp$1W(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1W = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1W.call(b, prop))
+      __defNormalProp$1W(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1W)
+    for (var prop of __getOwnPropSymbols$1W(b)) {
+      if (__propIsEnum$1W.call(b, prop))
+        __defNormalProp$1W(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest$1q = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp$1W.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols$1W)
+    for (var prop of __getOwnPropSymbols$1W(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1W.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const H1$1 = (_a) => {
+  var _b = _a, {
+    children,
+    sx = {}
+  } = _b, rest = __objRest$1q(_b, [
+    "children",
+    "sx"
+  ]);
+  const styles = useStyleConfig("H1", { sx });
+  return /* @__PURE__ */ React.createElement(
+    Heading,
+    __spreadValues$1W({
+      as: "h1",
+      sx: styles
+    }, rest),
+    children
+  );
+};
+
 var __defProp$1V = Object.defineProperty;
 var __getOwnPropSymbols$1V = Object.getOwnPropertySymbols;
 var __hasOwnProp$1V = Object.prototype.hasOwnProperty;
@@ -523,7 +570,7 @@ var __objRest$1p = (source, exclude) => {
     }
   return target;
 };
-const H1$1 = (_a) => {
+const H2$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -531,11 +578,11 @@ const H1$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("H1", { sx });
+  const styles = useStyleConfig("H2", { sx });
   return /* @__PURE__ */ React.createElement(
     Heading,
     __spreadValues$1V({
-      as: "h1",
+      as: "h2",
       sx: styles
     }, rest),
     children
@@ -570,7 +617,7 @@ var __objRest$1o = (source, exclude) => {
     }
   return target;
 };
-const H2$1 = (_a) => {
+const H3$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -578,11 +625,11 @@ const H2$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("H2", { sx });
+  const styles = useStyleConfig("H3", { sx });
   return /* @__PURE__ */ React.createElement(
     Heading,
     __spreadValues$1U({
-      as: "h2",
+      as: "h3",
       sx: styles
     }, rest),
     children
@@ -617,7 +664,7 @@ var __objRest$1n = (source, exclude) => {
     }
   return target;
 };
-const H3$1 = (_a) => {
+const H4$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -625,11 +672,11 @@ const H3$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("H3", { sx });
+  const styles = useStyleConfig("H4", { sx });
   return /* @__PURE__ */ React.createElement(
     Heading,
     __spreadValues$1T({
-      as: "h3",
+      as: "h4",
       sx: styles
     }, rest),
     children
@@ -664,7 +711,7 @@ var __objRest$1m = (source, exclude) => {
     }
   return target;
 };
-const H4$1 = (_a) => {
+const H5$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -672,11 +719,11 @@ const H4$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("H4", { sx });
+  const styles = useStyleConfig("H5", { sx });
   return /* @__PURE__ */ React.createElement(
     Heading,
     __spreadValues$1S({
-      as: "h4",
+      as: "h5",
       sx: styles
     }, rest),
     children
@@ -711,7 +758,7 @@ var __objRest$1l = (source, exclude) => {
     }
   return target;
 };
-const H5$1 = (_a) => {
+const H6$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -719,11 +766,11 @@ const H5$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("H5", { sx });
+  const styles = useStyleConfig("H6", { sx });
   return /* @__PURE__ */ React.createElement(
     Heading,
     __spreadValues$1R({
-      as: "h5",
+      as: "h6",
       sx: styles
     }, rest),
     children
@@ -758,19 +805,21 @@ var __objRest$1k = (source, exclude) => {
     }
   return target;
 };
-const H6$1 = (_a) => {
+const P$1 = (_a) => {
   var _b = _a, {
     children,
+    variant = "16",
     sx = {}
   } = _b, rest = __objRest$1k(_b, [
     "children",
+    "variant",
     "sx"
   ]);
-  const styles = useStyleConfig("H6", { sx });
+  const styles = useStyleConfig("P", { variant, sx });
   return /* @__PURE__ */ React.createElement(
-    Heading,
+    Text,
     __spreadValues$1Q({
-      as: "h6",
+      variant,
       sx: styles
     }, rest),
     children
@@ -805,25 +854,10 @@ var __objRest$1j = (source, exclude) => {
     }
   return target;
 };
-const P$1 = (_a) => {
-  var _b = _a, {
-    children,
-    variant = "16",
-    sx = {}
-  } = _b, rest = __objRest$1j(_b, [
-    "children",
-    "variant",
-    "sx"
-  ]);
-  const styles = useStyleConfig("P", { variant, sx });
-  return /* @__PURE__ */ React.createElement(
-    Text,
-    __spreadValues$1P({
-      variant,
-      sx: styles
-    }, rest),
-    children
-  );
+const Blockquote$1 = (_a) => {
+  var _b = _a, { children, sx = {} } = _b, rest = __objRest$1j(_b, ["children", "sx"]);
+  const styles = useStyleConfig("Blockquote", { sx });
+  return /* @__PURE__ */ React.createElement(Text, __spreadValues$1P({ as: "span", sx: styles }, rest), children);
 };
 
 var __defProp$1O = Object.defineProperty;
@@ -854,10 +888,23 @@ var __objRest$1i = (source, exclude) => {
     }
   return target;
 };
-const Blockquote$1 = (_a) => {
-  var _b = _a, { children, sx = {} } = _b, rest = __objRest$1i(_b, ["children", "sx"]);
-  const styles = useStyleConfig("Blockquote", { sx });
-  return /* @__PURE__ */ React.createElement(Text, __spreadValues$1O({ as: "span", sx: styles }, rest), children);
+const Capitalized$1 = (_a) => {
+  var _b = _a, {
+    children,
+    sx = {}
+  } = _b, rest = __objRest$1i(_b, [
+    "children",
+    "sx"
+  ]);
+  const styles = useStyleConfig("Capitalized", { sx });
+  return /* @__PURE__ */ React.createElement(
+    Text,
+    __spreadValues$1O({
+      as: "span",
+      sx: styles
+    }, rest),
+    children
+  );
 };
 
 var __defProp$1N = Object.defineProperty;
@@ -888,7 +935,7 @@ var __objRest$1h = (source, exclude) => {
     }
   return target;
 };
-const Capitalized$1 = (_a) => {
+const Lead$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -896,7 +943,7 @@ const Capitalized$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("Capitalized", { sx });
+  const styles = useStyleConfig("Lead", { sx });
   return /* @__PURE__ */ React.createElement(
     Text,
     __spreadValues$1N({
@@ -935,7 +982,7 @@ var __objRest$1g = (source, exclude) => {
     }
   return target;
 };
-const Lead$1 = (_a) => {
+const Small$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -943,11 +990,11 @@ const Lead$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("Lead", { sx });
+  const styles = useStyleConfig("Small", { sx });
   return /* @__PURE__ */ React.createElement(
     Text,
     __spreadValues$1M({
-      as: "span",
+      as: "small",
       sx: styles
     }, rest),
     children
@@ -982,7 +1029,7 @@ var __objRest$1f = (source, exclude) => {
     }
   return target;
 };
-const Small$1 = (_a) => {
+const Tiny$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
@@ -990,11 +1037,11 @@ const Small$1 = (_a) => {
     "children",
     "sx"
   ]);
-  const styles = useStyleConfig("Small", { sx });
+  const styles = useStyleConfig("Tiny", { sx });
   return /* @__PURE__ */ React.createElement(
     Text,
     __spreadValues$1L({
-      as: "small",
+      as: "span",
       sx: styles
     }, rest),
     children
@@ -1020,58 +1067,11 @@ var __spreadValues$1K = (a, b) => {
 var __objRest$1e = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1K.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1K)
-    for (var prop of __getOwnPropSymbols$1K(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1K.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-const Tiny$1 = (_a) => {
-  var _b = _a, {
-    children,
-    sx = {}
-  } = _b, rest = __objRest$1e(_b, [
-    "children",
-    "sx"
-  ]);
-  const styles = useStyleConfig("Tiny", { sx });
-  return /* @__PURE__ */ React.createElement(
-    Text,
-    __spreadValues$1K({
-      as: "span",
-      sx: styles
-    }, rest),
-    children
-  );
-};
-
-var __defProp$1J = Object.defineProperty;
-var __getOwnPropSymbols$1J = Object.getOwnPropertySymbols;
-var __hasOwnProp$1J = Object.prototype.hasOwnProperty;
-var __propIsEnum$1J = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1J = (obj, key, value) => key in obj ? __defProp$1J(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1J = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1J.call(b, prop))
-      __defNormalProp$1J(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1J)
-    for (var prop of __getOwnPropSymbols$1J(b)) {
-      if (__propIsEnum$1J.call(b, prop))
-        __defNormalProp$1J(a, prop, b[prop]);
-    }
-  return a;
-};
-var __objRest$1d = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$1J.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$1K.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1J)
-    for (var prop of __getOwnPropSymbols$1J(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1J.call(source, prop))
+  if (source != null && __getOwnPropSymbols$1K)
+    for (var prop of __getOwnPropSymbols$1K(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1K.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -1081,7 +1081,7 @@ const Label$1 = (_a) => {
     children,
     size = "sm",
     sx = {}
-  } = _b, rest = __objRest$1d(_b, [
+  } = _b, rest = __objRest$1e(_b, [
     "children",
     "size",
     "sx"
@@ -1089,7 +1089,7 @@ const Label$1 = (_a) => {
   const styles = useStyleConfig("Label", { sx, size });
   return /* @__PURE__ */ React.createElement(
     FormLabel$1,
-    __spreadValues$1J({
+    __spreadValues$1K({
       sx: styles,
       requiredIndicator: /* @__PURE__ */ React.createElement(VisuallyHidden, null)
     }, rest),
@@ -1177,30 +1177,30 @@ const useOverflowGroup = () => {
   return { rect, containerRef };
 };
 
-var __defProp$1I = Object.defineProperty;
-var __getOwnPropSymbols$1I = Object.getOwnPropertySymbols;
-var __hasOwnProp$1I = Object.prototype.hasOwnProperty;
-var __propIsEnum$1I = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1I = (obj, key, value) => key in obj ? __defProp$1I(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1I = (a, b) => {
+var __defProp$1J = Object.defineProperty;
+var __getOwnPropSymbols$1J = Object.getOwnPropertySymbols;
+var __hasOwnProp$1J = Object.prototype.hasOwnProperty;
+var __propIsEnum$1J = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1J = (obj, key, value) => key in obj ? __defProp$1J(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1J = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$1I.call(b, prop))
-      __defNormalProp$1I(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1I)
-    for (var prop of __getOwnPropSymbols$1I(b)) {
-      if (__propIsEnum$1I.call(b, prop))
-        __defNormalProp$1I(a, prop, b[prop]);
+    if (__hasOwnProp$1J.call(b, prop))
+      __defNormalProp$1J(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1J)
+    for (var prop of __getOwnPropSymbols$1J(b)) {
+      if (__propIsEnum$1J.call(b, prop))
+        __defNormalProp$1J(a, prop, b[prop]);
     }
   return a;
 };
-var __objRest$1c = (source, exclude) => {
+var __objRest$1d = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1I.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$1J.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1I)
-    for (var prop of __getOwnPropSymbols$1I(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1I.call(source, prop))
+  if (source != null && __getOwnPropSymbols$1J)
+    for (var prop of __getOwnPropSymbols$1J(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1J.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -1210,14 +1210,32 @@ const AvatarGroup = (_a) => {
     children,
     max = Infinity,
     spacing = "-4"
-  } = _b, rest = __objRest$1c(_b, [
+  } = _b, rest = __objRest$1d(_b, [
     "children",
     "max",
     "spacing"
   ]);
   const [nbrRemainingAvatars, setNbrRemainingAvatars] = useState(0);
-  return /* @__PURE__ */ React.createElement(HStack, __spreadValues$1I({ bgColor: "background.default" }, rest), /* @__PURE__ */ React.createElement(HStack, { spacing }, /* @__PURE__ */ React.createElement(OverflowGroup, { max, onChange: setNbrRemainingAvatars }, children)), nbrRemainingAvatars > 0 && /* @__PURE__ */ React.createElement(Small$1, { sx: { color: "blue.500" } }, "+", nbrRemainingAvatars));
+  return /* @__PURE__ */ React.createElement(HStack, __spreadValues$1J({ bgColor: "background.default" }, rest), /* @__PURE__ */ React.createElement(HStack, { spacing }, /* @__PURE__ */ React.createElement(OverflowGroup, { max, onChange: setNbrRemainingAvatars }, children)), nbrRemainingAvatars > 0 && /* @__PURE__ */ React.createElement(Small$1, { sx: { color: "blue.500" } }, "+", nbrRemainingAvatars));
+};
+
+var __defProp$1I = Object.defineProperty;
+var __getOwnPropSymbols$1I = Object.getOwnPropertySymbols;
+var __hasOwnProp$1I = Object.prototype.hasOwnProperty;
+var __propIsEnum$1I = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1I = (obj, key, value) => key in obj ? __defProp$1I(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1I = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1I.call(b, prop))
+      __defNormalProp$1I(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1I)
+    for (var prop of __getOwnPropSymbols$1I(b)) {
+      if (__propIsEnum$1I.call(b, prop))
+        __defNormalProp$1I(a, prop, b[prop]);
+    }
+  return a;
 };
+const Badge = (props) => /* @__PURE__ */ React.createElement(Badge$1, __spreadValues$1I({}, props));
 
 var __defProp$1H = Object.defineProperty;
 var __getOwnPropSymbols$1H = Object.getOwnPropertySymbols;
@@ -1235,7 +1253,31 @@ var __spreadValues$1H = (a, b) => {
     }
   return a;
 };
-const Badge = (props) => /* @__PURE__ */ React.createElement(Badge$1, __spreadValues$1H({}, props));
+var __objRest$1c = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp$1H.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols$1H)
+    for (var prop of __getOwnPropSymbols$1H(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1H.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const Blinker$1 = (_a) => {
+  var _b = _a, {
+    color = "",
+    size,
+    isBlinking = true
+  } = _b, rest = __objRest$1c(_b, [
+    "color",
+    "size",
+    "isBlinking"
+  ]);
+  const styles = useStyleConfig("Blinker", { color, size, isBlinking });
+  return /* @__PURE__ */ React.createElement(Box, __spreadValues$1H({ sx: styles, "data-testid": "blinker-test-id" }, rest));
+};
 
 var __defProp$1G = Object.defineProperty;
 var __getOwnPropSymbols$1G = Object.getOwnPropertySymbols;
@@ -1265,19 +1307,12 @@ var __objRest$1b = (source, exclude) => {
     }
   return target;
 };
-const Blinker$1 = (_a) => {
-  var _b = _a, {
-    color = "",
-    size,
-    isBlinking = true
-  } = _b, rest = __objRest$1b(_b, [
-    "color",
-    "size",
-    "isBlinking"
-  ]);
-  const styles = useStyleConfig("Blinker", { color, size, isBlinking });
-  return /* @__PURE__ */ React.createElement(Box, __spreadValues$1G({ sx: styles, "data-testid": "blinker-test-id" }, rest));
-};
+const Button$1 = forwardRef$1(
+  (_a, ref) => {
+    var _b = _a, { variant = "default", children } = _b, rest = __objRest$1b(_b, ["variant", "children"]);
+    return /* @__PURE__ */ React.createElement(Button$2, __spreadValues$1G({ variant, ref }, rest), children);
+  }
+);
 
 var __defProp$1F = Object.defineProperty;
 var __getOwnPropSymbols$1F = Object.getOwnPropertySymbols;
@@ -1307,41 +1342,6 @@ var __objRest$1a = (source, exclude) => {
     }
   return target;
 };
-const Button$1 = forwardRef$1(
-  (_a, ref) => {
-    var _b = _a, { variant = "default", children } = _b, rest = __objRest$1a(_b, ["variant", "children"]);
-    return /* @__PURE__ */ React.createElement(Button$2, __spreadValues$1F({ variant, ref }, rest), children);
-  }
-);
-
-var __defProp$1E = Object.defineProperty;
-var __getOwnPropSymbols$1E = Object.getOwnPropertySymbols;
-var __hasOwnProp$1E = Object.prototype.hasOwnProperty;
-var __propIsEnum$1E = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1E = (obj, key, value) => key in obj ? __defProp$1E(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1E = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1E.call(b, prop))
-      __defNormalProp$1E(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1E)
-    for (var prop of __getOwnPropSymbols$1E(b)) {
-      if (__propIsEnum$1E.call(b, prop))
-        __defNormalProp$1E(a, prop, b[prop]);
-    }
-  return a;
-};
-var __objRest$19 = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$1E.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1E)
-    for (var prop of __getOwnPropSymbols$1E(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1E.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 const Checkbox$1 = (_a) => {
   var _b = _a, {
     value,
@@ -1349,7 +1349,7 @@ const Checkbox$1 = (_a) => {
     name,
     size = "md",
     variant = "default"
-  } = _b, rest = __objRest$19(_b, [
+  } = _b, rest = __objRest$1a(_b, [
     "value",
     "onChange",
     "name",
@@ -1358,7 +1358,7 @@ const Checkbox$1 = (_a) => {
   ]);
   return /* @__PURE__ */ React.createElement(
     Checkbox$2,
-    __spreadValues$1E({
+    __spreadValues$1F({
       size,
       id: name,
       onChange,
@@ -1384,30 +1384,30 @@ const trimFormValues = (obj) => {
   return newObj;
 };
 
-var __defProp$1D = Object.defineProperty;
-var __getOwnPropSymbols$1D = Object.getOwnPropertySymbols;
-var __hasOwnProp$1D = Object.prototype.hasOwnProperty;
-var __propIsEnum$1D = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1D = (obj, key, value) => key in obj ? __defProp$1D(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1D = (a, b) => {
+var __defProp$1E = Object.defineProperty;
+var __getOwnPropSymbols$1E = Object.getOwnPropertySymbols;
+var __hasOwnProp$1E = Object.prototype.hasOwnProperty;
+var __propIsEnum$1E = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1E = (obj, key, value) => key in obj ? __defProp$1E(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1E = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$1D.call(b, prop))
-      __defNormalProp$1D(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1D)
-    for (var prop of __getOwnPropSymbols$1D(b)) {
-      if (__propIsEnum$1D.call(b, prop))
-        __defNormalProp$1D(a, prop, b[prop]);
+    if (__hasOwnProp$1E.call(b, prop))
+      __defNormalProp$1E(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1E)
+    for (var prop of __getOwnPropSymbols$1E(b)) {
+      if (__propIsEnum$1E.call(b, prop))
+        __defNormalProp$1E(a, prop, b[prop]);
     }
   return a;
 };
-var __objRest$18 = (source, exclude) => {
+var __objRest$19 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1D.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$1E.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1D)
-    for (var prop of __getOwnPropSymbols$1D(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1D.call(source, prop))
+  if (source != null && __getOwnPropSymbols$1E)
+    for (var prop of __getOwnPropSymbols$1E(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1E.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -1423,7 +1423,7 @@ const Form = forwardRef$1((_a, ref) => {
     enableReinitialize = false,
     shouldTrim = true,
     innerFormStyle = {}
-  } = _b, rest = __objRest$18(_b, [
+  } = _b, rest = __objRest$19(_b, [
     "initialValues",
     "onSubmit",
     "children",
@@ -1438,7 +1438,7 @@ const Form = forwardRef$1((_a, ref) => {
     values,
     errors: validate(values)
   });
-  const newMethods = methods || useForm(__spreadValues$1D({
+  const newMethods = methods || useForm(__spreadValues$1E({
     defaultValues: initialValues,
     resolver: validate ? customResolver : void 0
   }, formSettings));
@@ -1464,33 +1464,33 @@ const Form = forwardRef$1((_a, ref) => {
     newMethods.trigger();
     e.preventDefault();
   };
-  return /* @__PURE__ */ React.createElement(FormProvider, __spreadValues$1D(__spreadValues$1D({}, newMethods), rest), /* @__PURE__ */ React.createElement("form", { style: __spreadValues$1D({ width: "100%" }, innerFormStyle), onSubmit: handleSubmit }, typeof children === "function" ? children(newMethods) : children));
+  return /* @__PURE__ */ React.createElement(FormProvider, __spreadValues$1E(__spreadValues$1E({}, newMethods), rest), /* @__PURE__ */ React.createElement("form", { style: __spreadValues$1E({ width: "100%" }, innerFormStyle), onSubmit: handleSubmit }, typeof children === "function" ? children(newMethods) : children));
 });
 
-var __defProp$1C = Object.defineProperty;
-var __getOwnPropSymbols$1C = Object.getOwnPropertySymbols;
-var __hasOwnProp$1C = Object.prototype.hasOwnProperty;
-var __propIsEnum$1C = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1C = (obj, key, value) => key in obj ? __defProp$1C(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1C = (a, b) => {
+var __defProp$1D = Object.defineProperty;
+var __getOwnPropSymbols$1D = Object.getOwnPropertySymbols;
+var __hasOwnProp$1D = Object.prototype.hasOwnProperty;
+var __propIsEnum$1D = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1D = (obj, key, value) => key in obj ? __defProp$1D(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1D = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp$1C.call(b, prop))
-      __defNormalProp$1C(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1C)
-    for (var prop of __getOwnPropSymbols$1C(b)) {
-      if (__propIsEnum$1C.call(b, prop))
-        __defNormalProp$1C(a, prop, b[prop]);
+    if (__hasOwnProp$1D.call(b, prop))
+      __defNormalProp$1D(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1D)
+    for (var prop of __getOwnPropSymbols$1D(b)) {
+      if (__propIsEnum$1D.call(b, prop))
+        __defNormalProp$1D(a, prop, b[prop]);
     }
   return a;
 };
-var __objRest$17 = (source, exclude) => {
+var __objRest$18 = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp$1C.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp$1D.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$1C)
-    for (var prop of __getOwnPropSymbols$1C(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$1C.call(source, prop))
+  if (source != null && __getOwnPropSymbols$1D)
+    for (var prop of __getOwnPropSymbols$1D(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1D.call(source, prop))
         target[prop] = source[prop];
     }
   return target;
@@ -1498,12 +1498,12 @@ var __objRest$17 = (source, exclude) => {
 const FormLabel = (_a) => {
   var _b = _a, {
     children: label
-  } = _b, rest = __objRest$17(_b, [
+  } = _b, rest = __objRest$18(_b, [
     "children"
   ]);
   return /* @__PURE__ */ React.createElement(
     Label$1,
-    __spreadValues$1C({
+    __spreadValues$1D({
       size: "sm",
       sx: {
         width: "80%",
@@ -1740,27 +1740,65 @@ const useScreenSize = () => {
   return "sm";
 };
 
-function Field({
-  name,
-  label,
-  children,
-  direction = "column",
-  isRequired = false,
-  noLabelConnection = false,
-  validate,
-  control: passedControl
-}) {
+var __defProp$1C = Object.defineProperty;
+var __getOwnPropSymbols$1C = Object.getOwnPropertySymbols;
+var __hasOwnProp$1C = Object.prototype.hasOwnProperty;
+var __propIsEnum$1C = Object.prototype.propertyIsEnumerable;
+var __defNormalProp$1C = (obj, key, value) => key in obj ? __defProp$1C(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues$1C = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp$1C.call(b, prop))
+      __defNormalProp$1C(a, prop, b[prop]);
+  if (__getOwnPropSymbols$1C)
+    for (var prop of __getOwnPropSymbols$1C(b)) {
+      if (__propIsEnum$1C.call(b, prop))
+        __defNormalProp$1C(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest$17 = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp$1C.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols$1C)
+    for (var prop of __getOwnPropSymbols$1C(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum$1C.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+function Field(_a) {
+  var _b = _a, {
+    name,
+    label,
+    children,
+    direction = "column",
+    isRequired = false,
+    noLabelConnection = false,
+    validate,
+    control: passedControl
+  } = _b, rest = __objRest$17(_b, [
+    "name",
+    "label",
+    "children",
+    "direction",
+    "isRequired",
+    "noLabelConnection",
+    "validate",
+    "control"
+  ]);
   const methods = useFormContext();
   const { formState: { errors } } = methods;
   const control = passedControl != null ? passedControl : methods.control;
   const fieldError = getFieldError(name, errors);
   return /* @__PURE__ */ React.createElement(FormControl, { isInvalid: !!fieldError, isRequired }, /* @__PURE__ */ React.createElement(
     Stack,
-    {
+    __spreadValues$1C({
       spacing: "auto",
       direction,
       alignItems: direction === "column" ? "stretch" : "center"
-    },
+    }, rest),
     label && /* @__PURE__ */ React.createElement(FormLabel, { htmlFor: noLabelConnection ? void 0 : name, mb: 1 }, label),
     /* @__PURE__ */ React.createElement(
       Controller,
@@ -2350,7 +2388,7 @@ const FlipButton$1 = (props) => {
   }, rest)) : /* @__PURE__ */ React.createElement(
     HStack,
     {
-      spacing: isSelected || icon ? 2 : 0,
+      spacing: isSelected && iconPlacement !== "none" || icon ? 2 : 0,
       sx: mergeAll([button, isFocused ? focusStyles : {}, { flexDirection: iconPlacement === "left" ? "row" : "row-reverse" }]),
       "aria-checked": isSelected,
       "aria-disabled": isDisabled,
@@ -5333,16 +5371,24 @@ var __objRest$G = (source, exclude) => {
     }
   return target;
 };
-function getComponents() {
-  return {
-    DropdownIndicator: (props) => props.selectProps.icon ? /* @__PURE__ */ React.createElement(chakraComponents.DropdownIndicator, __spreadValues$W({}, props), /* @__PURE__ */ React.createElement(Icon$1, { as: props.selectProps.icon })) : /* @__PURE__ */ React.createElement(chakraComponents.DropdownIndicator, __spreadValues$W({}, props)),
-    Option: (props) => props.selectProps.customOption ? /* @__PURE__ */ React.createElement(chakraComponents.Option, __spreadValues$W({}, props), props.selectProps.customOption(props.data)) : /* @__PURE__ */ React.createElement(chakraComponents.Option, __spreadValues$W({}, props)),
-    MultiValueContainer: (props) => props.selectProps.customTag ? /* @__PURE__ */ React.createElement(chakraComponents.MultiValueContainer, __spreadValues$W({}, props), props.selectProps.customTag(props.data)) : /* @__PURE__ */ React.createElement(chakraComponents.MultiValueContainer, __spreadValues$W({}, props)),
+function getComponents({
+  defaultControl = true
+}) {
+  const control = defaultControl ? {} : {
     Control: (_a) => {
-      var _b = _a, { children } = _b, props = __objRest$G(_b, ["children"]);
+      var _b = _a, {
+        children
+      } = _b, props = __objRest$G(_b, [
+        "children"
+      ]);
       return props.selectProps.leftIcon ? /* @__PURE__ */ React.createElement(chakraComponents.Control, __spreadValues$W({}, props), /* @__PURE__ */ React.createElement(HStack, { w: "full", pl: "2" }, /* @__PURE__ */ React.createElement(Icon$1, { as: props.selectProps.leftIcon }), /* @__PURE__ */ React.createElement(HStack, { w: "full", justify: "space-between" }, children))) : /* @__PURE__ */ React.createElement(chakraComponents.Control, __spreadValues$W({}, props), children);
     }
   };
+  return __spreadValues$W({
+    DropdownIndicator: (props) => props.selectProps.icon ? /* @__PURE__ */ React.createElement(chakraComponents.DropdownIndicator, __spreadValues$W({}, props), /* @__PURE__ */ React.createElement(Icon$1, { as: props.selectProps.icon })) : /* @__PURE__ */ React.createElement(chakraComponents.DropdownIndicator, __spreadValues$W({}, props)),
+    Option: (props) => props.selectProps.customOption ? /* @__PURE__ */ React.createElement(chakraComponents.Option, __spreadValues$W({}, props), props.selectProps.customOption(props.data)) : /* @__PURE__ */ React.createElement(chakraComponents.Option, __spreadValues$W({}, props)),
+    MultiValueContainer: (props) => props.selectProps.customTag ? /* @__PURE__ */ React.createElement(chakraComponents.MultiValueContainer, __spreadValues$W({}, props), props.selectProps.customTag(props.data)) : /* @__PURE__ */ React.createElement(chakraComponents.MultiValueContainer, __spreadValues$W({}, props))
+  }, control);
 }
 
 var __defProp$V = Object.defineProperty;
@@ -5423,7 +5469,7 @@ const SearchBar = forwardRef$1(
       isMulti,
       value: is(Array, value) ? value : []
     });
-    const customComponents = getComponents();
+    const customComponents = getComponents({ defaultControl: true });
     const simpleFilter = (query) => filter(
       (option) => test(new RegExp(toLower(query), "g"), toLower(option.label)),
       defaultOptions
@@ -10920,7 +10966,7 @@ function Select(_a) {
     isMulti,
     value: is(Array, value) ? value : []
   });
-  const customComponents = getComponents();
+  const customComponents = getComponents({ defaultControl: false });
   const prevOptions = useRef(
     options
   );