mirror of
https://github.com/langgenius/dify.git
synced 2026-04-25 01:26:57 +08:00
feat(portal): add customContainer prop to PortalToFollowElem for flexible rendering
This commit is contained in:
parent
273dae6738
commit
00b5772012
@ -112,6 +112,7 @@ const DropDown = ({
|
|||||||
} : {
|
} : {
|
||||||
mainAxis: 4,
|
mainAxis: 4,
|
||||||
}}
|
}}
|
||||||
|
customContainer={document.body}
|
||||||
>
|
>
|
||||||
<PortalToFollowElemTrigger onClick={handleTrigger}>
|
<PortalToFollowElemTrigger onClick={handleTrigger}>
|
||||||
<ActionButton className={cn(expand ? 'size-8 rounded-lg' : 'size-6 rounded-md')}>
|
<ActionButton className={cn(expand ? 'size-8 rounded-lg' : 'size-6 rounded-md')}>
|
||||||
|
|||||||
@ -31,6 +31,7 @@ export type PortalToFollowElemOptions = {
|
|||||||
offset?: number | OffsetOptions
|
offset?: number | OffsetOptions
|
||||||
onOpenChange?: (open: boolean) => void
|
onOpenChange?: (open: boolean) => void
|
||||||
triggerPopupSameWidth?: boolean
|
triggerPopupSameWidth?: boolean
|
||||||
|
customContainer?: HTMLElement | null
|
||||||
}
|
}
|
||||||
|
|
||||||
export function usePortalToFollowElem({
|
export function usePortalToFollowElem({
|
||||||
@ -39,8 +40,9 @@ export function usePortalToFollowElem({
|
|||||||
offset: offsetValue = 0,
|
offset: offsetValue = 0,
|
||||||
onOpenChange: setControlledOpen,
|
onOpenChange: setControlledOpen,
|
||||||
triggerPopupSameWidth,
|
triggerPopupSameWidth,
|
||||||
|
customContainer = null,
|
||||||
}: PortalToFollowElemOptions = {}) {
|
}: PortalToFollowElemOptions = {}) {
|
||||||
const container = document.getElementById('workflow-container') || document.body
|
const container = customContainer || document.getElementById('workflow-container') || document.body
|
||||||
const [localOpen, setLocalOpen] = useState(false)
|
const [localOpen, setLocalOpen] = useState(false)
|
||||||
const open = controlledOpen ?? localOpen
|
const open = controlledOpen ?? localOpen
|
||||||
const handleOpenChange = useCallback((newOpen: boolean) => {
|
const handleOpenChange = useCallback((newOpen: boolean) => {
|
||||||
|
|||||||
@ -49,7 +49,7 @@ const Operations = ({
|
|||||||
onClick={onClickExport}
|
onClick={onClickExport}
|
||||||
>
|
>
|
||||||
<span className='system-md-regular px-1 text-text-secondary'>
|
<span className='system-md-regular px-1 text-text-secondary'>
|
||||||
{t('datasetPipeline.operations.exportDSL')}
|
{t('datasetPipeline.operations.exportPipeline')}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -18,7 +18,6 @@ const translation = {
|
|||||||
choose: 'Choose',
|
choose: 'Choose',
|
||||||
details: 'Details',
|
details: 'Details',
|
||||||
editInfo: 'Edit info',
|
editInfo: 'Edit info',
|
||||||
exportDSL: 'Export DSL',
|
|
||||||
useTemplate: 'Use this Knowledge Pipeline',
|
useTemplate: 'Use this Knowledge Pipeline',
|
||||||
backToDataSource: 'Back to Data Source',
|
backToDataSource: 'Back to Data Source',
|
||||||
process: 'Process',
|
process: 'Process',
|
||||||
|
|||||||
@ -18,7 +18,6 @@ const translation = {
|
|||||||
choose: '选择',
|
choose: '选择',
|
||||||
details: '详情',
|
details: '详情',
|
||||||
editInfo: '编辑信息',
|
editInfo: '编辑信息',
|
||||||
exportDSL: '导出 DSL',
|
|
||||||
useTemplate: '使用此知识流水线',
|
useTemplate: '使用此知识流水线',
|
||||||
backToDataSource: '返回数据源',
|
backToDataSource: '返回数据源',
|
||||||
process: '处理',
|
process: '处理',
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user