jattac.libs.web.responsive-table 0.12.0-rc.4 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -10,7 +10,7 @@ function styleInject(css, ref) {
10
10
  if ( ref === void 0 ) ref = {};
11
11
  var insertAt = ref.insertAt;
12
12
 
13
- if (!css || typeof document === 'undefined') { return; }
13
+ if (typeof document === 'undefined') { return; }
14
14
 
15
15
  var head = document.head || document.getElementsByTagName('head')[0];
16
16
  var style = document.createElement('style');
@@ -33,9 +33,9 @@ function styleInject(css, ref) {
33
33
  }
34
34
  }
35
35
 
36
- var css_248z$2 = ".ResponsiveTable-module_responsiveTable__4y-Od{--table-border-color:#e0e0e0;--table-header-bg:#f8f9fa;--table-row-hover-bg:#f1f3f5;--table-row-stripe-bg:#fafbfc;--card-bg:#fff;--card-border-color:#d1d5db;--card-shadow:0 2px 8px rgba(0,0,0,.06);--text-color:#212529;--text-color-muted:#6c757d;--interactive-color:#0056b3;--primary-color:#007bff;--rt-mobile-card-shadow:0 1px 2px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.06),0 12px 32px rgba(0,0,0,.04);--rt-mobile-card-radius:16px;--rt-mobile-bg-wash:#f1f5f9;--rt-mobile-label-color:#475569;--rt-mobile-value-color:#1e293b}.ResponsiveTable-module_tableContainer__VjWjH{border:1px solid var(--table-border-color);border-radius:8px;overflow-x:auto;width:100%}.ResponsiveTable-module_responsiveTable__4y-Od{background-color:var(--card-bg);border-collapse:collapse;color:var(--text-color);width:100%}.ResponsiveTable-module_responsiveTable__4y-Od thead th{background-color:var(--table-header-bg);border-bottom:2px solid var(--table-border-color);color:var(--text-color-muted);font-size:.75rem;font-weight:600;letter-spacing:.05em;padding:1rem;text-align:left;text-transform:uppercase;z-index:1}.ResponsiveTable-module_responsiveTable__4y-Od td{border-bottom:1px solid var(--table-border-color);font-size:.9rem;padding:1rem;text-align:left}.ResponsiveTable-module_responsiveTable__4y-Od tr:last-child td{border-bottom:none}.ResponsiveTable-module_responsiveTable__4y-Od tr:nth-child(2n){background-color:var(--table-row-stripe-bg)}.ResponsiveTable-module_responsiveTable__4y-Od tr:hover{background-color:var(--table-row-hover-bg)}.ResponsiveTable-module_cardContainer__Het4h{background-color:var(--rt-mobile-bg-wash);border-radius:var(--rt-mobile-card-radius);display:flex;flex-direction:column;gap:1.25rem;padding:1rem}.ResponsiveTable-module_card__b-U2v{background-color:var(--card-bg);border:1px solid var(--card-border-color);border-bottom:3px solid var(--primary-color);border-radius:var(--rt-mobile-card-radius);box-shadow:var(--rt-mobile-card-shadow);overflow:hidden;padding:1rem;transition:box-shadow .2s ease-in-out,transform .2s ease-in-out}.ResponsiveTable-module_card__b-U2v:hover{box-shadow:0 2px 4px rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.08),0 16px 48px rgba(0,0,0,.06);transform:translateY(-4px)}.ResponsiveTable-module_card-header__Ttk51{border-bottom:1px solid var(--table-border-color);margin-bottom:1rem;padding-bottom:.5rem}.ResponsiveTable-module_card-row__qvIUJ{align-items:flex-start;display:flex;gap:1rem;justify-content:space-between;margin:0 0 .75rem}.ResponsiveTable-module_card-row__qvIUJ.ResponsiveTable-module_stacked__FSaTB{align-items:stretch;flex-direction:column;gap:.25rem;margin-bottom:1rem}.ResponsiveTable-module_card-row__qvIUJ:last-child{margin-bottom:0}.ResponsiveTable-module_card-label__v9L71{color:var(--rt-mobile-label-color);font-size:.75rem;font-weight:600;text-transform:uppercase;white-space:nowrap}.ResponsiveTable-module_card-value__BO-c-{color:var(--rt-mobile-value-color);font-size:.95rem;text-align:right}.ResponsiveTable-module_card-row__qvIUJ.ResponsiveTable-module_stacked__FSaTB .ResponsiveTable-module_card-value__BO-c-{text-align:left}.ResponsiveTable-module_numberValue__-TLR1{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;text-align:right!important}.ResponsiveTable-module_dateValue__UMvqJ{color:var(--text-color-muted);font-size:.85rem}.ResponsiveTable-module_imageValue__wVb-p img{border-radius:8px;height:auto;max-width:100%;object-fit:cover}.ResponsiveTable-module_inputValue__CrGMx{margin-top:.5rem;width:100%}.ResponsiveTable-module_inputValue__CrGMx button,.ResponsiveTable-module_inputValue__CrGMx input[type=text],.ResponsiveTable-module_inputValue__CrGMx select,.ResponsiveTable-module_inputValue__CrGMx textarea{min-height:44px;width:100%!important}.ResponsiveTable-module_clickableRow__0kjWm{cursor:pointer}.ResponsiveTable-module_responsiveTable__4y-Od tbody tr{transition:background-color .12s ease}.ResponsiveTable-module_responsiveTable__4y-Od tbody tr.ResponsiveTable-module_clickableRow__0kjWm:active{background-color:var(--table-row-active-bg,#dde3ea);transition:background-color .08s ease}.ResponsiveTable-module_responsiveTable__4y-Od tbody tr.ResponsiveTable-module_clickableRow__0kjWm:focus-visible{outline:2px solid var(--primary-color,#3b82f6);outline-offset:-2px}.ResponsiveTable-module_card__b-U2v.ResponsiveTable-module_clickableRow__0kjWm:active{box-shadow:0 1px 3px rgba(0,0,0,.08);transform:translateY(-1px);transition:transform .08s ease,box-shadow .08s ease}.ResponsiveTable-module_card__b-U2v.ResponsiveTable-module_clickableRow__0kjWm:focus-visible{outline:2px solid var(--primary-color,#3b82f6);outline-offset:-2px}.ResponsiveTable-module_clickableHeader__xHQhF{cursor:pointer;transition:color .2s}.ResponsiveTable-module_clickableHeader__xHQhF:hover{color:var(--interactive-color)}.ResponsiveTable-module_sortable__yvA60{cursor:pointer}.ResponsiveTable-module_sorted-asc__jzOIa,.ResponsiveTable-module_sorted-desc__7WCFK{background-color:#f0f7ff!important;color:var(--interactive-color)!important}.ResponsiveTable-module_headerInnerWrapper__3VAhD{align-items:center;display:flex;justify-content:space-between;width:100%}.ResponsiveTable-module_headerContent__ODMzS{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ResponsiveTable-module_sortIcon__A9WtD{background-position:50%;background-repeat:no-repeat;background-size:contain;flex-shrink:0;height:1rem;margin-left:.5rem;opacity:.3;width:1rem}.ResponsiveTable-module_sortable__yvA60:hover .ResponsiveTable-module_sortIcon__A9WtD{opacity:.8}.ResponsiveTable-module_sortable__yvA60 .ResponsiveTable-module_sortIcon__A9WtD{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236c757d'%3E%3Cpath d='M10 18h4v-2h-4v2zm-6-8v2h16V8H4zm3-6h10v2H7V2z'/%3E%3C/svg%3E\")}.ResponsiveTable-module_sorted-asc__jzOIa .ResponsiveTable-module_sortIcon__A9WtD{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230056b3'%3E%3Cpath d='m7 14 5-5 5 5z'/%3E%3C/svg%3E\");opacity:1}.ResponsiveTable-module_sorted-desc__7WCFK .ResponsiveTable-module_sortIcon__A9WtD{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230056b3'%3E%3Cpath d='m7 10 5 5 5-5z'/%3E%3C/svg%3E\");opacity:1}.ResponsiveTable-module_responsiveTable__4y-Od tfoot{background-color:var(--table-header-bg);border-top:2px solid var(--table-border-color)}.ResponsiveTable-module_footerCell__8H-uG{font-size:.9rem;font-weight:600;padding:1rem;text-align:right}.ResponsiveTable-module_clickableFooterCell__WB9Ss{color:var(--interactive-color);cursor:pointer}.ResponsiveTable-module_clickableFooterCell__WB9Ss:hover{text-decoration:underline}.ResponsiveTable-module_footerCard__-NE2M{background-color:var(--table-header-bg);border:1px solid var(--card-border-color);border-radius:12px;margin-top:1rem;overflow:hidden;padding:1.25rem}.ResponsiveTable-module_footer-card-row__Vv6Ur{display:flex;font-size:.9rem;font-weight:600;justify-content:space-between;margin:0 0 .75rem}.ResponsiveTable-module_selectedRow__-JyNW{background-color:#e7f1ff!important;transition:background-color .15s ease}.ResponsiveTable-module_card__b-U2v.ResponsiveTable-module_selectedRow__-JyNW{background-color:#e7f1ff;border-left:4px solid var(--primary-color)}.ResponsiveTable-module_animatedRow__SFjrJ{animation:ResponsiveTable-module_cardEntrance__6JjRV .5s cubic-bezier(.2,.8,.2,1) forwards;opacity:0}@keyframes ResponsiveTable-module_cardEntrance__6JjRV{0%{opacity:0;transform:translateY(15px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes ResponsiveTable-module_fadeInUp__jMCS7{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.ResponsiveTable-module_skeleton__XxsXW{background-color:#f0f0f0;border-radius:4px;overflow:hidden;position:relative}.ResponsiveTable-module_skeleton__XxsXW:after{animation:ResponsiveTable-module_shimmer__H8PhC 1.5s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.6),transparent);content:\"\";height:100%;left:-150%;position:absolute;top:0;width:150%}@keyframes ResponsiveTable-module_shimmer__H8PhC{0%{transform:translateX(0)}to{transform:translateX(100%)}}.ResponsiveTable-module_noDataWrapper__Rj-k3{align-items:center;background-color:var(--table-header-bg);border:2px dashed var(--table-border-color);border-radius:12px;color:var(--text-color-muted);display:flex;flex-direction:column;gap:1rem;justify-content:center;padding:4rem 2rem}.ResponsiveTable-module_noData__IpwNq{font-size:1.1rem;font-weight:500}.ResponsiveTable-module_spinner__Pn-3D{animation:ResponsiveTable-module_spin__i3NHn .8s linear infinite;border:3px solid rgba(0,0,0,.1);border-left:3px solid var(--primary-color);border-radius:50%;height:24px;width:24px}@keyframes ResponsiveTable-module_spin__i3NHn{to{transform:rotate(1turn)}}.ResponsiveTable-module_infoContainer__b9IF5{align-items:center;color:var(--text-color-muted);display:flex;font-size:.85rem;gap:.5rem;justify-content:center;padding:1.5rem}.ResponsiveTable-module_stickyHeader__-jjN- th{box-shadow:0 2px 4px rgba(0,0,0,.05);position:sticky;top:0}.ResponsiveTable-module_internalStickyHeader__idiJY th{position:sticky;top:0}.ResponsiveTable-module_detailCell__hb9C5{background:rgba(0,0,0,.012);border-top:none;padding:0;transition:border-left .2s ease}.ResponsiveTable-module_detailCellHasContent__F-DX5{padding-bottom:.5rem}.ResponsiveTable-module_detailCellExpanded__Zr6UF{border-left:2px solid var(--primary-color,#3b82f6)}.ResponsiveTable-module_detailToggleBar__F5Qrk{height:0;overflow:hidden;transition:height .2s ease}.ResponsiveTable-module_detailToggleBarVisible__q9b-3{align-items:center;background:rgba(59,130,246,.08);box-shadow:inset 0 1px 0 rgba(0,0,0,.04);cursor:pointer;display:flex;height:2.5rem;padding:0 .75rem;user-select:none}.ResponsiveTable-module_detailToggleBarVisible__q9b-3:hover{background:rgba(59,130,246,.14)}.ResponsiveTable-module_detailChevron__mBs8j{align-items:center;color:var(--primary-color,#3b82f6);display:flex;font-size:2.2rem;transform:rotate(-90deg);transition:transform .25s ease}.ResponsiveTable-module_detailChevronExpanded__zGFTQ{transform:rotate(0deg)}.ResponsiveTable-module_detailContentWrapper__VzM29{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}.ResponsiveTable-module_detailContentWrapperExpanded__bkiUb{grid-template-rows:1fr}.ResponsiveTable-module_detailContentInner__GWVaq{overflow:hidden;padding-left:1.5rem}.ResponsiveTable-module_mobileDetailOuter__gusle{background:rgba(0,0,0,.012);overflow:hidden}";
37
- var styles$2 = {"responsiveTable":"ResponsiveTable-module_responsiveTable__4y-Od","tableContainer":"ResponsiveTable-module_tableContainer__VjWjH","cardContainer":"ResponsiveTable-module_cardContainer__Het4h","card":"ResponsiveTable-module_card__b-U2v","card-header":"ResponsiveTable-module_card-header__Ttk51","card-row":"ResponsiveTable-module_card-row__qvIUJ","stacked":"ResponsiveTable-module_stacked__FSaTB","card-label":"ResponsiveTable-module_card-label__v9L71","card-value":"ResponsiveTable-module_card-value__BO-c-","numberValue":"ResponsiveTable-module_numberValue__-TLR1","dateValue":"ResponsiveTable-module_dateValue__UMvqJ","imageValue":"ResponsiveTable-module_imageValue__wVb-p","inputValue":"ResponsiveTable-module_inputValue__CrGMx","clickableRow":"ResponsiveTable-module_clickableRow__0kjWm","clickableHeader":"ResponsiveTable-module_clickableHeader__xHQhF","sortable":"ResponsiveTable-module_sortable__yvA60","sorted-asc":"ResponsiveTable-module_sorted-asc__jzOIa","sorted-desc":"ResponsiveTable-module_sorted-desc__7WCFK","headerInnerWrapper":"ResponsiveTable-module_headerInnerWrapper__3VAhD","headerContent":"ResponsiveTable-module_headerContent__ODMzS","sortIcon":"ResponsiveTable-module_sortIcon__A9WtD","footerCell":"ResponsiveTable-module_footerCell__8H-uG","clickableFooterCell":"ResponsiveTable-module_clickableFooterCell__WB9Ss","footerCard":"ResponsiveTable-module_footerCard__-NE2M","footer-card-row":"ResponsiveTable-module_footer-card-row__Vv6Ur","selectedRow":"ResponsiveTable-module_selectedRow__-JyNW","animatedRow":"ResponsiveTable-module_animatedRow__SFjrJ","cardEntrance":"ResponsiveTable-module_cardEntrance__6JjRV","skeleton":"ResponsiveTable-module_skeleton__XxsXW","shimmer":"ResponsiveTable-module_shimmer__H8PhC","noDataWrapper":"ResponsiveTable-module_noDataWrapper__Rj-k3","noData":"ResponsiveTable-module_noData__IpwNq","spinner":"ResponsiveTable-module_spinner__Pn-3D","spin":"ResponsiveTable-module_spin__i3NHn","infoContainer":"ResponsiveTable-module_infoContainer__b9IF5","stickyHeader":"ResponsiveTable-module_stickyHeader__-jjN-","internalStickyHeader":"ResponsiveTable-module_internalStickyHeader__idiJY","detailCell":"ResponsiveTable-module_detailCell__hb9C5","detailCellHasContent":"ResponsiveTable-module_detailCellHasContent__F-DX5","detailCellExpanded":"ResponsiveTable-module_detailCellExpanded__Zr6UF","detailToggleBar":"ResponsiveTable-module_detailToggleBar__F5Qrk","detailToggleBarVisible":"ResponsiveTable-module_detailToggleBarVisible__q9b-3","detailChevron":"ResponsiveTable-module_detailChevron__mBs8j","detailChevronExpanded":"ResponsiveTable-module_detailChevronExpanded__zGFTQ","detailContentWrapper":"ResponsiveTable-module_detailContentWrapper__VzM29","detailContentWrapperExpanded":"ResponsiveTable-module_detailContentWrapperExpanded__bkiUb","detailContentInner":"ResponsiveTable-module_detailContentInner__GWVaq","mobileDetailOuter":"ResponsiveTable-module_mobileDetailOuter__gusle","fadeInUp":"ResponsiveTable-module_fadeInUp__jMCS7"};
38
- styleInject(css_248z$2);
36
+ var css_248z = ".ResponsiveTable-module_responsiveTable__4y-Od{--table-border-color:#e0e0e0;--table-header-bg:#f8f9fa;--table-row-hover-bg:#f1f3f5;--table-row-stripe-bg:#fafbfc;--card-bg:#fff;--card-border-color:#d1d5db;--card-shadow:0 2px 8px rgba(0,0,0,.06);--text-color:#212529;--text-color-muted:#6c757d;--interactive-color:#0056b3;--primary-color:#007bff;--rt-mobile-card-shadow:0 1px 2px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.06),0 12px 32px rgba(0,0,0,.04);--rt-mobile-card-radius:16px;--rt-mobile-bg-wash:#f1f5f9;--rt-mobile-label-color:#475569;--rt-mobile-value-color:#1e293b}.ResponsiveTable-module_tableContainer__VjWjH{border:1px solid var(--table-border-color);border-radius:8px;overflow-x:auto;width:100%}.ResponsiveTable-module_responsiveTable__4y-Od{background-color:var(--card-bg);border-collapse:collapse;color:var(--text-color);width:100%}.ResponsiveTable-module_responsiveTable__4y-Od thead th{background-color:var(--table-header-bg);border-bottom:2px solid var(--table-border-color);color:var(--text-color-muted);font-size:.75rem;font-weight:600;letter-spacing:.05em;padding:1rem;text-align:left;text-transform:uppercase;z-index:1}.ResponsiveTable-module_responsiveTable__4y-Od td{border-bottom:1px solid var(--table-border-color);font-size:.9rem;padding:1rem;text-align:left}.ResponsiveTable-module_responsiveTable__4y-Od tr:last-child td{border-bottom:none}.ResponsiveTable-module_responsiveTable__4y-Od tr:nth-child(2n){background-color:var(--table-row-stripe-bg)}.ResponsiveTable-module_responsiveTable__4y-Od tr:hover{background-color:var(--table-row-hover-bg)}.ResponsiveTable-module_cardContainer__Het4h{background-color:var(--rt-mobile-bg-wash);border-radius:var(--rt-mobile-card-radius);display:flex;flex-direction:column;gap:1.25rem;padding:1rem}.ResponsiveTable-module_card__b-U2v{background-color:var(--card-bg);border:1px solid var(--card-border-color);border-bottom:3px solid var(--primary-color);border-radius:var(--rt-mobile-card-radius);box-shadow:var(--rt-mobile-card-shadow);overflow:hidden;padding:1rem;transition:box-shadow .2s ease-in-out,transform .2s ease-in-out}.ResponsiveTable-module_card__b-U2v:hover{box-shadow:0 2px 4px rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.08),0 16px 48px rgba(0,0,0,.06);transform:translateY(-4px)}.ResponsiveTable-module_card-header__Ttk51{border-bottom:1px solid var(--table-border-color);margin-bottom:1rem;padding-bottom:.5rem}.ResponsiveTable-module_card-row__qvIUJ{align-items:flex-start;display:flex;gap:1rem;justify-content:space-between;margin:0 0 .75rem}.ResponsiveTable-module_card-row__qvIUJ.ResponsiveTable-module_stacked__FSaTB{align-items:stretch;flex-direction:column;gap:.25rem;margin-bottom:1rem}.ResponsiveTable-module_card-row__qvIUJ:last-child{margin-bottom:0}.ResponsiveTable-module_card-label__v9L71{color:var(--rt-mobile-label-color);font-size:.75rem;font-weight:600;text-transform:uppercase;white-space:nowrap}.ResponsiveTable-module_card-value__BO-c-{color:var(--rt-mobile-value-color);font-size:.95rem;text-align:right}.ResponsiveTable-module_card-row__qvIUJ.ResponsiveTable-module_stacked__FSaTB .ResponsiveTable-module_card-value__BO-c-{text-align:left}.ResponsiveTable-module_numberValue__-TLR1{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;text-align:right!important}.ResponsiveTable-module_dateValue__UMvqJ{color:var(--text-color-muted);font-size:.85rem}.ResponsiveTable-module_imageValue__wVb-p img{border-radius:8px;height:auto;max-width:100%;object-fit:cover}.ResponsiveTable-module_inputValue__CrGMx{margin-top:.5rem;width:100%}.ResponsiveTable-module_inputValue__CrGMx button,.ResponsiveTable-module_inputValue__CrGMx input[type=text],.ResponsiveTable-module_inputValue__CrGMx select,.ResponsiveTable-module_inputValue__CrGMx textarea{min-height:44px;width:100%!important}.ResponsiveTable-module_clickableRow__0kjWm{cursor:pointer}.ResponsiveTable-module_responsiveTable__4y-Od tbody tr{transition:background-color .12s ease}.ResponsiveTable-module_responsiveTable__4y-Od tbody tr.ResponsiveTable-module_clickableRow__0kjWm:active{background-color:var(--table-row-active-bg,#dde3ea);transition:background-color .08s ease}.ResponsiveTable-module_responsiveTable__4y-Od tbody tr.ResponsiveTable-module_clickableRow__0kjWm:focus-visible{outline:2px solid var(--primary-color,#3b82f6);outline-offset:-2px}.ResponsiveTable-module_card__b-U2v.ResponsiveTable-module_clickableRow__0kjWm:active{box-shadow:0 1px 3px rgba(0,0,0,.08);transform:translateY(-1px);transition:transform .08s ease,box-shadow .08s ease}.ResponsiveTable-module_card__b-U2v.ResponsiveTable-module_clickableRow__0kjWm:focus-visible{outline:2px solid var(--primary-color,#3b82f6);outline-offset:-2px}.ResponsiveTable-module_clickableHeader__xHQhF{cursor:pointer;transition:color .2s}.ResponsiveTable-module_clickableHeader__xHQhF:hover{color:var(--interactive-color)}.ResponsiveTable-module_sortable__yvA60{cursor:pointer}.ResponsiveTable-module_sorted-asc__jzOIa,.ResponsiveTable-module_sorted-desc__7WCFK{background-color:#f0f7ff!important;color:var(--interactive-color)!important}.ResponsiveTable-module_headerInnerWrapper__3VAhD{align-items:center;display:flex;justify-content:space-between;width:100%}.ResponsiveTable-module_headerContent__ODMzS{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ResponsiveTable-module_sortIcon__A9WtD{background-position:50%;background-repeat:no-repeat;background-size:contain;flex-shrink:0;height:1rem;margin-left:.5rem;opacity:.3;width:1rem}.ResponsiveTable-module_sortable__yvA60:hover .ResponsiveTable-module_sortIcon__A9WtD{opacity:.8}.ResponsiveTable-module_sortable__yvA60 .ResponsiveTable-module_sortIcon__A9WtD{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%236c757d'%3E%3Cpath d='M10 18h4v-2h-4v2zm-6-8v2h16V8H4zm3-6h10v2H7V2z'/%3E%3C/svg%3E\")}.ResponsiveTable-module_sorted-asc__jzOIa .ResponsiveTable-module_sortIcon__A9WtD{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230056b3'%3E%3Cpath d='m7 14 5-5 5 5z'/%3E%3C/svg%3E\");opacity:1}.ResponsiveTable-module_sorted-desc__7WCFK .ResponsiveTable-module_sortIcon__A9WtD{background-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230056b3'%3E%3Cpath d='m7 10 5 5 5-5z'/%3E%3C/svg%3E\");opacity:1}.ResponsiveTable-module_responsiveTable__4y-Od tfoot{background-color:var(--table-header-bg);border-top:2px solid var(--table-border-color)}.ResponsiveTable-module_footerCell__8H-uG{font-size:.9rem;font-weight:600;padding:1rem;text-align:right}.ResponsiveTable-module_clickableFooterCell__WB9Ss{color:var(--interactive-color);cursor:pointer}.ResponsiveTable-module_clickableFooterCell__WB9Ss:hover{text-decoration:underline}.ResponsiveTable-module_footerCard__-NE2M{background-color:var(--table-header-bg);border:1px solid var(--card-border-color);border-radius:12px;margin-top:1rem;overflow:hidden;padding:1.25rem}.ResponsiveTable-module_footer-card-row__Vv6Ur{display:flex;font-size:.9rem;font-weight:600;justify-content:space-between;margin:0 0 .75rem}.ResponsiveTable-module_selectedRow__-JyNW{background-color:#e7f1ff!important;transition:background-color .15s ease}.ResponsiveTable-module_card__b-U2v.ResponsiveTable-module_selectedRow__-JyNW{background-color:#e7f1ff;border-left:4px solid var(--primary-color)}.ResponsiveTable-module_animatedRow__SFjrJ{animation:ResponsiveTable-module_cardEntrance__6JjRV .5s cubic-bezier(.2,.8,.2,1) forwards;opacity:0}@keyframes ResponsiveTable-module_cardEntrance__6JjRV{0%{opacity:0;transform:translateY(15px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes ResponsiveTable-module_fadeInUp__jMCS7{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.ResponsiveTable-module_skeleton__XxsXW{background-color:#f0f0f0;border-radius:4px;overflow:hidden;position:relative}.ResponsiveTable-module_skeleton__XxsXW:after{animation:ResponsiveTable-module_shimmer__H8PhC 1.5s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.6),transparent);content:\"\";height:100%;left:-150%;position:absolute;top:0;width:150%}@keyframes ResponsiveTable-module_shimmer__H8PhC{0%{transform:translateX(0)}to{transform:translateX(100%)}}.ResponsiveTable-module_noDataWrapper__Rj-k3{align-items:center;background-color:var(--table-header-bg);border:2px dashed var(--table-border-color);border-radius:12px;color:var(--text-color-muted);display:flex;flex-direction:column;gap:1rem;justify-content:center;padding:4rem 2rem}.ResponsiveTable-module_noData__IpwNq{font-size:1.1rem;font-weight:500}.ResponsiveTable-module_spinner__Pn-3D{animation:ResponsiveTable-module_spin__i3NHn .8s linear infinite;border:3px solid rgba(0,0,0,.1);border-left:3px solid var(--primary-color);border-radius:50%;height:24px;width:24px}@keyframes ResponsiveTable-module_spin__i3NHn{to{transform:rotate(1turn)}}.ResponsiveTable-module_infoContainer__b9IF5{align-items:center;color:var(--text-color-muted);display:flex;font-size:.85rem;gap:.5rem;justify-content:center;padding:1.5rem}.ResponsiveTable-module_stickyHeader__-jjN- th{box-shadow:0 2px 4px rgba(0,0,0,.05);position:sticky;top:0}.ResponsiveTable-module_internalStickyHeader__idiJY th{position:sticky;top:0}.ResponsiveTable-module_expandColumn__yvwN-{border-bottom:1px solid var(--table-border-color);min-width:2rem;padding:0!important;text-align:center;vertical-align:middle;width:2rem}.ResponsiveTable-module_expandChevron__7JalN{align-items:center;border-radius:.25rem;color:var(--primary-color,#3b82f6);cursor:pointer;display:inline-flex;font-size:1.125rem;height:1.5rem;justify-content:center;opacity:.25;transform:rotate(-90deg);transition:opacity .15s ease,transform .25s ease;user-select:none;width:1.5rem}.ResponsiveTable-module_expandChevron__7JalN:focus-visible{outline:2px solid var(--primary-color,#3b82f6);outline-offset:2px}@keyframes ResponsiveTable-module_chevronGreeting__nLVUh{0%{opacity:0;transform:rotate(-90deg) scale(.6)}12%{opacity:1;transform:rotate(-90deg) scale(1.3)}22%{opacity:.35;transform:rotate(-90deg) scale(1)}32%{opacity:1;transform:rotate(-90deg) scale(1.15)}45%{opacity:.25;transform:rotate(-90deg) scale(1)}to{opacity:.25;transform:rotate(-90deg) scale(1)}}.ResponsiveTable-module_expandChevronGreeting__hu51J{animation:ResponsiveTable-module_chevronGreeting__nLVUh 2.2s ease-out forwards;animation-delay:calc(var(--row-idx, 0)*60ms)}.ResponsiveTable-module_expandChevronHovered__aNVCU{opacity:.6}.ResponsiveTable-module_expandChevronExpanded__iQ1bV{opacity:1;transform:rotate(0deg)}.ResponsiveTable-module_detailCell__hb9C5{background:rgba(0,0,0,.012);border-top:none;padding:0;transition:border-left .2s ease}.ResponsiveTable-module_detailCellHasContent__F-DX5{padding-bottom:.5rem}.ResponsiveTable-module_detailCellExpanded__Zr6UF{border-left:2px solid var(--primary-color,#3b82f6)}.ResponsiveTable-module_detailToggleBar__F5Qrk{height:0;overflow:hidden;transition:height .25s ease,background .25s ease}.ResponsiveTable-module_detailToggleBarExpanded__l8IWq{align-items:center;background:rgba(59,130,246,.08);box-shadow:inset 0 1px 0 rgba(0,0,0,.04);cursor:pointer;display:flex;gap:.5rem;height:2rem;padding:0 .75rem;user-select:none}.ResponsiveTable-module_detailToggleBarExpanded__l8IWq:hover{background:rgba(59,130,246,.14)}.ResponsiveTable-module_detailToggleChevron__KWp3H{align-items:center;color:var(--primary-color,#3b82f6);display:flex;font-size:1.25rem;opacity:1}.ResponsiveTable-module_detailContentWrapper__VzM29{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}.ResponsiveTable-module_detailContentWrapperExpanded__bkiUb{grid-template-rows:1fr}.ResponsiveTable-module_detailContentInner__GWVaq{overflow:hidden;padding-left:1.5rem}.ResponsiveTable-module_mobileDetailOuter__gusle{background:rgba(0,0,0,.012);overflow:hidden}.ResponsiveTable-module_mobileExpandRow__Fb0AP{align-items:center;border-bottom:1px solid var(--table-border-color);display:flex;justify-content:flex-start;margin-bottom:.25rem;padding:0 0 .25rem}";
37
+ var styles = {"responsiveTable":"ResponsiveTable-module_responsiveTable__4y-Od","tableContainer":"ResponsiveTable-module_tableContainer__VjWjH","cardContainer":"ResponsiveTable-module_cardContainer__Het4h","card":"ResponsiveTable-module_card__b-U2v","card-header":"ResponsiveTable-module_card-header__Ttk51","card-row":"ResponsiveTable-module_card-row__qvIUJ","stacked":"ResponsiveTable-module_stacked__FSaTB","card-label":"ResponsiveTable-module_card-label__v9L71","card-value":"ResponsiveTable-module_card-value__BO-c-","numberValue":"ResponsiveTable-module_numberValue__-TLR1","dateValue":"ResponsiveTable-module_dateValue__UMvqJ","imageValue":"ResponsiveTable-module_imageValue__wVb-p","inputValue":"ResponsiveTable-module_inputValue__CrGMx","clickableRow":"ResponsiveTable-module_clickableRow__0kjWm","clickableHeader":"ResponsiveTable-module_clickableHeader__xHQhF","sortable":"ResponsiveTable-module_sortable__yvA60","sorted-asc":"ResponsiveTable-module_sorted-asc__jzOIa","sorted-desc":"ResponsiveTable-module_sorted-desc__7WCFK","headerInnerWrapper":"ResponsiveTable-module_headerInnerWrapper__3VAhD","headerContent":"ResponsiveTable-module_headerContent__ODMzS","sortIcon":"ResponsiveTable-module_sortIcon__A9WtD","footerCell":"ResponsiveTable-module_footerCell__8H-uG","clickableFooterCell":"ResponsiveTable-module_clickableFooterCell__WB9Ss","footerCard":"ResponsiveTable-module_footerCard__-NE2M","footer-card-row":"ResponsiveTable-module_footer-card-row__Vv6Ur","selectedRow":"ResponsiveTable-module_selectedRow__-JyNW","animatedRow":"ResponsiveTable-module_animatedRow__SFjrJ","cardEntrance":"ResponsiveTable-module_cardEntrance__6JjRV","skeleton":"ResponsiveTable-module_skeleton__XxsXW","shimmer":"ResponsiveTable-module_shimmer__H8PhC","noDataWrapper":"ResponsiveTable-module_noDataWrapper__Rj-k3","noData":"ResponsiveTable-module_noData__IpwNq","spinner":"ResponsiveTable-module_spinner__Pn-3D","spin":"ResponsiveTable-module_spin__i3NHn","infoContainer":"ResponsiveTable-module_infoContainer__b9IF5","stickyHeader":"ResponsiveTable-module_stickyHeader__-jjN-","internalStickyHeader":"ResponsiveTable-module_internalStickyHeader__idiJY","expandColumn":"ResponsiveTable-module_expandColumn__yvwN-","expandChevron":"ResponsiveTable-module_expandChevron__7JalN","expandChevronGreeting":"ResponsiveTable-module_expandChevronGreeting__hu51J","chevronGreeting":"ResponsiveTable-module_chevronGreeting__nLVUh","expandChevronHovered":"ResponsiveTable-module_expandChevronHovered__aNVCU","expandChevronExpanded":"ResponsiveTable-module_expandChevronExpanded__iQ1bV","detailCell":"ResponsiveTable-module_detailCell__hb9C5","detailCellHasContent":"ResponsiveTable-module_detailCellHasContent__F-DX5","detailCellExpanded":"ResponsiveTable-module_detailCellExpanded__Zr6UF","detailToggleBar":"ResponsiveTable-module_detailToggleBar__F5Qrk","detailToggleBarExpanded":"ResponsiveTable-module_detailToggleBarExpanded__l8IWq","detailToggleChevron":"ResponsiveTable-module_detailToggleChevron__KWp3H","detailContentWrapper":"ResponsiveTable-module_detailContentWrapper__VzM29","detailContentWrapperExpanded":"ResponsiveTable-module_detailContentWrapperExpanded__bkiUb","detailContentInner":"ResponsiveTable-module_detailContentInner__GWVaq","mobileDetailOuter":"ResponsiveTable-module_mobileDetailOuter__gusle","mobileExpandRow":"ResponsiveTable-module_mobileExpandRow__Fb0AP","fadeInUp":"ResponsiveTable-module_fadeInUp__jMCS7"};
38
+ styleInject(css_248z);
39
39
 
