@infinite-table/infinite-react 0.3.19 → 0.3.22

package/index.css

@@ -1,4 +1,4 @@
-/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAA+1X227iMBB95yss8VKkuiI3aNOXlfZLHNshFsFGtqGwK/597RAa4sQBttuHlYKFEMwZj3PmzHhIpRAa/J4AACHjOeNMU6i2CFM4T8Fc0s17ny0wtpcgTHz20Nr95siavdbYWpdec5KCwGdbGNtA3KU1e62vKQgHnN9SEHn5MGTFXWMuuIaK/TqT2Re5QVSULvrCN5jQx0wDqah9HcbEvQw29sTHYgNZeJhsEEsfmxUkRxtWHlPAeEEl0w4Ei1LIFEzjV7scI8KYmh0umDxfzuPIwVAphbyCzM3LgWRCEiqhRITtVAr2SD51ZTxznRBer6TYcZKCj8L84tg3jMOCslWhDT/z+fbg2EuBCNwgtYaaHnRrO7nK0FOYJM+Xt0mjG75xF3sqS3Rs7bCS6HjTQZgHY/poVeKS1oBr4vqT08C2iBDGVx7yEv/ph7lvWd1NJK3UVSBOSqsFzfbmQ1IEPxjRhRFdl/W2zwV3A1ZYxlr8ThdZni+yQS8suNISMU5Jzw7Og16p1H3MgiLLAaZl2T4DJXYNoHvOTXK7BnzqRMKDJ5XR0PEuzscvOHdcewPM7kEdZmAgHjMJqvqTqc9FRwHXSCWkPsM3SK4YH3IYyHF/In2U1A1rkdvVbYq7Db9AL10m6sq9ilVvhXdSmm75037rg9W1VtdE0L/XcJ2HnbR48n4VsLNV5zAzoETJCJjihV0DZ2d8zxTLSpNSLrjbka+Rj/X6mm9Jz840zynWkOwk0kzwasBRnaupakfXMZU+2pMRpIpO2fbAvYnowVYphtCQuVzejTZZDOK3u+GZaZRBMgT/1DRE5bZA58HvAQcINTLJgzueC7xTlFSjpdtkxcdQkfkLyzoKQtr9sKouV1LWuu0EmuIMJ9h9ngZbi4RTpasK6SlHC+trypldPditYFxbwe1N4SpoxgzDjsJSlGUVAu20eJ+cJi+l7QDP4KW5YOsfqs/UTvYdazrO++O8P87747w/zvvjvD/O++O8P87747w/zvv/xbxPkFxfD/T2uzvKt0IG8yAO3Ny3qtLo7lJ3IYrCyHfR1H0KR3bde3UFWRiEbvgbV1cYhm9R+E1d15OZKIuXSfytCgxjQ68r8uu+/UntafJjQwlD4GkraU6lqitT4YJuqsYi17Mq681fuXsU8KAG7lPBozr4OyX8Oy08poYv6OERRdzWBACnyekPDRuBD6obAAA= */
+/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAA+1X227jIBB9z1cg9aWRShXfktZ9WWm/BAOOUWyIgKTNrvrvC66ztrFxknb7tC6qomTOMPjMmcGTSiE0+L0AAELGc8aZplDtEaZwlYKVpNXLmC0wtscgTHz20Nr95siavdbYWjdec5KCwGdbG9tE3I01e61PKQgnnJ9TEHn5MGTFQ2MuuIaK/fogcyxyi6gpXY+FbzGhj5kWUlP7NI2JRxls7YmPxRay9jDZIjY+NmtIjipWnlLAeEEl0w4Ei1LIFNzFT3Y5RoQxNTucMXm+WcWRg6FSCtmBrMyfA8mEJFRCiQg7qBQckbwfynjpOiG820px4CQFr4X5xbFXjMOCsm2hDT+r1f7NsZcCEVghtYOavunednKbofswSR7O/yaNbvjWXRypLNGpt8NWotNFB2EejOmTVYlLWgtuiBtPTgvbI0IY33rIS/ynn+a+Z3U3kbRWV4E4Ka0WNDuaD0kRfGVEF0Z0Q9b7PmfcBVhhGevxe7fO8nydTXphwZWWiHFKRnZwHrSjUvcxC4osB5iWZf8MlNg1gR45N8ntmvBpEgnfPKmMpo53dj59wXngOhpgeQ3qbQkm4jGToLo/mfpcDxTQRSoh9Qe8QnLL+JTDRI7HE+mjpGlY69yuYVM8VPwMPXeZaCj3OlazFT5IabrlT/ttDNbUWlMTwfhe03UeDtLiyXsn4GCrwWGWQImSEXCH13Y5W+0ZtxX2uR1DFIWRW0JdOONHplhWGpFwwd0e30Xedns0GZT0w5nmOcUakoNEmgkjsMdQDe66ur91Qyp9sgcjSBWDPjAC92Z2BFtrBkLD5WZzNdrIIoifr4ZnpvMGyRT8b5FAVO4L9PEmeYMDhBqZ3MEDzwU+KErqd1W3a4vXqar1V6p1FIT0G2xdrq5GrXU/CHSHM5xg93labKMRTpWuS26kvi1srMtndo1g94JxbfV2NJ1AQfPeYthRWIqyrEOggxYvi/fFY2lbygN4bG/s5of6M7WjwsCazgPEPEDMA8Q8QMwDxDxAzAPEPEDMA8Q8QMwDxP85QBAkd90JwX53Z4NeyGAVxIGb+15RGt1Nlp3T+HBk17V3YZCFQeiGv3AXhmH4HIXf1MY9mYmyeJPE36rAMDb0uiLvXgR/qX1f/KgoYQjc7yXNqVRNZSpc0KpuLHK3rLPezobXKOBGDVynglt18Dkl/Dst3KaGL+jhFkVc1gQA74v3P9F2j39MHAAA */
 :root {
   --infinite-space-0: 0rem;
   --infinite-space-1: 0.125rem;
@@ -50,9 +50,10 @@
   --infinite-cell-border-width: 1px;
   --infinite-cell-padding: var(--infinite-space-2) var(--infinite-space-3);
   --infinite-cell-border: var(--infinite-cell-border-width) solid #c6c6c6;
+  --infinite-pinned-cell-border: var(--infinite-cell-border-width) solid #2a323d;
   --infinite-cell-border-invisible: none;
   --infinite-cell-border-radius: var(--infinite-space-2);
-  --infinite-column-reorder-effect-duration: 0.2s;
+  --infinite-column-reorder-effect-duration: .2s;
   --infinite-active-cell-border-style: dashed;
   --infinite-active-cell-border-width: 1px;
   --infinite-active-cell-border-color--r: 77;
@@ -121,9 +122,10 @@
   --infinite-cell-border-width: 1px;
   --infinite-cell-padding: var(--infinite-space-2) var(--infinite-space-3);
   --infinite-cell-border: var(--infinite-cell-border-width) solid #c6c6c6;
+  --infinite-pinned-cell-border: var(--infinite-cell-border-width) solid #2a323d;
   --infinite-cell-border-invisible: none;
   --infinite-cell-border-radius: var(--infinite-space-2);
-  --infinite-column-reorder-effect-duration: 0.2s;
+  --infinite-column-reorder-effect-duration: .2s;
   --infinite-active-cell-border-style: dashed;
   --infinite-active-cell-border-width: 1px;
   --infinite-active-cell-border-color--r: 77;
@@ -166,7 +168,7 @@
   }
 }
 
