@mendylanda/ui 0.3.0-alpha.1 → 0.3.0-alpha.3

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.
@@ -1 +1 @@
1
- export const originalClassNames = {"mui-cb20bd519346":"pointer-events-auto","mui-33228ff7d583":"pointer-events-none","mui-b75af7ef6c4d":"invisible","mui-d42ef1497900":"visible","mui-32fb090591d9":"sr-only","mui-747355bdc2a2":"absolute","mui-d2d9e1f13413":"relative","mui-964a9431ff49":"sticky","mui-ce13093ad8c9":"inset-0","mui-3ba24c062d55":"inset-x-0","mui-eb9e48c5dda9":"inset-y-0","mui-cced28c6dc3f":"start","mui-207bd0b3f259":"start-2","mui-cea70f23972e":"start-3","mui-361e48d0308f":"end","mui-13422ddc8d83":"end-1","mui-585f4729f611":"end-9","mui-98599e4ee250":"top-0","mui-4e45f4841abb":"top-1/2","mui-a74c4477017c":"right-0","mui-30150dd033ab":"bottom-0","mui-a5c36273c0f0":"bottom-2","mui-635702706586":"left-0","mui-014aadadffad":"isolate","mui-418e44ad4f9e":"z-10","mui-4e8f0a87a0dc":"z-20","mui-fbb62f5cb6fe":"z-30","mui-3eef1ce97dba":"z-50","mui-a42d519714d6":"container","mui-a2526bc2efa3":"m-0","mui-abba77319850":"-mx-1","mui-1752f11474a6":"mx-auto","mui-d8747231f142":"my-1","mui-958e2cfcf5b6":"-ms-2","mui-291952c2525a":"-ms-px","mui-8cc46fa87f41":"-me-1.5","mui-f28fea81a5cd":"mt-2","mui-cc51bda60e7e":"ml-auto","mui-496aca80e4d8":"block","mui-d1b2a59fbea7":"contents","mui-222f930b8752":"flex","mui-0f2a693e93e2":"grid","mui-e564b4081d7a":"hidden","mui-995cf20a9c45":"inline","mui-123306850fe1":"inline-flex","mui-0d4fc4a78d37":"table","mui-3da89b3ed14b":"field-sizing-content","mui-129d6f9b1e07":"aspect-square","mui-f7d12b41bceb":"size-(--cell-size)","mui-dc797fcc7165":"size-1.5","mui-5e34f5313859":"size-3","mui-61c000c8a98a":"size-3.5","mui-100c22d5776b":"size-4","mui-0712570dcc9f":"size-6","mui-79ede756e761":"size-7","mui-ebd37e04d422":"size-8","mui-3ee10ef4c057":"size-9","mui-d0a383a9c24f":"size-10","mui-4dad94bd15e3":"size-auto","mui-a5960ac1d283":"h-(--cell-size)","mui-c7d5500b77ab":"h-0","mui-2edce89ef182":"h-3","mui-099be97e1fa4":"h-4","mui-ce1945804664":"h-6","mui-1fb07b38c63b":"h-8","mui-539ae144f076":"h-9","mui-fdd2f85cad6b":"h-10","mui-a66e9985b093":"h-auto","mui-57c930dc1c31":"h-full","mui-ae2c4b060bb9":"h-px","mui-571ea69568d3":"max-h-(--filter-menu-height)","mui-1f061e70178e":"max-h-(--radix-dropdown-menu-content-available-height)","mui-b057efba3283":"max-h-96","mui-80baa5d03af7":"max-h-[calc(var(--filter-menu-height)-2px)]","mui-1326520533f0":"max-h-[min(6rem,calc(var(--filter-menu-height)*0.25))]","mui-fb4a3e97b5bd":"max-h-[min(20rem,var(--radix-dropdown-menu-content-available-height,20rem))]","mui-dcd942c18ddc":"max-h-[var(--radix-dropdown-menu-content-available-height)]","mui-410da8dfa8ac":"min-h-0","mui-9974acedf3f7":"min-h-9","mui-8423dc94ee06":"min-h-10","mui-50312c3ce4a3":"min-h-[60px]","mui-d48fe95d4da8":"w-(--cell-size)","mui-d4ea834145ae":"w-2","mui-56bb14cbd1fe":"w-2/3","mui-8867d85ed290":"w-8","mui-4ac4ec8dfbce":"w-40","mui-72b37c1a040d":"w-64","mui-37535002f0f7":"w-72","mui-fc6a57ff7553":"w-[var(--mendy-filter-editor-width,19rem)]","mui-0b9c84552e40":"w-[var(--mendy-filter-list-width,var(--mendy-filter-anchor-width,18.75rem))]","mui-4415137b0467":"w-[var(--mendy-filter-menu-width,calc(var(--filter-list-width)_+_var(--mendy-filter-editor-width,19rem)))]","mui-8cfb5a42ef9f":"w-fit","mui-58d0413dd93c":"w-full","mui-91f82aa1df0c":"max-w-[60%]","mui-34055e6f8c1b":"max-w-[calc(100vw-2rem)]","mui-81b198a2db84":"max-w-full","mui-1458e495e3ae":"min-w-(--cell-size)","mui-184ddc11e5f9":"min-w-0","mui-e9ab1547c94d":"min-w-[8rem]","mui-2bf6510f1330":"min-w-full","mui-7bd5bab6d7f4":"flex-1","mui-66b490dd6005":"shrink","mui-27ead27a81df":"shrink-0","mui-215061302c50":"border-collapse","mui-3a3774477287":"origin-(--radix-dropdown-menu-content-transform-origin)","mui-5dde0fd996f0":"-translate-y-1/2","mui-aa214ea38326":"transform","mui-393df0d154e0":"animate-none!","mui-7b3cd77eb999":"animate-pulse","mui-2194d094b585":"cursor-col-resize","mui-d343f41ba73e":"cursor-default","mui-739a9a000791":"touch-none","mui-acd532d8913e":"resize","mui-ae112c903ef8":"resize-y","mui-eeb3a8b33f69":"grid-cols-[min(var(--filter-list-width),calc(100%_-_min(var(--mendy-filter-editor-width,19rem),50%)))_minmax(0,1fr)]","mui-b5985369ee35":"grid-rows-[minmax(0,1fr)]","mui-302c0d124a94":"flex-col","mui-faa8a23c68f6":"flex-wrap","mui-8fd2e2355cbc":"place-content-center","mui-71556df3b421":"items-center","mui-b9677bd1cb66":"items-start","mui-32c92bb1fde4":"justify-between","mui-a503dd374cca":"justify-center","mui-307644c34db6":"justify-end","mui-c62ec162662e":"justify-start","mui-19e97f3f40e6":"gap-1","mui-70007b876865":"gap-1.5","mui-074569488cca":"gap-2","mui-d7db3451d154":"gap-3","mui-90fc3ec35a37":"gap-4","mui-27e6c432192f":"space-y-1","mui-267171770524":"space-y-2","mui-5a3a4ee420c2":"truncate","mui-1a26a0d28420":"overflow-auto","mui-d5111d0e9f48":"overflow-hidden","mui-0fc84a692dad":"overflow-visible","mui-3b82279f859f":"overflow-x-hidden","mui-2368e909f3a5":"overflow-y-auto","mui-998780cdef87":"overscroll-contain","mui-b005d61d0953":"rounded-full","mui-3fa8c572949b":"rounded-md","mui-52417259a4f5":"rounded-none","mui-02e603944040":"rounded-sm","mui-b31810dbd8a9":"rounded-s-none","mui-10c0bae8cba9":"rounded-l-md","mui-34bbd346e74c":"rounded-r-md","mui-4f1a55de40bc":"border","mui-dad556abfe15":"border-0","mui-55860251be20":"border-s","mui-3b6d5fc7b061":"border-e","mui-894c3815a57f":"border-t","mui-bbe39cfb5cc6":"border-b","mui-8450eb0f1857":"border-dashed","mui-163a623b3716":"border-border/50","mui-1267095cdeb7":"border-input","mui-9b76f456b8c9":"border-muted-foreground/50","mui-292affc1f780":"bg-accent","mui-5b272f3c5076":"bg-background","mui-a943bea85d66":"bg-border","mui-0cf6c2e8fe7e":"bg-current","mui-965cf6587342":"bg-destructive","mui-047624ec0c39":"bg-green-100","mui-87ecb59f2d2d":"bg-muted","mui-810ae775809b":"bg-muted-foreground/20","mui-e593c38256e0":"bg-popover","mui-0c2864fba576":"bg-primary","mui-d191cb569aac":"bg-secondary","mui-8fca9236d191":"bg-transparent","mui-04760bcd507f":"p-0","mui-1dee6e3ec67d":"p-1","mui-b97db4a9f432":"p-2","mui-094f5333853b":"p-3","mui-c432836760e3":"p-6","mui-c7902d77ad80":"p-8","mui-56b8f5e0fb12":"px-(--cell-size)","mui-16e909e6f01d":"px-0","mui-1da2e8f173c5":"px-1.5","mui-e7e01cc7f4df":"px-2","mui-0f9e6672913a":"px-3","mui-9513b3968002":"px-4","mui-0194c6e46323":"px-8","mui-1fcf28756bb1":"py-1","mui-a8c1dfb1d4ef":"py-1.5","mui-b5edc3ea7c91":"py-2","mui-078d945937da":"ps-8","mui-b2100041c585":"ps-9","mui-05d4103bd67f":"pe-2","mui-a202804a1738":"pe-3","mui-0e14c365f9e8":"pe-9","mui-559069d2c2e5":"pe-16","mui-0a702d97ed7d":"pt-3","mui-1a52da5bc88c":"pr-1","mui-f5d8e661d857":"pl-2","mui-05ab12448317":"text-center","mui-10558dbb3a24":"text-end","mui-e9347b78185f":"text-start","mui-757071a1d1c4":"text-base","mui-c74ab393b96d":"text-sm","mui-3992de70b033":"text-xs","mui-5f120ad4b50b":"text-[0.8rem]","mui-761cdb81bddb":"leading-none","mui-daaac3fbf55e":"font-medium","mui-52101fc7d8bb":"font-normal","mui-e1683b3c030a":"tracking-widest","mui-393883c1db68":"[overflow-wrap:anywhere]","mui-37cf9655f30a":"break-words","mui-726fca123972":"whitespace-normal","mui-963f6168b7d6":"whitespace-nowrap","mui-cc209238d847":"text-accent-foreground","mui-5eafab9bbefc":"text-current","mui-887b9502d5c7":"text-destructive","mui-8d4bf2704c8d":"text-destructive-foreground","mui-957a109f887f":"text-foreground","mui-35f35c41d134":"text-muted-foreground","mui-5bd2afe89f0b":"text-popover-foreground","mui-249f14ee5b6b":"text-primary","mui-abd1aaa1f5b2":"text-primary-foreground","mui-80df79ec9bb5":"text-secondary-foreground","mui-944969efb294":"underline","mui-d52f902a57e8":"underline-offset-4","mui-94f91922a10e":"opacity-0","mui-0b5a4d1257ab":"opacity-50","mui-65694092f002":"opacity-100","mui-0d4ca75de41c":"shadow-lg","mui-94ea94fde25f":"shadow-md","mui-89c3006b2722":"shadow-none","mui-7de07d413c13":"shadow-xs","mui-59edd3d33673":"outline-hidden","mui-318678825324":"outline","mui-e0122edc668b":"drop-shadow-md","mui-dfc3376b8266":"filter","mui-70dd37c11434":"transition","mui-eae178841c68":"transition-colors","mui-2cdd01663c76":"transition-opacity","mui-2b48746f4314":"transition-shadow","mui-b4b2fd95f324":"transition-none","mui-b30fc56058b6":"outline-none","mui-78905c9e865c":"select-none","mui-d80b6593dae5":"[--cell-size:--spacing(8)]","mui-82c2977beb8e":"[--cell-size:min(2rem,calc((100vw-3.5rem)/7))]","mui-d7d803c609c5":"[--filter-list-width:var(--mendy-filter-list-width,var(--mendy-filter-anchor-width,13rem))]","mui-971625533e56":"[--filter-menu-height:min(var(--mendy-filter-menu-max-height,44rem),var(--radix-dropdown-menu-content-available-height,44rem))]","mui-cacb19aa9640":"[scrollbar-width:thin]","mui-14bd99410890":"[unicode-bidi:isolate]","mui-97b1c00ff005":"group-hover:bg-accent","mui-ad936fcbed63":"group","mui-9af9a4182597":"group-data-[disabled=true]:pointer-events-none","mui-272ef88d6a0c":"group-data-[disabled=true]:opacity-50","mui-60052b901494":"group-data-[focused=true]/day:relative","mui-d9c5891363f9":"group/day","mui-3f96bf138f7b":"group-data-[focused=true]/day:z-10","mui-d39eb62b8363":"group-data-[focused=true]/day:border-ring","mui-5892a880410a":"group-data-[focused=true]/day:ring-1","mui-31b75c623c06":"group-data-[focused=true]/day:ring-ring","mui-e6020023567a":"group-data-[highlighted=true]:bg-accent","mui-f0ee83167878":"peer-disabled:cursor-not-allowed","mui-2ffc1d06387e":"peer","mui-25d26df52a1d":"peer-disabled:opacity-50","mui-32713fefe32f":"file:border-0","mui-25a74d576c42":"file:bg-transparent","mui-844abccf1fd0":"file:text-sm","mui-dc43de54f42a":"file:font-medium","mui-20315da78444":"placeholder:text-muted-foreground","mui-3deb00079b4c":"first:border-s-0","mui-beeef6663906":"last:border-e-0","mui-37ad15a95595":"hover:bg-accent","mui-63b29dace366":"hover:bg-accent/50","mui-bb6a4b3e902d":"hover:bg-destructive/90","mui-4273133a876a":"hover:bg-primary/20","mui-af9ea085901b":"hover:bg-primary/90","mui-099700a5a311":"hover:bg-secondary/80","mui-71863717995b":"hover:bg-transparent","mui-9f1f77b92dcb":"hover:text-accent-foreground","mui-4d6720d47806":"hover:text-foreground","mui-b56720602554":"hover:underline","mui-8da02faac748":"hover:opacity-100","mui-a8c1861c5d03":"focus:bg-accent","mui-a85c4c5d7465":"focus:text-accent-foreground","mui-b906a32b31ee":"focus-visible:border-ring","mui-2f669cfad5aa":"focus-visible:bg-primary/20","mui-39be5a15b766":"focus-visible:ring-1","mui-355efe22aedb":"focus-visible:ring-2","mui-365a4654f7b1":"focus-visible:ring-[3px]","mui-db549d38ff19":"focus-visible:ring-ring","mui-392a26f4c1b0":"focus-visible:ring-ring/50","mui-a47d391255f3":"focus-visible:outline","mui-1df9125eebaf":"focus-visible:outline-1","mui-a8719ed8b095":"focus-visible:-outline-offset-2","mui-2b1c7d88acff":"focus-visible:outline-primary","mui-223daa83ed2d":"focus-visible:outline-ring","mui-2e357972fc10":"focus-visible:outline-none","mui-50aafa8694bb":"focus-visible:ring-inset","mui-8d3c1014b967":"disabled:pointer-events-none","mui-db567af109b7":"disabled:cursor-not-allowed","mui-4600b77303d6":"disabled:opacity-50","mui-7eb7501a2ef0":"has-focus:border-ring","mui-d0449753ba7b":"has-focus:ring-[3px]","mui-fc19c8471f34":"has-focus:ring-ring/50","mui-e288cffc2ef4":"has-[>svg]:px-1.5","mui-3b01ee05b16d":"has-[>svg]:px-2.5","mui-9e08353b774f":"has-[>svg]:px-3","mui-2c0115d1c32a":"aria-disabled:opacity-50","mui-1fac1d7d1df3":"aria-invalid:border-destructive","mui-2d91b4cbc3cb":"aria-invalid:ring-destructive","mui-5491fd0b4dc5":"aria-invalid:ring-destructive/20","mui-2d6703b5473b":"aria-pressed:bg-accent","mui-ff2dcda51a27":"aria-pressed:text-accent-foreground","mui-7d900a71e5ba":"aria-selected:text-muted-foreground","mui-397f5ba426a0":"data-[disabled]:pointer-events-none","mui-9beb654fcb0d":"data-[disabled]:opacity-50","mui-9d7d1760cd8e":"data-[highlighted=true]:bg-accent","mui-6fa6a8ade7c4":"data-[inset]:pl-8","mui-bbaaa5969856":"data-[more-below=true]:[mask-image:linear-gradient(#000_calc(100%_-_1rem),transparent)]","mui-dfc89afd7885":"data-[navigation=pointer]:focus-visible:ring-0","mui-96308b55e0d6":"data-[range-end=true]:rounded-md","mui-a55dbe6f3eec":"data-[range-end=true]:rounded-r-md","mui-714051e55e8e":"data-[range-end=true]:bg-primary","mui-c764cebcd540":"data-[range-end=true]:text-primary-foreground","mui-05ec0700cd48":"data-[range-middle=true]:rounded-none","mui-5fb598fb06f4":"data-[range-middle=true]:bg-accent","mui-0813905aa141":"data-[range-middle=true]:text-accent-foreground","mui-8020e31bff67":"data-[range-start=true]:rounded-md","mui-ab65911baf1d":"data-[range-start=true]:rounded-l-md","mui-f5460d79341c":"data-[range-start=true]:bg-primary","mui-421a7d3e6631":"data-[range-start=true]:text-primary-foreground","mui-a39af81d518c":"data-[selected-single=true]:bg-primary","mui-b6991ab170de":"data-[selected-single=true]:text-primary-foreground","mui-3cc0d07ef843":"data-[selected=true]:rounded-none","mui-89f6aab7a3f8":"data-[side=bottom]:slide-in-from-top-2","mui-3550f48d66b9":"data-[side=left]:slide-in-from-right-2","mui-7720fe004f5c":"data-[side=right]:slide-in-from-left-2","mui-66b560f839de":"data-[side=top]:slide-in-from-bottom-2","mui-20553d55d224":"data-[state=checked]:border-primary","mui-57d6d6401a2f":"data-[state=checked]:bg-primary","mui-7ca12016214f":"data-[state=checked]:text-primary-foreground","mui-37d8a3f448ff":"data-[state=closed]:animate-none!","mui-0cb4489c3645":"data-[state=closed]:animate-out","mui-bb5869ef903b":"data-[state=closed]:fade-out-0","mui-f4cf4be63707":"data-[state=closed]:zoom-out-95","mui-bae1e782f277":"data-[state=open]:animate-in","mui-4027d9c589b6":"data-[state=open]:bg-accent","mui-1952cd5b00aa":"data-[state=open]:text-accent-foreground","mui-6f73a280432e":"data-[state=open]:text-foreground","mui-790ed041a953":"data-[state=open]:opacity-100","mui-45464a92c1f6":"data-[state=open]:fade-in-0","mui-9ca352480f25":"data-[state=open]:zoom-in-95","mui-f3f7a9c5e1b3":"data-[variant=destructive]:text-destructive","mui-e2bb4ac97190":"data-[variant=destructive]:focus:bg-destructive/10","mui-353a727facfd":"data-[variant=destructive]:focus:text-destructive","mui-237747164b60":"motion-reduce:animate-none","mui-0cc20f4e20c8":"sm:w-[21.875rem]","mui-56760b222da0":"md:flex-row","mui-c05c9b99939d":"md:text-sm","mui-36b12e8339c7":"rtl:rotate-180","mui-d254c96aea74":"dark:bg-green-950","mui-9daa2369a41b":"dark:bg-input/30","mui-b2786f463a62":"dark:hover:text-accent-foreground","mui-c88f65aa011e":"dark:aria-invalid:ring-destructive/40","mui-bd73d819941e":"dark:data-[state=checked]:bg-primary","mui-98a28c2293f7":"dark:data-[variant=destructive]:focus:bg-destructive/20","mui-d78a8526410d":"pointer-coarse:[--cell-size:min(2.5rem,calc((100vw-3.5rem)/7))]","mui-b51243872d85":"sm:pointer-fine:h-8","mui-e771a8b4d87d":"sm:pointer-fine:h-9","mui-aa0e3c036805":"sm:pointer-fine:min-h-8","mui-0288c4ea71ea":"sm:pointer-fine:py-0.5","mui-41d1475cf71a":"sm:pointer-fine:py-1.5","mui-548a450e8e53":"[&_*]:transition-none!","mui-a1c8c43d9be2":"[&_[role^=menuitem]]:min-h-9","mui-b43343fe71c0":"sm:pointer-fine:[&_[role^=menuitem]]:min-h-8","mui-cc310a330231":"[&_button]:font-semibold","mui-b7ff49878425":"[&_button]:underline","mui-d9bdd2c94504":"[&_button]:underline-offset-4","mui-bcae9d37090c":"[&_svg]:pointer-events-none","mui-c77732bd3ab4":"[&_svg]:size-3.5","mui-040e748a3fa0":"[&_svg]:shrink-0","mui-be87a4a64d81":"[&_svg:not([class*='size-'])]:size-3","mui-eb5ef2dbc2d4":"[&_svg:not([class*='size-'])]:size-4","mui-8637dfd54fbb":"[&_svg:not([class*='text-'])]:text-muted-foreground","mui-4f05a238500e":"[&::-webkit-search-cancel-button]:appearance-none","mui-74ab31abd804":"[&:first-child[data-selected=true]_button]:rounded-l-md","mui-13858191ca50":"rtl:**:[.rdp-button\\_next>svg]:rotate-180","mui-a324a7f99932":"rtl:**:[.rdp-button\\_previous>svg]:rotate-180","mui-82b114bbff3d":"data-[variant=destructive]:*:[svg]:text-destructive!","mui-6ee0c74de40c":"[&:last-child[data-selected=true]_button]:rounded-r-md","mui-6162ab70efb5":"[&:nth-child(2)[data-selected=true]_button]:rounded-l-md","mui-f157ee6bae99":"[&>div]:w-full","mui-ba417cf466b0":"[&>span]:text-xs","mui-829c8ef4f9c5":"[&>span]:opacity-70","mui-bf95f682e553":"[&>span:first-child]:mt-[calc(0.5lh-0.4375rem)]","mui-eb740dd32318":"[&>svg]:size-3.5","mui-019fd73c95db":"[&>svg]:text-muted-foreground","mui-b8293c91796c":"[[data-slot=card-content]_&]:bg-transparent","mui-8dd7e6b42262":"[[data-slot=popover-content]_&]:bg-transparent"};
1
+ export const originalClassNames = {"mui-cb20bd519346":"pointer-events-auto","mui-33228ff7d583":"pointer-events-none","mui-b75af7ef6c4d":"invisible","mui-d42ef1497900":"visible","mui-32fb090591d9":"sr-only","mui-747355bdc2a2":"absolute","mui-d2d9e1f13413":"relative","mui-964a9431ff49":"sticky","mui-ce13093ad8c9":"inset-0","mui-3ba24c062d55":"inset-x-0","mui-eb9e48c5dda9":"inset-y-0","mui-cced28c6dc3f":"start","mui-207bd0b3f259":"start-2","mui-cea70f23972e":"start-3","mui-361e48d0308f":"end","mui-13422ddc8d83":"end-1","mui-585f4729f611":"end-9","mui-98599e4ee250":"top-0","mui-4e45f4841abb":"top-1/2","mui-a74c4477017c":"right-0","mui-30150dd033ab":"bottom-0","mui-a5c36273c0f0":"bottom-2","mui-635702706586":"left-0","mui-014aadadffad":"isolate","mui-d7efd1b0b0f9":"z-1","mui-418e44ad4f9e":"z-10","mui-4e8f0a87a0dc":"z-20","mui-fbb62f5cb6fe":"z-30","mui-3eef1ce97dba":"z-50","mui-a42d519714d6":"container","mui-a2526bc2efa3":"m-0","mui-abba77319850":"-mx-1","mui-1752f11474a6":"mx-auto","mui-d8747231f142":"my-1","mui-958e2cfcf5b6":"-ms-2","mui-291952c2525a":"-ms-px","mui-8cc46fa87f41":"-me-1.5","mui-f28fea81a5cd":"mt-2","mui-cc51bda60e7e":"ml-auto","mui-496aca80e4d8":"block","mui-d1b2a59fbea7":"contents","mui-222f930b8752":"flex","mui-0f2a693e93e2":"grid","mui-e564b4081d7a":"hidden","mui-995cf20a9c45":"inline","mui-123306850fe1":"inline-flex","mui-0d4fc4a78d37":"table","mui-3da89b3ed14b":"field-sizing-content","mui-129d6f9b1e07":"aspect-square","mui-f7d12b41bceb":"size-(--cell-size)","mui-dc797fcc7165":"size-1.5","mui-5e34f5313859":"size-3","mui-61c000c8a98a":"size-3.5","mui-100c22d5776b":"size-4","mui-2bd43fb57913":"size-5","mui-0712570dcc9f":"size-6","mui-79ede756e761":"size-7","mui-ebd37e04d422":"size-8","mui-3ee10ef4c057":"size-9","mui-d0a383a9c24f":"size-10","mui-4dad94bd15e3":"size-auto","mui-a5960ac1d283":"h-(--cell-size)","mui-c7d5500b77ab":"h-0","mui-2edce89ef182":"h-3","mui-099be97e1fa4":"h-4","mui-ce1945804664":"h-6","mui-c8e50836f8a1":"h-7","mui-1fb07b38c63b":"h-8","mui-539ae144f076":"h-9","mui-fdd2f85cad6b":"h-10","mui-a66e9985b093":"h-auto","mui-57c930dc1c31":"h-full","mui-ae2c4b060bb9":"h-px","mui-571ea69568d3":"max-h-(--filter-menu-height)","mui-1f061e70178e":"max-h-(--radix-dropdown-menu-content-available-height)","mui-4d3f1304ebb2":"max-h-(--radix-popover-content-available-height)","mui-da0beef015c9":"max-h-[400px]","mui-80baa5d03af7":"max-h-[calc(var(--filter-menu-height)-2px)]","mui-1326520533f0":"max-h-[min(6rem,calc(var(--filter-menu-height)*0.25))]","mui-fb4a3e97b5bd":"max-h-[min(20rem,var(--radix-dropdown-menu-content-available-height,20rem))]","mui-dcd942c18ddc":"max-h-[var(--radix-dropdown-menu-content-available-height)]","mui-7bd696ca6be3":"max-h-full","mui-410da8dfa8ac":"min-h-0","mui-9974acedf3f7":"min-h-9","mui-8423dc94ee06":"min-h-10","mui-50312c3ce4a3":"min-h-[60px]","mui-d48fe95d4da8":"w-(--cell-size)","mui-d4ea834145ae":"w-2","mui-56bb14cbd1fe":"w-2/3","mui-8867d85ed290":"w-8","mui-4ac4ec8dfbce":"w-40","mui-37535002f0f7":"w-72","mui-a4cce7869436":"w-[300px]","mui-fc6a57ff7553":"w-[var(--mendy-filter-editor-width,19rem)]","mui-0b9c84552e40":"w-[var(--mendy-filter-list-width,var(--mendy-filter-anchor-width,18.75rem))]","mui-4415137b0467":"w-[var(--mendy-filter-menu-width,calc(var(--filter-list-width)_+_var(--mendy-filter-editor-width,19rem)))]","mui-8cfb5a42ef9f":"w-fit","mui-58d0413dd93c":"w-full","mui-91f82aa1df0c":"max-w-[60%]","mui-34055e6f8c1b":"max-w-[calc(100vw-2rem)]","mui-81b198a2db84":"max-w-full","mui-1458e495e3ae":"min-w-(--cell-size)","mui-184ddc11e5f9":"min-w-0","mui-e9ab1547c94d":"min-w-[8rem]","mui-2bf6510f1330":"min-w-full","mui-7bd5bab6d7f4":"flex-1","mui-66b490dd6005":"shrink","mui-27ead27a81df":"shrink-0","mui-adca5146416e":"grow","mui-215061302c50":"border-collapse","mui-3a3774477287":"origin-(--radix-dropdown-menu-content-transform-origin)","mui-5dde0fd996f0":"-translate-y-1/2","mui-4e3f08588318":"-rotate-45","mui-c80411b7591f":"rotate-45","mui-aa214ea38326":"transform","mui-393df0d154e0":"animate-none!","mui-7b3cd77eb999":"animate-pulse","mui-2194d094b585":"cursor-col-resize","mui-d343f41ba73e":"cursor-default","mui-f2e47d9c52ad":"cursor-grab","mui-d2fa8848968d":"cursor-pointer","mui-739a9a000791":"touch-none","mui-acd532d8913e":"resize","mui-ae112c903ef8":"resize-y","mui-eeb3a8b33f69":"grid-cols-[min(var(--filter-list-width),calc(100%_-_min(var(--mendy-filter-editor-width,19rem),50%)))_minmax(0,1fr)]","mui-b5985369ee35":"grid-rows-[minmax(0,1fr)]","mui-302c0d124a94":"flex-col","mui-faa8a23c68f6":"flex-wrap","mui-8fd2e2355cbc":"place-content-center","mui-71556df3b421":"items-center","mui-b9677bd1cb66":"items-start","mui-32c92bb1fde4":"justify-between","mui-a503dd374cca":"justify-center","mui-307644c34db6":"justify-end","mui-c62ec162662e":"justify-start","mui-19e97f3f40e6":"gap-1","mui-70007b876865":"gap-1.5","mui-074569488cca":"gap-2","mui-d7db3451d154":"gap-3","mui-90fc3ec35a37":"gap-4","mui-27e6c432192f":"space-y-1","mui-267171770524":"space-y-2","mui-5a3a4ee420c2":"truncate","mui-1a26a0d28420":"overflow-auto","mui-d5111d0e9f48":"overflow-hidden","mui-0fc84a692dad":"overflow-visible","mui-3b82279f859f":"overflow-x-hidden","mui-2368e909f3a5":"overflow-y-auto","mui-998780cdef87":"overscroll-contain","mui-b005d61d0953":"rounded-full","mui-3fa8c572949b":"rounded-md","mui-52417259a4f5":"rounded-none","mui-02e603944040":"rounded-sm","mui-b31810dbd8a9":"rounded-s-none","mui-10c0bae8cba9":"rounded-l-md","mui-34bbd346e74c":"rounded-r-md","mui-4f1a55de40bc":"border","mui-dad556abfe15":"border-0","mui-55860251be20":"border-s","mui-3b6d5fc7b061":"border-e","mui-894c3815a57f":"border-t","mui-bbe39cfb5cc6":"border-b","mui-8450eb0f1857":"border-dashed","mui-163a623b3716":"border-border/50","mui-1267095cdeb7":"border-input","mui-9b76f456b8c9":"border-muted-foreground/50","mui-515f9fdc6db7":"border-primary","mui-292affc1f780":"bg-accent","mui-5b272f3c5076":"bg-background","mui-a943bea85d66":"bg-border","mui-0cf6c2e8fe7e":"bg-current","mui-965cf6587342":"bg-destructive","mui-047624ec0c39":"bg-green-100","mui-87ecb59f2d2d":"bg-muted","mui-810ae775809b":"bg-muted-foreground/20","mui-e593c38256e0":"bg-popover","mui-0c2864fba576":"bg-primary","mui-d191cb569aac":"bg-secondary","mui-8fca9236d191":"bg-transparent","mui-04760bcd507f":"p-0","mui-1dee6e3ec67d":"p-1","mui-b97db4a9f432":"p-2","mui-094f5333853b":"p-3","mui-c432836760e3":"p-6","mui-c7902d77ad80":"p-8","mui-56b8f5e0fb12":"px-(--cell-size)","mui-16e909e6f01d":"px-0","mui-1da2e8f173c5":"px-1.5","mui-e7e01cc7f4df":"px-2","mui-0f9e6672913a":"px-3","mui-9513b3968002":"px-4","mui-0194c6e46323":"px-8","mui-1fcf28756bb1":"py-1","mui-a8c1dfb1d4ef":"py-1.5","mui-b5edc3ea7c91":"py-2","mui-d3cea061f2f3":"py-3","mui-078d945937da":"ps-8","mui-b2100041c585":"ps-9","mui-05d4103bd67f":"pe-2","mui-a202804a1738":"pe-3","mui-0e14c365f9e8":"pe-9","mui-559069d2c2e5":"pe-16","mui-0a702d97ed7d":"pt-3","mui-1a52da5bc88c":"pr-1","mui-f5d8e661d857":"pl-2","mui-05ab12448317":"text-center","mui-10558dbb3a24":"text-end","mui-e9347b78185f":"text-start","mui-757071a1d1c4":"text-base","mui-c74ab393b96d":"text-sm","mui-3992de70b033":"text-xs","mui-5f120ad4b50b":"text-[0.8rem]","mui-761cdb81bddb":"leading-none","mui-daaac3fbf55e":"font-medium","mui-52101fc7d8bb":"font-normal","mui-e1683b3c030a":"tracking-widest","mui-393883c1db68":"[overflow-wrap:anywhere]","mui-37cf9655f30a":"break-words","mui-726fca123972":"whitespace-normal","mui-963f6168b7d6":"whitespace-nowrap","mui-cc209238d847":"text-accent-foreground","mui-5eafab9bbefc":"text-current","mui-887b9502d5c7":"text-destructive","mui-8d4bf2704c8d":"text-destructive-foreground","mui-957a109f887f":"text-foreground","mui-35f35c41d134":"text-muted-foreground","mui-5bd2afe89f0b":"text-popover-foreground","mui-249f14ee5b6b":"text-primary","mui-abd1aaa1f5b2":"text-primary-foreground","mui-80df79ec9bb5":"text-secondary-foreground","mui-944969efb294":"underline","mui-d52f902a57e8":"underline-offset-4","mui-94f91922a10e":"opacity-0","mui-0b5a4d1257ab":"opacity-50","mui-65694092f002":"opacity-100","mui-0d4ca75de41c":"shadow-lg","mui-94ea94fde25f":"shadow-md","mui-89c3006b2722":"shadow-none","mui-7de07d413c13":"shadow-xs","mui-853be6c11609":"ring-2","mui-fd9d0b696aac":"ring-primary","mui-59edd3d33673":"outline-hidden","mui-318678825324":"outline","mui-e0122edc668b":"drop-shadow-md","mui-dfc3376b8266":"filter","mui-70dd37c11434":"transition","mui-eae178841c68":"transition-colors","mui-2cdd01663c76":"transition-opacity","mui-2b48746f4314":"transition-shadow","mui-b4b2fd95f324":"transition-none","mui-b30fc56058b6":"outline-none","mui-78905c9e865c":"select-none","mui-d80b6593dae5":"[--cell-size:--spacing(8)]","mui-82c2977beb8e":"[--cell-size:min(2rem,calc((100vw-3.5rem)/7))]","mui-d7d803c609c5":"[--filter-list-width:var(--mendy-filter-list-width,var(--mendy-filter-anchor-width,13rem))]","mui-971625533e56":"[--filter-menu-height:min(var(--mendy-filter-menu-max-height,44rem),var(--radix-dropdown-menu-content-available-height,44rem))]","mui-cacb19aa9640":"[scrollbar-width:thin]","mui-14bd99410890":"[unicode-bidi:isolate]","mui-97b1c00ff005":"group-hover:bg-accent","mui-ad936fcbed63":"group","mui-9af9a4182597":"group-data-[disabled=true]:pointer-events-none","mui-272ef88d6a0c":"group-data-[disabled=true]:opacity-50","mui-60052b901494":"group-data-[focused=true]/day:relative","mui-d9c5891363f9":"group/day","mui-3f96bf138f7b":"group-data-[focused=true]/day:z-10","mui-d39eb62b8363":"group-data-[focused=true]/day:border-ring","mui-5892a880410a":"group-data-[focused=true]/day:ring-1","mui-31b75c623c06":"group-data-[focused=true]/day:ring-ring","mui-e6020023567a":"group-data-[highlighted=true]:bg-accent","mui-f0ee83167878":"peer-disabled:cursor-not-allowed","mui-2ffc1d06387e":"peer","mui-25d26df52a1d":"peer-disabled:opacity-50","mui-32713fefe32f":"file:border-0","mui-25a74d576c42":"file:bg-transparent","mui-844abccf1fd0":"file:text-sm","mui-dc43de54f42a":"file:font-medium","mui-20315da78444":"placeholder:text-muted-foreground","mui-3deb00079b4c":"first:border-s-0","mui-37ad15a95595":"hover:bg-accent","mui-63b29dace366":"hover:bg-accent/50","mui-bb6a4b3e902d":"hover:bg-destructive/90","mui-5cbdd1b32f1a":"hover:bg-muted/50","mui-4273133a876a":"hover:bg-primary/20","mui-af9ea085901b":"hover:bg-primary/90","mui-099700a5a311":"hover:bg-secondary/80","mui-71863717995b":"hover:bg-transparent","mui-9f1f77b92dcb":"hover:text-accent-foreground","mui-4d6720d47806":"hover:text-foreground","mui-b56720602554":"hover:underline","mui-8da02faac748":"hover:opacity-100","mui-a8c1861c5d03":"focus:bg-accent","mui-a85c4c5d7465":"focus:text-accent-foreground","mui-b906a32b31ee":"focus-visible:border-ring","mui-2f669cfad5aa":"focus-visible:bg-primary/20","mui-39be5a15b766":"focus-visible:ring-1","mui-355efe22aedb":"focus-visible:ring-2","mui-365a4654f7b1":"focus-visible:ring-[3px]","mui-db549d38ff19":"focus-visible:ring-ring","mui-392a26f4c1b0":"focus-visible:ring-ring/50","mui-a47d391255f3":"focus-visible:outline","mui-1df9125eebaf":"focus-visible:outline-1","mui-a8719ed8b095":"focus-visible:-outline-offset-2","mui-2b1c7d88acff":"focus-visible:outline-primary","mui-223daa83ed2d":"focus-visible:outline-ring","mui-2e357972fc10":"focus-visible:outline-none","mui-50aafa8694bb":"focus-visible:ring-inset","mui-71998ea7a2d0":"active:cursor-grabbing","mui-8d3c1014b967":"disabled:pointer-events-none","mui-db567af109b7":"disabled:cursor-not-allowed","mui-4600b77303d6":"disabled:opacity-50","mui-7eb7501a2ef0":"has-focus:border-ring","mui-d0449753ba7b":"has-focus:ring-[3px]","mui-fc19c8471f34":"has-focus:ring-ring/50","mui-e288cffc2ef4":"has-[>svg]:px-1.5","mui-3b01ee05b16d":"has-[>svg]:px-2.5","mui-9e08353b774f":"has-[>svg]:px-3","mui-2c0115d1c32a":"aria-disabled:opacity-50","mui-1fac1d7d1df3":"aria-invalid:border-destructive","mui-2d91b4cbc3cb":"aria-invalid:ring-destructive","mui-5491fd0b4dc5":"aria-invalid:ring-destructive/20","mui-2d6703b5473b":"aria-pressed:bg-accent","mui-ff2dcda51a27":"aria-pressed:text-accent-foreground","mui-7d900a71e5ba":"aria-selected:text-muted-foreground","mui-397f5ba426a0":"data-[disabled]:pointer-events-none","mui-9beb654fcb0d":"data-[disabled]:opacity-50","mui-9d7d1760cd8e":"data-[highlighted=true]:bg-accent","mui-6fa6a8ade7c4":"data-[inset]:pl-8","mui-bbaaa5969856":"data-[more-below=true]:[mask-image:linear-gradient(#000_calc(100%_-_1rem),transparent)]","mui-dfc89afd7885":"data-[navigation=pointer]:focus-visible:ring-0","mui-96308b55e0d6":"data-[range-end=true]:rounded-md","mui-a55dbe6f3eec":"data-[range-end=true]:rounded-r-md","mui-714051e55e8e":"data-[range-end=true]:bg-primary","mui-c764cebcd540":"data-[range-end=true]:text-primary-foreground","mui-05ec0700cd48":"data-[range-middle=true]:rounded-none","mui-5fb598fb06f4":"data-[range-middle=true]:bg-accent","mui-0813905aa141":"data-[range-middle=true]:text-accent-foreground","mui-8020e31bff67":"data-[range-start=true]:rounded-md","mui-ab65911baf1d":"data-[range-start=true]:rounded-l-md","mui-f5460d79341c":"data-[range-start=true]:bg-primary","mui-421a7d3e6631":"data-[range-start=true]:text-primary-foreground","mui-a39af81d518c":"data-[selected-single=true]:bg-primary","mui-b6991ab170de":"data-[selected-single=true]:text-primary-foreground","mui-3cc0d07ef843":"data-[selected=true]:rounded-none","mui-89f6aab7a3f8":"data-[side=bottom]:slide-in-from-top-2","mui-3550f48d66b9":"data-[side=left]:slide-in-from-right-2","mui-7720fe004f5c":"data-[side=right]:slide-in-from-left-2","mui-66b560f839de":"data-[side=top]:slide-in-from-bottom-2","mui-20553d55d224":"data-[state=checked]:border-primary","mui-57d6d6401a2f":"data-[state=checked]:bg-primary","mui-7ca12016214f":"data-[state=checked]:text-primary-foreground","mui-37d8a3f448ff":"data-[state=closed]:animate-none!","mui-0cb4489c3645":"data-[state=closed]:animate-out","mui-bb5869ef903b":"data-[state=closed]:fade-out-0","mui-f4cf4be63707":"data-[state=closed]:zoom-out-95","mui-bae1e782f277":"data-[state=open]:animate-in","mui-4027d9c589b6":"data-[state=open]:bg-accent","mui-1952cd5b00aa":"data-[state=open]:text-accent-foreground","mui-6f73a280432e":"data-[state=open]:text-foreground","mui-790ed041a953":"data-[state=open]:opacity-100","mui-45464a92c1f6":"data-[state=open]:fade-in-0","mui-9ca352480f25":"data-[state=open]:zoom-in-95","mui-f3f7a9c5e1b3":"data-[variant=destructive]:text-destructive","mui-e2bb4ac97190":"data-[variant=destructive]:focus:bg-destructive/10","mui-353a727facfd":"data-[variant=destructive]:focus:text-destructive","mui-237747164b60":"motion-reduce:animate-none","mui-0cc20f4e20c8":"sm:w-[21.875rem]","mui-56760b222da0":"md:flex-row","mui-c05c9b99939d":"md:text-sm","mui-36b12e8339c7":"rtl:rotate-180","mui-d254c96aea74":"dark:bg-green-950","mui-9daa2369a41b":"dark:bg-input/30","mui-b2786f463a62":"dark:hover:text-accent-foreground","mui-c88f65aa011e":"dark:aria-invalid:ring-destructive/40","mui-bd73d819941e":"dark:data-[state=checked]:bg-primary","mui-98a28c2293f7":"dark:data-[variant=destructive]:focus:bg-destructive/20","mui-d78a8526410d":"pointer-coarse:[--cell-size:min(2.5rem,calc((100vw-3.5rem)/7))]","mui-b51243872d85":"sm:pointer-fine:h-8","mui-e771a8b4d87d":"sm:pointer-fine:h-9","mui-aa0e3c036805":"sm:pointer-fine:min-h-8","mui-0288c4ea71ea":"sm:pointer-fine:py-0.5","mui-41d1475cf71a":"sm:pointer-fine:py-1.5","mui-548a450e8e53":"[&_*]:transition-none!","mui-a1c8c43d9be2":"[&_[role^=menuitem]]:min-h-9","mui-b43343fe71c0":"sm:pointer-fine:[&_[role^=menuitem]]:min-h-8","mui-cc310a330231":"[&_button]:font-semibold","mui-b7ff49878425":"[&_button]:underline","mui-d9bdd2c94504":"[&_button]:underline-offset-4","mui-bcae9d37090c":"[&_svg]:pointer-events-none","mui-c77732bd3ab4":"[&_svg]:size-3.5","mui-040e748a3fa0":"[&_svg]:shrink-0","mui-be87a4a64d81":"[&_svg:not([class*='size-'])]:size-3","mui-eb5ef2dbc2d4":"[&_svg:not([class*='size-'])]:size-4","mui-8637dfd54fbb":"[&_svg:not([class*='text-'])]:text-muted-foreground","mui-4f05a238500e":"[&::-webkit-search-cancel-button]:appearance-none","mui-74ab31abd804":"[&:first-child[data-selected=true]_button]:rounded-l-md","mui-13858191ca50":"rtl:**:[.rdp-button\\_next>svg]:rotate-180","mui-a324a7f99932":"rtl:**:[.rdp-button\\_previous>svg]:rotate-180","mui-82b114bbff3d":"data-[variant=destructive]:*:[svg]:text-destructive!","mui-6ee0c74de40c":"[&:last-child[data-selected=true]_button]:rounded-r-md","mui-6162ab70efb5":"[&:nth-child(2)[data-selected=true]_button]:rounded-l-md","mui-f157ee6bae99":"[&>div]:w-full","mui-ba417cf466b0":"[&>span]:text-xs","mui-829c8ef4f9c5":"[&>span]:opacity-70","mui-bf95f682e553":"[&>span:first-child]:mt-[calc(0.5lh-0.4375rem)]","mui-eb740dd32318":"[&>svg]:size-3.5","mui-019fd73c95db":"[&>svg]:text-muted-foreground","mui-b8293c91796c":"[[data-slot=card-content]_&]:bg-transparent","mui-8dd7e6b42262":"[[data-slot=popover-content]_&]:bg-transparent"};
@@ -0,0 +1,5 @@
1
+ import type { ComponentProps } from "react";
2
+ import * as PopoverPrimitive from "@radix-ui/react-popover";
3
+ export declare const Popover: import("react").FC<PopoverPrimitive.PopoverProps>;
4
+ export declare const PopoverTrigger: import("react").ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
5
+ export declare function PopoverContent({ className, align, sideOffset, ...props }: ComponentProps<typeof PopoverPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,10 @@
1
+ "use client";
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ import * as PopoverPrimitive from "@radix-ui/react-popover";
4
+ import { useMendyUI } from "../customization.js";
5
+ import { cn } from "../utils.js";
6
+ export const Popover = PopoverPrimitive.Root;
7
+ export const PopoverTrigger = PopoverPrimitive.Trigger;
8
+ export function PopoverContent({ className, align = "center", sideOffset = 8, ...props }) {
9
+ return (_jsx(PopoverPrimitive.Portal, { container: useMendyUI().portalContainer, children: _jsx(PopoverPrimitive.Content, { "data-mendy-ui": "", "data-slot": "popover-content", align: align, sideOffset: sideOffset, className: cn("mui-3eef1ce97dba mui-4d3f1304ebb2 mui-37535002f0f7 mui-34055e6f8c1b mui-d5111d0e9f48 mui-3fa8c572949b mui-4f1a55de40bc mui-e593c38256e0 mui-5bd2afe89f0b mui-94ea94fde25f mui-b30fc56058b6", className), ...props }) }));
10
+ }
package/dist/styles.css CHANGED
@@ -102,6 +102,9 @@
102
102
  .mui-014aadadffad:where([data-mendy-ui], [data-mendy-ui] *) {
103
103
  isolation: isolate;
104
104
  }
105
+ .mui-d7efd1b0b0f9:where([data-mendy-ui], [data-mendy-ui] *) {
106
+ z-index: 1;
107
+ }
105
108
  .mui-418e44ad4f9e:where([data-mendy-ui], [data-mendy-ui] *) {
106
109
  z-index: 10;
107
110
  }
@@ -209,6 +212,10 @@
209
212
  width: calc(var(--spacing) * 4);
210
213
  height: calc(var(--spacing) * 4);
211
214
  }