40
40
  /******************************************************************************
41
41
  Copyright (c) Microsoft Corporation.
@@ -116,7 +116,7 @@ function TableProvider({ children, value }) {
116
116
  var _a;
117
117
  const rawColumnDefinition = getRawColumnDefinition(colDef);
118
118
  return onHeaderClick
119
- ? ((_a = rawColumnDefinition.interactivity) === null || _a === void 0 ? void 0 : _a.className) || styles$2.clickableHeader
119
+ ? ((_a = rawColumnDefinition.interactivity) === null || _a === void 0 ? void 0 : _a.className) || styles.clickableHeader
120
120
  : '';
121
121
  }, [getRawColumnDefinition]);
122
122
  const getHeaderProps = React.useCallback((colDef) => {
@@ -196,13 +196,13 @@ function TableHeaderCell(props) {
196
196
  const rawColDef = getRawColumnDefinition(columnDefinition);
197
197
  const clickableHeaderClassName = getClickableHeaderClassName(onHeaderClick, columnDefinition);
198
198
  const headerProps = getHeaderProps(columnDefinition);
199
- const combinedClassName = `${clickableHeaderClassName} ${headerProps.className ? styles$2[headerProps.className] : ''} ${rawColDef.headerClassName || ''}`.trim();
199
+ const combinedClassName = `${clickableHeaderClassName} ${headerProps.className ? styles[headerProps.className] : ''} ${rawColDef.headerClassName || ''}`.trim();
200
200
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
201
201
  const { className } = headerProps, restHeaderProps = __rest(headerProps, ["className"]);
202
202
  return (React.createElement("th", Object.assign({ key: colIndex, className: combinedClassName, style: Object.assign(Object.assign({}, headerProps.style), rawColDef.headerStyle) }, restHeaderProps, { onClick: onHeaderClick ? () => onHeaderClick(rawColDef.interactivity.id) : restHeaderProps.onClick }),
203
- React.createElement("div", { className: styles$2.headerInnerWrapper },
204
- React.createElement("div", { className: styles$2.headerContent }, getColumnDefinition(columnDefinition, 0).displayLabel),
205
- React.createElement("span", { className: styles$2.sortIcon }))));
203
+ React.createElement("div", { className: styles.headerInnerWrapper },
204
+ React.createElement("div", { className: styles.headerContent }, getColumnDefinition(columnDefinition, 0).displayLabel),
205
+ React.createElement("span", { className: styles.sortIcon }))));
206
206
  }
207
207
 
208
208
  function TableBodyCell(props) {
@@ -214,12 +214,12 @@ function TableBodyCell(props) {
214
214
  }
215
215
 
216
216
  function TableBodyRow(props) {
217
- const { row, rowIndex, columnDefinitions, onRowClick, selectionProps, animationProps, } = props;
217
+ const { row, rowIndex, columnDefinitions, onRowClick, selectionProps, animationProps, expandCell, onMouseEnter, onMouseLeave, } = props;
218
218
  const { getRowProps } = useTableContext();
219
219
  const rowProps = getRowProps(row);
220
220
  const isClickable = onRowClick || selectionProps;
221
221
  const pluginOnClick = rowProps.onClick;
222
- return (React.createElement("tr", { className: `${isClickable ? styles$2.clickableRow : ''} ${(animationProps === null || animationProps === void 0 ? void 0 : animationProps.animateOnLoad) ? styles$2.animatedRow : ''} ${rowProps.className || ''}`.trim(), style: { animationDelay: `${rowIndex * 0.05}s` }, tabIndex: isClickable ? 0 : undefined, "aria-selected": rowProps['aria-selected'], onClickCapture: (e) => {
222
+ return (React.createElement("tr", { className: `${isClickable ? styles.clickableRow : ''} ${(animationProps === null || animationProps === void 0 ? void 0 : animationProps.animateOnLoad) ? styles.animatedRow : ''} ${rowProps.className || ''}`.trim(), style: { animationDelay: `${rowIndex * 0.05}s` }, tabIndex: isClickable ? 0 : undefined, "aria-selected": rowProps['aria-selected'], onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onClickCapture: (e) => {
223
223
  // Capture Phase: Check for the ignore attribute BEFORE child handlers run.
224
224
  // This prevents issues where child handlers trigger a re-render/unmount
225
225
  // that detaches the target from the DOM before the bubbling phase.
@@ -238,42 +238,45 @@ function TableBodyRow(props) {
238
238
  if (onRowClick) {
239
239
  onRowClick(row);
240
240
  }
241
- } }, columnDefinitions.map((columnDefinition, colIndex) => (React.createElement("td", { key: colIndex },
242
- React.createElement(TableBodyCell, { row: row, rowIndex: rowIndex, columnDefinition: columnDefinition }))))));
241
+ } },
242
+ expandCell,
243
+ columnDefinitions.map((columnDefinition, colIndex) => (React.createElement("td", { key: colIndex },
244
+ React.createElement(TableBodyCell, { row: row, rowIndex: rowIndex, columnDefinition: columnDefinition }))))));
243
245
  }
244
246
 
245
- function DetailRow({ row, rowIndex, colSpan, expandRowRenderer, isExpanded, onToggle, expandChevronClassName }) {
247
+ function DetailRow({ row, rowIndex, colSpan, expandRowRenderer, isExpanded, onToggle }) {
246
248
  const content = expandRowRenderer(row, rowIndex);
247
249
  const hasContent = content != null;
248
250
  const [everExpanded, setEverExpanded] = React.useState(false);
249
251
  if (isExpanded && !everExpanded)
250
252
  setEverExpanded(true);
251
253
  const tdClass = [
252
- styles$2.detailCell,
253
- hasContent ? styles$2.detailCellHasContent : '',
254
- isExpanded ? styles$2.detailCellExpanded : '',
254
+ styles.detailCell,
255
+ hasContent ? styles.detailCellHasContent : '',
256
+ isExpanded ? styles.detailCellExpanded : '',
255
257
  ].join(' ').trim();
256
- const chevronClass = [
257
- styles$2.detailChevron,
258
- isExpanded ? styles$2.detailChevronExpanded : '',
259
- expandChevronClassName !== null && expandChevronClassName !== void 0 ? expandChevronClassName : '',
258
+ const toggleBarClass = [
259
+ styles.detailToggleBar,
260
+ isExpanded ? styles.detailToggleBarExpanded : '',
260
261
  ].join(' ').trim();
262
+ const toggleAttrs = {
263
+ role: 'button',
264
+ tabIndex: 0,
265
+ 'aria-expanded': isExpanded,
266
+ onClick: onToggle,
267
+ onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') {
268
+ e.preventDefault();
269
+ onToggle();
270
+ } },
271
+ 'data-rt-ignore-row-click': true,
272
+ };
261
273
  return (React.createElement("tr", null,
262
274
  React.createElement("td", { colSpan: colSpan, className: tdClass },
263
- React.createElement("div", Object.assign({ className: `${styles$2.detailToggleBar} ${hasContent ? styles$2.detailToggleBarVisible : ''}` }, (hasContent ? {
264
- role: 'button',
265
- tabIndex: 0,
266
- 'aria-expanded': isExpanded,
267
- onClick: onToggle,
268
- onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') {
269
- e.preventDefault();
270
- onToggle();
271
- } },
272
- 'data-rt-ignore-row-click': true,
273
- } : {})), hasContent && (React.createElement("span", { className: chevronClass },
274
- React.createElement(md.MdArrowDropDown, null)))),
275
- React.createElement("div", { className: `${styles$2.detailContentWrapper} ${isExpanded ? styles$2.detailContentWrapperExpanded : ''}` },
276
- React.createElement("div", { className: styles$2.detailContentInner }, everExpanded && content)))));
275
+ isExpanded && (React.createElement("div", Object.assign({ className: toggleBarClass }, toggleAttrs),
276
+ React.createElement("span", { className: styles.detailToggleChevron },
277
+ React.createElement(md.MdArrowDropDown, null)))),
278
+ React.createElement("div", { className: `${styles.detailContentWrapper} ${isExpanded ? styles.detailContentWrapperExpanded : ''}` },
279
+ React.createElement("div", { className: styles.detailContentInner }, everExpanded && content)))));
277
280
  }
278
281
 
279
282
  const TableSentinel = ({ onIntersect, isLoading }) => {
@@ -307,6 +310,12 @@ function DesktopView(props) {
307
310
  const { maxHeight, isHeaderSticky, tableContainerRef, headerRef, footerRows, renderPluginFooters, onScroll, } = props;
308
311
  const { visibleColumns, originalColumnDefinitions, currentData, getRawColumnDefinition, onRowClick, selectionProps, animationProps, pagination, expandRowRenderer, expandChevronClassName, getRowId, } = useTableContext();
309
312
  const [expandedIds, setExpandedIds] = React.useState(new Set());
313
+ const [hoveredRowId, setHoveredRowId] = React.useState(null);
314
+ const [greetingActive, setGreetingActive] = React.useState(true);
315
+ React.useEffect(() => {
316
+ const t = setTimeout(() => setGreetingActive(false), 3200);
317
+ return () => clearTimeout(t);
318
+ }, []);
310
319
  const toggleExpanded = React.useCallback((id) => {
311
320
  setExpandedIds(prev => {
312
321
  const next = new Set(prev);
@@ -337,41 +346,60 @@ function DesktopView(props) {
337
346
  }
338
347
  return (React.createElement("tfoot", null, footerRows.map((row, rowIndex) => {
339
348
  let currentOriginalIndex = 0;
340
- return (React.createElement("tr", { key: rowIndex }, row.columns.map((col, colIndex) => {
341
- const effectiveColSpan = getEffectiveColSpan(col, currentOriginalIndex);
342
- currentOriginalIndex += (col.colSpan || 1);
343
- if (effectiveColSpan === 0)
344
- return null;
345
- return (React.createElement("td", { key: colIndex, colSpan: effectiveColSpan, className: `${styles$2.footerCell} ${col.className || ''} ${col.onCellClick ? styles$2.clickableFooterCell : ''}`, onClick: col.onCellClick }, col.cellRenderer()));
346
- })));
349
+ return (React.createElement("tr", { key: rowIndex },
350
+ expandRowRenderer && React.createElement("td", { className: styles.expandColumn }),
351
+ row.columns.map((col, colIndex) => {
352
+ const effectiveColSpan = getEffectiveColSpan(col, currentOriginalIndex);
353
+ currentOriginalIndex += (col.colSpan || 1);
354
+ if (effectiveColSpan === 0)
355
+ return null;
356
+ return (React.createElement("td", { key: colIndex, colSpan: effectiveColSpan, className: `${styles.footerCell} ${col.className || ''} ${col.onCellClick ? styles.clickableFooterCell : ''}`, onClick: col.onCellClick }, col.cellRenderer()));
357
+ })));
347
358
  })));
348
- }, [footerRows, getEffectiveColSpan]);
359
+ }, [footerRows, getEffectiveColSpan, expandRowRenderer]);
349
360
  const useFixedHeaders = !!maxHeight;
350
361
  const fixedHeadersStyle = useFixedHeaders
351
362
  ? { maxHeight, overflowY: 'auto' }
352
363
  : {};
353
364
  const headerClassName = useFixedHeaders
354
- ? styles$2.internalStickyHeader
355
- : (isHeaderSticky ? styles$2.stickyHeader : '');
356
- return (React.createElement("div", { className: styles$2.tableContainer, style: fixedHeadersStyle, ref: tableContainerRef, onScroll: onScroll },
357
- React.createElement("table", { className: styles$2['responsiveTable'] },
365
+ ? styles.internalStickyHeader
366
+ : (isHeaderSticky ? styles.stickyHeader : '');
367
+ return (React.createElement("div", { className: styles.tableContainer, style: fixedHeadersStyle, ref: tableContainerRef, onScroll: onScroll },
368
+ React.createElement("table", { className: styles['responsiveTable'] },
358
369
  React.createElement("thead", { ref: headerRef, className: headerClassName },
359
- React.createElement("tr", null, visibleColumns.map((columnDefinition, colIndex) => (React.createElement(TableHeaderCell, { key: colIndex, columnDefinition: columnDefinition, colIndex: colIndex }))))),
370
+ React.createElement("tr", null,
371
+ expandRowRenderer && React.createElement("th", { className: styles.expandColumn }),
372
+ visibleColumns.map((columnDefinition, colIndex) => (React.createElement(TableHeaderCell, { key: colIndex, columnDefinition: columnDefinition, colIndex: colIndex }))))),
360
373
  React.createElement("tbody", null, currentData.map((row, rowIndex) => {
361
374
  const rowId = getRowId(row, rowIndex);
375
+ const isExpanded = expandedIds.has(rowId);
376
+ const isHovered = hoveredRowId === rowId;
377
+ const rowContent = expandRowRenderer === null || expandRowRenderer === void 0 ? void 0 : expandRowRenderer(row, rowIndex);
378
+ const rowHasContent = rowContent != null;
379
+ const chevronClasses = [
380
+ styles.expandChevron,
381
+ greetingActive && rowHasContent ? styles.expandChevronGreeting : '',
382
+ isExpanded ? styles.expandChevronExpanded : '',
383
+ isHovered && !isExpanded ? styles.expandChevronHovered : '',
384
+ expandChevronClassName !== null && expandChevronClassName !== void 0 ? expandChevronClassName : '',
385
+ ].filter(Boolean).join(' ').trim();
362
386
  return (React.createElement(React.Fragment, { key: rowId },
363
- React.createElement(TableBodyRow, { row: row, rowIndex: rowIndex, columnDefinitions: visibleColumns, onRowClick: onRowClick, selectionProps: selectionProps, animationProps: animationProps }),
364
- expandRowRenderer && (React.createElement(DetailRow, { row: row, rowIndex: rowIndex, colSpan: visibleColumns.length, expandRowRenderer: expandRowRenderer, isExpanded: expandedIds.has(rowId), onToggle: () => toggleExpanded(rowId), expandChevronClassName: expandChevronClassName }))));
387
+ React.createElement(TableBodyRow, { row: row, rowIndex: rowIndex, columnDefinitions: visibleColumns, onRowClick: onRowClick, selectionProps: selectionProps, animationProps: animationProps, expandCell: expandRowRenderer ? (React.createElement("td", { className: styles.expandColumn, style: { '--row-idx': rowIndex } }, rowHasContent && (React.createElement("span", { className: chevronClasses, role: "button", tabIndex: 0, "aria-expanded": isExpanded, onClick: (e) => { e.stopPropagation(); toggleExpanded(rowId); }, onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') {
388
+ e.preventDefault();
389
+ toggleExpanded(rowId);
390
+ } }, "data-rt-ignore-row-click": true },
391
+ React.createElement(md.MdArrowDropDown, null))))) : undefined, onMouseEnter: () => expandRowRenderer && setHoveredRowId(rowId), onMouseLeave: () => expandRowRenderer && setHoveredRowId(null) }),
392
+ expandRowRenderer && rowHasContent && (React.createElement(DetailRow, { row: row, rowIndex: rowIndex, colSpan: visibleColumns.length + 1, expandRowRenderer: expandRowRenderer, isExpanded: isExpanded, onToggle: () => toggleExpanded(rowId) }))));
365
393
  })),
366
394
  tableFooter),
367
395
  (pagination === null || pagination === void 0 ? void 0 : pagination.hasMore) && (React.createElement(TableSentinel, { onIntersect: () => pagination.loadNextPage(), isLoading: pagination.isFetchingMore })),
368
- (pagination === null || pagination === void 0 ? void 0 : pagination.isFetchingMore) && (React.createElement("div", { className: styles$2.infoContainer },
369
- React.createElement("div", { className: styles$2.spinner }),
396
+ (pagination === null || pagination === void 0 ? void 0 : pagination.isFetchingMore) && (React.createElement("div", { className: styles.infoContainer },
397
+ React.createElement("div", { className: styles.spinner }),
370
398
  React.createElement("span", null, "Loading more items..."))),
371
399
  renderPluginFooters()));
372
400
  }
373
401
 
374
- function MobileDetailSection({ row, rowIndex, expandRowRenderer, isExpanded, onToggle, expandChevronClassName }) {
402
+ function MobileDetailSection({ row, rowIndex, expandRowRenderer, isExpanded, onToggle }) {
375
403
  const content = expandRowRenderer(row, rowIndex);
376
404
  const hasContent = content != null;
377
405
  const [everExpanded, setEverExpanded] = React.useState(false);
@@ -379,31 +407,44 @@ function MobileDetailSection({ row, rowIndex, expandRowRenderer, isExpanded, onT
379
407
  setEverExpanded(true);
380
408
  if (!hasContent)
381
409
  return null;
382
- const chevronClass = [
383
- styles$2.detailChevron,
384
- isExpanded ? styles$2.detailChevronExpanded : '',
385
- expandChevronClassName !== null && expandChevronClassName !== void 0 ? expandChevronClassName : '',
386
- ].join(' ').trim();
387
410
  const outerClass = [
388
- styles$2.mobileDetailOuter,
389
- styles$2.detailCellHasContent,
390
- isExpanded ? styles$2.detailCellExpanded : '',
411
+ styles.mobileDetailOuter,
412
+ styles.detailCellHasContent,
413
+ isExpanded ? styles.detailCellExpanded : '',
414
+ ].join(' ').trim();
415
+ const toggleBarClass = [
416
+ styles.detailToggleBar,
417
+ isExpanded ? styles.detailToggleBarExpanded : '',
391
418
  ].join(' ').trim();
419
+ const toggleAttrs = {
420
+ role: 'button',
421
+ tabIndex: 0,
422
+ 'aria-expanded': isExpanded,
423
+ onClick: onToggle,
424
+ onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') {
425
+ e.preventDefault();
426
+ onToggle();
427
+ } },
428
+ 'data-rt-ignore-row-click': true,
429
+ };
392
430
  return (React.createElement("div", { className: outerClass },
393
- React.createElement("div", { className: `${styles$2.detailToggleBar} ${styles$2.detailToggleBarVisible}`, role: "button", tabIndex: 0, "aria-expanded": isExpanded, onClick: onToggle, onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') {
394
- e.preventDefault();
395
- onToggle();
396
- } }, "data-rt-ignore-row-click": true },
397
- React.createElement("span", { className: chevronClass },
398
- React.createElement(md.MdArrowDropDown, null))),
399
- React.createElement("div", { className: `${styles$2.detailContentWrapper} ${isExpanded ? styles$2.detailContentWrapperExpanded : ''}` },
400
- React.createElement("div", { className: styles$2.detailContentInner }, everExpanded && content))));
431
+ isExpanded && (React.createElement("div", Object.assign({ className: toggleBarClass }, toggleAttrs),
432
+ React.createElement("span", { className: styles.detailToggleChevron },
433
+ React.createElement(md.MdArrowDropDown, null)))),
434
+ React.createElement("div", { className: `${styles.detailContentWrapper} ${isExpanded ? styles.detailContentWrapperExpanded : ''}` },
435
+ React.createElement("div", { className: styles.detailContentInner }, everExpanded && content))));
401
436
  }
402
437
  function MobileView(props) {
403
438
  const { mobileFooter } = props;
404
439
  const { currentData, visibleColumns, onRowClick, selectionProps, animationProps, getRowProps, getRowId, getColumnDefinition, onHeaderClickCallback, getClickableHeaderClassName, pagination, mobileCardClassName, expandRowRenderer, expandChevronClassName, } = useTableContext();
405
440
  const isClickable = onRowClick || selectionProps;
406
441
  const [expandedIds, setExpandedIds] = React.useState(new Set());
442
+ const [hoveredRowId, setHoveredRowId] = React.useState(null);
443
+ const [greetingActive, setGreetingActive] = React.useState(true);
444
+ React.useEffect(() => {
445
+ const t = setTimeout(() => setGreetingActive(false), 3200);
446
+ return () => clearTimeout(t);
447
+ }, []);
407
448
  const toggleExpanded = React.useCallback((id) => {
408
449
  setExpandedIds(prev => {
409
450
  const next = new Set(prev);
@@ -444,19 +485,30 @@ function MobileView(props) {
444
485
  };
445
486
  const getTypeClassName = (dataType) => {
446
487
  switch (dataType) {
447
- case 'number': return styles$2.numberValue;
448
- case 'date': return styles$2.dateValue;
449
- case 'image': return styles$2.imageValue;
450
- case 'input': return styles$2.inputValue;
488
+ case 'number': return styles.numberValue;
489
+ case 'date': return styles.dateValue;
490
+ case 'image': return styles.imageValue;
491
+ case 'input': return styles.inputValue;
451
492
  default: return '';
452
493
  }
453
494
  };
454
- return (React.createElement("div", { className: styles$2.cardContainer },
495
+ return (React.createElement("div", { className: styles.cardContainer },
455
496
  currentData.map((row, rowIndex) => {
456
497
  const rowProps = getRowProps(row);
457
498
  const pluginOnClick = rowProps.onClick;
458
- return (React.createElement(React.Fragment, { key: getRowId(row, rowIndex) },
459
- React.createElement("div", { className: `${styles$2.card} ${isClickable ? styles$2.clickableRow : ''} ${(animationProps === null || animationProps === void 0 ? void 0 : animationProps.animateOnLoad) ? styles$2.animatedRow : ''} ${rowProps.className || ''} ${mobileCardClassName || ''}`.trim(), style: { animationDelay: `${rowIndex * 0.05}s` }, tabIndex: isClickable ? 0 : undefined, "aria-selected": rowProps['aria-selected'], onClickCapture: (e) => {
499
+ const rowId = getRowId(row, rowIndex);
500
+ const isExpanded = expandedIds.has(rowId);
501
+ const rowContent = expandRowRenderer === null || expandRowRenderer === void 0 ? void 0 : expandRowRenderer(row, rowIndex);
502
+ const rowHasContent = rowContent != null;
503
+ const chevronClasses = [
504
+ styles.expandChevron,
505
+ greetingActive && rowHasContent ? styles.expandChevronGreeting : '',
506
+ isExpanded ? styles.expandChevronExpanded : '',
507
+ hoveredRowId === rowId && !isExpanded ? styles.expandChevronHovered : '',
508
+ expandChevronClassName !== null && expandChevronClassName !== void 0 ? expandChevronClassName : '',
509
+ ].filter(Boolean).join(' ').trim();
510
+ return (React.createElement(React.Fragment, { key: rowId },
511
+ React.createElement("div", { className: `${styles.card} ${isClickable ? styles.clickableRow : ''} ${(animationProps === null || animationProps === void 0 ? void 0 : animationProps.animateOnLoad) ? styles.animatedRow : ''} ${rowProps.className || ''} ${mobileCardClassName || ''}`.trim(), style: { animationDelay: `${rowIndex * 0.05}s` }, tabIndex: isClickable ? 0 : undefined, "aria-selected": rowProps['aria-selected'], onMouseEnter: () => expandRowRenderer && setHoveredRowId(rowId), onMouseLeave: () => expandRowRenderer && setHoveredRowId(null), onClickCapture: (e) => {
460
512
  const target = e.target;
461
513
  if (target.closest('[data-rt-ignore-row-click]')) {
462
514
  e.nativeEvent._rtIgnoreRowClick = true;
@@ -470,7 +522,13 @@ function MobileView(props) {
470
522
  if (onRowClick)
471
523
  onRowClick(row);
472
524
  } },
473
- React.createElement("div", { className: styles$2['card-body'] }, visibleColumns.map((columnDefinition, colIndex) => {
525
+ expandRowRenderer && rowHasContent && (React.createElement("div", { className: styles.mobileExpandRow, style: { '--row-idx': rowIndex } },
526
+ React.createElement("span", { className: chevronClasses, role: "button", tabIndex: 0, "aria-expanded": isExpanded, onClick: (e) => { e.stopPropagation(); toggleExpanded(rowId); }, onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') {
527
+ e.preventDefault();
528
+ toggleExpanded(rowId);
529
+ } }, "data-rt-ignore-row-click": true },
530
+ React.createElement(md.MdArrowDropDown, null)))),
531
+ React.createElement("div", { className: styles['card-body'] }, visibleColumns.map((columnDefinition, colIndex) => {
474
532
  const colDef = getColumnDefinition(columnDefinition, rowIndex);
475
533
  const onHeaderClick = onHeaderClickCallback(columnDefinition);
476
534
  const clickableHeaderClassName = getClickableHeaderClassName(onHeaderClick, columnDefinition);
@@ -479,21 +537,21 @@ function MobileView(props) {
479
537
  const sampleValue = colDef.dataKey ? row[colDef.dataKey] : null;
480
538
  const dataType = inferDataType(colDef, sampleValue);
481
539
  const typeClassName = getTypeClassName(dataType);
482
- return (React.createElement("div", { key: colIndex, className: `${styles$2['card-row']} ${styles$2.stacked}` },
483
- React.createElement("span", { className: `${styles$2['card-label']} ${clickableHeaderClassName} ${colDef.headerClassName || ''}`, style: colDef.headerStyle, onClick: (e) => {
540
+ return (React.createElement("div", { key: colIndex, className: `${styles['card-row']} ${styles.stacked}` },
541
+ React.createElement("span", { className: `${styles['card-label']} ${clickableHeaderClassName} ${colDef.headerClassName || ''}`, style: colDef.headerStyle, onClick: (e) => {
484
542
  if (onHeaderClick) {
485
543
  e.stopPropagation();
486
544
  onHeaderClick(colDef.interactivity.id);
487
545
  }
488
546
  } }, colDef.displayLabel),
489
- React.createElement("span", { className: `${styles$2['card-value']} ${typeClassName} ${colDef.cellClassName || ''}`, style: colDef.cellStyle },
547
+ React.createElement("span", { className: `${styles['card-value']} ${typeClassName} ${colDef.cellClassName || ''}`, style: colDef.cellStyle },
490
548
  React.createElement(TableBodyCell, { row: row, rowIndex: rowIndex, columnDefinition: columnDefinition }))));
491
549
  }))),
492
- expandRowRenderer && (React.createElement(MobileDetailSection, { row: row, rowIndex: rowIndex, expandRowRenderer: expandRowRenderer, isExpanded: expandedIds.has(getRowId(row, rowIndex)), onToggle: () => toggleExpanded(getRowId(row, rowIndex)), expandChevronClassName: expandChevronClassName }))));
550
+ expandRowRenderer && rowHasContent && (React.createElement(MobileDetailSection, { row: row, rowIndex: rowIndex, expandRowRenderer: expandRowRenderer, isExpanded: isExpanded, onToggle: () => toggleExpanded(rowId) }))));
493
551
  }),
494
552
  (pagination === null || pagination === void 0 ? void 0 : pagination.hasMore) && (React.createElement(TableSentinel, { onIntersect: () => pagination.loadNextPage(), isLoading: pagination.isFetchingMore })),
495
- (pagination === null || pagination === void 0 ? void 0 : pagination.isFetchingMore) && (React.createElement("div", { className: styles$2.infoContainer },
496
- React.createElement("div", { className: styles$2.spinner }),
553
+ (pagination === null || pagination === void 0 ? void 0 : pagination.isFetchingMore) && (React.createElement("div", { className: styles.infoContainer },
554
+ React.createElement("div", { className: styles.spinner }),
497
555
  React.createElement("span", null, "Loading more items..."))),
498
556
  mobileFooter));
499
557
  }
@@ -503,35 +561,16 @@ function SkeletonView(props) {
503
561
  const skeletonRowCount = 5;
504
562
  const columnCount = columnDefinitions.length;
505
563
  if (isMobile) {
506
- return (React.createElement("div", null, [...Array(skeletonRowCount)].map((_, i) => (React.createElement("div", { key: i, className: styles$2.skeletonCard }, [...Array(columnCount)].map((_, j) => (React.createElement("div", { key: j, className: `${styles$2.skeleton} ${styles$2.skeletonText}`, style: { marginBottom: '0.5rem' } }))))))));
564
+ return (React.createElement("div", null, [...Array(skeletonRowCount)].map((_, i) => (React.createElement("div", { key: i, className: styles.skeletonCard }, [...Array(columnCount)].map((_, j) => (React.createElement("div", { key: j, className: `${styles.skeleton} ${styles.skeletonText}`, style: { marginBottom: '0.5rem' } }))))))));
507
565
  }
508
- return (React.createElement("table", { className: styles$2.responsiveTable },
566
+ return (React.createElement("table", { className: styles.responsiveTable },
509
567
  React.createElement("thead", null,
510
568
  React.createElement("tr", null, [...Array(columnCount)].map((_, i) => (React.createElement("th", { key: i },
511
- React.createElement("div", { className: `${styles$2.skeleton} ${styles$2.skeletonText}` })))))),
569
+ React.createElement("div", { className: `${styles.skeleton} ${styles.skeletonText}` })))))),
512
570
  React.createElement("tbody", null, [...Array(skeletonRowCount)].map((_, i) => (React.createElement("tr", { key: i }, [...Array(columnCount)].map((_, j) => (React.createElement("td", { key: j },
513
- React.createElement("div", { className: `${styles$2.skeleton} ${styles$2.skeletonText}` }))))))))));
571
+ React.createElement("div", { className: `${styles.skeleton} ${styles.skeletonText}` }))))))))));
514
572
  }
515
573
 
516
- var css_248z$1 = ".LoadingSpinner-module_spinner__F9V3x{animation:LoadingSpinner-module_spin__VkBDO .8s cubic-bezier(.4,0,.2,1) infinite;border:3px solid rgba(0,0,0,.05);border-left:3px solid var(--primary-color,#007bff);border-radius:50%;display:inline-block;height:28px;vertical-align:middle;width:28px}@keyframes LoadingSpinner-module_spin__VkBDO{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}";
517
- var styles$1 = {"spinner":"LoadingSpinner-module_spinner__F9V3x"};
518
- styleInject(css_248z$1);
519
-
520
- var css_248z = ".NoMoreDataMessage-module_infoContainer__dk1r5{align-items:center;background-color:var(--table-header-bg,#f8f9fa);border-top:1px solid var(--table-border-color,#e0e0e0);color:var(--text-color-muted,#6c757d);display:flex;font-size:.85rem;gap:.75rem;justify-content:center;padding:2rem;width:100%}.NoMoreDataMessage-module_infoContainer__dk1r5.NoMoreDataMessage-module_noMoreData__ATuIg{font-weight:600;letter-spacing:.02em}";
521
- var styles = {"infoContainer":"NoMoreDataMessage-module_infoContainer__dk1r5","noMoreData":"NoMoreDataMessage-module_noMoreData__ATuIg"};
522
- styleInject(css_248z);
523
-
524
- const LoadingSpinner = () => {
525
- return (React.createElement("div", { className: styles.infoContainer },
526
- React.createElement("div", { className: styles$1.spinner }),
527
- React.createElement("span", null, "Loading more items...")));
528
- };
529
-
530
- const NoMoreDataMessage = () => {
531
- return (React.createElement("div", { className: `${styles.infoContainer} ${styles.noMoreData}` },
532
- React.createElement("p", null, "You've reached the end!")));
533
- };
534
-
535
574
  function debounce(func, delay) {
536
575
  let timeout;
537
576
  return function (...args) {
@@ -746,7 +785,7 @@ class SelectionPlugin {
746
785
  const rowId = this.getRowId(row);
747
786
  const isSelected = selectedIds.has(rowId);
748
787
  const combinedClassName = [
749
- isSelected ? styles$2.selectedRow : '',
788
+ isSelected ? styles.selectedRow : '',
750
789
  isSelected ? selectedRowClassName : ''
751
790
  ].filter(Boolean).join(' ');
752
791
  return {
@@ -891,7 +930,7 @@ class SortPlugin {
891
930
  }
892
931
 
893
932
  const useTablePlugins = (props) => {
894
- const { data, plugins, filterProps, selectionProps, sortProps, columnDefinitions, getScrollableElement, infiniteScrollProps, onFilterChange, } = props;
933
+ const { data, plugins, filterProps, selectionProps, sortProps, columnDefinitions, getScrollableElement, onFilterChange, } = props;
895
934
  const [processedData, setProcessedData] = React.useState(data);
896
935
  const [activePlugins, setActivePlugins] = React.useState([]);
897
936
  // Persist internal plugins using refs to prevent state loss
@@ -961,7 +1000,6 @@ const useTablePlugins = (props) => {
961
1000
  getData: () => data,
962
1001
  forceUpdate: forceUpdatePlugins,
963
1002
  getScrollableElement: getScrollableElement,
964
- infiniteScrollProps: infiniteScrollProps,
965
1003
  filterProps: filterProps,
966
1004
  selectionProps: selectionProps,
967
1005
  columnDefinitions: columnDefinitions,
@@ -989,7 +1027,6 @@ const useTablePlugins = (props) => {
989
1027
  sortProps,
990
1028
  columnDefinitions,
991
1029
  getScrollableElement,
992
- infiniteScrollProps,
993
1030
  getRawColumnDefinition,
994
1031
  onFilterChange,
995
1032
  ]);
@@ -1003,157 +1040,6 @@ const useTablePlugins = (props) => {
1003
1040
  return { processedData, activePlugins, visibleColumns, forceUpdatePlugins };
1004
1041
  };
1005
1042
 
1006
- function InfiniteTable(props) {
1007
- const { columnDefinitions, data, noDataComponent, maxHeight, onRowClick, footerRows, mobileBreakpoint, plugins, enablePageLevelStickyHeader, infiniteScrollProps, filterProps, selectionProps, animationProps, sortProps, } = props;
1008
- const tableContainerRef = React.useRef(null);
1009
- const headerRef = React.useRef(null);
1010
- const { isMobile, isHeaderSticky, debouncedScrollHandler } = useResponsiveTable({
1011
- mobileBreakpoint,
1012
- enablePageLevelStickyHeader,
1013
- maxHeight,
1014
- headerRef,
1015
- scrollableRef: tableContainerRef,
1016
- });
1017
- const [internalData, setInternalData] = React.useState(data || []);
1018
- const [isLoadingMore, setIsLoadingMore] = React.useState(false);
1019
- const [internalHasMore, setInternalHasMore] = React.useState(true);
1020
- const getScrollableElement = React.useCallback(() => tableContainerRef.current, []);
1021
- const { processedData, activePlugins, visibleColumns } = useTablePlugins({
1022
- data: internalData,
1023
- plugins,
1024
- filterProps,
1025
- selectionProps,
1026
- sortProps,
1027
- columnDefinitions,
1028
- getScrollableElement,
1029
- infiniteScrollProps,
1030
- });
1031
- const currentHasMore = (infiniteScrollProps === null || infiniteScrollProps === void 0 ? void 0 : infiniteScrollProps.hasMore) !== undefined
1032
- ? infiniteScrollProps.hasMore
1033
- : internalHasMore;
1034
- const hasData = React.useMemo(() => processedData.length > 0, [processedData]);
1035
- const noDataComponentNode = noDataComponent || React.createElement("div", { className: styles$2.noData }, "No data");
1036
- const defaultLoadingComponent = React.createElement(LoadingSpinner, null);
1037
- const defaultNoMoreDataComponent = React.createElement(NoMoreDataMessage, null);
1038
- const loadMoreData = React.useCallback(() => __awaiter(this, void 0, void 0, function* () {
1039
- var _a;
1040
- if (!infiniteScrollProps || isLoadingMore)
1041
- return;
1042
- setIsLoadingMore(true);
1043
- try {
1044
- const newItems = yield ((_a = infiniteScrollProps.onLoadMore) === null || _a === void 0 ? void 0 : _a.call(infiniteScrollProps, internalData));
1045
- if (infiniteScrollProps.hasMore === undefined) {
1046
- if (!newItems || newItems.length === 0) {
1047
- setInternalHasMore(false);
1048
- }
1049
- }
1050
- if (newItems && newItems.length > 0) {
1051
- setInternalData(prevData => [...prevData, ...newItems]);
1052
- }
1053
- }
1054
- catch (error) {
1055
- console.error("Failed to load more items for infinite scroll:", error);
1056
- }
1057
- finally {
1058
- setIsLoadingMore(false);
1059
- }
1060
- }), [infiniteScrollProps, isLoadingMore, internalData]);
1061
- React.useEffect(() => {
1062
- setInternalData(data || []);
1063
- }, [data]);
1064
- React.useEffect(() => {
1065
- if (data.length === 0) {
1066
- loadMoreData();
1067
- }
1068
- }, [data.length, loadMoreData]);
1069
- const handleScrollForInfinite = React.useCallback((currentTarget) => {
1070
- if (!currentTarget)
1071
- return;
1072
- const { scrollHeight, scrollTop, clientHeight } = currentTarget;
1073
- if (currentHasMore && !isLoadingMore && scrollHeight - scrollTop - clientHeight < 100) {
1074
- loadMoreData();
1075
- }
1076
- }, [currentHasMore, isLoadingMore, loadMoreData]);
1077
- const mobileFooter = React.useMemo(() => {
1078
- if (!footerRows || footerRows.length === 0) {
1079
- return null;
1080
- }
1081
- // Helper to get raw column definition in this context
1082
- const getRaw = (colDef) => {
1083
- if (typeof colDef === 'function') {
1084
- return processedData.length > 0 ? colDef(processedData[0], 0) : { displayLabel: '', cellRenderer: () => '' };
1085
- }
1086
- return colDef;
1087
- };
1088
- return (React.createElement("div", { className: styles$2.footerCard },
1089
- React.createElement("div", { className: styles$2['footer-card-body'] }, footerRows.map((row, rowIndex) => {
1090
- let currentColumnIndex = 0;
1091
- return (React.createElement("div", { key: rowIndex }, row.columns.map((col, colIndex) => {
1092
- let label = col.displayLabel;
1093
- if (!label && col.colSpan === 1) {
1094
- const header = columnDefinitions[currentColumnIndex];
1095
- if (header) {
1096
- label = getRaw(header).displayLabel;
1097
- }
1098
- }
1099
- currentColumnIndex += col.colSpan;
1100
- return (React.createElement("p", { key: colIndex, className: `${styles$2['footer-card-row']} ${col.className || ''} ${col.onCellClick ? styles$2.clickableFooterCell : ''}`, onClick: col.onCellClick },
1101
- label && React.createElement("span", { className: styles$2['card-label'] }, label),
1102
- React.createElement("span", { className: styles$2['card-value'] }, col.cellRenderer())));
1103
- })));
1104
- }))));
1105
- }, [footerRows, columnDefinitions, processedData]);
1106
- const renderPluginHeaders = React.useCallback(() => {
1107
- if (!activePlugins) {
1108
- return null;
1109
- }
1110
- return activePlugins.map((plugin) => {
1111
- if (plugin.renderHeader) {
1112
- if (plugin.id === 'sort' && !isMobile) {
1113
- return null;
1114
- }
1115
- return React.createElement("div", { key: plugin.id }, plugin.renderHeader());
1116
- }
1117
- return null;
1118
- });
1119
- }, [activePlugins, isMobile]);
1120
- const renderPluginFooters = React.useCallback(() => {
1121
- if (!plugins) {
1122
- return null;
1123
- }
1124
- return plugins.map((plugin) => {
1125
- if (plugin.renderFooter) {
1126
- return React.createElement("div", { key: plugin.id + '-footer' }, plugin.renderFooter());
1127
- }
1128
- return null;
1129
- });
1130
- }, [plugins]);
1131
- const infiniteStatusUI = (React.createElement(React.Fragment, null,
1132
- isLoadingMore && ((infiniteScrollProps === null || infiniteScrollProps === void 0 ? void 0 : infiniteScrollProps.loadingMoreComponent) || defaultLoadingComponent),
1133
- !isLoadingMore && !currentHasMore && ((infiniteScrollProps === null || infiniteScrollProps === void 0 ? void 0 : infiniteScrollProps.noMoreDataComponent) || defaultNoMoreDataComponent)));
1134
- if ((animationProps === null || animationProps === void 0 ? void 0 : animationProps.isLoading) && !hasData) {
1135
- return React.createElement(SkeletonView, { isMobile: isMobile, columnDefinitions: visibleColumns });
1136
- }
1137
- return (React.createElement(TableProvider, { value: {
1138
- data: internalData,
1139
- processedData,
1140
- visibleColumns,
1141
- originalColumnDefinitions: columnDefinitions,
1142
- activePlugins,
1143
- onRowClick,
1144
- selectionProps,
1145
- animationProps,
1146
- } },
1147
- React.createElement("div", null,
1148
- React.createElement("div", { style: { display: 'flex', justifyContent: 'flex-end' } }, renderPluginHeaders()),
1149
- !hasData && noDataComponentNode,
1150
- hasData && (isMobile ? (React.createElement(MobileView, { mobileFooter: mobileFooter })) : (React.createElement(DesktopView, { maxHeight: maxHeight, isHeaderSticky: isHeaderSticky, tableContainerRef: tableContainerRef, headerRef: headerRef, footerRows: footerRows, renderPluginFooters: renderPluginFooters, onScroll: (e) => {
1151
- debouncedScrollHandler(e.currentTarget); // For sticky header
1152
- handleScrollForInfinite(e.currentTarget); // For infinite scroll
1153
- } }))),
1154
- hasData && infiniteStatusUI)));
1155
- }
1156
-
1157
1043
  const useTableDataSource = (props) => {
1158
1044
  const { dataSource, pageSize = 20, initialData = [], sort, filter } = props;
1159
1045
  const [data, setData] = React.useState(initialData);
@@ -1255,7 +1141,7 @@ const useTableDataSource = (props) => {
1255
1141
  * Supports static data or async data sources with built-in infinite scroll.
1256
1142
  */
