eai-frontend-components 2.0.83 → 2.0.84

package/dist/index.d.ts

@@ -1113,13 +1113,21 @@ interface OrgChartNodeData {
     children?: OrgChartNodeData[];
     data?: Record<string, unknown>;
 }
+interface NodeCardProps {
+    node: OrgChartNodeData;
+    onNodeClick?: (node: OrgChartNodeData) => void;
+    isExpanded: boolean;
+    hasChildren: boolean;
+    onToggle: () => void;
+}
 interface OrgChartProps {
     data: OrgChartNodeData;
     onNodeClick?: (node: OrgChartNodeData) => void;
     defaultExpanded?: boolean;
     className?: string;
+    renderNode?: (props: NodeCardProps) => ReactNode;
 }
-declare function OrgChart({ data, onNodeClick, defaultExpanded, className }: OrgChartProps): react_jsx_runtime.JSX.Element;
+declare function OrgChart({ data, onNodeClick, defaultExpanded, className, renderNode }: OrgChartProps): react_jsx_runtime.JSX.Element;
 
 type ResponsiveDialogAction = {
     label: string;

package/dist/index.esm.js

@@ -10144,19 +10144,26 @@ function NodeCard({ node, onNodeClick, isExpanded, hasChildren, onToggle }) {
                             onToggle();
                         }, children: isExpanded ? jsx(ChevronUp, { className: 'h-3 w-3' }) : jsx(ChevronDown, { className: 'h-3 w-3' }) }) }))] }) }));
 }
-function OrgChartTreeNode({ node, onNodeClick, defaultExpanded }) {
+function OrgChartTreeNode({ node, onNodeClick, defaultExpanded, renderNode }) {
     const [isExpanded, setIsExpanded] = useState(defaultExpanded);
     const children = node.children ?? [];
     const hasChildren = children.length > 0;
-    return (jsxs("div", { className: 'flex flex-col items-center', children: [jsx(NodeCard, { node: node, onNodeClick: onNodeClick, isExpanded: isExpanded, hasChildren: hasChildren, onToggle: () => setIsExpanded((prev) => !prev) }), hasChildren && isExpanded && (jsxs(Fragment, { children: [jsx("div", { className: 'h-4 w-px bg-border' }), jsx("div", { className: 'flex items-start', children: children.map((child, i) => {
+    const cardProps = {
+        node,
+        onNodeClick,
+        isExpanded,
+        hasChildren,
+        onToggle: () => setIsExpanded((prev) => !prev),
+    };
+    return (jsxs("div", { className: 'flex flex-col items-center', children: [renderNode ? renderNode(cardProps) : jsx(NodeCard, { ...cardProps }), hasChildren && isExpanded && (jsxs(Fragment, { children: [jsx("div", { className: 'h-4 w-px bg-border' }), jsx("div", { className: 'flex items-start', children: children.map((child, i) => {
                             const isOnly = children.length === 1;
                             const isFirst = i === 0;
                             const isLast = i === children.length - 1;
-                            return (jsxs("div", { className: cn('relative flex flex-col items-center px-4', !isOnly && "after:absolute after:top-0 after:h-px after:bg-border after:content-['']", !isOnly && isFirst && 'after:-right-4 after:left-1/2', !isOnly && isLast && 'after:-left-4 after:right-1/2', !isOnly && !isFirst && !isLast && 'after:-left-4 after:-right-4'), children: [jsx("div", { className: 'h-4 w-px bg-border' }), jsx(OrgChartTreeNode, { node: child, onNodeClick: onNodeClick, defaultExpanded: defaultExpanded })] }, child.id));
+                            return (jsxs("div", { className: cn('relative flex flex-col items-center px-4', !isOnly && "after:absolute after:top-0 after:h-px after:bg-border after:content-['']", !isOnly && isFirst && 'after:-right-4 after:left-1/2', !isOnly && isLast && 'after:-left-4 after:right-1/2', !isOnly && !isFirst && !isLast && 'after:-left-4 after:-right-4'), children: [jsx("div", { className: 'h-4 w-px bg-border' }), jsx(OrgChartTreeNode, { node: child, onNodeClick: onNodeClick, defaultExpanded: defaultExpanded, renderNode: renderNode })] }, child.id));
                         }) })] }))] }));
 }
-function OrgChart({ data, onNodeClick, defaultExpanded = true, className }) {
-    return (jsx("div", { className: cn('w-full overflow-x-auto', className), children: jsx("div", { className: 'flex justify-center px-4 py-6', children: jsx(OrgChartTreeNode, { node: data, onNodeClick: onNodeClick, defaultExpanded: defaultExpanded }) }) }));
+function OrgChart({ data, onNodeClick, defaultExpanded = true, className, renderNode }) {
+    return (jsx("div", { className: cn('w-full overflow-x-auto', className), children: jsx("div", { className: 'flex justify-center px-4 py-6', children: jsx(OrgChartTreeNode, { node: data, onNodeClick: onNodeClick, defaultExpanded: defaultExpanded, renderNode: renderNode }) }) }));
 }
 
 function useMediaQuery(queryInput) {