simple-table-core 2.4.7 → 2.4.9
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/{Animate-18a5c3ed.js → Animate-83698811.js} +2 -2
- package/dist/Animate-83698811.js.map +1 -0
- package/dist/{DatePicker-a5056e77.js → DatePicker-351b14f7.js} +2 -2
- package/dist/DatePicker-351b14f7.js.map +1 -0
- package/dist/cjs/{Animate-e09824d4.js → Animate-602f9788.js} +2 -2
- package/dist/cjs/Animate-602f9788.js.map +1 -0
- package/dist/cjs/{DatePicker-00096a9d.js → DatePicker-f688bd14.js} +2 -2
- package/dist/cjs/DatePicker-f688bd14.js.map +1 -0
- package/dist/cjs/components/simple-table/TableSection.d.ts +1 -1
- package/dist/cjs/consts/column-constraints.d.ts +58 -0
- package/dist/cjs/consts/general-consts.d.ts +2 -9
- package/dist/cjs/context/TableContext.d.ts +1 -0
- package/dist/cjs/hooks/useAutoScaleMainSection.d.ts +28 -0
- package/dist/cjs/index-6e0768e6.js +2 -0
- package/dist/cjs/index-6e0768e6.js.map +1 -0
- package/dist/cjs/index.d.ts +3 -5
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/styles.css +1 -1
- package/dist/cjs/types/HandleResizeStartProps.d.ts +7 -7
- package/dist/cjs/utils/cellUtils.d.ts +2 -1
- package/dist/cjs/utils/resizeUtils.d.ts +13 -10
- package/dist/components/simple-table/TableSection.d.ts +1 -1
- package/dist/consts/column-constraints.d.ts +58 -0
- package/dist/consts/general-consts.d.ts +2 -9
- package/dist/context/TableContext.d.ts +1 -0
- package/dist/hooks/useAutoScaleMainSection.d.ts +28 -0
- package/dist/index-97894266.js +2 -0
- package/dist/index-97894266.js.map +1 -0
- package/dist/index.d.ts +3 -5
- package/dist/index.es.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/types/HandleResizeStartProps.d.ts +7 -7
- package/dist/utils/cellUtils.d.ts +2 -1
- package/dist/utils/resizeUtils.d.ts +13 -10
- package/package.json +1 -1
- package/src/styles/base.css +6 -0
- package/dist/Animate-18a5c3ed.js.map +0 -1
- package/dist/DatePicker-a5056e77.js.map +0 -1
- package/dist/cjs/Animate-e09824d4.js.map +0 -1
- package/dist/cjs/DatePicker-00096a9d.js.map +0 -1
- package/dist/cjs/index-aed12af6.js +0 -2
- package/dist/cjs/index-aed12af6.js.map +0 -1
- package/dist/index-c2f46c58.js +0 -2
- package/dist/index-c2f46c58.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{_ as n,u as i,a as t,c as o,b as e,A as a,d as r,f as l,R as d}from"./index-
|
|
2
|
-
//# sourceMappingURL=Animate-
|
|
1
|
+
import{_ as n,u as i,a as t,c as o,b as e,A as a,d as r,f as l,R as d}from"./index-97894266.js";import{jsx as u}from"react/jsx-runtime";import{useRef as f,useMemo as s,useLayoutEffect as v}from"react";var m=function(m){var p=m.children,h=m.id,M=m.parentRef,c=m.tableRow,Y=n(m,["children","id","parentRef","tableRow"]),C=i(),g=C.allowAnimations,x=C.isResizing,R=C.isScrolling,b=C.rowHeight,j=f(null),A=f(null),B=t(R),w=t(x),_=s(function(){return o(b)},[b]);return v(function(){var n,i,t,o;if(g&&j.current&&!x){var u=j.current.getBoundingClientRect(),f=A.current;if(!R)if(!B||R)if(!w||x){if(A.current=u,f){var s=u.x-f.x,v=u.y-f.y;if((Math.abs(s)>=50||Math.abs(v)>5)&&(Math.abs(s)>5||Math.abs(v)>5)){var m=e(e({},a.ROW_REORDER),{onComplete:function(){j.current&&(j.current.style.zIndex="",j.current.style.position="",j.current.style.top="")}}),p=null===(n=null==M?void 0:M.current)||void 0===n?void 0:n.scrollTop,h=null===(i=null==M?void 0:M.current)||void 0===i?void 0:i.clientHeight,Y=null===(t=null==M?void 0:M.current)||void 0===t?void 0:t.scrollHeight;if(void 0!==p&&void 0!==h&&void 0!==Y){var C=_*(b+d),k=p-C,q=p+h+C,y=f.y>k&&q>f.y,z=u.y>k&&q>u.y,D=p>u.y,E=null!==(o=null==c?void 0:c.position)&&void 0!==o?o:0,F=.6*b,G=function(n,i,t){return Math.min(900,Math.max(100,100+80*Math.log10(Math.max(1,Math.min(Math.abs(n-i),Math.abs(n-t))))))};if(y&&!z&&u.y>p+h){var H=G(u.y,p,p+h);return void r({element:j.current,options:{startY:f.y,endY:p+h+H+E%15*F*2.5+E%7*.4*b,finalY:u.y,duration:m.duration,easing:m.easing,onComplete:m.onComplete}})}if(y&&!z&&D)return H=G(u.y,p,p+h),void r({element:j.current,options:{startY:f.y,endY:p-H-E%15*F*2.5-E%7*.4*b,finalY:u.y,duration:m.duration,easing:m.easing,onComplete:m.onComplete}});if(!y&&z&&f.y>p+h)return H=G(f.y,p,p+h),void r({element:j.current,options:{startY:p+h+H+E%10*F*1,endY:u.y,duration:m.duration,easing:m.easing,onComplete:m.onComplete}});if(!y&&z&&p>f.y)return H=G(f.y,p,p+h),void r({element:j.current,options:{startY:p-H-E%10*F*1,endY:u.y,duration:m.duration,easing:m.easing,onComplete:m.onComplete}})}l({element:j.current,fromBounds:f,toBounds:u,finalConfig:m})}}}else A.current=u;else A.current=u}},[g,_,x,R,M,B,w,b,null==c?void 0:c.position,c]),u("div",e({ref:j,"data-animate-id":h,id:h+""},Y,{children:p}))};m.displayName="Animate";export{m as Animate,m as default};
|
|
2
|
+
//# sourceMappingURL=Animate-83698811.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Animate-83698811.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{u as e,b as n}from"./index-
|
|
2
|
-
//# sourceMappingURL=DatePicker-
|
|
1
|
+
import{u as e,b as n}from"./index-97894266.js";import{jsxs as t,Fragment as a,jsx as r}from"react/jsx-runtime";import{useState as c}from"react";var i=function(i){var d,o,s=i.onChange,l=i.onClose,u=i.value,f=e().icons,h=c(u||new Date),m=h[0],v=h[1],k=c("days"),p=k[0],w=k[1],y=function(e,n){return new Date(e,n+1,0).getDate()};return t("div",n({className:"st-datepicker"},{children:[t("div",n({className:"st-datepicker-header"},{children:["days"===p&&t(a,{children:[r("button",n({onClick:function(){v(new Date(m.getFullYear(),m.getMonth()-1,1))},className:"st-datepicker-nav-btn"},{children:f.prev})),t("div",n({className:"st-datepicker-header-label",onClick:function(){return w("months")}},{children:[(o=m,o.toLocaleString("default",{month:"long"}))," ",m.getFullYear()]})),r("button",n({onClick:function(){v(new Date(m.getFullYear(),m.getMonth()+1,1))},className:"st-datepicker-nav-btn"},{children:f.next}))]}),"months"===p&&r("div",n({className:"st-datepicker-header-label",onClick:function(){return w("years")}},{children:m.getFullYear()})),"years"===p&&r("div",n({className:"st-datepicker-header-label"},{children:"Select Year"}))]})),t("div",n({className:"st-datepicker-grid st-datepicker-".concat(p,"-grid")},{children:["days"===p&&function(){var e=[],t=m.getFullYear(),a=m.getMonth(),c=y(t,a),i=function(e,n){return new Date(e,n,1).getDay()}(t,a),d=y(t,a-1);["Su","Mo","Tu","We","Th","Fr","Sa"].forEach(function(t,a){e.push(r("div",n({className:"st-datepicker-weekday"},{children:t}),"header-".concat(a)))});for(var o=function(t){var a=d-i+t+1;e.push(r("div",n({className:"st-datepicker-day other-month",onClick:function(){return function(e){var n=new Date(m.getFullYear(),m.getMonth()-1,e,12,0,0);v(n),s(n),null==l||l()}(a)}},{children:a}),"prev-".concat(a)))},f=0;i>f;f++)o(f);for(var h=function(c){var i=c===(new Date).getDate()&&a===(new Date).getMonth()&&t===(new Date).getFullYear(),d=new Date(u),o=c===d.getDate()&&a===d.getMonth()&&t===d.getFullYear();e.push(r("div",n({className:"st-datepicker-day ".concat(i?"today":""," ").concat(o?"selected":""),onClick:function(){return function(e){var n=m.getFullYear(),t=m.getMonth(),a=new Date(n,t,e,12,0,0);v(a),s(a),null==l||l()}(c)}},{children:c}),"day-".concat(c)))},k=1;c>=k;k++)h(k);var p=35-(i+c),w=function(t){e.push(r("div",n({className:"st-datepicker-day other-month",onClick:function(){return function(e){var n=new Date(m.getFullYear(),m.getMonth()+1,e,12,0,0);v(n),s(n),null==l||l()}(t)}},{children:t}),"next-".concat(t)))};for(k=1;p>=k;k++)w(k);return e}(),"months"===p&&(d=[],Array.from({length:12},function(e,n){return new Date(2e3,n,1).toLocaleString("default",{month:"short"})}).forEach(function(e,t){var a=t===m.getMonth();d.push(r("div",n({className:"st-datepicker-month ".concat(a?"selected":""),onClick:function(){return function(e){v(new Date(m.getFullYear(),e,1)),w("days")}(t)}},{children:e}),"month-".concat(t)))}),d),"years"===p&&function(){for(var e=[],t=m.getFullYear(),a=t-6,c=function(a){e.push(r("div",n({className:"st-datepicker-year ".concat(a===t?"selected":""),onClick:function(){return function(e){v(new Date(e,m.getMonth(),1)),w("months")}(a)}},{children:a}),"year-".concat(a)))},i=a;a+12>i;i++)c(i);return e}()]})),r("div",n({className:"st-datepicker-footer"},{children:r("button",n({className:"st-datepicker-today-btn",onClick:function(){var e=new Date,n=new Date(e.getFullYear(),e.getMonth(),e.getDate(),12,0,0);v(n),s(n),null==l||l()}},{children:"Today"}))}))]}))};export{i as default};
|
|
2
|
+
//# sourceMappingURL=DatePicker-351b14f7.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DatePicker-351b14f7.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
2
|
-
//# sourceMappingURL=Animate-
|
|
1
|
+
"use strict";var e=require("./index-6e0768e6.js"),n=require("react/jsx-runtime"),i=require("react"),t=function(t){var o=t.children,r=t.id,a=t.parentRef,l=t.tableRow,d=e.__rest(t,["children","id","parentRef","tableRow"]),u=e.useTableContext(),v=u.allowAnimations,f=u.isResizing,s=u.isScrolling,m=u.rowHeight,h=i.useRef(null),p=i.useRef(null),M=e.usePrevious(s),c=e.usePrevious(f),Y=i.useMemo(function(){return e.calculateBufferRowCount(m)},[m]);return i.useLayoutEffect(function(){var n,i,t,o;if(v&&h.current&&!f){var r=h.current.getBoundingClientRect(),d=p.current;if(!s)if(!M||s)if(!c||f){if(p.current=r,d){var u=r.x-d.x,C=r.y-d.y;if((Math.abs(u)>=50||Math.abs(C)>5)&&(Math.abs(u)>5||Math.abs(C)>5)){var g=e.__assign(e.__assign({},e.ANIMATION_CONFIGS.ROW_REORDER),{onComplete:function(){h.current&&(h.current.style.zIndex="",h.current.style.position="",h.current.style.top="")}}),x=null===(n=null==a?void 0:a.current)||void 0===n?void 0:n.scrollTop,q=null===(i=null==a?void 0:a.current)||void 0===i?void 0:i.clientHeight,j=null===(t=null==a?void 0:a.current)||void 0===t?void 0:t.scrollHeight;if(void 0!==x&&void 0!==q&&void 0!==j){var B=Y*(m+e.ROW_SEPARATOR_WIDTH),R=x-B,b=x+q+B,w=d.y>R&&b>d.y,A=r.y>R&&b>r.y,k=x>r.y,y=null!==(o=null==l?void 0:l.position)&&void 0!==o?o:0,z=.6*m,D=function(e,n,i){return Math.min(900,Math.max(100,100+80*Math.log10(Math.max(1,Math.min(Math.abs(e-n),Math.abs(e-i))))))};if(w&&!A&&r.y>x+q){var E=D(r.y,x,x+q);return void e.animateWithCustomCoordinates({element:h.current,options:{startY:d.y,endY:x+q+E+y%15*z*2.5+y%7*.4*m,finalY:r.y,duration:g.duration,easing:g.easing,onComplete:g.onComplete}})}if(w&&!A&&k)return E=D(r.y,x,x+q),void e.animateWithCustomCoordinates({element:h.current,options:{startY:d.y,endY:x-E-y%15*z*2.5-y%7*.4*m,finalY:r.y,duration:g.duration,easing:g.easing,onComplete:g.onComplete}});if(!w&&A&&d.y>x+q)return E=D(d.y,x,x+q),void e.animateWithCustomCoordinates({element:h.current,options:{startY:x+q+E+y%10*z*1,endY:r.y,duration:g.duration,easing:g.easing,onComplete:g.onComplete}});if(!w&&A&&x>d.y)return E=D(d.y,x,x+q),void e.animateWithCustomCoordinates({element:h.current,options:{startY:x-E-y%10*z*1,endY:r.y,duration:g.duration,easing:g.easing,onComplete:g.onComplete}})}e.flipElement({element:h.current,fromBounds:d,toBounds:r,finalConfig:g})}}}else p.current=r;else p.current=r}},[v,Y,f,s,a,M,c,m,null==l?void 0:l.position,l]),n.jsx("div",e.__assign({ref:h,"data-animate-id":r,id:r+""},d,{children:o}))};t.displayName="Animate",exports.Animate=t,exports.default=t;
|
|
2
|
+
//# sourceMappingURL=Animate-602f9788.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Animate-602f9788.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("./index-
|
|
2
|
-
//# sourceMappingURL=DatePicker-
|
|
1
|
+
"use strict";var e=require("./index-6e0768e6.js"),n=require("react/jsx-runtime"),t=require("react");exports.default=function(a){var r,c,i=a.onChange,d=a.onClose,s=a.value,l=e.useTableContext().icons,o=t.useState(s||new Date),u=o[0],h=o[1],f=t.useState("days"),v=f[0],k=f[1],m=function(e,n){return new Date(e,n+1,0).getDate()};return n.jsxs("div",e.__assign({className:"st-datepicker"},{children:[n.jsxs("div",e.__assign({className:"st-datepicker-header"},{children:["days"===v&&n.jsxs(n.Fragment,{children:[n.jsx("button",e.__assign({onClick:function(){h(new Date(u.getFullYear(),u.getMonth()-1,1))},className:"st-datepicker-nav-btn"},{children:l.prev})),n.jsxs("div",e.__assign({className:"st-datepicker-header-label",onClick:function(){return k("months")}},{children:[(c=u,c.toLocaleString("default",{month:"long"}))," ",u.getFullYear()]})),n.jsx("button",e.__assign({onClick:function(){h(new Date(u.getFullYear(),u.getMonth()+1,1))},className:"st-datepicker-nav-btn"},{children:l.next}))]}),"months"===v&&n.jsx("div",e.__assign({className:"st-datepicker-header-label",onClick:function(){return k("years")}},{children:u.getFullYear()})),"years"===v&&n.jsx("div",e.__assign({className:"st-datepicker-header-label"},{children:"Select Year"}))]})),n.jsxs("div",e.__assign({className:"st-datepicker-grid st-datepicker-".concat(v,"-grid")},{children:["days"===v&&function(){var t=[],a=u.getFullYear(),r=u.getMonth(),c=m(a,r),l=function(e,n){return new Date(e,n,1).getDay()}(a,r),o=m(a,r-1);["Su","Mo","Tu","We","Th","Fr","Sa"].forEach(function(a,r){t.push(n.jsx("div",e.__assign({className:"st-datepicker-weekday"},{children:a}),"header-".concat(r)))});for(var f=function(a){var r=o-l+a+1;t.push(n.jsx("div",e.__assign({className:"st-datepicker-day other-month",onClick:function(){return function(e){var n=new Date(u.getFullYear(),u.getMonth()-1,e,12,0,0);h(n),i(n),null==d||d()}(r)}},{children:r}),"prev-".concat(r)))},v=0;l>v;v++)f(v);for(var k=function(c){var l=c===(new Date).getDate()&&r===(new Date).getMonth()&&a===(new Date).getFullYear(),o=new Date(s),f=c===o.getDate()&&r===o.getMonth()&&a===o.getFullYear();t.push(n.jsx("div",e.__assign({className:"st-datepicker-day ".concat(l?"today":""," ").concat(f?"selected":""),onClick:function(){return function(e){var n=u.getFullYear(),t=u.getMonth(),a=new Date(n,t,e,12,0,0);h(a),i(a),null==d||d()}(c)}},{children:c}),"day-".concat(c)))},p=1;c>=p;p++)k(p);var w=35-(l+c),y=function(a){t.push(n.jsx("div",e.__assign({className:"st-datepicker-day other-month",onClick:function(){return function(e){var n=new Date(u.getFullYear(),u.getMonth()+1,e,12,0,0);h(n),i(n),null==d||d()}(a)}},{children:a}),"next-".concat(a)))};for(p=1;w>=p;p++)y(p);return t}(),"months"===v&&(r=[],Array.from({length:12},function(e,n){return new Date(2e3,n,1).toLocaleString("default",{month:"short"})}).forEach(function(t,a){var c=a===u.getMonth();r.push(n.jsx("div",e.__assign({className:"st-datepicker-month ".concat(c?"selected":""),onClick:function(){return function(e){h(new Date(u.getFullYear(),e,1)),k("days")}(a)}},{children:t}),"month-".concat(a)))}),r),"years"===v&&function(){for(var t=[],a=u.getFullYear(),r=a-6,c=function(r){t.push(n.jsx("div",e.__assign({className:"st-datepicker-year ".concat(r===a?"selected":""),onClick:function(){return function(e){h(new Date(e,u.getMonth(),1)),k("months")}(r)}},{children:r}),"year-".concat(r)))},i=r;r+12>i;i++)c(i);return t}()]})),n.jsx("div",e.__assign({className:"st-datepicker-footer"},{children:n.jsx("button",e.__assign({className:"st-datepicker-today-btn",onClick:function(){var e=new Date,n=new Date(e.getFullYear(),e.getMonth(),e.getDate(),12,0,0);h(n),i(n),null==d||d()}},{children:"Today"}))}))]}))};
|
|
2
|
+
//# sourceMappingURL=DatePicker-f688bd14.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DatePicker-f688bd14.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -9,6 +9,7 @@ interface TableSectionProps {
|
|
|
9
9
|
columnIndices: ColumnIndices;
|
|
10
10
|
headers: HeaderObject[];
|
|
11
11
|
pinned?: Pinned;
|
|
12
|
+
regularRows: TableRowType[];
|
|
12
13
|
rowHeight: number;
|
|
13
14
|
rowIndices: RowIndices;
|
|
14
15
|
rowsToRender: TableRowType[];
|
|
@@ -16,7 +17,6 @@ interface TableSectionProps {
|
|
|
16
17
|
templateColumns: string;
|
|
17
18
|
totalHeight: number;
|
|
18
19
|
width?: number;
|
|
19
|
-
regularRows: TableRowType[];
|
|
20
20
|
}
|
|
21
21
|
declare const TableSection: import("react").ForwardRefExoticComponent<TableSectionProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
22
22
|
export default TableSection;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Column width constraints for the table
|
|
3
|
+
* These values control minimum and maximum widths for columns and sections
|
|
4
|
+
*/
|
|
5
|
+
/**
|
|
6
|
+
* MIN_COLUMN_WIDTH
|
|
7
|
+
* The minimum width in pixels that any column can have.
|
|
8
|
+
* This is used as:
|
|
9
|
+
* - The default minimum width when header.minWidth is undefined
|
|
10
|
+
* - The absolute minimum in autoExpandColumns mode to prevent columns from becoming too narrow
|
|
11
|
+
*/
|
|
12
|
+
export declare const MIN_COLUMN_WIDTH = 40;
|
|
13
|
+
/**
|
|
14
|
+
* MAX_SINGLE_PINNED_SECTION_PERCENT
|
|
15
|
+
* Maximum percentage of container width that a single pinned section can occupy.
|
|
16
|
+
* When only one section (left OR right) is pinned, it can take up to 60% of the width.
|
|
17
|
+
* This ensures the main section always has at least 40% of the space.
|
|
18
|
+
*/
|
|
19
|
+
export declare const MAX_SINGLE_PINNED_SECTION_PERCENT = 0.6;
|
|
20
|
+
/**
|
|
21
|
+
* MAX_DUAL_PINNED_SECTION_PERCENT
|
|
22
|
+
* Maximum percentage of container width that each pinned section can occupy
|
|
23
|
+
* when BOTH left and right sections are pinned.
|
|
24
|
+
* With both sections at 40%, the main section is guaranteed at least 20% of the space.
|
|
25
|
+
*/
|
|
26
|
+
export declare const MAX_DUAL_PINNED_SECTION_PERCENT = 0.4;
|
|
27
|
+
/**
|
|
28
|
+
* Mobile breakpoints for responsive pinned section constraints
|
|
29
|
+
*/
|
|
30
|
+
export declare const MOBILE_BREAKPOINT_SMALL = 480;
|
|
31
|
+
export declare const MOBILE_BREAKPOINT_MEDIUM = 768;
|
|
32
|
+
/**
|
|
33
|
+
* Get the maximum allowed width percentage for a single pinned section based on container width.
|
|
34
|
+
* This is used when only ONE section (left OR right) is pinned.
|
|
35
|
+
*
|
|
36
|
+
* @param containerWidth - The table container width in pixels (st-body-container)
|
|
37
|
+
* @returns The maximum percentage (0-1) of container width that the pinned section can occupy
|
|
38
|
+
*/
|
|
39
|
+
export declare const getMaxSinglePinnedPercent: (containerWidth: number) => number;
|
|
40
|
+
/**
|
|
41
|
+
* Get the maximum allowed width percentage for pinned sections based on container width
|
|
42
|
+
* and the number of pinned sections.
|
|
43
|
+
*
|
|
44
|
+
* @param containerWidth - The table container width in pixels (st-body-container)
|
|
45
|
+
* @param hasPinnedLeft - Whether there is a pinned left section
|
|
46
|
+
* @param hasPinnedRight - Whether there is a pinned right section
|
|
47
|
+
* @returns The maximum percentage (0-1) of container width that each pinned section can occupy
|
|
48
|
+
*/
|
|
49
|
+
export declare const getMaxPinnedSectionPercent: (containerWidth: number, hasPinnedLeft: boolean, hasPinnedRight: boolean) => number;
|
|
50
|
+
/**
|
|
51
|
+
* Calculate the maximum width in pixels for a pinned section
|
|
52
|
+
*
|
|
53
|
+
* @param containerWidth - The table container width in pixels (st-body-container)
|
|
54
|
+
* @param hasPinnedLeft - Whether there is a pinned left section
|
|
55
|
+
* @param hasPinnedRight - Whether there is a pinned right section
|
|
56
|
+
* @returns The maximum width in pixels for a pinned section
|
|
57
|
+
*/
|
|
58
|
+
export declare const getMaxPinnedSectionWidth: (containerWidth: number, hasPinnedLeft: boolean, hasPinnedRight: boolean) => number;
|
|
@@ -9,12 +9,5 @@ export declare const calculateBufferRowCount: (rowHeight: number) => number;
|
|
|
9
9
|
export declare const COLUMN_EDIT_WIDTH = 29.5;
|
|
10
10
|
export declare const TABLE_HEADER_CELL_WIDTH_DEFAULT = 150;
|
|
11
11
|
export declare const PINNED_BORDER_WIDTH = 1;
|
|
12
|
-
export declare const
|
|
13
|
-
export declare const
|
|
14
|
-
/**
|
|
15
|
-
* Get the maximum allowed width percentage for pinned columns based on viewport width
|
|
16
|
-
* This ensures better mobile compatibility by reducing pinned column space on smaller screens
|
|
17
|
-
* @param viewportWidth - The current viewport width in pixels
|
|
18
|
-
* @returns The maximum percentage (0-1) of container width that pinned columns can occupy
|
|
19
|
-
*/
|
|
20
|
-
export declare const getResponsiveMaxPinnedPercent: (viewportWidth: number) => number;
|
|
12
|
+
export declare const CHART_COLUMN_TYPES: string[];
|
|
13
|
+
export declare const OPTIMAL_CHART_COLUMN_WIDTH = 150;
|
|
@@ -36,6 +36,7 @@ interface TableContextType {
|
|
|
36
36
|
columnBorders: boolean;
|
|
37
37
|
columnReordering: boolean;
|
|
38
38
|
columnResizing: boolean;
|
|
39
|
+
containerWidth: number;
|
|
39
40
|
copyHeadersToClipboard: boolean;
|
|
40
41
|
draggedHeaderRef: MutableRefObject<HeaderObject | null>;
|
|
41
42
|
editColumns?: boolean;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { RefObject } from "react";
|
|
2
|
+
import HeaderObject from "../types/HeaderObject";
|
|
3
|
+
interface AutoScaleOptions {
|
|
4
|
+
autoExpandColumns: boolean;
|
|
5
|
+
containerWidth: number;
|
|
6
|
+
pinnedLeftWidth: number;
|
|
7
|
+
pinnedRightWidth: number;
|
|
8
|
+
mainBodyRef: RefObject<HTMLDivElement>;
|
|
9
|
+
isResizing?: boolean;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Pure function that scales headers to fill available width if autoExpandColumns is enabled
|
|
13
|
+
*/
|
|
14
|
+
export declare const applyAutoScaleToHeaders: (headers: HeaderObject[], options: AutoScaleOptions) => HeaderObject[];
|
|
15
|
+
interface UseAutoScaleMainSectionProps {
|
|
16
|
+
autoExpandColumns: boolean;
|
|
17
|
+
containerWidth: number;
|
|
18
|
+
pinnedLeftWidth: number;
|
|
19
|
+
pinnedRightWidth: number;
|
|
20
|
+
mainBodyRef: RefObject<HTMLDivElement>;
|
|
21
|
+
isResizing: boolean;
|
|
22
|
+
setHeaders: React.Dispatch<React.SetStateAction<HeaderObject[]>>;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Hook that wraps setHeaders to automatically apply scaling when headers are updated
|
|
26
|
+
*/
|
|
27
|
+
export declare const useAutoScaleMainSection: ({ autoExpandColumns, containerWidth, pinnedLeftWidth, pinnedRightWidth, mainBodyRef, isResizing, setHeaders, }: UseAutoScaleMainSectionProps) => (headersOrUpdater: HeaderObject[] | ((prev: HeaderObject[]) => HeaderObject[])) => void;
|
|
28
|
+
export {};
|