mainbase-ui 3.36.0 → 3.37.0

package/dist/cjs/components/icons.cjs

@@ -1,10 +1,11 @@
 "use client";
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var factory = require('../styled-system/factory.cjs');
 
 const CheckIcon = (props) => {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     factory.mainbase.svg,
     {
       viewBox: "0 0 24 24",
@@ -13,12 +14,12 @@ const CheckIcon = (props) => {
       strokeWidth: "2",
       strokeLinecap: "round",
       strokeLinejoin: "round",
-      ...props
-    },
-    /* @__PURE__ */ React.createElement("path", { d: "M20 6 9 17l-5-5" })
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" })
+    }
   );
 };
-const ChevronLeftIcon = (props) => /* @__PURE__ */ React.createElement(
+const ChevronLeftIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   factory.mainbase.svg,
   {
     viewBox: "0 0 24 24",
@@ -27,11 +28,11 @@ const ChevronLeftIcon = (props) => /* @__PURE__ */ React.createElement(
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "m15 18-6-6 6-6" })
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m15 18-6-6 6-6" })
+  }
 );
-const ChevronUpIcon = (props) => /* @__PURE__ */ React.createElement(
+const ChevronUpIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   factory.mainbase.svg,
   {
     viewBox: "0 0 24 24",
@@ -40,12 +41,12 @@ const ChevronUpIcon = (props) => /* @__PURE__ */ React.createElement(
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "m18 15-6-6-6 6" })
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m18 15-6-6-6 6" })
+  }
 );
 const ChevronDownIcon = (props) => {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     factory.mainbase.svg,
     {
       viewBox: "0 0 24 24",
@@ -54,12 +55,12 @@ const ChevronDownIcon = (props) => {
       strokeWidth: "2",
       strokeLinecap: "round",
       strokeLinejoin: "round",
-      ...props
-    },
-    /* @__PURE__ */ React.createElement("path", { d: "m6 9 6 6 6-6" })
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
+    }
   );
 };
-const ChevronRightIcon = (props) => /* @__PURE__ */ React.createElement(
+const ChevronRightIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   factory.mainbase.svg,
   {
     viewBox: "0 0 24 24",
@@ -68,11 +69,11 @@ const ChevronRightIcon = (props) => /* @__PURE__ */ React.createElement(
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "m9 18 6-6-6-6" })
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m9 18 6-6-6-6" })
+  }
 );
-const EllpsisIcon = (props) => /* @__PURE__ */ React.createElement(
+const EllpsisIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   factory.mainbase.svg,
   {
     viewBox: "0 0 24 24",
@@ -81,13 +82,15 @@ const EllpsisIcon = (props) => /* @__PURE__ */ React.createElement(
     strokeWidth: "2",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "1" }),
-  /* @__PURE__ */ React.createElement("circle", { cx: "19", cy: "12", r: "1" }),
-  /* @__PURE__ */ React.createElement("circle", { cx: "5", cy: "12", r: "1" })
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "1" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "19", cy: "12", r: "1" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "5", cy: "12", r: "1" })
+    ]
+  }
 );
-const ArrowUpIcon = (props) => /* @__PURE__ */ React.createElement(
+const ArrowUpIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   factory.mainbase.svg,
   {
     viewBox: "0 0 24 24",
@@ -96,12 +99,14 @@ const ArrowUpIcon = (props) => /* @__PURE__ */ React.createElement(
     strokeWidth: "3",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "m5 12 7-7 7 7" }),
-  /* @__PURE__ */ React.createElement("path", { d: "M12 19V5" })
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m5 12 7-7 7 7" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 19V5" })
+    ]
+  }
 );
-const ArrowDownIcon = (props) => /* @__PURE__ */ React.createElement(
+const ArrowDownIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   factory.mainbase.svg,
   {
     viewBox: "0 0 24 24",
@@ -110,56 +115,58 @@ const ArrowDownIcon = (props) => /* @__PURE__ */ React.createElement(
     strokeWidth: "3",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "M12 5v14" }),
-  /* @__PURE__ */ React.createElement("path", { d: "m19 12-7 7-7-7" })
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 5v14" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m19 12-7 7-7-7" })
+    ]
+  }
 );
