@dreamtree-org/twreact-ui 1.1.63 → 1.1.64

package/dist/index.esm.js

@@ -4741,7 +4741,7 @@ function MobileCard(_ref) {
   }, key);
 }
 
-var _excluded$x = ["data", "columns", "sortable", "filterable", "selectable", "pagination", "pageSize", "onSort", "onFilter", "onFetch", "onFilterChange", "onSelectionChange", "onRowClick", "hasDetails", "DetailsComponent", "className", "withAction", "onAction", "actions", "showSerial", "cellClass", "rowClass", "globalSearch", "limitOptions", "showLimitSelector", "onLimitChange", "showReloadButton", "renderReloadButton", "onReload", "stripedRows", "theme", "responsiveBreakpoint", "serverSide", "totalRecords", "pageNumber", "TheadComponent", "TfootComponent"];
+var _excluded$x = ["data", "columns", "sortable", "filterable", "selectable", "pagination", "pageSize", "onSort", "onFilter", "onFetch", "onFilterChange", "onSelectionChange", "onRowClick", "hasDetails", "DetailsComponent", "className", "withAction", "onAction", "actions", "showSerial", "cellClass", "rowClass", "globalSearch", "limitOptions", "showLimitSelector", "onLimitChange", "showReloadButton", "renderReloadButton", "onReload", "stripedRows", "theme", "responsiveBreakpoint", "serverSide", "totalRecords", "pageNumber", "onPageChange", "TheadComponent", "TfootComponent"];
 function ownKeys$B(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$B(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$B(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$B(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DEFAULT_DATA = [];
@@ -4809,6 +4809,7 @@ var Table = function Table(_ref) {
     _ref$totalRecords = _ref.totalRecords,
     totalRecords = _ref$totalRecords === void 0 ? 0 : _ref$totalRecords,
     pageNumber = _ref.pageNumber,
+    onPageChange = _ref.onPageChange,
     _ref$TheadComponent = _ref.TheadComponent,
     TheadComponent = _ref$TheadComponent === void 0 ? null : _ref$TheadComponent,
     _ref$TfootComponent = _ref.TfootComponent,
@@ -5149,7 +5150,8 @@ var Table = function Table(_ref) {
   }, [applyGlobalSearch]);
   var handlePageChange = useCallback(function (newPage) {
     setCurrentPage(newPage);
-  }, []);
+    onPageChange === null || onPageChange === void 0 || onPageChange(newPage);
+  }, [onPageChange]);
   var renderCell = useCallback(function (column, row, globalIndex) {
     if (column.render) return column.render(row, globalIndex);
     return row === null || row === void 0 ? void 0 : row[column.key];
@@ -16556,7 +16558,7 @@ function _objectSpread$h(e) { for (var r = 1; r < arguments.length; r++) { var t
  * - isMobileOpen, setIsMobileOpen
  * - showCollapsedTooltips: boolean (default true)
  */
-var Sidebar = function Sidebar(_ref2) {
+var Sidebar = /*#__PURE__*/React__default.forwardRef(function (_ref2, ref) {
   var _ref2$items = _ref2.items,
     items = _ref2$items === void 0 ? [] : _ref2$items,
     _ref2$collapsed = _ref2.collapsed,
@@ -16799,6 +16801,7 @@ var Sidebar = function Sidebar(_ref2) {
     children: [jsx("div", {
       className: "hidden md:flex sticky top-0 h-screen",
       children: jsx("div", _objectSpread$h(_objectSpread$h({
+        ref: ref,
         className: cn$1(desktopPlacementClass, className)
       }, props), {}, {
         children: SidebarContent
@@ -16819,7 +16822,8 @@ var Sidebar = function Sidebar(_ref2) {
       children: SidebarContent
     })]
   });
-};
+});
+Sidebar.displayName = "Sidebar";
 
 var _excluded$c = ["trigger", "children", "placement", "className"];
 function ownKeys$g(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -16871,7 +16875,7 @@ var Dropdown = function Dropdown(_ref) {
 };
 
 var _excluded$b = ["emitter", "content", "notifications"],
-  _excluded2$2 = ["emitter", "logo", "items", "user", "notifications", "searchable", "onSearch", "leftIcon", "rightMenuContent", "onLeftIconClick", "onLoginClick", "onLogoutClick", "className"];
+  _excluded2$2 = ["emitter", "logo", "items", "user", "notifications", "searchable", "onSearch", "leftIcon", "rightMenuContent", "onLeftIconClick", "onLoginClick", "onLogoutClick", "className", "onFetch", "isMobileOpen", "setIsMobileOpen"];
 function ownKeys$f(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // Simplified Notifications, uses notifications from props and a single effect for fetch/update
@@ -17018,7 +17022,7 @@ var styledClassNames = {
   icon: "h-6 w-6",
   dropdown: "w-56 rounded-md border border-gray-200 bg-white py-1 shadow-lg"
 };
-var Navbar = function Navbar(_ref3) {
+var Navbar = /*#__PURE__*/React__default.forwardRef(function (_ref3, ref) {
   var emitter = _ref3.emitter,
     logo = _ref3.logo,
     _ref3$items = _ref3.items,
@@ -17042,7 +17046,10 @@ var Navbar = function Navbar(_ref3) {
       return console.log("invoked onLogoutClick");
     } : _ref3$onLogoutClick,
     className = _ref3.className,
-    props = _objectWithoutProperties$1(_ref3, _excluded2$2);
+    onFetch = _ref3.onFetch;
+    _ref3.isMobileOpen;
+    _ref3.setIsMobileOpen;
+    var props = _objectWithoutProperties$1(_ref3, _excluded2$2);
   var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
     isMobileMenuOpen = _useState4[0],
@@ -17111,6 +17118,7 @@ var Navbar = function Navbar(_ref3) {
     }, rest));
   };
   return jsxs("nav", _objectSpread$f(_objectSpread$f({
+    ref: ref,
     className: cn$1("bg-white border-b border-gray-200 px-4 sm:px-6 lg:px-8", className)
   }, props), {}, {
     children: [jsxs("div", {
@@ -17155,7 +17163,8 @@ var Navbar = function Navbar(_ref3) {
             })]
           })
         }), jsx(RightMenuComponent, {
-          notifications: notifications
+          notifications: notifications,
+          onFetch: onFetch
         }), !user && jsx("button", {
           className: styledClassNames.button,
           onClick: handleLoginClick,
@@ -17247,7 +17256,7 @@ var Navbar = function Navbar(_ref3) {
       })
     })]
   }));
-};
+});
 Navbar.displayName = "Navbar";
 Navbar.propTypes = {
   emitter: PropTypes.object.isRequired,
@@ -17262,12 +17271,13 @@ Navbar.propTypes = {
 var _excluded$a = ["items", "className"];
 function ownKeys$e(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var FootNav = function FootNav(_ref) {
+var FootNav = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref$items = _ref.items,
     items = _ref$items === void 0 ? [] : _ref$items,
     className = _ref.className,
     props = _objectWithoutProperties$1(_ref, _excluded$a);
   return jsx("nav", _objectSpread$e(_objectSpread$e({
+    ref: ref,
     className: cn$1('fixed bottom-0 left-0 right-0 bg-white border-t border-gray-200 px-4 py-2 md:hidden', className)
   }, props), {}, {
     children: jsx("div", {
@@ -17295,12 +17305,13 @@ var FootNav = function FootNav(_ref) {
       })
     })
   }));
-};
+});
+FootNav.displayName = 'FootNav';
 
 var _excluded$9 = ["items", "separator", "showHome", "homeIcon", "onHomeClick", "className"];
 function ownKeys$d(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Breadcrumbs = function Breadcrumbs(_ref) {
+var Breadcrumbs = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref$items = _ref.items,
     items = _ref$items === void 0 ? [] : _ref$items,
     _ref$separator = _ref.separator,
@@ -17324,6 +17335,7 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
     onClick: onHomeClick
   }].concat(_toConsumableArray$1(items)) : items;
   return jsx("nav", _objectSpread$d(_objectSpread$d({
+    ref: ref,
     className: cn$1('flex items-center space-x-1 text-sm', className),
     "aria-label": "Breadcrumb"
   }, props), {}, {
@@ -17357,7 +17369,8 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
       }, item.id);
     })
   }));
