mirror of
https://github.com/langgenius/dify.git
synced 2026-05-13 08:57:28 +08:00
783cdb1357
Add TreeEditInput component for inline file/folder renaming with keyboard support (Enter to submit, Escape to cancel). Add TreeGuideLines component to render vertical indent lines based on node depth for better visual hierarchy in the tree view. Reorganize file tree components into dedicated `file-tree` subdirectory for better code organization.
29 lines
555 B
TypeScript
29 lines
555 B
TypeScript
'use client'
|
|
|
|
import * as React from 'react'
|
|
|
|
const INDENT_SIZE = 20
|
|
|
|
type TreeGuideLinesProps = {
|
|
level: number
|
|
}
|
|
|
|
const TreeGuideLines: React.FC<TreeGuideLinesProps> = ({ level }) => {
|
|
if (level === 0)
|
|
return null
|
|
|
|
return (
|
|
<>
|
|
{Array.from({ length: level }).map((_, i) => (
|
|
<div
|
|
key={`guide-${i}`}
|
|
className="absolute bottom-0 top-0 border-l border-divider-subtle"
|
|
style={{ left: `${(i + 1) * INDENT_SIZE - 10}px` }}
|
|
/>
|
|
))}
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default React.memo(TreeGuideLines)
|