タグ D&D 時の表示位置修正 (#268) #400

マージ済み
みてるぞ が 8 個のコミットを feature/268 から main へマージ 2026-07-08 00:01:08 +09:00
2個のファイルの変更10行の追加13行の削除
コミット f8e8d8fbb0 の変更だけを表示してゐます - すべてのコミットを表示
+1 -1
ファイルの表示
@@ -65,7 +65,7 @@ const DraggableDroppableTagRow: FC<Props> = ({ tag, nestLevel, pathKey, parentTa
data: { kind: 'tag', tagId: tag.id } }) data: { kind: 'tag', tagId: tag.id } })
const style: CSSProperties = { transform: CSS.Translate.toString (transform), const style: CSSProperties = { transform: CSS.Translate.toString (transform),
visibility: dragging && !(sp) ? 'hidden' : 'visible' } visibility: dragging ? 'hidden' : 'visible' }
return ( return (
<div <div
+9 -12
ファイルの表示
@@ -4,7 +4,6 @@ import { DndContext,
MouseSensor, MouseSensor,
TouchSensor, TouchSensor,
pointerWithin, pointerWithin,
rectIntersection,
useDroppable, useDroppable,
useSensor, useSensor,
useSensors } from '@dnd-kit/core' useSensors } from '@dnd-kit/core'
@@ -36,8 +35,7 @@ import type { Category, Post, TagWithSections } from '@/types'
type TagByCategory = { [key in Category]: TagWithSections[] } type TagByCategory = { [key in Category]: TagWithSections[] }
const tagCollisionDetection: CollisionDetection = args => { const tagCollisionDetection: CollisionDetection = args => {
const byPointer = pointerWithin (args) return pointerWithin (args)
return byPointer.length > 0 ? byPointer : rectIntersection (args)
} }
const alwaysMeasureDroppables = { const alwaysMeasureDroppables = {
@@ -491,15 +489,14 @@ const TagDetailSidebar: FC<Props> = ({ className, post, sp }) => {
</ul> </ul>
</motion.div>)} </motion.div>)}
{!(sp) && ( <DragOverlay adjustScale={false}>
<DragOverlay adjustScale={false}> <div className="pointer-events-none">
<div className="pointer-events-none"> {activeTagDrag != null && (() => {
{activeTagDrag != null && (() => { const tag = findTag (tags, activeTagDrag.tagId)
const tag = findTag (tags, activeTagDrag.tagId) return tag && <TagLink tag={tag} nestLevel={activeTagDrag.nestLevel}/>
return tag && <TagLink tag={tag} nestLevel={activeTagDrag.nestLevel}/> }) ()}
}) ()} </div>
</div> </DragOverlay>
</DragOverlay>)}
</DndContext> </DndContext>
</SidebarComponent>) </SidebarComponent>)
} }