-};
+});
+Breadcrumbs.displayName = 'Breadcrumbs';
 
 var _excluded$8 = ["isOpen", "onClose", "title", "children", "size", "dismissible", "showCloseButton", "footer", "className", "onOpen"],
   _excluded2$1 = ["children", "className"],
@@ -17373,7 +17386,19 @@ var getFocusable = function getFocusable(root) {
     return el.getAttribute('aria-hidden') !== 'true';
   }) : [];
 };
-var Dialog = function Dialog(_ref) {
+// Assign one node to several refs (callback or object). Lets the dialog keep
+// its internal `dialogRef` for the focus trap while still exposing the panel
+// node to a consumer-supplied `ref` (issue #56).
+var setRefs = function setRefs(node) {
+  for (var _len = arguments.length, refs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    refs[_key - 1] = arguments[_key];
+  }
+  refs.forEach(function (ref) {
+    if (!ref) return;
+    if (typeof ref === 'function') ref(node);else ref.current = node;
+  });
+};
+var Dialog = /*#__PURE__*/React__default.forwardRef(function (_ref, _ref3) {
   var isOpen = _ref.isOpen,
     onClose = _ref.onClose,
     title = _ref.title,
@@ -17464,7 +17489,9 @@ var Dialog = function Dialog(_ref) {
     className: "fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50 p-4",
     onClick: handleBackdropClick,
     children: jsxs("div", _objectSpread$c(_objectSpread$c({
-      ref: dialogRef,
+      ref: function ref(node) {
+        return setRefs(node, dialogRef, _ref3);
+      },
       className: cn$1('w-full rounded-lg bg-white shadow-xl animate-scale-in motion-reduce:animate-none', sizeClasses[size], className),
       tabIndex: -1,
       role: "dialog",
@@ -17495,32 +17522,33 @@ var Dialog = function Dialog(_ref) {
       })]
     }))
   }), document.body);