1257
1143
  function ResponsiveTableInner(props, ref) {
1258
- const { columnDefinitions, data: initialData, dataSource, pageSize, noDataComponent, maxHeight, onRowClick, footerRows, mobileBreakpoint, plugins, enablePageLevelStickyHeader, infiniteScrollProps, filterProps, selectionProps, animationProps, sortProps, mobileCardClassName, onDataSourceStateChange, onPageChange, onDataSourceError, expandRowRenderer, expandChevronClassName, } = props;
1144
+ const { columnDefinitions, data: initialData, dataSource, pageSize, noDataComponent, maxHeight, onRowClick, footerRows, mobileBreakpoint, plugins, enablePageLevelStickyHeader, filterProps, selectionProps, animationProps, sortProps, mobileCardClassName, onDataSourceStateChange, onPageChange, onDataSourceError, expandRowRenderer, expandChevronClassName, } = props;
1259
1145
  const tableContainerRef = React.useRef(null);
1260
1146
  const headerRef = React.useRef(null);
1261
1147
  const { isMobile, isHeaderSticky } = useResponsiveTable({
@@ -1315,7 +1201,6 @@ function ResponsiveTableInner(props, ref) {
1315
1201
  sortProps,
1316
1202
  columnDefinitions,
1317
1203
  getScrollableElement,
1318
- infiniteScrollProps,
1319
1204
  });
1320
1205
  // Fire onDataSourceStateChange when dataSource state changes
1321
1206
  React.useEffect(() => {
@@ -1346,9 +1231,9 @@ function ResponsiveTableInner(props, ref) {
1346
1231
  const hasData = React.useMemo(() => processedData.length > 0, [processedData]);
1347
1232
  const noDataSvg = (React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "#ccc", height: "40", width: "40", viewBox: "0 0 24 24" },
1348
1233
  React.createElement("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-1-14h2v6h-2zm0 8h2v2h-2z" })));
1349
- const noDataComponentNode = noDataComponent || (React.createElement("div", { className: styles$2.noDataWrapper },
1234
+ const noDataComponentNode = noDataComponent || (React.createElement("div", { className: styles.noDataWrapper },
1350
1235
  noDataSvg,
1351
- React.createElement("div", { className: styles$2.noData }, "No data")));
1236
+ React.createElement("div", { className: styles.noData }, "No data")));
1352
1237
  const mobileFooter = React.useMemo(() => {
1353
1238
  if (!footerRows || footerRows.length === 0) {
1354
1239
  return null;
@@ -1360,8 +1245,8 @@ function ResponsiveTableInner(props, ref) {
1360
1245
  }
1361
1246
  return colDef;
1362
1247
  };
1363
- return (React.createElement("div", { className: styles$2.footerCard },
1364
- React.createElement("div", { className: styles$2['footer-card-body'] }, footerRows.map((row, rowIndex) => {
1248
+ return (React.createElement("div", { className: styles.footerCard },
1249
+ React.createElement("div", { className: styles['footer-card-body'] }, footerRows.map((row, rowIndex) => {
1365
1250
  let currentColumnIndex = 0;
1366
1251
  return (React.createElement("div", { key: rowIndex }, row.columns.map((col, colIndex) => {
1367
1252
  let label = col.displayLabel;
@@ -1372,9 +1257,9 @@ function ResponsiveTableInner(props, ref) {
1372
1257
  }
1373
1258
  }
1374
1259
  currentColumnIndex += col.colSpan;
1375
- return (React.createElement("p", { key: colIndex, className: `${styles$2['footer-card-row']} ${col.className || ''} ${col.onCellClick ? styles$2.clickableFooterCell : ''}`, onClick: col.onCellClick },
1376
- label && React.createElement("span", { className: styles$2['card-label'] }, label),
1377
- React.createElement("span", { className: styles$2['card-value'] }, col.cellRenderer())));
1260
+ return (React.createElement("p", { key: colIndex, className: `${styles['footer-card-row']} ${col.className || ''} ${col.onCellClick ? styles.clickableFooterCell : ''}`, onClick: col.onCellClick },
1261
+ label && React.createElement("span", { className: styles['card-label'] }, label),
1262
+ React.createElement("span", { className: styles['card-value'] }, col.cellRenderer())));
1378
1263
  })));
1379
1264
  }))));
1380
1265
  }, [footerRows, columnDefinitions, processedData]);
@@ -1408,9 +1293,6 @@ function ResponsiveTableInner(props, ref) {
1408
1293
  animateOnLoad: animationProps === null || animationProps === void 0 ? void 0 : animationProps.animateOnLoad,
1409
1294
  isLoading,
1410
1295
  }), [animationProps === null || animationProps === void 0 ? void 0 : animationProps.animateOnLoad, animationProps === null || animationProps === void 0 ? void 0 : animationProps.isLoading, isLoading]);
1411
- if (infiniteScrollProps) {
1412
- return React.createElement(InfiniteTable, Object.assign({}, props));
1413
- }
1414
1296
  if (isLoading && !hasData) {
1415
1297
  return React.createElement(SkeletonView, { isMobile: isMobile, columnDefinitions: visibleColumns });
1416
1298
  }
@@ -1471,61 +1353,7 @@ function ResponsiveTableInner(props, ref) {
1471
1353
  }
1472
1354
  const ResponsiveTable = React.forwardRef(ResponsiveTableInner);
1473
1355
 
1474
- class InfiniteScrollPlugin {
1475
- constructor() {
1476
- this.id = 'infinite-scroll';
1477
- this.isLoadingMore = false;
1478
- this.onPluginInit = (api) => {
1479
- this.api = api;
1480
- this.attachScrollListener();
1481
- };
1482
- this.attachScrollListener = () => {
1483
- var _a, _b;
1484
- const scrollableElement = (_b = (_a = this.api).getScrollableElement) === null || _b === void 0 ? void 0 : _b.call(_a);
1485
- if (scrollableElement) {
1486
- scrollableElement.addEventListener('scroll', this.handleScroll);
1487
- }
1488
- };
1489
- this.handleScroll = () => __awaiter(this, void 0, void 0, function* () {
1490
- var _a, _b, _c, _d;
1491
- const scrollableElement = (_b = (_a = this.api).getScrollableElement) === null || _b === void 0 ? void 0 : _b.call(_a);
1492
- if (!scrollableElement || !this.api.infiniteScrollProps) {
1493
- return;
1494
- }
1495
- const { scrollTop, scrollHeight, clientHeight } = scrollableElement;
1496
- const scrollThreshold = 200; // Load more data when 200px from the bottom
1497
- if (scrollHeight - scrollTop - clientHeight < scrollThreshold &&
1498
- this.api.infiniteScrollProps.hasMore &&
1499
- !this.isLoadingMore) {
1500
- this.isLoadingMore = true;
1501
- this.api.forceUpdate(); // Trigger re-render to show loading component
1502
- yield ((_d = (_c = this.api.infiniteScrollProps).onLoadMore) === null || _d === void 0 ? void 0 : _d.call(_c, this.api.getData()));
1503
- this.isLoadingMore = false;
1504
- this.api.forceUpdate(); // Trigger re-render to hide loading component
1505
- }
1506
- });
1507
- this.processData = (data) => {
1508
- // This plugin doesn't modify the data directly, but rather triggers loading more.
1509
- // The main component's data prop should be updated by the consumer of the table.
1510
- return data;
1511
- };
1512
- this.renderFooter = () => {
1513
- if (!this.api.infiniteScrollProps) {
1514
- return null;
1515
- }
1516
- if (this.isLoadingMore) {
1517
- return this.api.infiniteScrollProps.loadingMoreComponent || React.createElement("div", null, "Loading more...");
1518
- }
1519
- else if (!this.api.infiniteScrollProps.hasMore) {
1520
- return this.api.infiniteScrollProps.noMoreDataComponent || React.createElement("div", null, "No more data.");
1521
- }
1522
- return null;
1523
- };
1524
- }
1525
- }
1526
-
1527
1356
  exports.FilterPlugin = FilterPlugin;
1528
- exports.InfiniteScrollPlugin = InfiniteScrollPlugin;
1529
1357
  exports.SelectionPlugin = SelectionPlugin;
1530
1358
  exports.SortPlugin = SortPlugin;
1531
1359
  exports.default = ResponsiveTable;