-/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/utilities.css.ts.vanilla.css?source=#H4sIAAAAAAAAA5WU3Y6bMBCF7/MU3FRKq3oF+5Pu0ss+SGVggNkYm9omJKn67p2YaJMxaJWIG8T5jrFnxufhd7ZRXYZjmvxdJUlh9sLhEXWT07utwAr69HP1b/XwAeYF1MbC7bysPdib8eTbHei9eyHHXbvJAtgbhx6NzhMLSnrcAYMeI0gWzqjBc+gpgpzHcntgyHOE1LiHihEvgahRqTwpB2tB+19GGcugzRW0k3YtBOoaNXoQsizJIsqT5ysz/Qgm563ZwidrvzLs5tXfpnrLcttYM+gqT1C3YNEzSgbKW6kdNbXLp1cqODxV6/Q7PXzV4k6+jHlrPMHrt7SChqNVQKkMzticWoKahoYRwAg6s7BAw8SbXp87GuwCdlQelyfaaI41U8cU7PMkY0p7pcxsGMQjNaCaO98jMWXqNlZTrqu5zoFuAeCEXiI4YhYRzvSBqdD1Sh7yUAqm/+F6oUy5ZYDlAGqFGsScc4EbHDXKgYLSL1TcB6YFbFqS+UYHptFZvjB5F+QRK9/GzvFamhn309SaPrYdLsLMdAyagnq2zSy9kma+LDsno/emm1kfmTg3Txlnl6qTPV9rc+vLx6CLWpkx3Kih0xzaxJA1IyemGJMKGy0okjq6badMiu5u9jrHKNPAly3nptx6Hyis6wMFG62k/fKSchkNm3VeWh51WfEJDpqnfjYFl9mBnY7dYlVBVJsqYuTgDScgInbosFB8wLP6PItKibKVuoH8EpicnEJrbE/J73pZwum+jFb2HJsSzMPei8uvQSnsHTpC/wMMl29wgQgAAA== */
+/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/utilities.css.ts.vanilla.css?source=#H4sIAAAAAAAAA5WV3XKbMBCF7/MU3HQm7VQZ0zR/9LIP0hFigY1liUrC2On03buWMgmLaBKPbxif74jVLjq6+lXe6l2J06b4c1EUtT0Ij09ouoqeXQNO0F8/Lv5eXL2AVQ2tdfBxXrYB3Ifx4ssZ6Lm1kOOsasoIDtZjQGuqwoGWAffAoG8LSNbe6jFw6HoB+YBqe2TI9wXS4gEaRtxEokWtq0KNzoEJP622jkG3M2gv3aUQaFo0GEBIpcgi1MnzmZnuoskHZ7fwxtr3DPvw6g+p31JtO2dH01QFmh4cBkbJSAUnjaeh7qr0SA2H6+Zy85V+fNX6TF4teWcDwZcPmwY6jjYRpTZ46yoaCRr6aBgBjKA9Cwf0MfGht88TjXYBe2qPrwpjDce6NDENh6oomdLPlMyGUXyiATS583Ehbpi6Xapc1pnM9V2uc8CsAJywawRHhlWEM7/fqdS9V6l/t9IQiQb9oOWxisNg+sj1bEx7rtfaqi0DJg6g0WhA5NwhcqOnT8mDBhVWXnaMTA/Y9STzjTwxjXb6iWddugImbEK/tJblXMutKQKDHTLj9auS21LiaWizWsubmZQbb2eqHIPl6t1zvIdgd9nC90zMl05Z5dYaWMq5llvruZyXpV4Os2i1nWJqjDvDoWYJOTtxIiWP1NgZQbG7o0Q55e4in8o2xyi3Iaiecyl8Hke6kNojhTetZML6kv06Gov1QToe5yW+gYPhN1uZ8sruwaVt99g0sOjNdsHkLdYLYo8ea82PSJnSK0qoMRz/g5kMW6vJPh8MrYXqpemger1hOJnibOpPV6UfpILT8Z2cHDiWEi3AIYjXfYDWOHj0hP4DUOrmI7IJAAA= */
 ._16lm1iw0 {
   box-sizing: border-box;
 }
