@mendylanda/ui 0.3.0-alpha.0 → 0.3.0-alpha.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/class-names.js +1 -1
- package/dist/primitives/popover.d.ts +5 -0
- package/dist/primitives/popover.js +10 -0
- package/dist/styles.css +58 -21
- package/dist/styles.tailwind3.css +58 -21
- package/dist/table/table-column-settings.d.ts +6 -0
- package/dist/table/table-column-settings.js +55 -0
- package/dist/table/table-controls.d.ts +1 -3
- package/dist/table/table-controls.js +4 -41
- package/dist/table/table-feedback.js +1 -1
- package/dist/table/table-layout.d.ts +43 -0
- package/dist/table/table-layout.js +51 -0
- package/dist/table/table-loading.d.ts +11 -0
- package/dist/table/table-loading.js +5 -0
- package/dist/table/table-parts.js +2 -2
- package/dist/table/table-view.js +4 -36
- package/package.json +4 -2
package/dist/class-names.js
CHANGED
|
@@ -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-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-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-b8ceaab118a4":"space-y-3","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-01024deec75e":"rounded","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-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-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-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-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
|
@@ -209,6 +209,10 @@
|
|
|
209
209
|
width: calc(var(--spacing) * 4);
|
|
210
210
|
height: calc(var(--spacing) * 4);
|
|
211
211
|
}
|
|
212
|
+
.mui-2bd43fb57913:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
213
|
+
width: calc(var(--spacing) * 5);
|
|
214
|
+
height: calc(var(--spacing) * 5);
|
|
215
|
+
}
|
|
212
216
|
.mui-0712570dcc9f:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
213
217
|
width: calc(var(--spacing) * 6);
|
|
214
218
|
height: calc(var(--spacing) * 6);
|
|
@@ -239,12 +243,18 @@
|
|
|
239
243
|
.mui-c7d5500b77ab:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
240
244
|
height: calc(var(--spacing) * 0);
|
|
241
245
|
}
|
|
246
|
+
.mui-2edce89ef182:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
247
|
+
height: calc(var(--spacing) * 3);
|
|
248
|
+
}
|
|
242
249
|
.mui-099be97e1fa4:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
243
250
|
height: calc(var(--spacing) * 4);
|
|
244
251
|
}
|
|
245
252
|
.mui-ce1945804664:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
246
253
|
height: calc(var(--spacing) * 6);
|
|
247
254
|
}
|
|
255
|
+
.mui-c8e50836f8a1:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
256
|
+
height: calc(var(--spacing) * 7);
|
|
257
|
+
}
|
|
248
258
|
.mui-1fb07b38c63b:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
249
259
|
height: calc(var(--spacing) * 8);
|
|
250
260
|
}
|
|
@@ -269,8 +279,11 @@
|
|
|
269
279
|
.mui-1f061e70178e:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
270
280
|
max-height: var(--radix-dropdown-menu-content-available-height);
|
|
271
281
|
}
|
|
272
|
-
.mui-
|
|
273
|
-
max-height:
|
|
282
|
+
.mui-4d3f1304ebb2:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
283
|
+
max-height: var(--radix-popover-content-available-height);
|
|
284
|
+
}
|
|
285
|
+
.mui-da0beef015c9:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
286
|
+
max-height: 400px;
|
|
274
287
|
}
|
|
275
288
|
.mui-80baa5d03af7:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
276
289
|
max-height: calc(var(--filter-menu-height) - 2px);
|
|
@@ -302,18 +315,21 @@
|
|
|
302
315
|
.mui-d4ea834145ae:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
303
316
|
width: calc(var(--spacing) * 2);
|
|
304
317
|
}
|
|
318
|
+
.mui-56bb14cbd1fe:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
319
|
+
width: calc(2 / 3 * 100%);
|
|
320
|
+
}
|
|
305
321
|
.mui-8867d85ed290:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
306
322
|
width: calc(var(--spacing) * 8);
|
|
307
323
|
}
|
|
308
324
|
.mui-4ac4ec8dfbce:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
309
325
|
width: calc(var(--spacing) * 40);
|
|
310
326
|
}
|
|
311
|
-
.mui-72b37c1a040d:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
312
|
-
width: calc(var(--spacing) * 64);
|
|
313
|
-
}
|
|
314
327
|
.mui-37535002f0f7:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
315
328
|
width: calc(var(--spacing) * 72);
|
|
316
329
|
}
|
|
330
|
+
.mui-a4cce7869436:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
331
|
+
width: 300px;
|
|
332
|
+
}
|
|
317
333
|
.mui-fc6a57ff7553:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
318
334
|
width: var(--mendy-filter-editor-width,19rem);
|
|
319
335
|
}
|
|
@@ -369,6 +385,12 @@
|
|
|
369
385
|
--mendy-tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
|
|
370
386
|
translate: var(--mendy-tw-translate-x) var(--mendy-tw-translate-y);
|
|
371
387
|
}
|
|
388
|
+
.mui-4e3f08588318:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
389
|
+
rotate: calc(45deg * -1);
|
|
390
|
+
}
|
|
391
|
+
.mui-c80411b7591f:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
392
|
+
rotate: 45deg;
|
|
393
|
+
}
|
|
372
394
|
.mui-aa214ea38326:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
373
395
|
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,);
|
|
374
396
|
}
|
|
@@ -384,6 +406,12 @@
|
|
|
384
406
|
.mui-d343f41ba73e:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
385
407
|
cursor: default;
|
|
386
408
|
}
|
|
409
|
+
.mui-f2e47d9c52ad:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
410
|
+
cursor: grab;
|
|
411
|
+
}
|
|
412
|
+
.mui-d2fa8848968d:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
413
|
+
cursor: pointer;
|
|
414
|
+
}
|
|
387
415
|
.mui-739a9a000791:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
388
416
|
touch-action: none;
|
|
389
417
|
}
|
|
@@ -455,13 +483,6 @@
|
|
|
455
483
|
margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--mendy-tw-space-y-reverse)));
|
|
456
484
|
}
|
|
457
485
|
}
|
|
458
|
-
.mui-b8ceaab118a4:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
459
|
-
:where(& > :not(:last-child)) {
|
|
460
|
-
--mendy-tw-space-y-reverse: 0;
|
|
461
|
-
margin-block-start: calc(calc(var(--spacing) * 3) * var(--mendy-tw-space-y-reverse));
|
|
462
|
-
margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--mendy-tw-space-y-reverse)));
|
|
463
|
-
}
|
|
464
|
-
}
|
|
465
486
|
.mui-5a3a4ee420c2:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
466
487
|
overflow: hidden;
|
|
467
488
|
text-overflow: ellipsis;
|
|
@@ -485,9 +506,6 @@
|
|
|
485
506
|
.mui-998780cdef87:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
486
507
|
overscroll-behavior: contain;
|
|
487
508
|
}
|
|
488
|
-
.mui-01024deec75e:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
489
|
-
border-radius: 0.25rem;
|
|
490
|
-
}
|
|
491
509
|
.mui-b005d61d0953:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
492
510
|
border-radius: calc(infinity * 1px);
|
|
493
511
|
}
|
|
@@ -642,6 +660,9 @@
|
|
|
642
660
|
.mui-b5edc3ea7c91:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
643
661
|
padding-block: calc(var(--spacing) * 2);
|
|
644
662
|
}
|
|
663
|
+
.mui-d3cea061f2f3:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
664
|
+
padding-block: calc(var(--spacing) * 3);
|
|
665
|
+
}
|
|
645
666
|
.mui-078d945937da:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
646
667
|
padding-inline-start: calc(var(--spacing) * 8);
|
|
647
668
|
}
|
|
@@ -782,6 +803,13 @@
|
|
|
782
803
|
--mendy-tw-shadow: 0 1px 2px 0 var(--mendy-tw-shadow-color, rgb(0 0 0 / 0.05));
|
|
783
804
|
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);
|
|
784
805
|
}
|
|
806
|
+
.mui-853be6c11609:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
807
|
+
--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);
|
|
808
|
+
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);
|
|
809
|
+
}
|
|
810
|
+
.mui-fd9d0b696aac:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
811
|
+
--mendy-tw-ring-color: var(--primary, #171717);
|
|
812
|
+
}
|
|
785
813
|
.mui-59edd3d33673:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
786
814
|
--mendy-tw-outline-style: none;
|
|
787
815
|
outline-style: none;
|
|
@@ -943,12 +971,6 @@
|
|
|
943
971
|
border-inline-start-width: 0px;
|
|
944
972
|
}
|
|
945
973
|
}
|
|
946
|
-
.mui-beeef6663906:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
947
|
-
&:last-child {
|
|
948
|
-
border-inline-end-style: var(--mendy-tw-border-style);
|
|
949
|
-
border-inline-end-width: 0px;
|
|
950
|
-
}
|
|
951
|
-
}
|
|
952
974
|
.mui-37ad15a95595:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
953
975
|
&:hover {
|
|
954
976
|
@media (hover: hover) {
|
|
@@ -976,6 +998,16 @@
|
|
|
976
998
|
}
|
|
977
999
|
}
|
|
978
1000
|
}
|
|
1001
|
+
.mui-5cbdd1b32f1a:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
1002
|
+
&:hover {
|
|
1003
|
+
@media (hover: hover) {
|
|
1004
|
+
background-color: var(--muted, #f5f5f5);
|
|
1005
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1006
|
+
background-color: color-mix(in oklab, var(--muted, #f5f5f5) 50%, transparent);
|
|
1007
|
+
}
|
|
1008
|
+
}
|
|
1009
|
+
}
|
|
1010
|
+
}
|
|
979
1011
|
.mui-4273133a876a:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
980
1012
|
&:hover {
|
|
981
1013
|
@media (hover: hover) {
|
|
@@ -1133,6 +1165,11 @@
|
|
|
1133
1165
|
--mendy-tw-ring-inset: inset;
|
|
1134
1166
|
}
|
|
1135
1167
|
}
|
|
1168
|
+
.mui-71998ea7a2d0:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
1169
|
+
&:active {
|
|
1170
|
+
cursor: grabbing;
|
|
1171
|
+
}
|
|
1172
|
+
}
|
|
1136
1173
|
.mui-8d3c1014b967:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
1137
1174
|
&:disabled {
|
|
1138
1175
|
pointer-events: none;
|
|
@@ -208,6 +208,10 @@
|
|
|
208
208
|
width: calc(var(--spacing) * 4);
|
|
209
209
|
height: calc(var(--spacing) * 4);
|
|
210
210
|
}
|
|
211
|
+
.mui-2bd43fb57913:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
212
|
+
width: calc(var(--spacing) * 5);
|
|
213
|
+
height: calc(var(--spacing) * 5);
|
|
214
|
+
}
|
|
211
215
|
.mui-0712570dcc9f:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
212
216
|
width: calc(var(--spacing) * 6);
|
|
213
217
|
height: calc(var(--spacing) * 6);
|
|
@@ -238,12 +242,18 @@
|
|
|
238
242
|
.mui-c7d5500b77ab:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
239
243
|
height: calc(var(--spacing) * 0);
|
|
240
244
|
}
|
|
245
|
+
.mui-2edce89ef182:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
246
|
+
height: calc(var(--spacing) * 3);
|
|
247
|
+
}
|
|
241
248
|
.mui-099be97e1fa4:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
242
249
|
height: calc(var(--spacing) * 4);
|
|
243
250
|
}
|
|
244
251
|
.mui-ce1945804664:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
245
252
|
height: calc(var(--spacing) * 6);
|
|
246
253
|
}
|
|
254
|
+
.mui-c8e50836f8a1:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
255
|
+
height: calc(var(--spacing) * 7);
|
|
256
|
+
}
|
|
247
257
|
.mui-1fb07b38c63b:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
248
258
|
height: calc(var(--spacing) * 8);
|
|
249
259
|
}
|
|
@@ -268,8 +278,11 @@
|
|
|
268
278
|
.mui-1f061e70178e:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
269
279
|
max-height: var(--radix-dropdown-menu-content-available-height);
|
|
270
280
|
}
|
|
271
|
-
.mui-
|
|
272
|
-
max-height:
|
|
281
|
+
.mui-4d3f1304ebb2:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
282
|
+
max-height: var(--radix-popover-content-available-height);
|
|
283
|
+
}
|
|
284
|
+
.mui-da0beef015c9:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
285
|
+
max-height: 400px;
|
|
273
286
|
}
|
|
274
287
|
.mui-80baa5d03af7:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
275
288
|
max-height: calc(var(--filter-menu-height) - 2px);
|
|
@@ -301,18 +314,21 @@
|
|
|
301
314
|
.mui-d4ea834145ae:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
302
315
|
width: calc(var(--spacing) * 2);
|
|
303
316
|
}
|
|
317
|
+
.mui-56bb14cbd1fe:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
318
|
+
width: calc(2 / 3 * 100%);
|
|
319
|
+
}
|
|
304
320
|
.mui-8867d85ed290:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
305
321
|
width: calc(var(--spacing) * 8);
|
|
306
322
|
}
|
|
307
323
|
.mui-4ac4ec8dfbce:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
308
324
|
width: calc(var(--spacing) * 40);
|
|
309
325
|
}
|
|
310
|
-
.mui-72b37c1a040d:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
311
|
-
width: calc(var(--spacing) * 64);
|
|
312
|
-
}
|
|
313
326
|
.mui-37535002f0f7:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
314
327
|
width: calc(var(--spacing) * 72);
|
|
315
328
|
}
|
|
329
|
+
.mui-a4cce7869436:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
330
|
+
width: 300px;
|
|
331
|
+
}
|
|
316
332
|
.mui-fc6a57ff7553:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
317
333
|
width: var(--mendy-filter-editor-width,19rem);
|
|
318
334
|
}
|
|
@@ -368,6 +384,12 @@
|
|
|
368
384
|
--mendy-tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
|
|
369
385
|
translate: var(--mendy-tw-translate-x) var(--mendy-tw-translate-y);
|
|
370
386
|
}
|
|
387
|
+
.mui-4e3f08588318:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
388
|
+
rotate: calc(45deg * -1);
|
|
389
|
+
}
|
|
390
|
+
.mui-c80411b7591f:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
391
|
+
rotate: 45deg;
|
|
392
|
+
}
|
|
371
393
|
.mui-aa214ea38326:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
372
394
|
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,);
|
|
373
395
|
}
|
|
@@ -383,6 +405,12 @@
|
|
|
383
405
|
.mui-d343f41ba73e:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
384
406
|
cursor: default;
|
|
385
407
|
}
|
|
408
|
+
.mui-f2e47d9c52ad:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
409
|
+
cursor: grab;
|
|
410
|
+
}
|
|
411
|
+
.mui-d2fa8848968d:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
412
|
+
cursor: pointer;
|
|
413
|
+
}
|
|
386
414
|
.mui-739a9a000791:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
387
415
|
touch-action: none;
|
|
388
416
|
}
|
|
@@ -454,13 +482,6 @@
|
|
|
454
482
|
margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--mendy-tw-space-y-reverse)));
|
|
455
483
|
}
|
|
456
484
|
}
|
|
457
|
-
.mui-b8ceaab118a4:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
458
|
-
:where(& > :not(:last-child)) {
|
|
459
|
-
--mendy-tw-space-y-reverse: 0;
|
|
460
|
-
margin-block-start: calc(calc(var(--spacing) * 3) * var(--mendy-tw-space-y-reverse));
|
|
461
|
-
margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--mendy-tw-space-y-reverse)));
|
|
462
|
-
}
|
|
463
|
-
}
|
|
464
485
|
.mui-5a3a4ee420c2:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
465
486
|
overflow: hidden;
|
|
466
487
|
text-overflow: ellipsis;
|
|
@@ -484,9 +505,6 @@
|
|
|
484
505
|
.mui-998780cdef87:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
485
506
|
overscroll-behavior: contain;
|
|
486
507
|
}
|
|
487
|
-
.mui-01024deec75e:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
488
|
-
border-radius: 0.25rem;
|
|
489
|
-
}
|
|
490
508
|
.mui-b005d61d0953:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
491
509
|
border-radius: calc(infinity * 1px);
|
|
492
510
|
}
|
|
@@ -641,6 +659,9 @@
|
|
|
641
659
|
.mui-b5edc3ea7c91:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
642
660
|
padding-block: calc(var(--spacing) * 2);
|
|
643
661
|
}
|
|
662
|
+
.mui-d3cea061f2f3:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
663
|
+
padding-block: calc(var(--spacing) * 3);
|
|
664
|
+
}
|
|
644
665
|
.mui-078d945937da:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
645
666
|
padding-inline-start: calc(var(--spacing) * 8);
|
|
646
667
|
}
|
|
@@ -781,6 +802,13 @@
|
|
|
781
802
|
--mendy-tw-shadow: 0 1px 2px 0 var(--mendy-tw-shadow-color, rgb(0 0 0 / 0.05));
|
|
782
803
|
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);
|
|
783
804
|
}
|
|
805
|
+
.mui-853be6c11609:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
806
|
+
--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);
|
|
807
|
+
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);
|
|
808
|
+
}
|
|
809
|
+
.mui-fd9d0b696aac:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
810
|
+
--mendy-tw-ring-color: var(--primary, #171717);
|
|
811
|
+
}
|
|
784
812
|
.mui-59edd3d33673:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
785
813
|
--mendy-tw-outline-style: none;
|
|
786
814
|
outline-style: none;
|
|
@@ -942,12 +970,6 @@
|
|
|
942
970
|
border-inline-start-width: 0px;
|
|
943
971
|
}
|
|
944
972
|
}
|
|
945
|
-
.mui-beeef6663906:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
946
|
-
&:last-child {
|
|
947
|
-
border-inline-end-style: var(--mendy-tw-border-style);
|
|
948
|
-
border-inline-end-width: 0px;
|
|
949
|
-
}
|
|
950
|
-
}
|
|
951
973
|
.mui-37ad15a95595:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
952
974
|
&:hover {
|
|
953
975
|
@media (hover: hover) {
|
|
@@ -975,6 +997,16 @@
|
|
|
975
997
|
}
|
|
976
998
|
}
|
|
977
999
|
}
|
|
1000
|
+
.mui-5cbdd1b32f1a:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
1001
|
+
&:hover {
|
|
1002
|
+
@media (hover: hover) {
|
|
1003
|
+
background-color: var(--muted, #f5f5f5);
|
|
1004
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1005
|
+
background-color: color-mix(in oklab, var(--muted, #f5f5f5) 50%, transparent);
|
|
1006
|
+
}
|
|
1007
|
+
}
|
|
1008
|
+
}
|
|
1009
|
+
}
|
|
978
1010
|
.mui-4273133a876a:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
979
1011
|
&:hover {
|
|
980
1012
|
@media (hover: hover) {
|
|
@@ -1132,6 +1164,11 @@
|
|
|
1132
1164
|
--mendy-tw-ring-inset: inset;
|
|
1133
1165
|
}
|
|
1134
1166
|
}
|
|
1167
|
+
.mui-71998ea7a2d0:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
1168
|
+
&:active {
|
|
1169
|
+
cursor: grabbing;
|
|
1170
|
+
}
|
|
1171
|
+
}
|
|
1135
1172
|
.mui-8d3c1014b967:where([data-mendy-ui], [data-mendy-ui] *) {
|
|
1136
1173
|
&:disabled {
|
|
1137
1174
|
pointer-events: none;
|
|
@@ -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
|
|
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,49 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import {
|
|
2
|
+
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { useState } from "react";
|
|
4
|
-
import { ChevronLeft, ChevronRight
|
|
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,
|
|
9
|
-
|
|
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", children: [order.map((id, index) => {
|
|
27
|
-
const column = byId.get(id);
|
|
28
|
-
if (!column)
|
|
29
|
-
return null;
|
|
30
|
-
const definition = column.columnDef;
|
|
31
|
-
const label = definition.label ?? (typeof definition.header === "string" ? definition.header : id);
|
|
32
|
-
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) => {
|
|
33
|
-
event.preventDefault();
|
|
34
|
-
column.pin(column.getIsPinned() === "start" ? false : "start");
|
|
35
|
-
}, children: [" ", column.getIsPinned() === "start" ? "Unpin" : "Pin to start"] }), _jsx(DropdownMenuItem, { disabled: !column.getCanPin(), onSelect: (event) => {
|
|
36
|
-
event.preventDefault();
|
|
37
|
-
column.pin(column.getIsPinned() === "end" ? false : "end");
|
|
38
|
-
}, children: column.getIsPinned() === "end" ? "Unpin" : "Pin to end" }), _jsx(DropdownMenuItem, { disabled: index === 0, onSelect: (event) => {
|
|
39
|
-
event.preventDefault();
|
|
40
|
-
move(id, -1);
|
|
41
|
-
}, children: "Move earlier" }), _jsx(DropdownMenuItem, { disabled: index === order.length - 1, onSelect: (event) => {
|
|
42
|
-
event.preventDefault();
|
|
43
|
-
move(id, 1);
|
|
44
|
-
}, children: "Move later" })] })] }, id));
|
|
45
|
-
}), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { onSelect: () => applyTablePreferences(table, { version: 1, ...table.initialState }), children: "Reset columns" })] })] }));
|
|
46
|
-
}
|
|
8
|
+
import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, } from "../primitives/dropdown-menu.js";
|
|
9
|
+
export { TableColumnSettings } from "./table-column-settings.js";
|
|
47
10
|
export function TablePagination({ table, loading, }) {
|
|
48
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" }) })] }));
|
|
49
12
|
}
|
|
@@ -4,7 +4,7 @@ export function TableInitialState({ status, hasRows, loadingState, emptyState, e
|
|
|
4
4
|
if (hasRows)
|
|
5
5
|
return null;
|
|
6
6
|
if (status === "loading")
|
|
7
|
-
return
|
|
7
|
+
return loadingState ?? null;
|
|
8
8
|
if (status === "error")
|
|
9
9
|
return (_jsxs("div", { role: "alert", className: "mui-c432836760e3 mui-05ab12448317", children: [error ?? "Could not load rows.", retry && (_jsx(Button, { variant: "outline", size: "sm", onClick: retry, children: "Retry" }))] }));
|
|
10
10
|
return (_jsx("div", { role: "status", className: "mui-c7902d77ad80 mui-05ab12448317 mui-35f35c41d134", children: emptyState ?? "No results." }));
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type { CSSProperties } from "react";
|
|
2
|
+
import type { Column } from "@tanstack/react-table";
|
|
3
|
+
import type { DataTableFeatures } from "./features.js";
|
|
4
|
+
import type { DataTableInstance } from "./use-data-table.js";
|
|
5
|
+
/** Keep headers, skeletons, and loaded cells on the same column geometry. */
|
|
6
|
+
export declare function tableLayout<T extends object>(table: DataTableInstance<T>, viewportWidth: number | null, rowHeight: number): {
|
|
7
|
+
columns: Column<{
|
|
8
|
+
cellSelectionFeature: import("@tanstack/react-table").TableFeature;
|
|
9
|
+
columnResizingFeature: import("@tanstack/react-table").TableFeature;
|
|
10
|
+
columnOrderingFeature: import("@tanstack/react-table").TableFeature;
|
|
11
|
+
columnPinningFeature: import("@tanstack/react-table").TableFeature;
|
|
12
|
+
columnSizingFeature: import("@tanstack/react-table").TableFeature;
|
|
13
|
+
columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
|
|
14
|
+
columnFilteringFeature: import("@tanstack/react-table").TableFeature;
|
|
15
|
+
columnFacetingFeature: import("@tanstack/react-table").TableFeature;
|
|
16
|
+
globalFilteringFeature: import("@tanstack/react-table").TableFeature;
|
|
17
|
+
rowPaginationFeature: import("@tanstack/react-table").TableFeature;
|
|
18
|
+
rowSelectionFeature: import("@tanstack/react-table").TableFeature;
|
|
19
|
+
rowSortingFeature: import("@tanstack/react-table").TableFeature;
|
|
20
|
+
filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
21
|
+
sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
22
|
+
paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
23
|
+
facetedRowModel: (table: import("@tanstack/react-table").Table<any, any>, columnId: string) => () => import("@tanstack/react-table").RowModel<any, any>;
|
|
24
|
+
facetedUniqueValues: (table: import("@tanstack/react-table").Table<import("@tanstack/react-table").TableFeatures, any>, columnId: string) => () => Map<any, number>;
|
|
25
|
+
filterFns: {
|
|
26
|
+
includesString: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
27
|
+
inNumberRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
28
|
+
inDateRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
29
|
+
equals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
30
|
+
arrIncludes: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
31
|
+
weakEquals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
|
|
32
|
+
};
|
|
33
|
+
sortFns: {
|
|
34
|
+
alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
35
|
+
basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
36
|
+
datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
37
|
+
text: import("@tanstack/react-table").CreatedSortFn<any, any>;
|
|
38
|
+
};
|
|
39
|
+
}, T, unknown>[];
|
|
40
|
+
totalWidth: number;
|
|
41
|
+
pinningActive: boolean;
|
|
42
|
+
cellStyle: (column: Column<DataTableFeatures, T>) => CSSProperties;
|
|
43
|
+
};
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/** Keep headers, skeletons, and loaded cells on the same column geometry. */
|
|
2
|
+
export function tableLayout(table, viewportWidth, rowHeight) {
|
|
3
|
+
const columns = [
|
|
4
|
+
...table.getStartVisibleLeafColumns(),
|
|
5
|
+
...table.getCenterVisibleLeafColumns(),
|
|
6
|
+
...table.getEndVisibleLeafColumns(),
|
|
7
|
+
];
|
|
8
|
+
const totalWidth = columns.reduce((sum, column) => sum + column.getSize(), 0);
|
|
9
|
+
const pinnedWidth = [
|
|
10
|
+
...table.getStartVisibleLeafColumns(),
|
|
11
|
+
...table.getEndVisibleLeafColumns(),
|
|
12
|
+
].reduce((sum, column) => sum + column.getSize(), 0);
|
|
13
|
+
// Preserve stored pins, but leave room to reach the middle columns on narrow screens.
|
|
14
|
+
const pinningActive = (viewportWidth ?? Infinity) >= Math.min(totalWidth, pinnedWidth + 120);
|
|
15
|
+
const positions = new Map();
|
|
16
|
+
let offset = 0;
|
|
17
|
+
for (const column of table.getStartVisibleLeafColumns()) {
|
|
18
|
+
positions.set(column.id, { side: "left", offset });
|
|
19
|
+
offset += column.getSize();
|
|
20
|
+
}
|
|
21
|
+
offset = 0;
|
|
22
|
+
for (const column of [...table.getEndVisibleLeafColumns()].reverse()) {
|
|
23
|
+
positions.set(column.id, { side: "right", offset });
|
|
24
|
+
offset += column.getSize();
|
|
25
|
+
}
|
|
26
|
+
function cellStyle(column) {
|
|
27
|
+
const pin = pinningActive ? positions.get(column.id) : undefined;
|
|
28
|
+
return {
|
|
29
|
+
width: column.getSize(),
|
|
30
|
+
minWidth: column.getSize(),
|
|
31
|
+
height: rowHeight,
|
|
32
|
+
...(column.id === table.getEndVisibleLeafColumns()[0]?.id
|
|
33
|
+
? { marginInlineStart: "auto" }
|
|
34
|
+
: {}),
|
|
35
|
+
...(pin
|
|
36
|
+
? {
|
|
37
|
+
position: "sticky",
|
|
38
|
+
[pin.side]: pin.offset,
|
|
39
|
+
zIndex: 2,
|
|
40
|
+
...(column.id === table.getStartVisibleLeafColumns().at(-1)?.id
|
|
41
|
+
? { borderRightWidth: 4 }
|
|
42
|
+
: {}),
|
|
43
|
+
...(column.id === table.getEndVisibleLeafColumns()[0]?.id
|
|
44
|
+
? { borderLeftWidth: 4 }
|
|
45
|
+
: {}),
|
|
46
|
+
}
|
|
47
|
+
: {}),
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
return { columns, totalWidth, pinningActive, cellStyle };
|
|
51
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { CSSProperties } from "react";
|
|
2
|
+
import type { Column } from "@tanstack/react-table";
|
|
3
|
+
import type { DataTableFeatures } from "./features.js";
|
|
4
|
+
/** Loading shares the live column geometry and its single scroll container. */
|
|
5
|
+
export declare function TableLoadingRows<T extends object>({ columns, count, width, rowHeight, cellStyle, }: {
|
|
6
|
+
columns: Column<DataTableFeatures, T>[];
|
|
7
|
+
count: number;
|
|
8
|
+
width: number;
|
|
9
|
+
rowHeight: number;
|
|
10
|
+
cellStyle: (column: Column<DataTableFeatures, T>) => CSSProperties;
|
|
11
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
/** Loading shares the live column geometry and its single scroll container. */
|
|
3
|
+
export function TableLoadingRows({ columns, count, width, rowHeight, cellStyle, }) {
|
|
4
|
+
return (_jsx("div", { role: "status", "aria-label": "Loading rows", className: "mui-2bf6510f1330", style: { width }, children: Array.from({ length: count }, (_, index) => (_jsx("div", { "aria-hidden": "true", "data-slot": "table-loading-row", className: "mui-222f930b8752 mui-2bf6510f1330", style: { height: rowHeight }, children: columns.map((column) => (_jsx("div", { "data-slot": "table-loading-cell", "data-column-id": column.id, className: "mui-222f930b8752 mui-27ead27a81df mui-71556df3b421 mui-bbe39cfb5cc6 mui-3b6d5fc7b061 mui-5b272f3c5076 mui-0f9e6672913a", style: cellStyle(column), children: _jsx("div", { className: "mui-2edce89ef182 mui-56bb14cbd1fe mui-7b3cd77eb999 mui-02e603944040 mui-87ecb59f2d2d mui-237747164b60" }) }, column.id))) }, index))) }));
|
|
5
|
+
}
|
|
@@ -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
|
|
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 })] }, column.id));
|
|
14
14
|
}
|
|
15
15
|
export function TableBodyRow({ row, rowIndex, start, rowHeight, cellStyle, focusedId, copied, contentClassName, onRowActivate, isRowHighlighted, }) {
|
|
16
16
|
const cells = [
|
|
@@ -63,5 +63,5 @@ function TableHeaderContent({ header, renderHeader, title, }) {
|
|
|
63
63
|
const column = header.column;
|
|
64
64
|
const definition = column.columnDef;
|
|
65
65
|
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] }));
|
|
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 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
67
|
}
|
package/dist/table/table-view.js
CHANGED
|
@@ -6,6 +6,8 @@ import { TableHeaderCell, TableBodyRow } from "./table-parts.js";
|
|
|
6
6
|
import { Button } from "../primitives/button.js";
|
|
7
7
|
import { cn } from "../utils.js";
|
|
8
8
|
import { useViewportWidth } from "./use-viewport-width.js";
|
|
9
|
+
import { tableLayout } from "./table-layout.js";
|
|
10
|
+
import { TableLoadingRows } from "./table-loading.js";
|
|
9
11
|
import { TableInitialState } from "./table-feedback.js";
|
|
10
12
|
import { useTableInteraction } from "./use-table-interaction.js";
|
|
11
13
|
export function TableView({ table, label = "Data table", height = "min(65dvh, 640px)", rowHeight = 44, className, contentClassName, emptyState, loadingState, scrollRef, status = "ready", refreshing, error, retry, loadMore, queryKey, renderHeader, onRowActivate, isRowHighlighted, onCopyError, }) {
|
|
@@ -18,11 +20,6 @@ export function TableView({ table, label = "Data table", height = "min(65dvh, 64
|
|
|
18
20
|
scrollRef.current = node;
|
|
19
21
|
}, [scrollRef]);
|
|
20
22
|
const rows = table.getRowModel().rows;
|
|
21
|
-
const columns = [
|
|
22
|
-
...table.getStartVisibleLeafColumns(),
|
|
23
|
-
...table.getCenterVisibleLeafColumns(),
|
|
24
|
-
...table.getEndVisibleLeafColumns(),
|
|
25
|
-
];
|
|
26
23
|
const virtual = useVirtualizer({
|
|
27
24
|
count: rows.length,
|
|
28
25
|
getScrollElement: () => container.current,
|
|
@@ -31,13 +28,7 @@ export function TableView({ table, label = "Data table", height = "min(65dvh, 64
|
|
|
31
28
|
overscan: 8,
|
|
32
29
|
});
|
|
33
30
|
const viewportWidth = useViewportWidth(container);
|
|
34
|
-
const
|
|
35
|
-
const pinnedWidth = [
|
|
36
|
-
...table.getStartVisibleLeafColumns(),
|
|
37
|
-
...table.getEndVisibleLeafColumns(),
|
|
38
|
-
].reduce((sum, column) => sum + column.getSize(), 0);
|
|
39
|
-
// Preserve stored pins, but leave room to reach the middle columns on narrow screens.
|
|
40
|
-
const pinningActive = (viewportWidth ?? Infinity) >= Math.min(totalWidth, pinnedWidth + 120);
|
|
31
|
+
const { columns, totalWidth, pinningActive, cellStyle } = tableLayout(table, viewportWidth, rowHeight);
|
|
41
32
|
const { announcement, copied, onKeyDown } = useTableInteraction({
|
|
42
33
|
table,
|
|
43
34
|
pinningActive,
|
|
@@ -70,32 +61,9 @@ export function TableView({ table, label = "Data table", height = "min(65dvh, 64
|
|
|
70
61
|
requested.current = null;
|
|
71
62
|
});
|
|
72
63
|
}, [last, rows.length, queryKey, loadMore?.available, loadMore?.loading, loadMore?.error]);
|
|
73
|
-
const positions = new Map();
|
|
74
|
-
let offset = 0;
|
|
75
|
-
for (const column of table.getStartVisibleLeafColumns()) {
|
|
76
|
-
positions.set(column.id, { side: "left", offset });
|
|
77
|
-
offset += column.getSize();
|
|
78
|
-
}
|
|
79
|
-
offset = 0;
|
|
80
|
-
for (const column of [...table.getEndVisibleLeafColumns()].reverse()) {
|
|
81
|
-
positions.set(column.id, { side: "right", offset });
|
|
82
|
-
offset += column.getSize();
|
|
83
|
-
}
|
|
84
|
-
function cellStyle(column) {
|
|
85
|
-
const pin = pinningActive ? positions.get(column.id) : undefined;
|
|
86
|
-
return {
|
|
87
|
-
width: column.getSize(),
|
|
88
|
-
minWidth: column.getSize(),
|
|
89
|
-
height: rowHeight,
|
|
90
|
-
...(column.id === table.getEndVisibleLeafColumns()[0]?.id
|
|
91
|
-
? { marginInlineStart: "auto" }
|
|
92
|
-
: {}),
|
|
93
|
-
...(pin ? { position: "sticky", [pin.side]: pin.offset, zIndex: 2 } : {}),
|
|
94
|
-
};
|
|
95
|
-
}
|
|
96
64
|
const focused = table.getFocusedCell();
|
|
97
65
|
const headersById = new Map(table.getFlatHeaders().map((header) => [header.column.id, header]));
|
|
98
|
-
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, 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: () => {
|
|
66
|
+
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: () => {
|
|
99
67
|
requested.current = null;
|
|
100
68
|
void Promise.resolve()
|
|
101
69
|
.then(() => loadMore.load())
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mendylanda/ui",
|
|
3
|
-
"version": "0.3.0-alpha.
|
|
4
|
-
"description": "Mendy Landa
|
|
3
|
+
"version": "0.3.0-alpha.2",
|
|
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",
|
|
7
7
|
"author": "Mendy Landa",
|
|
@@ -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",
|