DerexXD/UT-Registration-Plus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): fix longstanding drag-and-drop duplication issue (#502)

Browse Source 
* fix(ui): fixed color switching on list reordering

* chore: remove lock file

* chore: add back lock file

* feat(ui): fix color duplication issue and prevent scrolling beyond parent

* feat(ui): add to storybook

* fix(ui): remove white background while dragging

* chore: remove dnd pangea from package.json

* chore: rebuild lock file

* chore: remove nested li element issue

* fix(ui): allow grabbing cursor while dragging

* fix(ui): address chromatic errors

* fix(ui): address chromatic errors

* fix(ui): address linting issues and pass tests

* fix(ui): create hook for modifying the cursor globally

* chore: add check for storybook env

* chore: add back unused import to AddAllButton

* fix: make cursor grabbing hook more explicit

* chore: move sortable list item into sortable list file

* fix: remove isStorybook prop from ScheduleListItem

---------

Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
This commit is contained in:
Preston Cook
2025-02-04 17:28:54 -06:00
committed by GitHub
parent c2328e461e
commit 4752f5860a
16 changed files with 2913 additions and 2622 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/views/components/common/ScheduleDropdown.tsx
View File

@@ -15,12 +15,12 @@ export type ScheduleDropdownProps = {
/**
* This is a reusable dropdown component that can be used to toggle the visiblity of information
*/
export default function ScheduleDropdown(props: ScheduleDropdownProps) {
export default function ScheduleDropdown({ defaultOpen, children }: ScheduleDropdownProps) {
const [activeSchedule] = useSchedules();
return (
<div className='border border-ut-offwhite rounded border-solid bg-white'>
<Disclosure defaultOpen={props.defaultOpen}>
<Disclosure defaultOpen={defaultOpen}>
{({ open }) => (
<>
<DisclosureButton className='w-full flex items-center border-none bg-transparent px-3.5 py-2.5 text-left'>
@@ -50,14 +50,17 @@ export default function ScheduleDropdown(props: ScheduleDropdownProps) {
<Transition
as='div'
className='contain-paint max-h-55 origin-top overflow-auto transition-all duration-400 ease-in-out-expo'
enterFrom='transform scale-98 opacity-0 max-h-0!'
enterTo='transform scale-100 opacity-100 max-h-55'
leave='ease-out-expo'
leaveFrom='transform scale-100 opacity-100 max-h-55'
leaveTo='transform scale-98 opacity-0 max-h-0!'
className='overflow-hidden'
enter='transition-[max-height,opacity,padding] duration-300 ease-in-out-expo'
enterFrom='max-h-0 opacity-0 p-0.5'
enterTo='max-h-[440px] opacity-100 p-0'
leave='transition-[max-height,opacity,padding] duration-300 ease-in-out-expo'
leaveFrom='max-h-[440px] opacity-100 p-0'
leaveTo='max-h-0 opacity-0 p-0.5'
>
<DisclosurePanel className='px-3.5 pb-2.5 pt-2'>{props.children}</DisclosurePanel>
<div className='px-3.5 pb-2.5 pt-2'>
<DisclosurePanel>{children}</DisclosurePanel>
</div>
</Transition>
</>
)}