-};
+});
+Dialog.displayName = 'Dialog';
 // Dialog components for composition
-Dialog.Header = function (_ref3) {
-  var children = _ref3.children,
-    className = _ref3.className,
-    props = _objectWithoutProperties$1(_ref3, _excluded2$1);
+Dialog.Header = function (_ref4) {
+  var children = _ref4.children,
+    className = _ref4.className,
+    props = _objectWithoutProperties$1(_ref4, _excluded2$1);
   return jsx("div", _objectSpread$c(_objectSpread$c({
     className: cn$1('border-b border-gray-200 px-6 py-4', className)
   }, props), {}, {
     children: children
   }));
 };
-Dialog.Body = function (_ref4) {
-  var children = _ref4.children,
-    className = _ref4.className,
-    props = _objectWithoutProperties$1(_ref4, _excluded3$1);
+Dialog.Body = function (_ref5) {
+  var children = _ref5.children,
+    className = _ref5.className,
+    props = _objectWithoutProperties$1(_ref5, _excluded3$1);
   return jsx("div", _objectSpread$c(_objectSpread$c({
     className: cn$1('px-6 py-4', className)
   }, props), {}, {
     children: children
   }));
 };
-Dialog.Footer = function (_ref5) {
-  var children = _ref5.children,
-    className = _ref5.className,
-    props = _objectWithoutProperties$1(_ref5, _excluded4$1);
+Dialog.Footer = function (_ref6) {
+  var children = _ref6.children,
+    className = _ref6.className,
+    props = _objectWithoutProperties$1(_ref6, _excluded4$1);
   return jsx("div", _objectSpread$c(_objectSpread$c({
     className: cn$1('flex items-center justify-end gap-3 border-t border-gray-200 px-6 py-4', className)
   }, props), {}, {
@@ -17531,7 +17559,7 @@ Dialog.Footer = function (_ref5) {
 var _excluded$7 = ["id", "title", "message", "type", "duration", "onClose", "position"];
 function ownKeys$b(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Toast = function Toast(_ref) {
+var Toast = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var id = _ref.id,
     title = _ref.title,
     message = _ref.message,
@@ -17587,6 +17615,7 @@ var Toast = function Toast(_ref) {
   };
   if (!isVisible) return null;
   return /*#__PURE__*/createPortal(jsx("div", _objectSpread$b(_objectSpread$b({
+    ref: ref,
     className: cn$1('fixed z-50 max-w-sm rounded-lg border border-gray-200 bg-white p-4 shadow-lg animate-slide-up', positionClasses[position])
   }, props), {}, {
     children: jsxs("div", {
@@ -17613,7 +17642,8 @@ var Toast = function Toast(_ref) {
       })]
     })
   })), document.body);
-};
+});
+Toast.displayName = 'Toast';
 // Toast Container Component
 var ToastContainer = function ToastContainer(_ref2) {
   var _ref2$toasts = _ref2.toasts,
@@ -17693,7 +17723,7 @@ var useToast = function useToast() {
 var _excluded$6 = ["variant", "title", "children", "dismissible", "onDismiss", "className"];
 function ownKeys$a(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Alert = function Alert(_ref) {
+var Alert = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'info' : _ref$variant,
     title = _ref.title,
@@ -17739,6 +17769,7 @@ var Alert = function Alert(_ref) {
   };
   var variantStyles = variants[variant];
   return jsx("div", _objectSpread$a(_objectSpread$a({
+    ref: ref,
     className: cn$1('rounded-md border p-4', variantStyles.container, className),
     role: "alert"
   }, props), {}, {
@@ -17776,12 +17807,13 @@ var Alert = function Alert(_ref) {
       })]
     })
   }));
-};
+});
+Alert.displayName = 'Alert';
 
 var _excluded$5 = ["children", "variant", "size", "rounded", "className"];
 function ownKeys$9(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Badge = function Badge(_ref) {
+var Badge = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'default' : _ref$variant,
@@ -17806,6 +17838,7 @@ var Badge = function Badge(_ref) {
     lg: 'px-3 py-1 text-base'
   };
   return jsx("span", _objectSpread$9(_objectSpread$9({
+    ref: ref,
     className: cn$1('inline-flex items-center font-medium', variants[variant], sizes[size], {
       'rounded-full': rounded,
       'rounded-md': !rounded
@@ -17813,12 +17846,13 @@ var Badge = function Badge(_ref) {
   }, props), {}, {
     children: children
   }));
-};
+});
+Badge.displayName = 'Badge';
 
 var _excluded$4 = ["src", "alt", "name", "size", "shape", "status", "className"];
 function ownKeys$8(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Avatar = function Avatar(_ref) {
+var Avatar = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var src = _ref.src,
     alt = _ref.alt,
     name = _ref.name,
@@ -17858,6 +17892,7 @@ var Avatar = function Avatar(_ref) {
     '2xl': 'h-5 w-5'
   };
   return jsxs("div", {
+    ref: ref,
     className: "relative inline-block",
     children: [jsxs("div", _objectSpread$8(_objectSpread$8({
       className: cn$1('flex items-center justify-center bg-gray-100 text-primary-600 font-medium', sizes[size], {
@@ -17894,7 +17929,8 @@ var Avatar = function Avatar(_ref) {
       className: cn$1('absolute bottom-0 right-0 rounded-full border-2 border-white', statusColors[status], statusSizes[size])
     })]
   });
-};
+});
+Avatar.displayName = 'Avatar';
 
 var _excluded$3 = ["children", "className", "hover"],
   _excluded2 = ["children", "className"],
@@ -17904,20 +17940,22 @@ var _excluded$3 = ["children", "className", "hover"],
   _excluded6 = ["children", "className"];
 function ownKeys$7(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Card = function Card(_ref) {
+var Card = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var children = _ref.children,
     className = _ref.className,
     _ref$hover = _ref.hover,
     hover = _ref$hover === void 0 ? false : _ref$hover,
     props = _objectWithoutProperties$1(_ref, _excluded$3);
   return jsx("div", _objectSpread$7(_objectSpread$7({
+    ref: ref,
     className: cn$1('rounded-lg border border-gray-200 bg-white shadow-sm', {
       'hover:shadow-md transition-shadow': hover
     }, className)
   }, props), {}, {
     children: children
   }));
-};
+});
+Card.displayName = 'Card';
 var CardHeader = function CardHeader(_ref2) {
   var children = _ref2.children,
     className = _ref2.className,
@@ -17977,7 +18015,7 @@ Card.Footer = CardFooter;
 var _excluded$2 = ["currentPage", "totalPages", "onPageChange", "showFirstLast", "showPrevNext", "maxVisiblePages", "className"];
 function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Pagination = function Pagination(_ref) {
+var Pagination = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref$currentPage = _ref.currentPage,
     currentPage = _ref$currentPage === void 0 ? 1 : _ref$currentPage,
     _ref$totalPages = _ref.totalPages,
@@ -18017,6 +18055,7 @@ var Pagination = function Pagination(_ref) {
   };
   if (totalPages <= 1) return null;
   return jsxs("nav", _objectSpread$6(_objectSpread$6({
+    ref: ref,
     className: cn$1('flex items-center justify-center space-x-1', className),
     "aria-label": "Pagination"
   }, props), {}, {
@@ -18075,12 +18114,13 @@ var Pagination = function Pagination(_ref) {
       children: totalPages
     })]
   }));
-};
+});
+Pagination.displayName = 'Pagination';
 
 var _excluded$1 = ["steps", "currentStep", "orientation", "variant", "onStepClick", "className"];
 function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var Stepper = function Stepper(_ref) {
+var Stepper = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var _ref$steps = _ref.steps,
     steps = _ref$steps === void 0 ? [] : _ref$steps,
     _ref$currentStep = _ref.currentStep,
@@ -18114,6 +18154,7 @@ var Stepper = function Stepper(_ref) {
     }
   };
   return jsx("nav", _objectSpread$5(_objectSpread$5({
+    ref: ref,
     className: cn$1('flex', {
       'flex-col': orientation === 'vertical',
       'flex-row': orientation === 'horizontal'
@@ -18168,12 +18209,13 @@ var Stepper = function Stepper(_ref) {
       }, step.id || stepIndex);
     })
   }));
-};
+});
+Stepper.displayName = 'Stepper';
 
 var _excluded = ["accept", "multiple", "maxSize", "onFileSelect", "onFileRemove", "files", "disabled", "className"];
 function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), true).forEach(function (r) { _defineProperty$4(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var FileUpload = function FileUpload(_ref) {
+var FileUpload = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
   var accept = _ref.accept,
     _ref$multiple = _ref.multiple,
     multiple = _ref$multiple === void 0 ? false : _ref$multiple,
@@ -18265,6 +18307,7 @@ var FileUpload = function FileUpload(_ref) {
     }
   };
   return jsxs("div", _objectSpread$4(_objectSpread$4({
+    ref: ref,
     className: cn$1('w-full', className)
   }, props), {}, {
     children: [jsxs("div", {
@@ -18337,7 +18380,8 @@ var FileUpload = function FileUpload(_ref) {
       })
     })]
   }));
-};
+});
+FileUpload.displayName = 'FileUpload';
 
 var Condition = function Condition(_ref) {
   var condition = _ref.condition,
@@ -18347,7 +18391,7 @@ var Condition = function Condition(_ref) {
   return condition ? children : fallback;
 };
 
-function Carousel(props) {
+var Carousel = /*#__PURE__*/React__default.forwardRef(function Carousel(props, ref) {
   var children = props.children,
     _props$autoPlay = props.autoPlay,
     autoPlay = _props$autoPlay === void 0 ? false : _props$autoPlay,
@@ -18387,6 +18431,7 @@ function Carousel(props) {
   }, [autoPlay, isPaused, next, interval]);
   var childrenArray = React__default.Children.toArray(children);
   return jsxs("div", {
+    ref: ref,
     className: cn$1("relative group overflow-hidden rounded-xl bg-card border border-border/50 shadow-sm", className),
     onMouseEnter: function onMouseEnter() {
       return setIsPaused(true);
@@ -18432,7 +18477,8 @@ function Carousel(props) {
       })
     })]
   });
-}
+});
+Carousel.displayName = "Carousel";
 
 var ThemeContext = /*#__PURE__*/createContext(undefined);
 var useTheme = function useTheme() {