-const CheckCircleIcon = (props) => /* @__PURE__ */ React.createElement(
+const CheckCircleIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   factory.mainbase.svg,
   {
     stroke: "currentColor",
     fill: "currentColor",
     strokeWidth: "0",
     viewBox: "0 0 24 24",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z" })
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11.0026 16L6.75999 11.7574L8.17421 10.3431L11.0026 13.1716L16.6595 7.51472L18.0737 8.92893L11.0026 16Z" })
+  }
 );
-const WarningIcon = (props) => /* @__PURE__ */ React.createElement(
+const WarningIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   factory.mainbase.svg,
   {
     stroke: "currentColor",
     fill: "currentColor",
     strokeWidth: "0",
     viewBox: "0 0 24 24",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z" })
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 15H13V17H11V15ZM11 7H13V13H11V7Z" })
+  }
 );
-const InfoIcon = (props) => /* @__PURE__ */ React.createElement(
+const InfoIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
   factory.mainbase.svg,
   {
     viewBox: "0 0 24 24",
     fill: "currentColor",
     stroke: "currentColor",
     strokeWidth: "0",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z" })
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z" })
+  }
 );
-const QuoteIcon = (props) => /* @__PURE__ */ React.createElement(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M6.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35l.539-.222.474-.197-.485-1.938-.597.144c-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.318.142-.686.238-1.028.466-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.945-.33.358-.656.734-.909 1.162-.293.408-.492.856-.702 1.299-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539l.025.168.026-.006A4.5 4.5 0 1 0 6.5 10zm11 0c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35l.539-.222.474-.197-.485-1.938-.597.144c-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.317.143-.686.238-1.028.467-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.944-.33.358-.656.734-.909 1.162-.293.408-.492.856-.702 1.299-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539l.025.168.026-.006A4.5 4.5 0 1 0 17.5 10z" }));
-const StarIcon = (props) => /* @__PURE__ */ React.createElement(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" }));
-const ErrorIcon = (props) => /* @__PURE__ */ React.createElement(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M11.983,0a12.206,12.206,0,0,0-8.51,3.653A11.8,11.8,0,0,0,0,12.207,11.779,11.779,0,0,0,11.8,24h.214A12.111,12.111,0,0,0,24,11.791h0A11.766,11.766,0,0,0,11.983,0ZM10.5,16.542a1.476,1.476,0,0,1,1.449-1.53h.027a1.527,1.527,0,0,1,1.523,1.47,1.475,1.475,0,0,1-1.449,1.53h-.027A1.529,1.529,0,0,1,10.5,16.542ZM11,12.5v-6a1,1,0,0,1,2,0v6a1,1,0,1,1-2,0Z" }));
-const CloseIcon = (props) => /* @__PURE__ */ React.createElement(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props }, /* @__PURE__ */ React.createElement(
+const QuoteIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6.5 10c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35l.539-.222.474-.197-.485-1.938-.597.144c-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.318.142-.686.238-1.028.466-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.945-.33.358-.656.734-.909 1.162-.293.408-.492.856-.702 1.299-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539l.025.168.026-.006A4.5 4.5 0 1 0 6.5 10zm11 0c-.223 0-.437.034-.65.065.069-.232.14-.468.254-.68.114-.308.292-.575.469-.844.148-.291.409-.488.601-.737.201-.242.475-.403.692-.604.213-.21.492-.315.714-.463.232-.133.434-.28.65-.35l.539-.222.474-.197-.485-1.938-.597.144c-.191.048-.424.104-.689.171-.271.05-.56.187-.882.312-.317.143-.686.238-1.028.467-.344.218-.741.4-1.091.692-.339.301-.748.562-1.05.944-.33.358-.656.734-.909 1.162-.293.408-.492.856-.702 1.299-.19.443-.343.896-.468 1.336-.237.882-.343 1.72-.384 2.437-.034.718-.014 1.315.028 1.747.015.204.043.402.063.539l.025.168.026-.006A4.5 4.5 0 1 0 17.5 10z" }) });
+const StarIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" }) });
+const ErrorIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M11.983,0a12.206,12.206,0,0,0-8.51,3.653A11.8,11.8,0,0,0,0,12.207,11.779,11.779,0,0,0,11.8,24h.214A12.111,12.111,0,0,0,24,11.791h0A11.766,11.766,0,0,0,11.983,0ZM10.5,16.542a1.476,1.476,0,0,1,1.449-1.53h.027a1.527,1.527,0,0,1,1.523,1.47,1.475,1.475,0,0,1-1.449,1.53h-.027A1.529,1.529,0,0,1,10.5,16.542ZM11,12.5v-6a1,1,0,0,1,2,0v6a1,1,0,1,1-2,0Z" }) });
+const CloseIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx(factory.mainbase.svg, { viewBox: "0 0 24 24", fill: "currentColor", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
   "path",
   {
     fillRule: "evenodd",
     clipRule: "evenodd",
     d: "M18.7071 6.70711C19.0976 6.31658 19.0976 5.68342 18.7071 5.29289C18.3166 4.90237 17.6834 4.90237 17.2929 5.29289L12 10.5858L6.70711 5.29289C6.31658 4.90237 5.68342 4.90237 5.29289 5.29289C4.90237 5.68342 4.90237 6.31658 5.29289 6.70711L10.5858 12L5.29289 17.2929C4.90237 17.6834 4.90237 18.3166 5.29289 18.7071C5.68342 19.0976 6.31658 19.0976 6.70711 18.7071L12 13.4142L17.2929 18.7071C17.6834 19.0976 18.3166 19.0976 18.7071 18.7071C19.0976 18.3166 19.0976 17.6834 18.7071 17.2929L13.4142 12L18.7071 6.70711Z"
   }
-));
-const FileIcon = (props) => /* @__PURE__ */ React.createElement(
+) });
+const FileIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   factory.mainbase.svg,
   {
     stroke: "currentColor",
@@ -168,12 +175,14 @@ const FileIcon = (props) => /* @__PURE__ */ React.createElement(
     viewBox: "0 0 24 24",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
-  /* @__PURE__ */ React.createElement("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" })
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" })
+    ]
+  }
 );