215
+ .mui-2bd43fb57913:where([data-mendy-ui], [data-mendy-ui] *) {
216
+ width: calc(var(--spacing) * 5);
217
+ height: calc(var(--spacing) * 5);
218
+ }
212
219
  .mui-0712570dcc9f:where([data-mendy-ui], [data-mendy-ui] *) {
213
220
  width: calc(var(--spacing) * 6);
214
221
  height: calc(var(--spacing) * 6);
@@ -248,6 +255,9 @@
248
255
  .mui-ce1945804664:where([data-mendy-ui], [data-mendy-ui] *) {
249
256
  height: calc(var(--spacing) * 6);
250
257
  }
258
+ .mui-c8e50836f8a1:where([data-mendy-ui], [data-mendy-ui] *) {
259
+ height: calc(var(--spacing) * 7);
260
+ }
251
261
  .mui-1fb07b38c63b:where([data-mendy-ui], [data-mendy-ui] *) {
252
262
  height: calc(var(--spacing) * 8);
253
263
  }
@@ -272,8 +282,11 @@
272
282
  .mui-1f061e70178e:where([data-mendy-ui], [data-mendy-ui] *) {
273
283
  max-height: var(--radix-dropdown-menu-content-available-height);
274
284
  }
275
- .mui-b057efba3283:where([data-mendy-ui], [data-mendy-ui] *) {
276
- max-height: calc(var(--spacing) * 96);
285
+ .mui-4d3f1304ebb2:where([data-mendy-ui], [data-mendy-ui] *) {
286
+ max-height: var(--radix-popover-content-available-height);
287
+ }
288
+ .mui-da0beef015c9:where([data-mendy-ui], [data-mendy-ui] *) {
289
+ max-height: 400px;
277
290
  }
278
291
  .mui-80baa5d03af7:where([data-mendy-ui], [data-mendy-ui] *) {
279
292
  max-height: calc(var(--filter-menu-height) - 2px);
@@ -287,6 +300,9 @@
287
300
  .mui-dcd942c18ddc:where([data-mendy-ui], [data-mendy-ui] *) {
288
301
  max-height: var(--radix-dropdown-menu-content-available-height);
289
302
  }
303
+ .mui-7bd696ca6be3:where([data-mendy-ui], [data-mendy-ui] *) {
304
+ max-height: 100%;
305
+ }
290
306
  .mui-410da8dfa8ac:where([data-mendy-ui], [data-mendy-ui] *) {
291
307
  min-height: calc(var(--spacing) * 0);
292
308
  }
@@ -314,12 +330,12 @@
314
330
  .mui-4ac4ec8dfbce:where([data-mendy-ui], [data-mendy-ui] *) {
315
331
  width: calc(var(--spacing) * 40);
316
332
  }
317
- .mui-72b37c1a040d:where([data-mendy-ui], [data-mendy-ui] *) {
318
- width: calc(var(--spacing) * 64);
319
- }
320
333
  .mui-37535002f0f7:where([data-mendy-ui], [data-mendy-ui] *) {
321
334
  width: calc(var(--spacing) * 72);
322
335
  }
336
+ .mui-a4cce7869436:where([data-mendy-ui], [data-mendy-ui] *) {
337
+ width: 300px;
338
+ }
323
339
  .mui-fc6a57ff7553:where([data-mendy-ui], [data-mendy-ui] *) {
324
340
  width: var(--mendy-filter-editor-width,19rem);
325
341
  }
@@ -365,6 +381,9 @@
365
381
  .mui-27ead27a81df:where([data-mendy-ui], [data-mendy-ui] *) {
366
382
  flex-shrink: 0;
367
383
  }
384
+ .mui-adca5146416e:where([data-mendy-ui], [data-mendy-ui] *) {
385
+ flex-grow: 1;
386
+ }
368
387
  .mui-215061302c50:where([data-mendy-ui], [data-mendy-ui] *) {
369
388
  border-collapse: collapse;
370
389
  }
@@ -375,6 +394,12 @@
375
394
  --mendy-tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
376
395
  translate: var(--mendy-tw-translate-x) var(--mendy-tw-translate-y);
377
396
  }
397
+ .mui-4e3f08588318:where([data-mendy-ui], [data-mendy-ui] *) {
398
+ rotate: calc(45deg * -1);
399
+ }
400
+ .mui-c80411b7591f:where([data-mendy-ui], [data-mendy-ui] *) {
401
+ rotate: 45deg;
402
+ }
378
403
  .mui-aa214ea38326:where([data-mendy-ui], [data-mendy-ui] *) {
379
404
  transform: var(--mendy-tw-rotate-x,) var(--mendy-tw-rotate-y,) var(--mendy-tw-rotate-z,) var(--mendy-tw-skew-x,) var(--mendy-tw-skew-y,);
380
405
  }
@@ -390,6 +415,12 @@
390
415
  .mui-d343f41ba73e:where([data-mendy-ui], [data-mendy-ui] *) {
391
416
  cursor: default;
392
417
  }
418
+ .mui-f2e47d9c52ad:where([data-mendy-ui], [data-mendy-ui] *) {
419
+ cursor: grab;
420
+ }
421
+ .mui-d2fa8848968d:where([data-mendy-ui], [data-mendy-ui] *) {
422
+ cursor: pointer;
423
+ }
393
424
  .mui-739a9a000791:where([data-mendy-ui], [data-mendy-ui] *) {
394
425
  touch-action: none;
395
426
  }
@@ -551,6 +582,9 @@
551
582
  border-color: color-mix(in oklab, var(--muted-foreground, #737373) 50%, transparent);
552
583
  }
553
584
  }
585
+ .mui-515f9fdc6db7:where([data-mendy-ui], [data-mendy-ui] *) {
586
+ border-color: var(--primary, #171717);
587
+ }
554
588
  .mui-292affc1f780:where([data-mendy-ui], [data-mendy-ui] *) {
555
589
  background-color: var(--accent, #f5f5f5);
556
590
  }
@@ -638,6 +672,9 @@
638
672
  .mui-b5edc3ea7c91:where([data-mendy-ui], [data-mendy-ui] *) {
639
673
  padding-block: calc(var(--spacing) * 2);
640
674
  }
675
+ .mui-d3cea061f2f3:where([data-mendy-ui], [data-mendy-ui] *) {
676
+ padding-block: calc(var(--spacing) * 3);
677
+ }
641
678
  .mui-078d945937da:where([data-mendy-ui], [data-mendy-ui] *) {
642
679
  padding-inline-start: calc(var(--spacing) * 8);
643
680
  }
@@ -778,6 +815,13 @@
778
815
  --mendy-tw-shadow: 0 1px 2px 0 var(--mendy-tw-shadow-color, rgb(0 0 0 / 0.05));
779
816
  box-shadow: var(--mendy-tw-inset-shadow), var(--mendy-tw-inset-ring-shadow), var(--mendy-tw-ring-offset-shadow), var(--mendy-tw-ring-shadow), var(--mendy-tw-shadow);
780
817
  }
818
+ .mui-853be6c11609:where([data-mendy-ui], [data-mendy-ui] *) {
819
+ --mendy-tw-ring-shadow: var(--mendy-tw-ring-inset,) 0 0 0 calc(2px + var(--mendy-tw-ring-offset-width)) var(--mendy-tw-ring-color, currentcolor);
820
+ box-shadow: var(--mendy-tw-inset-shadow), var(--mendy-tw-inset-ring-shadow), var(--mendy-tw-ring-offset-shadow), var(--mendy-tw-ring-shadow), var(--mendy-tw-shadow);
821
+ }
822
+ .mui-fd9d0b696aac:where([data-mendy-ui], [data-mendy-ui] *) {
823
+ --mendy-tw-ring-color: var(--primary, #171717);
824
+ }
781
825
  .mui-59edd3d33673:where([data-mendy-ui], [data-mendy-ui] *) {
782
826
  --mendy-tw-outline-style: none;
783
827
  outline-style: none;
@@ -939,12 +983,6 @@
939
983
  border-inline-start-width: 0px;
940
984
  }
941
985
  }
942
- .mui-beeef6663906:where([data-mendy-ui], [data-mendy-ui] *) {
943
- &:last-child {
944
- border-inline-end-style: var(--mendy-tw-border-style);
945
- border-inline-end-width: 0px;
946
- }
947
- }
948
986
  .mui-37ad15a95595:where([data-mendy-ui], [data-mendy-ui] *) {
949
987
  &:hover {
950
988
  @media (hover: hover) {
@@ -972,6 +1010,16 @@
972
1010
  }
973
1011
  }
974
1012
  }
1013
+ .mui-5cbdd1b32f1a:where([data-mendy-ui], [data-mendy-ui] *) {
1014
+ &:hover {
1015
+ @media (hover: hover) {
1016
+ background-color: var(--muted, #f5f5f5);
1017
+ @supports (color: color-mix(in lab, red, red)) {
1018
+ background-color: color-mix(in oklab, var(--muted, #f5f5f5) 50%, transparent);
1019
+ }
1020
+ }
1021
+ }
1022
+ }
975
1023
  .mui-4273133a876a:where([data-mendy-ui], [data-mendy-ui] *) {
976
1024
  &:hover {
977
1025
  @media (hover: hover) {
@@ -1129,6 +1177,11 @@
1129
1177
  --mendy-tw-ring-inset: inset;
1130
1178
  }
1131
1179
  }
1180
+ .mui-71998ea7a2d0:where([data-mendy-ui], [data-mendy-ui] *) {
1181
+ &:active {
1182
+ cursor: grabbing;
1183
+ }
1184
+ }
1132
1185
  .mui-8d3c1014b967:where([data-mendy-ui], [data-mendy-ui] *) {
1133
1186
  &:disabled {
1134
1187
  pointer-events: none;
@@ -101,6 +101,9 @@
101
101
  .mui-014aadadffad:where([data-mendy-ui], [data-mendy-ui] *) {
102
102
  isolation: isolate;
103
103
  }
104
+ .mui-d7efd1b0b0f9:where([data-mendy-ui], [data-mendy-ui] *) {
105
+ z-index: 1;
106
+ }
104
107
  .mui-418e44ad4f9e:where([data-mendy-ui], [data-mendy-ui] *) {
105
108
  z-index: 10;
106
109
  }
@@ -208,6 +211,10 @@
208
211
  width: calc(var(--spacing) * 4);
209
212
  height: calc(var(--spacing) * 4);
210
213
  }
214
+ .mui-2bd43fb57913:where([data-mendy-ui], [data-mendy-ui] *) {
215
+ width: calc(var(--spacing) * 5);
216
+ height: calc(var(--spacing) * 5);
217
+ }
211
218
  .mui-0712570dcc9f:where([data-mendy-ui], [data-mendy-ui] *) {
212
219
  width: calc(var(--spacing) * 6);
213
220
  height: calc(var(--spacing) * 6);
@@ -247,6 +254,9 @@
247
254
  .mui-ce1945804664:where([data-mendy-ui], [data-mendy-ui] *) {
248
255
  height: calc(var(--spacing) * 6);
249
256
  }
257
+ .mui-c8e50836f8a1:where([data-mendy-ui], [data-mendy-ui] *) {
258
+ height: calc(var(--spacing) * 7);
259
+ }
250
260
  .mui-1fb07b38c63b:where([data-mendy-ui], [data-mendy-ui] *) {
251
261
  height: calc(var(--spacing) * 8);
252
262
  }
@@ -271,8 +281,11 @@
271
281
  .mui-1f061e70178e:where([data-mendy-ui], [data-mendy-ui] *) {
272
282
  max-height: var(--radix-dropdown-menu-content-available-height);
273
283
  }
274
- .mui-b057efba3283:where([data-mendy-ui], [data-mendy-ui] *) {
275
- max-height: calc(var(--spacing) * 96);
284
+ .mui-4d3f1304ebb2:where([data-mendy-ui], [data-mendy-ui] *) {
285
+ max-height: var(--radix-popover-content-available-height);
286
+ }
287
+ .mui-da0beef015c9:where([data-mendy-ui], [data-mendy-ui] *) {
288
+ max-height: 400px;
276
289
  }
277
290
  .mui-80baa5d03af7:where([data-mendy-ui], [data-mendy-ui] *) {
278
291
  max-height: calc(var(--filter-menu-height) - 2px);
@@ -286,6 +299,9 @@
286
299
  .mui-dcd942c18ddc:where([data-mendy-ui], [data-mendy-ui] *) {
287
300
  max-height: var(--radix-dropdown-menu-content-available-height);
288
301
  }
302
+ .mui-7bd696ca6be3:where([data-mendy-ui], [data-mendy-ui] *) {
303
+ max-height: 100%;
304
+ }
289
305
  .mui-410da8dfa8ac:where([data-mendy-ui], [data-mendy-ui] *) {
290
306
  min-height: calc(var(--spacing) * 0);
291
307
  }
@@ -313,12 +329,12 @@
313
329
  .mui-4ac4ec8dfbce:where([data-mendy-ui], [data-mendy-ui] *) {
314
330
  width: calc(var(--spacing) * 40);
315
331
  }
316
- .mui-72b37c1a040d:where([data-mendy-ui], [data-mendy-ui] *) {
317
- width: calc(var(--spacing) * 64);
318
- }
319
332
  .mui-37535002f0f7:where([data-mendy-ui], [data-mendy-ui] *) {
320
333
  width: calc(var(--spacing) * 72);
321
334
  }
335
+ .mui-a4cce7869436:where([data-mendy-ui], [data-mendy-ui] *) {
336
+ width: 300px;
337
+ }
322
338
  .mui-fc6a57ff7553:where([data-mendy-ui], [data-mendy-ui] *) {
323
339
  width: var(--mendy-filter-editor-width,19rem);
324
340
  }
@@ -364,6 +380,9 @@
364
380
  .mui-27ead27a81df:where([data-mendy-ui], [data-mendy-ui] *) {
365
381
  flex-shrink: 0;
366
382
  }
383
+ .mui-adca5146416e:where([data-mendy-ui], [data-mendy-ui] *) {
384
+ flex-grow: 1;
385
+ }
367
386
  .mui-215061302c50:where([data-mendy-ui], [data-mendy-ui] *) {
368
387
  border-collapse: collapse;
369
388
  }
@@ -374,6 +393,12 @@
374
393
  --mendy-tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
375
394
  translate: var(--mendy-tw-translate-x) var(--mendy-tw-translate-y);
376
395
  }
396
+ .mui-4e3f08588318:where([data-mendy-ui], [data-mendy-ui] *) {
397
+ rotate: calc(45deg * -1);
398
+ }
399
+ .mui-c80411b7591f:where([data-mendy-ui], [data-mendy-ui] *) {
400
+ rotate: 45deg;
401
+ }
377
402
  .mui-aa214ea38326:where([data-mendy-ui], [data-mendy-ui] *) {
378
403
  transform: var(--mendy-tw-rotate-x,) var(--mendy-tw-rotate-y,) var(--mendy-tw-rotate-z,) var(--mendy-tw-skew-x,) var(--mendy-tw-skew-y,);
379
404
  }
@@ -389,6 +414,12 @@
389
414
  .mui-d343f41ba73e:where([data-mendy-ui], [data-mendy-ui] *) {
390
415
  cursor: default;
391
416
  }
417
+ .mui-f2e47d9c52ad:where([data-mendy-ui], [data-mendy-ui] *) {
418
+ cursor: grab;
419
+ }
420
+ .mui-d2fa8848968d:where([data-mendy-ui], [data-mendy-ui] *) {
421
+ cursor: pointer;
422
+ }
392
423
  .mui-739a9a000791:where([data-mendy-ui], [data-mendy-ui] *) {
393
424
  touch-action: none;
394
425
  }
@@ -550,6 +581,9 @@
550
581
  border-color: color-mix(in oklab, var(--muted-foreground, #737373) 50%, transparent);
551
582
  }
552
583
  }
584
+ .mui-515f9fdc6db7:where([data-mendy-ui], [data-mendy-ui] *) {
585
+ border-color: var(--primary, #171717);
586
+ }
553
587
  .mui-292affc1f780:where([data-mendy-ui], [data-mendy-ui] *) {
554
588
  background-color: var(--accent, #f5f5f5);
555
589
  }
@@ -637,6 +671,9 @@
637
671
  .mui-b5edc3ea7c91:where([data-mendy-ui], [data-mendy-ui] *) {
638
672
  padding-block: calc(var(--spacing) * 2);
639
673
  }
674
+ .mui-d3cea061f2f3:where([data-mendy-ui], [data-mendy-ui] *) {
675
+ padding-block: calc(var(--spacing) * 3);
676
+ }
640
677
  .mui-078d945937da:where([data-mendy-ui], [data-mendy-ui] *) {
641
678
  padding-inline-start: calc(var(--spacing) * 8);
642
679
  }
@@ -777,6 +814,13 @@
777
814
  --mendy-tw-shadow: 0 1px 2px 0 var(--mendy-tw-shadow-color, rgb(0 0 0 / 0.05));
778
815
  box-shadow: var(--mendy-tw-inset-shadow), var(--mendy-tw-inset-ring-shadow), var(--mendy-tw-ring-offset-shadow), var(--mendy-tw-ring-shadow), var(--mendy-tw-shadow);
779
816
  }
817
+ .mui-853be6c11609:where([data-mendy-ui], [data-mendy-ui] *) {
818
+ --mendy-tw-ring-shadow: var(--mendy-tw-ring-inset,) 0 0 0 calc(2px + var(--mendy-tw-ring-offset-width)) var(--mendy-tw-ring-color, currentcolor);
819
+ box-shadow: var(--mendy-tw-inset-shadow), var(--mendy-tw-inset-ring-shadow), var(--mendy-tw-ring-offset-shadow), var(--mendy-tw-ring-shadow), var(--mendy-tw-shadow);
820
+ }
821
+ .mui-fd9d0b696aac:where([data-mendy-ui], [data-mendy-ui] *) {
822
+ --mendy-tw-ring-color: var(--primary, #171717);
823
+ }
780
824
  .mui-59edd3d33673:where([data-mendy-ui], [data-mendy-ui] *) {
781
825
  --mendy-tw-outline-style: none;
782
826
  outline-style: none;
@@ -938,12 +982,6 @@
938
982
  border-inline-start-width: 0px;
939
983
  }
940
984
  }
941
- .mui-beeef6663906:where([data-mendy-ui], [data-mendy-ui] *) {
942
- &:last-child {
943
- border-inline-end-style: var(--mendy-tw-border-style);
944
- border-inline-end-width: 0px;
945
- }
946
- }
947
985
  .mui-37ad15a95595:where([data-mendy-ui], [data-mendy-ui] *) {
948
986
  &:hover {
949
987
  @media (hover: hover) {
@@ -971,6 +1009,16 @@
971
1009
  }
972
1010
  }
973
1011
  }
1012
+ .mui-5cbdd1b32f1a:where([data-mendy-ui], [data-mendy-ui] *) {
1013
+ &:hover {
1014
+ @media (hover: hover) {
1015
+ background-color: var(--muted, #f5f5f5);
1016
+ @supports (color: color-mix(in lab, red, red)) {
1017
+ background-color: color-mix(in oklab, var(--muted, #f5f5f5) 50%, transparent);
1018
+ }
1019
+ }
1020
+ }
1021
+ }
974
1022
  .mui-4273133a876a:where([data-mendy-ui], [data-mendy-ui] *) {
975
1023
  &:hover {
976
1024
  @media (hover: hover) {
@@ -1128,6 +1176,11 @@
1128
1176
  --mendy-tw-ring-inset: inset;
1129
1177
  }
1130
1178
  }
1179
+ .mui-71998ea7a2d0:where([data-mendy-ui], [data-mendy-ui] *) {
1180
+ &:active {
1181
+ cursor: grabbing;
1182
+ }
1183
+ }
1131
1184
  .mui-8d3c1014b967:where([data-mendy-ui], [data-mendy-ui] *) {
1132
1185
  &:disabled {
1133
1186
  pointer-events: none;
@@ -0,0 +1,9 @@
1
+ interface WidthColumn {
2
+ id: string;
3
+ size: number;
4
+ maxSize: number;
5
+ grow: number | false;
6
+ }
7
+ /** Allocate spare space without changing stored or user-resized column widths. */
8
+ export declare function distributeColumnWidths(columns: WidthColumn[], viewport: number | null): Map<string, number>;
9
+ export {};
@@ -0,0 +1,23 @@
1
+ /** Allocate spare space without changing stored or user-resized column widths. */
2
+ export function distributeColumnWidths(columns, viewport) {
3
+ const widths = new Map(columns.map((column) => [column.id, column.size]));
4
+ let spare = (viewport ?? 0) - columns.reduce((sum, column) => sum + column.size, 0);
5
+ let flexible = columns.filter((column) => typeof column.grow === "number" &&
6
+ Number.isFinite(column.grow) &&
7
+ column.grow > 0 &&
8
+ column.maxSize > column.size);
9
+ while (spare > 0.01 && flexible.length) {
10
+ const unit = flexible.reduce((max, column) => Math.max(max, Number(column.grow)), 0);
11
+ const weight = flexible.reduce((sum, column) => sum + Number(column.grow) / unit, 0);
12
+ let used = 0;
13
+ for (const column of flexible) {
14
+ const size = widths.get(column.id);
15
+ const extra = Math.min(column.maxSize - size, spare * (Number(column.grow) / unit / weight));
16
+ widths.set(column.id, size + extra);
17
+ used += extra;
18
+ }
19
+ spare -= used;
20
+ flexible = flexible.filter((column) => column.maxSize - widths.get(column.id) > 0.01);
21
+ }
22
+ return widths;
23
+ }
@@ -4,6 +4,8 @@ import type { DataTableFeatures } from "./features.js";
4
4
  export type TableColumn<T extends object> = ColumnDef<DataTableFeatures, T> & {
5
5
  label?: string;
6
6
  align?: "start" | "center" | "end";
7
+ /** Share of spare viewport width. Defaults to 1 for data columns, false for display columns. */
8
+ grow?: number | false;
7
9
  defaultHidden?: boolean;
8
10
  pin?: "start" | "end";
9
11
  copyValue?: (row: T) => string;
@@ -28,6 +30,7 @@ export interface ValueFormat<V> {
28
30
  interface ValueOptions<T extends object, V> {
29
31
  label: string;
30
32
  size?: number;
33
+ grow?: number | false;
31
34
  minSize?: number;
32
35
  maxSize?: number;
33
36
  hidden?: boolean;
@@ -48,6 +51,9 @@ interface ColumnBuilder<T extends object> {
48
51
  label: string;
49
52
  render: (row: T) => ReactNode;
50
53
  size?: number;
54
+ minSize?: number;
55
+ maxSize?: number;
56
+ grow?: number | false;
51
57
  pin?: "start" | "end";
52
58
  }): TableColumn<T>;
53
59
  }
@@ -9,6 +9,7 @@ function valueColumn(id, value, options) {
9
9
  header: options.label,
10
10
  label: options.label,
11
11
  size: options.size,
12
+ grow: options.grow,
12
13
  minSize: options.minSize,
13
14
  maxSize: options.maxSize,
14
15
  defaultHidden: options.hidden,
@@ -45,6 +46,9 @@ export function defineColumns(define) {
45
46
  label: options.label,
46
47
  header: options.label,
47
48
  size: options.size,
49
+ minSize: options.minSize,
50
+ maxSize: options.maxSize,
51
+ grow: options.grow ?? false,
48
52
  pin: options.pin,
49
53
  enableSorting: false,
50
54
  enableCellSelection: false,
@@ -0,0 +1,6 @@
1
+ import type { ReactNode } from "react";
2
+ import type { DataTableInstance } from "./use-data-table.js";
3
+ export declare function TableColumnSettings<T extends object>({ table, children, }: {
4
+ table: DataTableInstance<T>;
5
+ children?: ReactNode;
6
+ }): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,55 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { useId } from "react";
4
+ import { DragDropContext, Draggable, Droppable } from "@hello-pangea/dnd";
5
+ import { GripVertical, Pin, RotateCcw, SlidersHorizontal } from "lucide-react";
6
+ import { useMendyUI } from "../customization.js";
7
+ import { Button } from "../primitives/button.js";
8
+ import { Checkbox } from "../primitives/checkbox.js";
9
+ import { Popover, PopoverContent, PopoverTrigger } from "../primitives/popover.js";
10
+ import { cn } from "../utils.js";
11
+ import { applyTablePreferences } from "./use-data-table.js";
12
+ export function TableColumnSettings({ table, children, }) {
13
+ const id = useId();
14
+ const { portalContainer } = useMendyUI();
15
+ const columns = table.getAllLeafColumns();
16
+ const byId = new Map(columns.map((column) => [column.id, column]));
17
+ const order = [
18
+ ...new Set([...table.state.columnOrder, ...columns.map((column) => column.id)]),
19
+ ].filter((key) => byId.has(key));
20
+ const ordered = order.map((key) => byId.get(key));
21
+ const hidden = columns.filter((column) => !column.getIsVisible()).length;
22
+ const start = columns.filter((column) => column.getIsPinned() === "start").length;
23
+ const end = columns.filter((column) => column.getIsPinned() === "end").length;
24
+ const summary = [
25
+ hidden && `${hidden} hidden`,
26
+ start && `${start} pinned left`,
27
+ end && `${end} pinned right`,
28
+ ]
29
+ .filter(Boolean)
30
+ .join(", ");
31
+ function reorder(result) {
32
+ if (!result.destination || result.destination.index === result.source.index)
33
+ return;
34
+ const next = [...order];
35
+ const [moved] = next.splice(result.source.index, 1);
36
+ next.splice(result.destination.index, 0, moved);
37
+ table.setColumnOrder(next);
38
+ }
39
+ return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", size: "icon-sm", "aria-label": "Column settings", title: "Column settings", children: _jsx(SlidersHorizontal, { className: "mui-100c22d5776b" }) }) }), _jsxs(PopoverContent, { align: "end", "aria-label": "Column settings", className: "mui-222f930b8752 mui-a4cce7869436 mui-302c0d124a94 mui-04760bcd507f", onCloseAutoFocus: (event) => {
40
+ if (document.activeElement?.closest('[role="grid"]'))
41
+ event.preventDefault();
42
+ }, children: [_jsxs("div", { className: "mui-27ead27a81df mui-bbe39cfb5cc6 mui-9513b3968002 mui-d3cea061f2f3", children: [_jsx("h4", { className: "mui-c74ab393b96d mui-daaac3fbf55e", children: "Column settings" }), _jsx("p", { className: "mui-3992de70b033 mui-35f35c41d134", children: "Drag to reorder, toggle visibility, and pin columns." })] }), children, _jsx(DragDropContext, { onDragEnd: reorder, children: _jsx(Droppable, { droppableId: id, getContainerForClone: () => portalContainer ?? document.body, renderClone: (provided, snapshot, rubric) => (_jsx(ColumnSettingsRow, { column: ordered[rubric.source.index], provided: provided, dragging: snapshot.isDragging })), children: (provided) => (_jsxs("div", { ref: provided.innerRef, ...provided.droppableProps, className: "mui-410da8dfa8ac mui-da0beef015c9 mui-2368e909f3a5 mui-b97db4a9f432", children: [ordered.map((column, index) => (_jsx(Draggable, { draggableId: `${id}-${column.id}`, disableInteractiveElementBlocking: true, index: index, children: (provided, snapshot) => (_jsx(ColumnSettingsRow, { column: column, provided: provided, dragging: snapshot.isDragging })) }, column.id))), provided.placeholder] })) }) }), _jsxs("div", { className: "mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-32c92bb1fde4 mui-074569488cca mui-894c3815a57f mui-9513b3968002 mui-b5edc3ea7c91", children: [_jsx("p", { className: "mui-3992de70b033 mui-35f35c41d134", "aria-live": "polite", children: summary || "No changes" }), _jsxs(Button, { variant: "ghost", size: "sm", className: "mui-c8e50836f8a1 mui-e7e01cc7f4df mui-3992de70b033", "aria-label": "Reset columns", onClick: () => applyTablePreferences(table, { version: 1, ...table.initialState }), children: [_jsx(RotateCcw, { className: "mui-5e34f5313859" }), "Reset"] })] })] })] }));
43
+ }
44
+ function ColumnSettingsRow({ column, provided, dragging, }) {
45
+ const definition = column.columnDef;
46
+ const label = definition.label ?? (typeof definition.header === "string" ? definition.header : column.id);
47
+ const pin = column.getIsPinned();
48
+ const next = pin === "start" ? "end" : pin === "end" ? false : "start";
49
+ const pinLabel = next === "start"
50
+ ? `Pin ${label} to left`
51
+ : next === "end"
52
+ ? `Pin ${label} to right`
53
+ : `Unpin ${label}`;
54
+ return (_jsxs("div", { ref: provided.innerRef, ...provided.draggableProps, "data-mendy-ui": "", "data-column-setting": column.id, "data-dragging": dragging, style: provided.draggableProps.style, className: cn("mui-222f930b8752 mui-71556df3b421 mui-074569488cca mui-3fa8c572949b mui-5b272f3c5076 mui-e7e01cc7f4df mui-a8c1dfb1d4ef mui-c74ab393b96d mui-957a109f887f", dragging ? "mui-3eef1ce97dba mui-0d4ca75de41c mui-853be6c11609 mui-fd9d0b696aac" : "mui-5cbdd1b32f1a"), children: [_jsx("button", { type: "button", ...provided.dragHandleProps, "aria-label": `Reorder ${label}`, title: "Drag to reorder. Press Space to move with arrow keys.", className: "mui-222f930b8752 mui-2bd43fb57913 mui-27ead27a81df mui-f2e47d9c52ad mui-71556df3b421 mui-a503dd374cca mui-02e603944040 mui-35f35c41d134 mui-b30fc56058b6 mui-355efe22aedb mui-db549d38ff19 mui-71998ea7a2d0", children: _jsx(GripVertical, { className: "mui-61c000c8a98a" }) }), _jsxs("label", { className: "mui-222f930b8752 mui-184ddc11e5f9 mui-7bd5bab6d7f4 mui-d2fa8848968d mui-71556df3b421 mui-074569488cca", children: [_jsx(Checkbox, { checked: column.getIsVisible(), disabled: !column.getCanHide(), onCheckedChange: (value) => column.toggleVisibility(value === true), "aria-label": `Show ${label}` }), _jsx("span", { className: "mui-5a3a4ee420c2", title: label, children: label })] }), _jsx(Button, { variant: "ghost", size: "icon-sm", disabled: !column.getCanPin(), "aria-label": pinLabel, title: pinLabel, className: cn("mui-0712570dcc9f mui-27ead27a81df", pin && "mui-87ecb59f2d2d"), onClick: () => column.pin(next), children: _jsx(Pin, { className: cn("mui-61c000c8a98a", pin === "start" && "mui-4e3f08588318", pin === "end" && "mui-c80411b7591f", !pin && "mui-35f35c41d134") }) })] }));
55
+ }
@@ -2,9 +2,7 @@ import type { ReactNode } from "react";
2
2
  import type { DataTableInstance } from "./use-data-table.js";
3
3
  import type { TableColumn } from "./columns.js";
4
4
  import type { SavedTableView } from "./state.js";
5
- export declare function TableColumnSettings<T extends object>({ table }: {
6
- table: DataTableInstance<T>;
7
- }): import("react/jsx-runtime").JSX.Element;
5
+ export { TableColumnSettings } from "./table-column-settings.js";
8
6
  export declare function TablePagination<T extends object>({ table, loading, }: {
9
7
  table: DataTableInstance<T>;
10
8
  loading?: boolean;
@@ -1,53 +1,12 @@
1
1
  "use client";
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
3
3
  import { useState } from "react";
4
- import { ChevronLeft, ChevronRight, SlidersHorizontal } from "lucide-react";
4
+ import { ChevronLeft, ChevronRight } from "lucide-react";
5
5
  import { Button } from "../primitives/button.js";
6
6
  import { Checkbox } from "../primitives/checkbox.js";
7
7
  import { Input } from "../primitives/input.js";
8
- import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, } from "../primitives/dropdown-menu.js";
9
- import { applyTablePreferences } from "./use-data-table.js";
10
- export function TableColumnSettings({ table }) {
11
- const columns = table.getAllLeafColumns();
12
- const byId = new Map(columns.map((column) => [column.id, column]));
13
- const orderedIds = new Set(table.state.columnOrder);
14
- const order = [
15
- ...table.state.columnOrder,
16
- ...columns.map((column) => column.id).filter((id) => !orderedIds.has(id)),
17
- ];
18
- function move(id, delta) {
19
- const next = [...order], index = next.indexOf(id), destination = index + delta;
20
- if (index < 0 || destination < 0 || destination >= next.length)
21
- return;
22
- next.splice(index, 1);
23
- next.splice(destination, 0, id);
24
- table.setColumnOrder(next);
25
- }
26
- return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", size: "sm", "aria-label": "Column settings", children: [_jsx(SlidersHorizontal, { className: "mui-100c22d5776b" }), _jsx("span", { children: "Columns" })] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "mui-b057efba3283 mui-72b37c1a040d mui-1a26a0d28420", "aria-label": "Column settings", onCloseAutoFocus: (event) => {
27
- // The close animation can finish after the user has already selected a cell.
28
- if (document.activeElement?.closest('[role="grid"]'))
29
- event.preventDefault();
30
- }, children: [order.map((id, index) => {
31
- const column = byId.get(id);
32
- if (!column)
33
- return null;
34
- const definition = column.columnDef;
35
- const label = definition.label ?? (typeof definition.header === "string" ? definition.header : id);
36
- return (_jsxs(DropdownMenuSub, { children: [_jsx(DropdownMenuSubTrigger, { children: label }), _jsxs(DropdownMenuSubContent, { children: [_jsx(DropdownMenuCheckboxItem, { checked: column.getIsVisible(), disabled: !column.getCanHide(), onSelect: (event) => event.preventDefault(), onCheckedChange: (value) => column.toggleVisibility(value), children: "Visible" }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuItem, { disabled: !column.getCanPin(), onSelect: (event) => {
37
- event.preventDefault();
38
- column.pin(column.getIsPinned() === "start" ? false : "start");
39
- }, children: [" ", column.getIsPinned() === "start" ? "Unpin" : "Pin to start"] }), _jsx(DropdownMenuItem, { disabled: !column.getCanPin(), onSelect: (event) => {
40
- event.preventDefault();
41
- column.pin(column.getIsPinned() === "end" ? false : "end");
42
- }, children: column.getIsPinned() === "end" ? "Unpin" : "Pin to end" }), _jsx(DropdownMenuItem, { disabled: index === 0, onSelect: (event) => {
43
- event.preventDefault();
44
- move(id, -1);
45
- }, children: "Move earlier" }), _jsx(DropdownMenuItem, { disabled: index === order.length - 1, onSelect: (event) => {
46
- event.preventDefault();
47
- move(id, 1);
48
- }, children: "Move later" })] })] }, id));
49
- }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { onSelect: () => applyTablePreferences(table, { version: 1, ...table.initialState }), children: "Reset columns" })] })] }));
50
- }
8
+ import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, } from "../primitives/dropdown-menu.js";
9
+ export { TableColumnSettings } from "./table-column-settings.js";
51
10
  export function TablePagination({ table, loading, }) {
52
11
  return (_jsxs("nav", { "data-mendy-ui": "", "aria-label": "Table pagination", className: "mui-222f930b8752 mui-faa8a23c68f6 mui-71556df3b421 mui-307644c34db6 mui-d7db3451d154 mui-b5edc3ea7c91 mui-c74ab393b96d", children: [_jsxs("span", { children: ["Page ", table.state.pagination.pageIndex + 1, table.getPageCount() >= 0 ? ` of ${Math.max(1, table.getPageCount())}` : ""] }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "outline", size: "sm", children: [table.state.pagination.pageSize, " rows"] }) }), _jsx(DropdownMenuContent, { children: [10, 20, 50, 100].map((size) => (_jsxs(DropdownMenuItem, { onSelect: () => table.setPageSize(size), children: [size, " rows"] }, size))) })] }), _jsx(Button, { variant: "outline", size: "icon-sm", disabled: loading || !table.getCanPreviousPage(), "aria-label": "Previous page", onClick: () => table.previousPage(), children: _jsx(ChevronLeft, { className: "mui-100c22d5776b" }) }), _jsx(Button, { variant: "outline", size: "icon-sm", disabled: loading || !table.getCanNextPage(), "aria-label": "Next page", onClick: () => table.nextPage(), children: _jsx(ChevronRight, { className: "mui-100c22d5776b" }) })] }));
53
12
  }