@@ -244,108 +246,135 @@
   z-index: 10;
 }
 ._16lm1iwk {
-  z-index: 1000;
+  z-index: 100;
 }
 ._16lm1iwl {
-  z-index: 10000;
+  z-index: 1000;
 }
 ._16lm1iwm {
-  z-index: 100000;
+  z-index: 10000;
 }
 ._16lm1iwn {
-  z-index: 1000000;
+  z-index: 100000;
 }
 ._16lm1iwo {
-  z-index: 10000000;
+  z-index: 1000000;
 }
 ._16lm1iwp {
-  display: flex;
+  z-index: 10000000;
 }
 ._16lm1iwq {
-  display: block;
+  z-index: 1000;
 }
 ._16lm1iwr {
-  display: inline-block;
+  z-index: 10000;
 }
 ._16lm1iws {
+  z-index: 100000;
+}
+._16lm1iwt {
+  display: flex;
+}
+._16lm1iwu {
+  display: none;
+}
+._16lm1iwv {
+  display: block;
+}
+._16lm1iww {
+  display: inline-block;
+}
+._16lm1iwx {
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
 }
-._16lm1iwt {
+._16lm1iwy {
   height: 0;
 }
-._16lm1iwu {
+._16lm1iwz {
   height: 100%;
 }
-._16lm1iwv {
+._16lm1iw10 {
   width: 0;
 }
-._16lm1iww {
+._16lm1iw11 {
   width: 100%;
 }
-._16lm1iwx {
+._16lm1iw12 {
   top: 0;
 }
-._16lm1iwy {
+._16lm1iw13 {
   top: 100%;
 }
-._16lm1iwz {
+._16lm1iw14 {
   left: 0;
 }
-._16lm1iw10 {
+._16lm1iw15 {
   left: 100%;
 }
-._16lm1iw11 {
+._16lm1iw16 {
+  left: auto;
+}
+._16lm1iw17 {
   bottom: 0;
 }
-._16lm1iw12 {
+._16lm1iw18 {
   bottom: 100%;
 }
-._16lm1iw13 {
+._16lm1iw19 {
   right: 0;
 }
-._16lm1iw14 {
+._16lm1iw1a {
   right: 100%;
 }
-._16lm1iw15 {
+._16lm1iw1b {
+  right: auto;
+}
+._16lm1iw1c {
   flex-flow: column;
 }
-._16lm1iw16 {
+._16lm1iw1d {
   flex-flow: row;
 }
-._16lm1iw17 {
+._16lm1iw1e {
   align-items: center;
 }
-._16lm1iw18 {
+._16lm1iw1f {
   align-items: stretch;
 }
-._16lm1iw19 {
+._16lm1iw1g {
   justify-content: center;
 }
-._16lm1iw1a {
+._16lm1iw1h {
   justify-content: flex-start;
 }
-._16lm1iw1b {
+._16lm1iw1i {
   justify-content: flex-end;
 }
-._16lm1iw1c {
+._16lm1iw1j {
   overflow: hidden;
 }
-._16lm1iw1d {
+._16lm1iw1k {
   overflow: auto;
 }
-._16lm1iw1e {
+._16lm1iw1l {
   overflow: visible;
 }
-._16lm1iw1f {
+._16lm1iw1m {
+  visibility: visible;
+}
+._16lm1iw1n {
+  visibility: hidden;
+}
+._16lm1iw1o {
   will-change: transform;
 }
-._16lm1iw1g {
+._16lm1iw1p {
   white-space: nowrap;
 }
-._16lm1iw1h {
+._16lm1iw1q {
   text-overflow: ellipsis;
 }
 
@@ -448,7 +477,7 @@
   display: none;
 }
 
-/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/InfiniteCls.css.ts.vanilla.css?source=Ll8xeWV1YjJ2MCB7CiAgb3V0bGluZTogbm9uZTsKICBmb250LWZhbWlseTogdmFyKC0taW5maW5pdGUtZm9udC1mYW1pbHkpOwogIGNvbG9yOiB2YXIoLS1pbmZpbml0ZS1jb2xvcik7CiAgYmFja2dyb3VuZDogdmFyKC0taW5maW5pdGUtYmFja2dyb3VuZCk7CiAgbWluLWhlaWdodDogdmFyKC0taW5maW5pdGUtbWluLWhlaWdodCk7Cn0KLl8xeWV1YjJ2MSB7CiAgLS1pbmZpbml0ZS1yb3ctcG9pbnRlci1ldmVudHMtd2hpbGUtc2Nyb2xsaW5nOiBub25lOwp9Ci5fMXlldWIydmUgewogIC0taW5maW5pdGUtYWN0aXZlLWNlbGwtYmFja2dyb3VuZC1hbHBoYTogdmFyKC0taW5maW5pdGUtYWN0aXZlLWNlbGwtYmFja2dyb3VuZC1hbHBoYS0tdGFibGUtdW5mb2N1c2VkKTsKICAtLWluZmluaXRlLWFjdGl2ZS1yb3ctYmFja2dyb3VuZC1hbHBoYTogdmFyKC0taW5maW5pdGUtYWN0aXZlLXJvdy1iYWNrZ3JvdW5kLWFscGhhLS10YWJsZS11bmZvY3VzZWQsIHZhcigtLWluZmluaXRlLWFjdGl2ZS1jZWxsLWJhY2tncm91bmQtYWxwaGEtLXRhYmxlLXVuZm9jdXNlZCkpOwp9Ci5fMXlldWIydmkgewogIGJvcmRlci1yaWdodDogdmFyKC0taW5maW5pdGUtY2VsbC1ib3JkZXIpOwp9Ci5fMXlldWIydmogewogIGJvcmRlci1sZWZ0OiB2YXIoLS1pbmZpbml0ZS1jZWxsLWJvcmRlcik7Cn0KLl8xeWV1YjJ2bCB7CiAgdXNlci1zZWxlY3Q6IG5vbmU7Cn0= */
+/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/InfiniteCls.css.ts.vanilla.css?source=#H4sIAAAAAAAAA6WTTW6DMBCF9z2FN5USKY6gXTU9TGTMGKYdxtQY0qjq3QtGKOZHUatukOX53sx7tjme0yu02VOXiK8HIWzrCRlOgi3Da79hLHtpVIV0PYlOuZ2UyAYZPcioth9Ybcm6FRV2Qz1T+r1wtuV8Bd1KgayQZQlYlH5F3ko9+f1wnPynwX8EOnuRtUX24CR0wL6RlxIJZKOdpT5lMaWMusCyi9Ieuz4EEEUmpaK6VCtv92Apvcr66S0bq9sGxqBr8WD7t4O22NWcw/9czk8Zw/lk1uX9qbrNCxr7BmKufYu1BOYPUgrS3o+TDRBov3F1dWC8U9wY66rTuCTl4TnfyTRJHg8iqT/DZ3yO91LUyAz5wtGg8d5WE31OG+qK9qWau/0ITuKEE2jmIIuFpsMGMyT0w882rGme0UWdtSK9W/Qv92I+wYqFdnvCD2Sb7IMGBAAA */
 ._1yeub2v0 {
   outline: none;
   font-family: var(--infinite-font-family);
@@ -475,8 +504,25 @@
   -ms-user-select: none;
   user-select: none;
 }
+._1yeub2vp {
+  transform: translate3d(-100%, 0px, 0px);
+  border-right: var(--infinite-pinned-cell-border);
+  bottom: var(--_1slvgu9m);
+}
+._1yeub2vq {
+  left: var(--_1slvgu9f);
+}
+._1yeub2vn ._1yeub2vq {
+  visibility: visible;
+}
+._1yeub2vr {
+  left: calc(var(--_1slvgu9h));
+}
+._1yeub2vo ._1yeub2vr {
+  visibility: visible;
+}
 
-/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/components/cell.css.ts.vanilla.css?source=#H4sIAAAAAAAAA6VTy07DMBC89yt8pAdXffCQwscgJ163BsdbrddpK8S/kzgFYlIopZfI0c7Mzuzas6cFwL5aqrl4nQjxHANbc5AVegbPhajaL9Dj5G0y+0AuTiONg70MrIgz9PI8WvR/xuGuEIQ7SdAABch0VkmHSflg2aIvhAPDYjWf1yED3o6AHn2udZcgW6W19etCNIpupLTeWG8ZZAXOyWNx2rkrkTSQ7PqdBh8BO6t5MxUBndW9ga2iNu1Ag+x681+RFOAAsVw2TnxmuR/FTWeDVI/aoIu1b6fbdwJjoGKpI6mOOM1G9JBkWwbSabuplHN04pSqelkTRq9HxG63X+WcDH8ho9Y/CpheoM/GuE37kqS0jeHXifeQ4aZLZMb6coGBm813N2nzV9m5XGHgJw79nL2FObcZcs+9go76Dg2hnZhVBAAA */
+/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/components/cell.css.ts.vanilla.css?source=Ll8xZWV4YzJhMCB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLl8xZWV4YzJhMSB7CiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0Owp9Ci5fMWVleGMyYTIgewogIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDsKICBmbGV4LWZsb3c6IHJvdy1yZXZlcnNlOwp9Ci5fMWVleGMyYTMgewogIHRyYW5zaXRpb246IGxlZnQgMzAwbXM7Cn0KLl8xZWV4YzJhNCB7CiAgdHJhbnNpdGlvbjogbm9uZTsKfQouXzFlZXhjMmE1IHsKICBwYWRkaW5nOiB2YXIoLS1pbmZpbml0ZS1jZWxsLXBhZGRpbmcpOwogIGJvcmRlci1sZWZ0OiB2YXIoLS1pbmZpbml0ZS1jZWxsLWJvcmRlci13aWR0aCkgc29saWQgdHJhbnNwYXJlbnQ7CiAgYm9yZGVyLXJpZ2h0OiB2YXIoLS1pbmZpbml0ZS1jZWxsLWJvcmRlci13aWR0aCkgc29saWQgdHJhbnNwYXJlbnQ7Cn0KLl8xeWV1YjJ2bCAuXzFlZXhjMmE2IHsKICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gdmFyKC0taW5maW5pdGUtY29sdW1uLXJlb3JkZXItZWZmZWN0LWR1cmF0aW9uKTsKfQouXzFlZXhjMmE3IHsKICBjb2xvcjogdmFyKC0taW5maW5pdGUtY2VsbC1jb2xvcik7Cn0KLl8xZWV4YzJhZCB7CiAgYmFja2dyb3VuZDogdmFyKC0taW5maW5pdGUtcm93LWJhY2tncm91bmQpOwp9Ci5fMWVleGMyYWUgewogIGJhY2tncm91bmQ6IHZhcigtLWluZmluaXRlLXJvdy1vZGQtYmFja2dyb3VuZCk7Cn0KLl8xZWV4YzJhZiB7CiAgYm9yZGVyLXRvcC1sZWZ0LXJhZGl1czogdmFyKC0taW5maW5pdGUtY2VsbC1ib3JkZXItcmFkaXVzKTsKICBib3JkZXItYm90dG9tLWxlZnQtcmFkaXVzOiB2YXIoLS1pbmZpbml0ZS1jZWxsLWJvcmRlci1yYWRpdXMpOwp9Ci5fMWVleGMyYWggewogIGJvcmRlci10b3AtcmlnaHQtcmFkaXVzOiB2YXIoLS1pbmZpbml0ZS1jZWxsLWJvcmRlci1yYWRpdXMpOwogIGJvcmRlci1ib3R0b20tcmlnaHQtcmFkaXVzOiB2YXIoLS1pbmZpbml0ZS1jZWxsLWJvcmRlci1yYWRpdXMpOwp9 */
 ._1eexc2a0 {
   justify-content: center;
 }
@@ -518,14 +564,8 @@
   border-top-right-radius: var(--infinite-cell-border-radius);
   border-bottom-right-radius: var(--infinite-cell-border-radius);
 }
-._1eexc2au {
-  border-right: var(--infinite-cell-border);
-}
-._1eexc2av {
-  border-left: var(--infinite-cell-border);
-}
 
-/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/components/InfiniteTableHeader/header.css.ts.vanilla.css?source=#H4sIAAAAAAAAA61Uy26DMBC85yt8qVQOjoA+RT6mMtjAqq6NjEPSVP33YpskhpI0QI8sO+PZ2cf6LYoPuUyjCH2tEPogqgCBOct1ghqi7jEGkYMAzXDJCGUKZ4xzXEulMWRSYIcINqvv1frIFf8j14PPpaAol5A9WjIOwoAcV7hpI7kUGtdwYAmKwmpvQqlUhlQRCts6QU/hnYlWhFIQRZvmsipZgwYpEkTSWvKtZiaqFRHHuJYVCtdxbeOy6h7sCokNi6fvyepLSfZeKLkV9FKp54xglDd0FWgtP+yH98TzvCcyyaW66Lz52Xc6tc+c7VGMEw2NtUc2TOVc7hJUAqVM9ICZBR7aNyjbm3b0/jKnvuvN6DTYMXAZfUm5jx2dyovQ4kbTLEFp6rvNP5t/dK81piIZ6M+2ZevX3rSNwbqfgZfYVRV3I3wyMQ7Dvo3lFCvwDqguA9TON1A32xVRTOjNtFbcbODAupMLgxoSa/TCzniElW9Ku1LWmNMBuOKPSwk8O9zqTSfw1KihGmvxIjnTGTw9h6t72V3WSYuJWvQn26ZxQ9CQaBx2VTSIBmpIOevrPt7UOWvfHcuFYubeq+jF3dALR8Af7PMt8PFkzqn3CdKrAn5dod60/X0M5pmSDfbiL+gPDqFcrOEIAAA= */
+/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/components/InfiniteTableHeader/header.css.ts.vanilla.css?source=#H4sIAAAAAAAAA7VUwW6DMAy99ytymTQOQcDWaaIfMwUIYJUmKATWdtq/DxLaGkZb2m5HHPv5+fkZ98MP9qmMfJ98LQjZMJWBoAVPdUgapp4pBZGCAM1pzlnCFY15UdBKKk0hloLaCme1+F64B6zgD7FeMJaCLH8E7NWAFSC6IovlrdpIKoWmFex5SHyv3HahSKoOVLEE6iokS++pi5YsSUBkbZrNKmUFGqQICYsqWdSad1GtmDjEtSyJ5waVicuyb9gPEnQoiN/S8ItYvM6UrEVybtRThjOJ69kJtJYb84FavN3XIpaFVGeV7x6HSnPTZt+mJnzbqTp4Xc8kYVaay2YuH5N/YEOILFkMetdK4L4PtjdV1j86KLH3btBb4jhN4HnDeQo7j7XMpOFNiz7hExKdO6T1CyTWKyVTXGhsu0mjIxBDc6aAI+mOKoxmCI3QD24GAWosSmtRI8zxoC7oY1McJIe18u0AiE0zZmMkfojO7QiIT/9jG10Iad93vI6ChpFT6rtJnQa/2BhEAxVEBR/1ZliMOV7DxZEpPndL2B+nk8L1/J4/EAZILxL4dcyDpV2/qf8+QDxJNjLltS38ALFNgMmuBwAA */
 ._12zfob11 {
   margin-left: var(--infinite-header-cell-sort-icon-margin);
 }
@@ -555,20 +595,10 @@
   background: var(--infinite-header-background);
   color: var(--infinite-header-color);
 }
-._12zfob1b {
-  position: relative;
-  overflow: hidden;
-}
-._12zfob1c {
-  z-index: 10;
-}
 ._12zfob1e {
-  border-right: var(--infinite-cell-border);
-}
-._12zfob1f {
-  border-left: var(--infinite-cell-border);
+  z-index: 10;
 }
-._12zfob1g {
+._12zfob1k {
   background: var(--infinite-header-cell-hover-background);
   color: var(--infinite-cell-color);
   opacity: 0.8;
@@ -576,71 +606,76 @@
   padding-left: 20px;
   z-index: 2000;
 }
-._12zfob1h {
+._12zfob1l {
   border-left: var(--infinite-cell-border-width) solid transparent;
   border-right: var(--infinite-cell-border);
   background: var(--infinite-header-cell-background);
   padding: 0;
 }
-._12zfob1h:hover {
+._12zfob1l:hover {
   background: var(--infinite-header-cell-hover-background);
 }
-._12zfob1p {
+._12zfob1t {
   border-top-left-radius: var(--infinite-cell-border-radius);
   border-bottom-left-radius: var(--infinite-cell-border-radius);
 }
-._12zfob1r {
+._12zfob1v {
   border-top-right-radius: var(--infinite-cell-border-radius);
   border-bottom-right-radius: var(--infinite-cell-border-radius);
 }
-._12zfob1z {
+._12zfob113 {
   z-index: 10;
 }
-._12zfob114 {
-  border-right: var(--infinite-cell-border);
-}
-._1yeub2va ._12zfob114 {
+._1yeub2va ._12zfob118 {
   --infinite-cell-border: var(--infinite-cell-border-invisible);
 }
-._12zfob115 {
-  border-left: var(--infinite-cell-border);
-}
-._12zfob116 {
-  --infinite-cell-border: var(--infinite-cell-border-invisible);
+._12zfob11a {
   border-right: var(--infinite-cell-border);
 }
-._12zfob117 {
+._12zfob11b {
   padding: var(--infinite-header-cell-padding);
 }
-._12zfob11a {
+._12zfob11e {
   background: var(--infinite-header-background);
 }
-._12zfob11b {
+._12zfob11f {
   padding: var(--infinite-cell-padding);
   border-bottom: var(--infinite-cell-border);
   border-right: var(--infinite-cell-border);
+  background: var(--infinite-header-cell-background);
 }
-._12zfob11c {
+._12zfob11g {
   border-top: var(--infinite-cell-border);
 }
 
-/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/ResizeHandle.css.ts.vanilla.css?source=LnpuZXl6aDAgewogIHRyYW5zZm9ybTogdHJhbnNsYXRlWCg1MCUpOwogIHdpZHRoOiB2YXIoLS1pbmZpbml0ZS1yZXNpemUtaGFuZGxlLWFjdGl2ZS1hcmVhLXdpZHRoKTsKICBvdmVyZmxvdzogaGlkZGVuOwp9Ci56bmV5emgwOmhvdmVyIHsKICBvdmVyZmxvdzogdmlzaWJsZTsKfQouem5leXpoMSB7CiAgcmlnaHQ6IGNhbGMoKHZhcigtLWluZmluaXRlLXJlc2l6ZS1oYW5kbGUtYWN0aXZlLWFyZWEtd2lkdGgpIC0gdmFyKC0taW5maW5pdGUtcmVzaXplLWhhbmRsZS13aWR0aCkpIC8gMik7CiAgd2lkdGg6IHZhcigtLWluZmluaXRlLXJlc2l6ZS1oYW5kbGUtd2lkdGgpOwp9Ci56bmV5emgwOmhvdmVyIC56bmV5emgxIHsKICBiYWNrZ3JvdW5kOiB2YXIoLS1pbmZpbml0ZS1yZXNpemUtaGFuZGxlLWhvdmVyLWJhY2tncm91bmQpOwp9Ci56bmV5emgwOmhvdmVyIC56bmV5emgzIHsKICBiYWNrZ3JvdW5kOiB2YXIoLS1pbmZpbml0ZS1yZXNpemUtaGFuZGxlLWNvbnN0cmFpbmVkLWhvdmVyLWJhY2tncm91bmQpOwp9 */
+/* vanilla-extract-css-ns:@infinite-table/infinite-react/src/components/InfiniteTable/components/InfiniteTableHeader/ResizeHandle/ResizeHandle.css.ts.vanilla.css?source=LnpuZXl6aDAgewogIHRyYW5zZm9ybTogdHJhbnNsYXRlWCg1MCUpOwogIHdpZHRoOiB2YXIoLS1pbmZpbml0ZS1yZXNpemUtaGFuZGxlLWFjdGl2ZS1hcmVhLXdpZHRoKTsKfQouem5leXpoMDpob3ZlciB7CiAgb3ZlcmZsb3c6IHZpc2libGU7Cn0KLnpuZXl6aDIgewogIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTsKfQouem5leXpoOCB7CiAgdHJhbnNmb3JtOiBub25lOwp9Ci56bmV5emg5IHsKICB0cmFuc2Zvcm06IG5vbmU7Cn0KLnpuZXl6aGEgewogIHRyYW5zZm9ybTogbm9uZTsKfQouem5leXpoYiB7CiAgcmlnaHQ6IGNhbGMoKHZhcigtLWluZmluaXRlLXJlc2l6ZS1oYW5kbGUtYWN0aXZlLWFyZWEtd2lkdGgpIC0gdmFyKC0taW5maW5pdGUtcmVzaXplLWhhbmRsZS13aWR0aCkpIC8gMik7CiAgd2lkdGg6IHZhcigtLWluZmluaXRlLXJlc2l6ZS1oYW5kbGUtd2lkdGgpOwp9Ci56bmV5emgwOmhvdmVyIC56bmV5emhiIHsKICBiYWNrZ3JvdW5kOiB2YXIoLS1pbmZpbml0ZS1yZXNpemUtaGFuZGxlLWhvdmVyLWJhY2tncm91bmQpOwp9Ci56bmV5emgwOmhvdmVyIC56bmV5emhkIHsKICBiYWNrZ3JvdW5kOiB2YXIoLS1pbmZpbml0ZS1yZXNpemUtaGFuZGxlLWNvbnN0cmFpbmVkLWhvdmVyLWJhY2tncm91bmQpOwp9 */
 .zneyzh0 {
   transform: translateX(50%);
   width: var(--infinite-resize-handle-active-area-width);
-  overflow: hidden;
 }
 .zneyzh0:hover {
   overflow: visible;
 }
-.zneyzh1 {
+.zneyzh2 {
+  transform: translateX(-50%);
+}
+.zneyzh8 {
+  transform: none;
+}
+.zneyzh9 {
+  transform: none;
+}
+.zneyzha {
+  transform: none;
+}
+.zneyzhb {
   right: calc((var(--infinite-resize-handle-active-area-width) - var(--infinite-resize-handle-width)) / 2);
   width: var(--infinite-resize-handle-width);
 }
-.zneyzh0:hover .zneyzh1 {
+.zneyzh0:hover .zneyzhb {
   background: var(--infinite-resize-handle-hover-background);
 }
-.zneyzh0:hover .zneyzh3 {
+.zneyzh0:hover .zneyzhd {
   background: var(--infinite-resize-handle-constrained-hover-background);
 }
 

package/index.d.ts

@@ -253,7 +253,9 @@ declare class MatrixBrain extends Logger {
      * The indexes in the returned array are the absolute indexes of the cols, so the returned array is an array with holes
      *
      */
-    getFixedEndColsOffsets: () => number[];
+    getFixedEndColsOffsets: ({ skipScroll }?: {
+        skipScroll: boolean;
+    }) => number[];
     /**
      * Returns an array of offsets for all rows fixed at the end
      *
@@ -264,7 +266,9 @@ declare class MatrixBrain extends Logger {
      * The indexes in the returned array are the absolute indexes of the rows, so the returned array is an array with holes
      *
      */
-    getFixedEndRowsOffsets: () => number[];
+    getFixedEndRowsOffsets: ({ skipScroll }?: {
+        skipScroll: boolean;
+    }) => number[];
     getFixedStartColsWidth: () => number;
     getFixedEndRowsHeight: () => number;
     getFixedStartRowsHeight: () => number;
@@ -273,8 +277,8 @@ declare class MatrixBrain extends Logger {
         vertical: number;
     };
     setRenderCount: ({ horizontal, vertical, }: {
-        horizontal: number;
-        vertical: number;
+        horizontal: number | undefined;
+        vertical: number | undefined;
     }) => void;
     private notifyRenderCountChange;
     updateFixedCells: (config: {
@@ -395,7 +399,13 @@ declare class ReactHeadlessTableRenderer extends Logger {
     private onDestroy;
     private hoverRowUpdatesInProgress;
     private infiniteNode;
-    setTransform: (element: HTMLElement, _rowIndex: number, colIndex: number, x: number, y: number, zIndex: number | 'auto' | undefined | null) => void;
+    private getInfiniteNode;
+    setTransform: (element: HTMLElement, _rowIndex: number, colIndex: number, { x, y, scrollLeft, scrollTop, }: {
+        x: number;
+        y: number;
+        scrollLeft?: boolean | undefined;
+        scrollTop?: boolean | undefined;
+    }, zIndex: number | 'auto' | undefined | null) => void;
     constructor(brain: MatrixBrain);
     getFullyVisibleRowsRange: () => {
         start: number;
@@ -502,7 +512,7 @@ interface InfiniteTableSetupState<T> {
     headerBrain: MatrixBrain;
     focused: boolean;
     ready: boolean;
-    columnReorderInProgress: boolean;
+    columnReorderDragColumnId: false | string;
     focusedWithin: boolean;
     scrollPosition: ScrollPosition;
     pinnedStartScrollListener: ScrollListener;
@@ -518,6 +528,7 @@ interface InfiniteTableMappedState<T> {
     groupColumn: InfiniteTableProps<T>['groupColumn'];
     headerOptions: NonUndefined<InfiniteTableProps<T>['headerOptions']>;
     onScrollbarsChange: InfiniteTableProps<T>['onScrollbarsChange'];
+    columnPinning: InfiniteTablePropColumnPinning;
     loadingText: InfiniteTableProps<T>['loadingText'];
     components: InfiniteTableProps<T>['components'];
     columns: InfiniteTablePropColumnsMap<T>;
@@ -565,7 +576,6 @@ interface InfiniteTableMappedState<T> {
     columnHeaderHeight: number;
     licenseKey: NonUndefined<InfiniteTableProps<T>['licenseKey']>;
     columnVisibility: InfiniteTablePropColumnVisibility;
-    columnPinning: InfiniteTablePropColumnPinningMap;
     columnSizing: InfiniteTablePropColumnSizing;
     columnTypes: InfiniteTablePropColumnTypes<T>;
     columnGroups: InfiniteTablePropColumnGroupsMap;
@@ -597,10 +607,8 @@ declare type LoadMaskProps = {
 declare type InfiniteTablePropColumnOrderNormalized = string[];
 declare type InfiniteTablePropColumnOrder = InfiniteTablePropColumnOrderNormalized | true;
 declare type InfiniteTablePropColumnVisibility = Record<string, false>;
-declare type InfiniteTablePropColumnPinningMap = Map<string, true | 'start' | 'end'>;
 declare type InfiniteTableColumnPinnedValues = false | 'start' | 'end';
-declare type InfiniteTablePropColumnPinningRecord = Record<string, true | 'start' | 'end'>;
-declare type InfiniteTablePropColumnPinning = InfiniteTablePropColumnPinningRecord | InfiniteTablePropColumnPinningMap;
+declare type InfiniteTablePropColumnPinning = Record<string, true | 'start' | 'end'>;
 declare type InfiniteTableRowStyleFnParams<T> = {
     rowIndex: number;
 } & InfiniteTableRowInfoDataDiscriminator<T>;
@@ -640,6 +648,8 @@ declare type InfiniteTableColumnType<T> = {
     valueGetter?: InfiniteTableColumn<T>['valueGetter'];
     valueFormatter?: InfiniteTableColumn<T>['valueFormatter'];
     style?: InfiniteTableColumn<T>['style'];
+    headerStyle?: InfiniteTableColumn<T>['headerStyle'];
+    headerClassName?: InfiniteTableColumn<T>['headerClassName'];
 };
 declare type InfiniteTablePropColumnTypes<T> = Record<'default' | string, InfiniteTableColumnType<T>>;
 declare type InfiniteTableColumnSizingOptions = {
@@ -653,6 +663,10 @@ declare type InfiniteTableImperativeApi<T> = {
     setColumnOrder: (columnOrder: InfiniteTablePropColumnOrder) => void;
     setColumnVisibility: (columnVisibility: InfiniteTablePropColumnVisibility) => void;
     x?: T;
+    get scrollLeft(): number;
+    set scrollLeft(value: number);
+    get scrollTop(): number;
+    set scrollTop(value: number);
     scrollRowIntoView: (rowIndex: number, config?: {
         scrollAdjustPosition?: ScrollAdjustPosition;
         offset?: number;
@@ -805,7 +819,7 @@ interface InfiniteTableProps<T> {
     scrollToBottomOffset?: number;
     defaultColumnOrder?: InfiniteTablePropColumnOrder;
     columnOrder?: InfiniteTablePropColumnOrder;
-    onColumnOrderChange?: (columnOrder: InfiniteTablePropColumnOrder) => void;
+    onColumnOrderChange?: (columnOrder: InfiniteTablePropColumnOrderNormalized) => void;
     onRowHeightChange?: (rowHeight: number) => void;
     filterEditors?: InfiniteTablePropFilterEditors<T>;
     onReady?: (api: InfiniteTableImperativeApi<T>) => void;
@@ -859,6 +873,7 @@ interface InfiniteTableComputedValues<T> {
 }
 
 interface InfiniteTableContextValue<T> {
+    imperativeApi: InfiniteTableImperativeApi<T>;
     componentState: InfiniteTableState<T>;
     componentActions: InfiniteTableActions<T>;
     computed: InfiniteTableComputedValues<T>;
@@ -899,6 +914,7 @@ declare type InfiniteTableToggleGroupRowFn = (groupKeys: any[]) => void;
 declare type InfiniteTableColumnHeaderParams<DATA_TYPE, COL_TYPE = InfiniteTableComputedColumn<DATA_TYPE>> = {
     domRef: InfiniteTableCellProps<DATA_TYPE>['domRef'];
     sortTool: JSX.Element | null;
+    dragging: boolean;
     column: COL_TYPE;
     columnSortInfo: DataSourceSingleSortInfo<DATA_TYPE> | null;
     columnFilterValue: DataSourceFilterValueItem<DATA_TYPE> | null;
@@ -936,7 +952,7 @@ declare type InfiniteTableColumnRowspanParam<DATA_TYPE, COL_TYPE = InfiniteTable
 };
 declare type InfiniteTableColumnRenderFunction<DATA_TYPE, COL_TYPE = InfiniteTableComputedColumn<DATA_TYPE>> = (renderParams: InfiniteTableColumnRenderParam<DATA_TYPE, COL_TYPE>) => Renderable | null;
 declare type InfiniteTableGroupColumnRenderIconFunction<DATA_TYPE, COL_TYPE = InfiniteTableComputedColumn<DATA_TYPE>> = (param: InfiniteTableGroupColumnRenderIconParam<DATA_TYPE, COL_TYPE>) => Renderable | null;
-declare type InfiniteTableColumnHeaderRenderFunction<T> = ({ columnSortInfo, column, }: InfiniteTableColumnHeaderParams<T>) => Renderable;
+declare type InfiniteTableColumnHeaderRenderFunction<T> = (headerParams: InfiniteTableColumnHeaderParams<T>) => Renderable;
 declare type InfiniteTableColumnAlign = 'start' | 'center' | 'end';
 declare type InfiniteTableColumnVerticalAlign = 'start' | 'center' | 'end';
 declare type InfiniteTableColumnHeader<T> = Renderable | InfiniteTableColumnHeaderRenderFunction<T>;
@@ -957,9 +973,13 @@ declare type InfiniteTableColumnStyleFnParams<T> = {
     column: InfiniteTableColumn<T>;
 } & InfiniteTableRowInfoDataDiscriminator<T>;
 declare type InfiniteTableColumnStyleFn<T> = (params: InfiniteTableColumnStyleFnParams<T>) => undefined | React.CSSProperties;
+declare type InfiniteTableColumnHeaderClassNameFn<T> = (params: InfiniteTableColumnHeaderParams<T>) => undefined | string;
+declare type InfiniteTableColumnHeaderStyleFn<T> = (params: InfiniteTableColumnHeaderParams<T>) => undefined | React.CSSProperties;
 declare type InfiniteTableColumnClassNameFn<T> = (params: InfiniteTableColumnStyleFnParams<T>) => undefined | string;
 declare type InfiniteTableColumnStyle<T> = CSSProperties | InfiniteTableColumnStyleFn<T>;
+declare type InfiniteTableColumnHeaderStyle<T> = CSSProperties | InfiniteTableColumnHeaderStyleFn<T>;
 declare type InfiniteTableColumnClassName<T> = string | InfiniteTableColumnClassNameFn<T>;
+declare type InfiniteTableColumnHeaderClassName<T> = string | InfiniteTableColumnHeaderClassNameFn<T>;
 declare type InfiniteTableColumnValueGetterParams<T> = {
     data: T;
     field?: keyof T;
@@ -989,6 +1009,8 @@ declare type InfiniteTableBaseColumn<T> = {
     sortType?: string;
     filterType?: string;
     style?: InfiniteTableColumnStyle<T>;
+    headerStyle?: InfiniteTableColumnHeaderStyle<T>;
+    headerClassName?: InfiniteTableColumnHeaderClassName<T>;
     className?: InfiniteTableColumnClassName<T>;
     rowspan?: InfiniteTableColumnRowspanFn<T>;
     valueGetter?: InfiniteTableColumnValueGetter<T>;