-const CopyIcon = (props) => /* @__PURE__ */ React.createElement(
+const CopyIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   factory.mainbase.svg,
   {
     stroke: "currentColor",
@@ -182,12 +191,14 @@ const CopyIcon = (props) => /* @__PURE__ */ React.createElement(
     viewBox: "0 0 24 24",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
-  /* @__PURE__ */ React.createElement("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
+    ]
+  }
 );
-const PipetteIcon = (props) => /* @__PURE__ */ React.createElement(
+const PipetteIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   factory.mainbase.svg,
   {
     stroke: "currentColor",
@@ -196,13 +207,15 @@ const PipetteIcon = (props) => /* @__PURE__ */ React.createElement(
     viewBox: "0 0 24 24",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("path", { d: "m2 22 1-1h3l9-9" }),
-  /* @__PURE__ */ React.createElement("path", { d: "M3 21v-3l9-9" }),
-  /* @__PURE__ */ React.createElement("path", { d: "m15 6 3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m2 22 1-1h3l9-9" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 21v-3l9-9" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m15 6 3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
+    ]
+  }
 );
-const EllipsisIcon = (props) => /* @__PURE__ */ React.createElement(
+const EllipsisIcon = (props) => /* @__PURE__ */ jsxRuntime.jsxs(
   factory.mainbase.svg,
   {
     stroke: "currentColor",
@@ -211,11 +224,13 @@ const EllipsisIcon = (props) => /* @__PURE__ */ React.createElement(
     viewBox: "0 0 24 24",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    ...props
-  },
-  /* @__PURE__ */ React.createElement("circle", { cx: "12", cy: "12", r: "1" }),
-  /* @__PURE__ */ React.createElement("circle", { cx: "19", cy: "12", r: "1" }),
-  /* @__PURE__ */ React.createElement("circle", { cx: "5", cy: "12", r: "1" })
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "1" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "19", cy: "12", r: "1" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "5", cy: "12", r: "1" })
+    ]
+  }
 );
 
 exports.ArrowDownIcon = ArrowDownIcon;

package/dist/cjs/components/image/image.cjs

@@ -1,15 +1,15 @@
 "use client";
 'use strict';
 
-var React$1 = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var factory = require('../../styled-system/factory.cjs');
 var cx = require('../../utils/cx.cjs');
-require('../../utils/unit.cjs');
 
-const Image = React$1.forwardRef(
+const Image = React.forwardRef(
   function Image2(props, ref) {
     const { align, fit = "cover", ...rest } = props;
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsxRuntime.jsx(
       factory.mainbase.img,
       {
         ref,

package/dist/cjs/components/input-addon/input-addon.cjs

@@ -1,17 +1,18 @@
 "use client";
 'use strict';
 
-var React$1 = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var empty = require('../../styled-system/empty.cjs');
 var factory = require('../../styled-system/factory.cjs');
 var useRecipe = require('../../styled-system/use-recipe.cjs');
 
-const InputAddon = React$1.forwardRef(
+const InputAddon = React.forwardRef(
   function InputAddon2({ unstyled, ...props }, ref) {
     const recipe = useRecipe.useRecipe({ key: "inputAddon", recipe: props.recipe });
     const [variantProps, localProps] = recipe.splitVariantProps(props);
     const styles = unstyled ? empty.EMPTY_SLOT_STYLES : recipe(variantProps);
-    return /* @__PURE__ */ React.createElement(factory.mainbase.div, { ref, ...localProps, css: [styles, props.css] });
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.mainbase.div, { ref, ...localProps, css: [styles, props.css] });
   }
 );
 

package/dist/cjs/components/input-group/input-group.cjs

@@ -1,12 +1,13 @@
 "use client";
 'use strict';
 
-var React$1 = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var group = require('../group/group.cjs');
 var inputAddon = require('../input-addon/input-addon.cjs');
 var inputElement = require('../input-element/input-element.cjs');
 
-const InputGroup = React$1.forwardRef(
+const InputGroup = React.forwardRef(
   function InputGroup2(props, ref) {
     const {
       startElement,
@@ -22,28 +23,30 @@ const InputGroup = React$1.forwardRef(
       endOffset = "0px",
       ...rest
     } = props;
-    const child = React$1.Children.only(children);
+    const child = React.Children.only(children);
     const attached = Boolean(startAddon || endAddon);
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsxRuntime.jsxs(
       group.Group,
       {
         width: "full",
         ref,
         attached,
         skip: (el) => el.type === inputElement.InputElement,
-        ...rest
-      },
-      startAddon && /* @__PURE__ */ React.createElement(inputAddon.InputAddon, { ...startAddonProps }, startAddon),
-      startElement && /* @__PURE__ */ React.createElement(inputElement.InputElement, { pointerEvents: "none", ...startElementProps }, startElement),
-      React$1.cloneElement(child, {
-        ...startElement && {
-          ps: `calc(var(--input-height) - ${startOffset})`
-        },
-        ...endElement && { pe: `calc(var(--input-height) - ${endOffset})` },
-        ...children.props
-      }),
-      endElement && /* @__PURE__ */ React.createElement(inputElement.InputElement, { placement: "end", ...endElementProps }, endElement),
-      endAddon && /* @__PURE__ */ React.createElement(inputAddon.InputAddon, { ...endAddonProps }, endAddon)
+        ...rest,
+        children: [
+          startAddon && /* @__PURE__ */ jsxRuntime.jsx(inputAddon.InputAddon, { ...startAddonProps, children: startAddon }),
+          startElement && /* @__PURE__ */ jsxRuntime.jsx(inputElement.InputElement, { pointerEvents: "none", ...startElementProps, children: startElement }),
+          React.cloneElement(child, {
+            ...startElement && {
+              ps: `calc(var(--input-height) - ${startOffset})`
+            },
+            ...endElement && { pe: `calc(var(--input-height) - ${endOffset})` },
+            ...children.props
+          }),
+          endElement && /* @__PURE__ */ jsxRuntime.jsx(inputElement.InputElement, { placement: "end", ...endElementProps, children: endElement }),
+          endAddon && /* @__PURE__ */ jsxRuntime.jsx(inputAddon.InputAddon, { ...endAddonProps, children: endAddon })
+        ]
+      }
     );
   }
 );

package/dist/cjs/components/link/link-box.cjs

@@ -1,15 +1,15 @@
 "use client";
 'use strict';
 
-var React$1 = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var factory = require('../../styled-system/factory.cjs');
 var cx = require('../../utils/cx.cjs');
-require('../../utils/unit.cjs');
 
-const LinkOverlay = React$1.forwardRef(
+const LinkOverlay = React.forwardRef(
   function LinkOverlay2(props, ref) {
     const { className, ...rest } = props;
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsxRuntime.jsx(
       factory.mainbase.a,
       {
         ...rest,
@@ -36,10 +36,10 @@ const LinkOverlay = React$1.forwardRef(
     );
   }
 );
-const LinkBox = React$1.forwardRef(
+const LinkBox = React.forwardRef(
   function LinkBox2(props, ref) {
     const { className, ...rest } = props;
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsxRuntime.jsx(
       factory.mainbase.div,
       {
         ref,

package/dist/cjs/components/listbox/listbox.cjs

@@ -1,6 +1,7 @@
 "use client";
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var listbox = require('@ark-ui/react/listbox');
 var createSlotRecipeContext = require('../../styled-system/create-slot-recipe-context.cjs');
 var icons = require('../icons.cjs');
@@ -44,7 +45,7 @@ const ListboxItemText = withContext(listbox.Listbox.ItemText, "itemText", { forw
 const ListboxItemIndicator = withContext(listbox.Listbox.ItemIndicator, "itemIndicator", {
   forwardAsChild: true,
   defaultProps: {
-    children: /* @__PURE__ */ React.createElement(icons.CheckIcon, null)
+    children: /* @__PURE__ */ jsxRuntime.jsx(icons.CheckIcon, {})
   }
 });
 const ListboxLabel = withContext(

package/dist/cjs/components/loader/loader.cjs

@@ -1,5 +1,6 @@
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var absoluteCenter = require('../absolute-center/absolute-center.cjs');
 var index = require('../span/index.cjs');
@@ -27,7 +28,7 @@ var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 const Loader = React__namespace.forwardRef(
   function Loader2(props, ref) {
     const {
-      spinner: spinner$1 = /* @__PURE__ */ React__namespace.createElement(spinner.Spinner, { size: "inherit", borderWidth: "0.125em", color: "inherit" }),
+      spinner: spinner$1 = /* @__PURE__ */ jsxRuntime.jsx(spinner.Spinner, { size: "inherit", borderWidth: "0.125em", color: "inherit" }),
       spinnerPlacement = "start",
       children,
       text,
@@ -36,12 +37,19 @@ const Loader = React__namespace.forwardRef(
     } = props;
     if (!visible) return children;
     if (text) {
-      return /* @__PURE__ */ React__namespace.createElement(index.Span, { ref, display: "contents", ...rest }, spinnerPlacement === "start" && spinner$1, text, spinnerPlacement === "end" && spinner$1);
+      return /* @__PURE__ */ jsxRuntime.jsxs(index.Span, { ref, display: "contents", ...rest, children: [
+        spinnerPlacement === "start" && spinner$1,
+        text,
+        spinnerPlacement === "end" && spinner$1
+      ] });
     }
     if (spinner$1) {
-      return /* @__PURE__ */ React__namespace.createElement(index.Span, { ref, display: "contents", ...rest }, /* @__PURE__ */ React__namespace.createElement(absoluteCenter.AbsoluteCenter, { display: "inline-flex" }, spinner$1), /* @__PURE__ */ React__namespace.createElement(index.Span, { visibility: "hidden", display: "contents" }, children));
+      return /* @__PURE__ */ jsxRuntime.jsxs(index.Span, { ref, display: "contents", ...rest, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(absoluteCenter.AbsoluteCenter, { display: "inline-flex", children: spinner$1 }),
+        /* @__PURE__ */ jsxRuntime.jsx(index.Span, { visibility: "hidden", display: "contents", children })
+      ] });
     }
-    return /* @__PURE__ */ React__namespace.createElement(index.Span, { ref, display: "contents", ...rest }, children);
+    return /* @__PURE__ */ jsxRuntime.jsx(index.Span, { ref, display: "contents", ...rest, children });
   }
 );
 Loader.displayName = "Loader";

package/dist/cjs/components/menu/menu.cjs

@@ -1,6 +1,7 @@
 "use client";
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var menu = require('@ark-ui/react/menu');
 var createSlotRecipeContext = require('../../styled-system/create-slot-recipe-context.cjs');
 var icons = require('../icons.cjs');
@@ -47,7 +48,7 @@ const MenuArrowTip = withContext(
 const MenuArrow = withContext(
   menu.Menu.Arrow,
   "arrow",
-  { forwardAsChild: true, defaultProps: { children: /* @__PURE__ */ React.createElement(MenuArrowTip, null) } }
+  { forwardAsChild: true, defaultProps: { children: /* @__PURE__ */ jsxRuntime.jsx(MenuArrowTip, {}) } }
 );
 const MenuIndicator = withContext(
   menu.Menu.Indicator,
@@ -77,7 +78,7 @@ const MenuItemCommand = withContext(
 );
 const MenuItemIndicator = withContext(menu.Menu.ItemIndicator, "itemIndicator", {
   forwardAsChild: true,
-  defaultProps: { children: /* @__PURE__ */ React.createElement(icons.CheckIcon, { boxSize: "4" }) }
+  defaultProps: { children: /* @__PURE__ */ jsxRuntime.jsx(icons.CheckIcon, { boxSize: "4" }) }
 });
 const MenuCheckboxItem = withContext(menu.Menu.CheckboxItem, "item", { forwardAsChild: true });
 const MenuRadioItemGroup = withContext(menu.Menu.RadioItemGroup, "itemGroup", { forwardAsChild: true });

package/dist/cjs/components/native-select/native-select.cjs

@@ -1,14 +1,14 @@
 "use client";
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var field = require('@ark-ui/react/field');
-var React$1 = require('react');
+var React = require('react');
 var createContext = require('../../create-context.cjs');
 var createSlotRecipeContext = require('../../styled-system/create-slot-recipe-context.cjs');
 var factory = require('../../styled-system/factory.cjs');
 var attr = require('../../utils/attr.cjs');
 var cx = require('../../utils/cx.cjs');
-require('../../utils/unit.cjs');
 var icons = require('../icons.cjs');
 
 const [NativeSelectBasePropsProvider, useNativeSelectBaseProps] = createContext.createContext({
@@ -28,17 +28,17 @@ const NativeSelectRoot = withProvider("div", "root", {
     const field$1 = field.useFieldContext();
     const disabled = Boolean(field$1?.disabled ?? props.disabled);
     const invalid = Boolean(field$1?.invalid ?? props.invalid);
-    return /* @__PURE__ */ React.createElement(NativeSelectBasePropsProvider, { value: { disabled, invalid } }, element);
+    return /* @__PURE__ */ jsxRuntime.jsx(NativeSelectBasePropsProvider, { value: { disabled, invalid }, children: element });
   }
 });
 const NativeSelectPropsProvider = PropsProvider;
 const StyledSelect = factory.mainbase(field.Field.Select, {}, { forwardAsChild: true });
-const NativeSelectField = React$1.forwardRef(function NativeSelectField2(props, ref) {
+const NativeSelectField = React.forwardRef(function NativeSelectField2(props, ref) {
   const { children, placeholder, unstyled, ...restProps } = props;
   const { disabled, invalid } = useNativeSelectBaseProps();
   const styles = useNativeSelectStyles();
   const classNames = useClassNames();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     StyledSelect,
     {
       disabled,
@@ -46,10 +46,12 @@ const NativeSelectField = React$1.forwardRef(function NativeSelectField2(props,
       ...restProps,
       ref,
       className: cx.cx(classNames.field, props.className),
-      css: [!unstyled ? styles.field : void 0, props.css]
-    },
-    placeholder && /* @__PURE__ */ React.createElement("option", { value: "" }, placeholder),
-    children
+      css: [!unstyled ? styles.field : void 0, props.css],
+      children: [
+        placeholder && /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: placeholder }),
+        children
+      ]
+    }
   );
 });
 function NativeSelectIndicator(props) {
@@ -57,16 +59,16 @@ function NativeSelectIndicator(props) {
   const styles = useNativeSelectStyles();
   const { disabled, invalid } = useNativeSelectBaseProps();
   const classNames = useClassNames();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     factory.mainbase.div,
     {
       ...restProps,
       "data-disabled": attr.dataAttr(disabled),
       "data-invalid": attr.dataAttr(invalid),
       className: cx.cx(classNames.indicator, props.className),
-      css: [!unstyled ? styles.indicator : void 0, props.css]
-    },
-    props.children ?? /* @__PURE__ */ React.createElement(icons.ChevronDownIcon, null)
+      css: [!unstyled ? styles.indicator : void 0, props.css],
+      children: props.children ?? /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronDownIcon, {})
+    }
   );
 }
 

package/dist/cjs/components/number-input/number-input.cjs

@@ -1,6 +1,7 @@
 "use client";
 'use strict';
 
+var jsxRuntime = require('react/jsx-runtime');
 var numberInput = require('@ark-ui/react/number-input');
 var createSlotRecipeContext = require('../../styled-system/create-slot-recipe-context.cjs');
 var icons = require('../icons.cjs');
@@ -18,16 +19,19 @@ const NumberInputLabel = withContext(numberInput.NumberInput.Label, "label", { f
 const NumberInputInput = withContext(numberInput.NumberInput.Input, "input", { forwardAsChild: true });
 const NumberInputIncrementTrigger = withContext(numberInput.NumberInput.IncrementTrigger, "incrementTrigger", {
   forwardAsChild: true,
-  defaultProps: { children: /* @__PURE__ */ React.createElement(icons.ChevronUpIcon, null) }
+  defaultProps: { children: /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronUpIcon, {}) }
 });
 const NumberInputDecrementTrigger = withContext(numberInput.NumberInput.DecrementTrigger, "decrementTrigger", {
   forwardAsChild: true,
-  defaultProps: { children: /* @__PURE__ */ React.createElement(icons.ChevronDownIcon, null) }
+  defaultProps: { children: /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronDownIcon, {}) }
 });
 const NumberInputControl = withContext(numberInput.NumberInput.Control, "control", {
   forwardAsChild: true,
   defaultProps: {
-    children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(NumberInputIncrementTrigger, null), /* @__PURE__ */ React.createElement(NumberInputDecrementTrigger, null))
+    children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(NumberInputIncrementTrigger, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(NumberInputDecrementTrigger, {})
+    ] })
   }
 });
 const NumberInputScrubber = withContext(numberInput.NumberInput.Scrubber, "scrubber", { forwardAsChild: true });