@@ -1,3 +1,4 @@
1
+ import { distributeColumnWidths } from "./column-widths.js";
1
2
  /** Keep headers, skeletons, and loaded cells on the same column geometry. */
2
3
  export function tableLayout(table, viewportWidth, rowHeight) {
3
4
  const columns = [
@@ -5,29 +6,41 @@ export function tableLayout(table, viewportWidth, rowHeight) {
5
6
  ...table.getCenterVisibleLeafColumns(),
6
7
  ...table.getEndVisibleLeafColumns(),
7
8
  ];
8
- const totalWidth = columns.reduce((sum, column) => sum + column.getSize(), 0);
9
+ const widths = distributeColumnWidths(columns.map((column) => {
10
+ const definition = column.columnDef;
11
+ return {
12
+ id: column.id,
13
+ size: column.getSize(),
14
+ maxSize: definition.maxSize ?? 1200,
15
+ grow: Object.hasOwn(table.state.columnSizing, column.id)
16
+ ? false
17
+ : (definition.grow ?? (column.accessorFn ? 1 : false)),
18
+ };
19
+ }), viewportWidth);
20
+ const size = (column) => widths.get(column.id);
21
+ const totalWidth = columns.reduce((sum, column) => sum + size(column), 0);
9
22
  const pinnedWidth = [
10
23
  ...table.getStartVisibleLeafColumns(),
11
24
  ...table.getEndVisibleLeafColumns(),
12
- ].reduce((sum, column) => sum + column.getSize(), 0);
25
+ ].reduce((sum, column) => sum + size(column), 0);
13
26
  // Preserve stored pins, but leave room to reach the middle columns on narrow screens.
14
27
  const pinningActive = (viewportWidth ?? Infinity) >= Math.min(totalWidth, pinnedWidth + 120);
15
28
  const positions = new Map();
16
29
  let offset = 0;
17
30
  for (const column of table.getStartVisibleLeafColumns()) {
18
31
  positions.set(column.id, { side: "left", offset });
19
- offset += column.getSize();
32
+ offset += size(column);
20
33
  }
21
34
  offset = 0;
22
35
  for (const column of [...table.getEndVisibleLeafColumns()].reverse()) {
23
36
  positions.set(column.id, { side: "right", offset });
24
- offset += column.getSize();
37
+ offset += size(column);
25
38
  }
26
39
  function cellStyle(column) {
27
40
  const pin = pinningActive ? positions.get(column.id) : undefined;
28
41
  return {
29
- width: column.getSize(),
30
- minWidth: column.getSize(),
42
+ width: size(column),
43
+ minWidth: size(column),
31
44
  height: rowHeight,
32
45
  ...(column.id === table.getEndVisibleLeafColumns()[0]?.id
33
46
  ? { marginInlineStart: "auto" }
@@ -10,7 +10,7 @@ export function TableHeaderCell({ table, header, index, style, renderHeader, con
10
10
  const definition = column.columnDef;
11
11
  const title = definition.label ?? (typeof definition.header === "string" ? definition.header : column.id);
12
12
  const sorted = column.getIsSorted();
13
- return (_jsxs("div", { role: "columnheader", "aria-colindex": index + 1, "aria-sort": sorted === "asc" ? "ascending" : sorted === "desc" ? "descending" : undefined, style: style, className: "mui-d2d9e1f13413 mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-19e97f3f40e6 mui-3b6d5fc7b061 mui-5b272f3c5076 mui-0f9e6672913a mui-daaac3fbf55e mui-35f35c41d134 mui-beeef6663906", children: [_jsx("div", { className: cn("mui-184ddc11e5f9 mui-7bd5bab6d7f4 mui-d5111d0e9f48", (renderHeader || typeof definition.header === "function") && contentClassName), children: _jsx(TableHeaderContent, { header: header, renderHeader: renderHeader, title: title }) }), column.getCanResize() && _jsx(TableResizeHandle, { table: table, header: header, title: title })] }, column.id));
13
+ return (_jsxs("div", { role: "columnheader", "aria-colindex": index + 1, "aria-sort": sorted === "asc" ? "ascending" : sorted === "desc" ? "descending" : undefined, style: style, className: "mui-d2d9e1f13413 mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-19e97f3f40e6 mui-3b6d5fc7b061 mui-5b272f3c5076 mui-0f9e6672913a mui-daaac3fbf55e mui-35f35c41d134", children: [_jsx("div", { className: cn("mui-184ddc11e5f9 mui-7bd5bab6d7f4 mui-d5111d0e9f48", (renderHeader || typeof definition.header === "function") && contentClassName), children: _jsx(TableHeaderContent, { header: header, renderHeader: renderHeader, title: title }) }), column.getCanResize() && (_jsx(TableResizeHandle, { table: table, header: header, title: title, width: Number(style.width) }))] }, column.id));
14
14
  }
15
15
  export function TableBodyRow({ row, rowIndex, start, rowHeight, cellStyle, focusedId, copied, contentClassName, onRowActivate, isRowHighlighted, }) {
16
16
  const cells = [
@@ -22,14 +22,7 @@ export function TableBodyRow({ row, rowIndex, start, rowHeight, cellStyle, focus
22
22
  const selected = cell.getIsSelected();
23
23
  const definition = cell.column.columnDef;
24
24
  const edge = selected ? cell.getSelectionEdges() : null;
25
- return (_jsx("div", { role: "gridcell", "aria-colindex": index + 1, "aria-selected": selected, "data-row-id": row.id, "data-column-id": cell.column.id, tabIndex: focusedId ? (focusedId === cell.id ? 0 : -1) : rowIndex === 0 && index === 0 ? 0 : -1, style: {
26
- ...cellStyle(cell.column),
27
- ...(selected
28
- ? {
29
- boxShadow: `${edge?.top ? "inset 0 2px var(--primary)," : ""}${edge?.bottom ? "inset 0 -2px var(--primary)," : ""}${edge?.left ? "inset 2px 0 var(--primary)," : ""}${edge?.right ? "inset -2px 0 var(--primary)," : ""} inset 0 0 0 0 transparent`,
30
- }
31
- : {}),
32
- }, className: cn("mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-d5111d0e9f48 mui-bbe39cfb5cc6 mui-3b6d5fc7b061 mui-5b272f3c5076 mui-0f9e6672913a mui-97b1c00ff005 mui-e6020023567a mui-a47d391255f3 mui-a8719ed8b095 mui-2b1c7d88acff", definition.align === "end" && "mui-307644c34db6 mui-10558dbb3a24", definition.align === "center" && "mui-a503dd374cca mui-05ab12448317", selected && "mui-292affc1f780", selected && copied && "mui-047624ec0c39 mui-d254c96aea74"), onMouseDown: (event) => {
25
+ return (_jsxs("div", { role: "gridcell", "aria-colindex": index + 1, "aria-selected": selected, "data-row-id": row.id, "data-column-id": cell.column.id, tabIndex: focusedId ? (focusedId === cell.id ? 0 : -1) : rowIndex === 0 && index === 0 ? 0 : -1, style: cellStyle(cell.column), className: cn("mui-d2d9e1f13413 mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-bbe39cfb5cc6 mui-3b6d5fc7b061 mui-5b272f3c5076 mui-0f9e6672913a mui-97b1c00ff005 mui-e6020023567a mui-a47d391255f3 mui-a8719ed8b095 mui-2b1c7d88acff", definition.align === "end" && "mui-307644c34db6 mui-10558dbb3a24", definition.align === "center" && "mui-a503dd374cca mui-05ab12448317", selected && "mui-292affc1f780", selected && copied && "mui-047624ec0c39 mui-d254c96aea74"), onMouseDown: (event) => {
33
26
  if (event.button !== 0 ||
34
27
  event.detail > 1 ||
35
28
  !cell.getCanSelect() ||
@@ -43,25 +36,52 @@ export function TableBodyRow({ row, rowIndex, start, rowHeight, cellStyle, focus
43
36
  }, onMouseEnter: cell.getSelectionExtendHandler(), onDoubleClick: (event) => {
44
37
  if (!event.target.closest(interactiveSelector))
45
38
  onRowActivate?.(row.original);
46
- }, children: _jsx("div", { className: cn("mui-184ddc11e5f9 mui-81b198a2db84 mui-5a3a4ee420c2", contentClassName), children: flexRender(cell.column.columnDef.cell ?? (() => String(cell.getValue() ?? "")), cell.getContext()) }) }, cell.id));
39
+ }, children: [selected && (_jsx("span", { "aria-hidden": "true", "data-selection-outline": "", className: "mui-33228ff7d583 mui-747355bdc2a2 mui-d7efd1b0b0f9 mui-515f9fdc6db7", style: {
40
+ top: edge?.top ? 0 : -1,
41
+ bottom: edge?.bottom ? -1 : -2,
42
+ left: -Number(cellStyle(cell.column).borderLeftWidth ?? 0),
43
+ right: -Number(cellStyle(cell.column).borderRightWidth ?? 1),
44
+ borderTopWidth: edge?.top ? 2 : 0,
45
+ borderBottomWidth: edge?.bottom ? 2 : 0,
46
+ borderLeftWidth: edge?.left ? 2 : 0,
47
+ borderRightWidth: edge?.right ? 2 : 0,
48
+ } })), _jsx("div", { className: cn("mui-7bd696ca6be3 mui-184ddc11e5f9 mui-81b198a2db84 mui-5a3a4ee420c2", contentClassName), children: flexRender(cell.column.columnDef.cell ?? (() => String(cell.getValue() ?? "")), cell.getContext()) })] }, cell.id));
47
49
  }) }, row.id));
48
50
  }
49
- function TableResizeHandle({ table, header, title, }) {
51
+ function TableResizeHandle({ table, header, title, width, }) {
50
52
  const column = header.column;
51
- return (_jsx("div", { role: "separator", tabIndex: 0, "aria-label": `Resize ${title}`, "aria-orientation": "vertical", "aria-valuenow": Math.round(column.getSize()), "aria-valuemin": column.columnDef.minSize ?? 48, "aria-valuemax": column.columnDef.maxSize ?? 1200, onDoubleClick: () => column.resetSize(), onMouseDown: header.getResizeHandler(), onTouchStart: header.getResizeHandler(), onKeyDown: (event) => {
53
+ const beginResize = (event) => {
54
+ if ("touches" in event && event.touches.length > 1)
55
+ return;
56
+ if ("button" in event) {
57
+ if (event.button !== 0)
58
+ return;
59
+ event.preventDefault();
60
+ event.currentTarget.focus({ preventScroll: true });
61
+ }
62
+ // Start dragging from the visible width, not the smaller configured base width.
63
+ header.getResizeHandler()(event);
64
+ table.setColumnSizing((sizes) => ({ ...sizes, [column.id]: width }));
65
+ table.setColumnResizing((state) => ({
66
+ ...state,
67
+ startSize: width,
68
+ columnSizingStart: [[column.id, width]],
69
+ }));
70
+ };
71
+ return (_jsx("div", { role: "separator", tabIndex: 0, "aria-label": `Resize ${title}`, "aria-orientation": "vertical", "aria-valuenow": Math.round(width), "aria-valuemin": column.columnDef.minSize ?? 48, "aria-valuemax": column.columnDef.maxSize ?? 1200, onDoubleClick: () => column.resetSize(), onMouseDown: beginResize, onTouchStart: beginResize, onKeyDown: (event) => {
52
72
  if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
53
73
  event.preventDefault();
54
74
  event.stopPropagation();
55
75
  table.setColumnSizing((sizes) => ({
56
76
  ...sizes,
57
- [column.id]: Math.min(column.columnDef.maxSize ?? 1200, Math.max(column.columnDef.minSize ?? 48, column.getSize() + (event.key === "ArrowLeft" ? -10 : 10))),
77
+ [column.id]: Math.min(column.columnDef.maxSize ?? 1200, Math.max(column.columnDef.minSize ?? 48, width + (event.key === "ArrowLeft" ? -10 : 10))),
58
78
  }));
59
79
  }
60
- }, className: "mui-747355bdc2a2 mui-eb9e48c5dda9 mui-a74c4477017c mui-418e44ad4f9e mui-d4ea834145ae mui-2194d094b585 mui-739a9a000791 mui-4273133a876a mui-2f669cfad5aa mui-2e357972fc10" }));
80
+ }, className: "mui-747355bdc2a2 mui-eb9e48c5dda9 mui-a74c4477017c mui-418e44ad4f9e mui-d4ea834145ae mui-2194d094b585 mui-739a9a000791 mui-78905c9e865c mui-4273133a876a mui-2f669cfad5aa mui-2e357972fc10" }));
61
81
  }
62
82
  function TableHeaderContent({ header, renderHeader, title, }) {
63
83
  const column = header.column;
64
84
  const definition = column.columnDef;
65
85
  const sorted = column.getIsSorted();
66
- return renderHeader ? (renderHeader(header)) : typeof definition.header === "function" ? (flexRender(definition.header, header.getContext())) : !column.getCanSort() ? (_jsx("span", { className: "mui-496aca80e4d8 mui-5a3a4ee420c2", title: title, children: title })) : (_jsxs(Button, { variant: "ghost", size: "sm", className: "mui-1fb07b38c63b mui-81b198a2db84 mui-c62ec162662e mui-19e97f3f40e6 mui-16e909e6f01d mui-daaac3fbf55e", onClick: column.getToggleSortingHandler(), title: title, children: [_jsx("span", { className: "mui-5a3a4ee420c2", children: title }), sorted === "asc" ? (_jsx(ArrowUp, { className: "mui-5e34f5313859 mui-27ead27a81df" })) : sorted === "desc" ? (_jsx(ArrowDown, { className: "mui-5e34f5313859 mui-27ead27a81df" })) : null] }));
86
+ return renderHeader ? (renderHeader(header)) : typeof definition.header === "function" ? (flexRender(definition.header, header.getContext())) : !column.getCanSort() ? (_jsx("span", { className: "mui-496aca80e4d8 mui-5a3a4ee420c2", title: title, children: title })) : (_jsxs(Button, { variant: "ghost", size: "sm", className: "mui-1fb07b38c63b mui-81b198a2db84 mui-c62ec162662e mui-19e97f3f40e6 mui-16e909e6f01d mui-daaac3fbf55e mui-35f35c41d134 mui-71863717995b mui-4d6720d47806", onClick: column.getToggleSortingHandler(), title: title, children: [_jsx("span", { className: "mui-5a3a4ee420c2", children: title }), sorted === "asc" ? (_jsx(ArrowUp, { className: "mui-5e34f5313859 mui-27ead27a81df" })) : sorted === "desc" ? (_jsx(ArrowDown, { className: "mui-5e34f5313859 mui-27ead27a81df" })) : null] }));
67
87
  }
@@ -45,10 +45,18 @@ export function TableView({ table, label = "Data table", height = "min(65dvh, 64
45
45
  useLayoutEffect(() => {
46
46
  load.current = loadMore;
47
47
  }, [loadMore]);
48
+ useEffect(() => {
49
+ requested.current = null;
50
+ }, [queryKey]);
48
51
  useEffect(() => {
49
52
  const data = load.current;
50
53
  const requestKey = `${queryKey}:${rows.length}`;
51
- if (!data?.available ||
54
+ const element = container.current;
55
+ // The virtual range can briefly describe the previous query after scroll resets.
56
+ const nearEnd = element &&
57
+ element.scrollTop + element.clientHeight + rowHeight * 10 >= (rows.length + 1) * rowHeight;
58
+ if (!nearEnd ||
59
+ !data?.available ||
52
60
  data.loading ||
53
61
  data.error ||
54
62
  last < rows.length - 10 ||
@@ -60,7 +68,15 @@ export function TableView({ table, label = "Data table", height = "min(65dvh, 64
60
68
  .catch(() => {
61
69
  requested.current = null;
62
70
  });
63
- }, [last, rows.length, queryKey, loadMore?.available, loadMore?.loading, loadMore?.error]);
71
+ }, [
72
+ last,
73
+ rows.length,
74
+ rowHeight,
75
+ queryKey,
76
+ loadMore?.available,
77
+ loadMore?.loading,
78
+ loadMore?.error,
79
+ ]);
64
80
  const focused = table.getFocusedCell();
65
81
  const headersById = new Map(table.getFlatHeaders().map((header) => [header.column.id, header]));
66
82
  return (_jsxs("div", { "data-mendy-ui": "", className: "mui-184ddc11e5f9", children: [_jsx("div", { "aria-live": "polite", className: "mui-32fb090591d9", children: announcement }), _jsxs("div", { ref: setContainer, role: "grid", "aria-label": label, "aria-rowcount": rows.length + 1, "aria-colcount": columns.length, "aria-busy": status === "loading" || refreshing, style: { height }, className: cn("mui-d2d9e1f13413 mui-014aadadffad mui-1a26a0d28420 mui-3fa8c572949b mui-4f1a55de40bc mui-5b272f3c5076 mui-c74ab393b96d mui-b30fc56058b6", className), onKeyDown: onKeyDown, children: [_jsx("div", { role: "row", "aria-rowindex": 1, className: "mui-964a9431ff49 mui-98599e4ee250 mui-4e8f0a87a0dc mui-222f930b8752 mui-2bf6510f1330 mui-bbe39cfb5cc6 mui-5b272f3c5076", style: { width: totalWidth }, children: columns.map((column, index) => (_jsx(TableHeaderCell, { table: table, header: headersById.get(column.id), index: index, style: cellStyle(column), renderHeader: renderHeader, contentClassName: contentClassName }, column.id))) }), _jsx(TableInitialState, { status: status, hasRows: rows.length > 0, loadingState: loadingState ?? (_jsx(TableLoadingRows, { columns: columns, width: totalWidth, rowHeight: rowHeight, cellStyle: cellStyle, count: Math.max(1, Math.ceil(((virtual.scrollRect?.height ?? 400) - rowHeight) / rowHeight)) })), emptyState: emptyState, error: error, retry: retry }), _jsx("div", { role: "rowgroup", className: "mui-d2d9e1f13413 mui-2bf6510f1330", style: { height: virtual.getTotalSize(), width: totalWidth }, children: items.map((item) => (_jsx(TableBodyRow, { row: rows[item.index], rowIndex: item.index, start: item.start, rowHeight: rowHeight, cellStyle: cellStyle, focusedId: focused?.id, copied: copied, contentClassName: contentClassName, onRowActivate: onRowActivate, isRowHighlighted: isRowHighlighted }, item.key))) }), rows.length > 0 && status === "error" && (_jsxs("div", { role: "alert", className: "mui-964a9431ff49 mui-30150dd033ab mui-5b272f3c5076 mui-094f5333853b", children: [error ?? "Could not refresh rows.", retry && (_jsx(Button, { onClick: retry, variant: "outline", size: "sm", children: "Retry" }))] })), loadMore?.available && (_jsxs("div", { className: "mui-964a9431ff49 mui-635702706586 mui-222f930b8752 mui-a503dd374cca mui-b97db4a9f432", children: [_jsx(Button, { size: "sm", variant: "ghost", disabled: loadMore.loading, onClick: () => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mendylanda/ui",
3
- "version": "0.3.0-alpha.1",
3
+ "version": "0.3.0-alpha.3",
4
4
  "description": "Mendy Landa’s reusable React components. Typed filters and tables with shared interaction behavior and customizable UI.",
5
5
  "homepage": "https://ui.mendylanda.com",
6
6
  "license": "MIT",
@@ -77,9 +77,11 @@
77
77
  "prepack": "pnpm build"
78
78
  },
79
79
  "dependencies": {
80
+ "@hello-pangea/dnd": "18.0.1",
80
81
  "@radix-ui/react-checkbox": "^1.3.3",
81
82
  "@radix-ui/react-dropdown-menu": "^2.1.16",
82
83
  "@radix-ui/react-label": "^2.1.7",
84
+ "@radix-ui/react-popover": "1.1.15",
83
85
  "@radix-ui/react-slot": "^1.2.3",
84
86
  "@tanstack/react-table": "9.2.4",
85
87
  "@tanstack/react-virtual": "^3.14.11",