dishui 0.0.56 → 0.0.59

package/dist/components/pro/Flow/panels/FlowPanelGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlowPanelGroup.js","names":[],"sources":["../../../../../src/components/pro/Flow/panels/FlowPanelGroup.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport Button from '../../../Button';\nimport { useDraggablePanel } from '../hooks/useDraggablePanel';\nimport { useResizablePanel, type ResizeEdge } from '../hooks/useResizablePanel';\n\nexport interface PanelTab {\n  id: string;\n  label: string;\n  icon?: React.ReactNode;\n  content: React.ReactNode;\n}\n\ninterface FlowPanelGroupProps {\n  tabs: PanelTab[];\n  defaultTab?: string;\n  className?: string;\n  resizeEdge: ResizeEdge;\n  defaultWidth: number;\n  style?: React.CSSProperties;\n  onDetach?: (tabId: string) => void;\n  onAttach?: (tabId: string) => void;\n  /** If true, show attach button instead of detach */\n  isDetached?: boolean;\n}\n\nexport default function FlowPanelGroup({\n  tabs,\n  defaultTab,\n  className,\n  resizeEdge,\n  defaultWidth,\n  style,\n  onDetach,\n  onAttach,\n  isDetached,\n}: FlowPanelGroupProps) {\n  const [activeTab, setActiveTab] = useState(defaultTab ?? tabs[0]?.id);\n  const { panelStyle, handleProps } = useDraggablePanel();\n  const { panelWidth, resizeHandleProps } = useResizablePanel(resizeEdge, defaultWidth);\n  const tabsScrollRef = useRef<HTMLDivElement>(null);\n\n  const showTabs = tabs.length > 1;\n\n  // Translate vertical wheel scrolling into horizontal tab scrolling, so the\n  // overflowing tabs are reachable with a normal mouse wheel / trackpad.\n  // Attached natively with { passive: false }: React's delegated onWheel is\n  // passive at the root, so preventDefault() there is ignored and logs\n  // \"Unable to preventDefault inside passive event listener invocation\".\n  useEffect(() => {\n    const el = tabsScrollRef.current;\n    if (!el) return;\n    const onWheel = (e: WheelEvent) => {\n      if (el.scrollWidth <= el.clientWidth) return;\n      if (e.deltaY !== 0) {\n        el.scrollLeft += e.deltaY;\n        e.preventDefault();\n      }\n    };\n    el.addEventListener('wheel', onWheel, { passive: false });\n    return () => el.removeEventListener('wheel', onWheel);\n  }, [showTabs]);\n\n  useEffect(() => {\n    if (tabs.length > 0 && !tabs.find(t => t.id === activeTab)) {\n      setActiveTab(tabs[0].id);\n    }\n  }, [tabs, activeTab]);\n\n  if (tabs.length === 0) return null;\n\n  const current = tabs.find(t => t.id === activeTab) ?? tabs[0];\n\n  return (\n    <div\n      className={`${className ?? 'flow-palette'}${isDetached ? ' flow-panel--detached' : ' flow-panel--docked'}`}\n      data-flow-panel\n      style={{ ...style, ...(isDetached ? panelStyle : undefined), width: panelWidth }}\n    >\n      <div\n        className={`flow-panel-resize-handle flow-panel-resize-handle--${resizeEdge}`}\n        {...resizeHandleProps}\n      />\n      {tabs.length > 1 ? (\n        <div className=\"flow-panel-tabs-row\" {...(isDetached ? handleProps : {})}>\n          <div className=\"flow-panel-tabs\" ref={tabsScrollRef}>\n            {tabs.map(tab => (\n              <Button\n                key={tab.id}\n                variant=\"ghost\"\n                size=\"xs\"\n                className={`flow-panel-tab${tab.id === current.id ? ' flow-panel-tab--active' : ''}`}\n                onClick={() => setActiveTab(tab.id)}\n              >\n                {tab.icon && <span className=\"flow-panel-tab-icon\">{tab.icon}</span>}\n                {tab.label}\n              </Button>\n            ))}\n          </div>\n          {onDetach && (\n            <button\n              className=\"flow-panel-detach-btn\"\n              title=\"Detach tab\"\n              onClick={() => onDetach(current.id)}\n            >⬈</button>\n          )}\n        </div>\n      ) : (\n        <div className=\"flow-panel-header-single\" {...(isDetached ? handleProps : {})}>\n          <span className=\"flow-panel-header-label\">\n            {current.icon && <span className=\"flow-panel-tab-icon\">{current.icon}</span>}\n            {current.label}\n          </span>\n          {isDetached && onAttach && (\n            <button\n              className=\"flow-panel-detach-btn\"\n              title=\"Attach back\"\n              onClick={() => onAttach(current.id)}\n            >⮋</button>\n          )}\n          {!isDetached && onDetach && (\n            <button\n              className=\"flow-panel-detach-btn\"\n              title=\"Detach tab\"\n              onClick={() => onDetach(current.id)}\n            >⮈</button>\n          )}\n        </div>\n      )}\n      <div className=\"flow-palette-content\">\n        {current.content}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"FlowPanelGroup.js","names":[],"sources":["../../../../../src/components/pro/Flow/panels/FlowPanelGroup.tsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react';\nimport Select from '../../../Select';\nimport { useDraggablePanel } from '../hooks/useDraggablePanel';\nimport { useResizablePanel, type ResizeEdge } from '../hooks/useResizablePanel';\nimport type { FlowPanelDock } from '../context/FlowUIContext';\n\nexport interface PanelTab {\n  id: string;\n  label: string;\n  icon?: React.ReactNode;\n  content: React.ReactNode;\n}\n\ninterface FlowPanelGroupProps {\n  tabs: PanelTab[];\n  defaultTab?: string;\n  className?: string;\n  resizeEdge: ResizeEdge;\n  defaultWidth: number;\n  style?: React.CSSProperties;\n  /** Which dock this group occupies ('float' = draggable overlay). */\n  dock?: FlowPanelDock;\n  /** Request moving the current tab to another dock (left/right/float). */\n  onDock?: (tabId: string, dock: FlowPanelDock) => void;\n  /** Floating panels report the dock edge they hover while dragging. */\n  onDragHintChange?: (side: 'left' | 'right' | null) => void;\n  /** Close (hide) the current panel; it can be reopened via the toolbar. */\n  onClose?: (tabId: string) => void;\n}\n\n/** Header buttons offered per current dock, in display order. */\nconst DOCK_ACTIONS: Record<FlowPanelDock, Array<{ target: FlowPanelDock; glyph: string; title: string }>> = {\n  left: [\n    { target: 'float', glyph: '⬈', title: '浮动面板' },\n    { target: 'right', glyph: '⇥', title: '停靠到右侧' },\n  ],\n  right: [\n    { target: 'left', glyph: '⇤', title: '停靠到左侧' },\n    { target: 'float', glyph: '⬈', title: '浮动面板' },\n  ],\n  float: [\n    { target: 'left', glyph: '⇤', title: '停靠到左侧' },\n    { target: 'right', glyph: '⇥', title: '停靠到右侧' },\n  ],\n};\n\nexport default function FlowPanelGroup({\n  tabs,\n  defaultTab,\n  className,\n  resizeEdge,\n  defaultWidth,\n  style,\n  dock,\n  onDock,\n  onDragHintChange,\n  onClose,\n}: FlowPanelGroupProps) {\n  const [activeTab, setActiveTab] = useState(defaultTab ?? tabs[0]?.id);\n  const isFloating = dock === 'float';\n  const currentId = tabs.find(t => t.id === activeTab)?.id ?? tabs[0]?.id;\n  const { panelStyle, handleProps } = useDraggablePanel(\n    isFloating\n      ? {\n          onDropDock: (side) => { if (currentId) onDock?.(currentId, side); },\n          onDragHintChange,\n        }\n      : undefined,\n  );\n  const { panelWidth, resizeHandleProps } = useResizablePanel(resizeEdge, defaultWidth);\n\n  useEffect(() => {\n    if (tabs.length > 0 && !tabs.find(t => t.id === activeTab)) {\n      setActiveTab(tabs[0].id);\n    }\n  }, [tabs, activeTab]);\n\n  const handleDock = useCallback((target: FlowPanelDock) => {\n    if (currentId) onDock?.(currentId, target);\n  }, [currentId, onDock]);\n\n  if (tabs.length === 0) return null;\n\n  const current = tabs.find(t => t.id === activeTab) ?? tabs[0];\n  const showSwitcher = tabs.length > 1;\n  const actions = DOCK_ACTIONS[dock ?? 'left'];\n\n  return (\n    <div\n      className={`${className ?? 'flow-palette'}${isFloating ? ' flow-panel--detached' : ' flow-panel--docked'}`}\n      data-flow-panel\n      style={{ ...style, ...(isFloating ? panelStyle : undefined), width: panelWidth }}\n    >\n      <div\n        className={`flow-panel-resize-handle flow-panel-resize-handle--${resizeEdge}`}\n        {...resizeHandleProps}\n      />\n      <div className=\"flow-panel-header\">\n        {isFloating && (\n          <span className=\"flow-panel-grip\" title=\"拖动移动面板\" {...handleProps}>⠿</span>\n        )}\n        {showSwitcher ? (\n          <Select\n            className=\"flow-panel-select\"\n            options={tabs.map(t => ({\n              value: t.id,\n              label: typeof t.icon === 'string' && t.icon ? `${t.icon} ${t.label}` : t.label,\n            }))}\n            value={current.id}\n            onChange={(v) => setActiveTab(String(v))}\n          />\n        ) : (\n          <span className=\"flow-panel-header-label\">\n            {current.icon && <span className=\"flow-panel-tab-icon\">{current.icon}</span>}\n            {current.label}\n          </span>\n        )}\n        <span className=\"flow-panel-header-actions\">\n          {actions.map(a => (\n            <button\n              key={a.target}\n              type=\"button\"\n              className=\"flow-panel-dock-btn\"\n              title={a.title}\n              onClick={() => handleDock(a.target)}\n            >{a.glyph}</button>\n          ))}\n          {onClose && (\n            <button\n              type=\"button\"\n              className=\"flow-panel-dock-btn flow-panel-close-btn\"\n              title=\"关闭面板（可从工具栏重新打开）\"\n              onClick={() => { if (currentId) onClose(currentId); }}\n            >✕</button>\n          )}\n        </span>\n      </div>\n      <div className=\"flow-palette-content\">\n        {current.content}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}