@uipath/apollo-wind 0.10.0 → 0.11.0-pr295.af4e744

package/dist/examples/flow-start-example.js

@@ -1,433 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Blocks, Bot, FolderKanban, GitBranch, LayoutGrid, List, MoreHorizontal } from "lucide-react";
-import { useMemo, useState } from "react";
-import { Badge } from "../components/ui/badge.js";
-import { Button } from "../components/ui/button.js";
-import { ButtonGroup } from "../components/ui/button-group.js";
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../components/ui/card.js";
-import { DataTable, DataTableColumnHeader } from "../components/ui/data-table.js";
-import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../components/ui/dropdown-menu.js";
-import { Skeleton } from "../components/ui/skeleton.js";
-import { Column, Grid, Row } from "../components/ui/layout/index.js";
-import { cn } from "../lib/index.js";
-function ProcessOptionCard({ option, isSelected, onSelect }) {
-    return /*#__PURE__*/ jsxs(Card, {
-        className: cn('group relative cursor-pointer transition-all duration-200 hover:border-primary/50 hover:shadow-md', isSelected && 'border-primary ring-2 ring-primary/20'),
-        onClick: onSelect,
-        children: [
-            option.badge && /*#__PURE__*/ jsx(Badge, {
-                variant: option.badgeVariant,
-                className: "absolute -top-2 right-4 text-[10px] px-2 py-0.5",
-                children: option.badge
-            }),
-            /*#__PURE__*/ jsx(CardHeader, {
-                className: "pb-3",
-                children: /*#__PURE__*/ jsx(Row, {
-                    gap: 3,
-                    align: "center",
-                    children: /*#__PURE__*/ jsx("div", {
-                        className: "flex h-10 w-10 items-center justify-center rounded-lg bg-muted text-muted-foreground transition-colors group-hover:bg-primary/10 group-hover:text-primary",
-                        children: option.icon
-                    })
-                })
-            }),
-            /*#__PURE__*/ jsxs(CardContent, {
-                className: "pt-0",
-                children: [
-                    /*#__PURE__*/ jsx(CardTitle, {
-                        className: "text-base mb-2",
-                        children: option.title
-                    }),
-                    /*#__PURE__*/ jsx(CardDescription, {
-                        className: "text-sm leading-relaxed",
-                        children: option.description
-                    })
-                ]
-            })
-        ]
-    });
-}
-function getTypeIcon(type) {
-    switch(type){
-        case 'flow':
-            return /*#__PURE__*/ jsx(GitBranch, {
-                className: "h-4 w-4"
-            });
-        case 'bpmn':
-            return /*#__PURE__*/ jsx(Blocks, {
-                className: "h-4 w-4"
-            });
-        case 'case':
-            return /*#__PURE__*/ jsx(FolderKanban, {
-                className: "h-4 w-4"
-            });
-        case 'autopilot':
-            return /*#__PURE__*/ jsx(Bot, {
-                className: "h-4 w-4"
-            });
-    }
-}
-function getTypeLabel(type) {
-    switch(type){
-        case 'flow':
-            return 'Flow';
-        case 'bpmn':
-            return 'BPMN';
-        case 'case':
-            return 'Case Management';
-        case 'autopilot':
-            return 'Autopilot';
-    }
-}
-function getStatusVariant(status) {
-    switch(status){
-        case 'published':
-            return 'default';
-        case 'draft':
-            return 'secondary';
-        case 'archived':
-            return 'outline';
-        default:
-            return 'secondary';
-    }
-}
-function RecentProjectCard({ project, onSelect }) {
-    return /*#__PURE__*/ jsx(Card, {
-        className: "group cursor-pointer transition-all duration-200 hover:border-primary/50 hover:shadow-sm",
-        onClick: onSelect,
-        children: /*#__PURE__*/ jsx(CardContent, {
-            className: "p-4",
-            children: /*#__PURE__*/ jsxs(Row, {
-                gap: 3,
-                align: "start",
-                children: [
-                    /*#__PURE__*/ jsx("div", {
-                        className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-md bg-muted text-muted-foreground",
-                        children: getTypeIcon(project.type)
-                    }),
-                    /*#__PURE__*/ jsxs(Column, {
-                        gap: 1,
-                        flex: 1,
-                        className: "min-w-0",
-                        children: [
-                            /*#__PURE__*/ jsxs(Row, {
-                                justify: "between",
-                                align: "center",
-                                gap: 2,
-                                children: [
-                                    /*#__PURE__*/ jsx("span", {
-                                        className: "truncate font-medium text-sm",
-                                        children: project.name
-                                    }),
-                                    project.status && /*#__PURE__*/ jsx(Badge, {
-                                        variant: getStatusVariant(project.status),
-                                        className: "shrink-0 text-[10px]",
-                                        children: project.status
-                                    })
-                                ]
-                            }),
-                            /*#__PURE__*/ jsx("span", {
-                                className: "text-xs text-muted-foreground",
-                                children: project.lastModified
-                            })
-                        ]
-                    })
-                ]
-            })
-        })
-    });
-}
-function SkeletonSection() {
-    return /*#__PURE__*/ jsxs(Column, {
-        gap: 4,
-        children: [
-            /*#__PURE__*/ jsx(Skeleton, {
-                className: "h-5 w-32"
-            }),
-            /*#__PURE__*/ jsxs(Column, {
-                gap: 3,
-                children: [
-                    /*#__PURE__*/ jsx(Row, {
-                        gap: 2,
-                        children: /*#__PURE__*/ jsx(Skeleton, {
-                            className: "h-4 flex-1 max-w-[280px]"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(Row, {
-                        gap: 2,
-                        children: /*#__PURE__*/ jsx(Skeleton, {
-                            className: "h-4 flex-1 max-w-[240px]"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(Row, {
-                        gap: 2,
-                        children: /*#__PURE__*/ jsx(Skeleton, {
-                            className: "h-4 flex-1 max-w-[320px]"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(Row, {
-                        gap: 2,
-                        children: /*#__PURE__*/ jsx(Skeleton, {
-                            className: "h-4 flex-1 max-w-[200px]"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(Row, {
-                        gap: 2,
-                        children: /*#__PURE__*/ jsx(Skeleton, {
-                            className: "h-4 flex-1 max-w-[260px]"
-                        })
-                    })
-                ]
-            })
-        ]
-    });
-}
-function createProjectColumns(onProjectSelect) {
-    return [
-        {
-            accessorKey: 'name',
-            header: ({ column })=>/*#__PURE__*/ jsx(DataTableColumnHeader, {
-                    column: column,
-                    title: "Name"
-                }),
-            cell: ({ row })=>/*#__PURE__*/ jsxs(Row, {
-                    gap: 2,
-                    align: "center",
-                    children: [
-                        /*#__PURE__*/ jsx("div", {
-                            className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-md bg-muted text-muted-foreground",
-                            children: getTypeIcon(row.original.type)
-                        }),
-                        /*#__PURE__*/ jsx("span", {
-                            className: "font-medium",
-                            children: row.original.name
-                        })
-                    ]
-                })
-        },
-        {
-            accessorKey: 'type',
-            header: ({ column })=>/*#__PURE__*/ jsx(DataTableColumnHeader, {
-                    column: column,
-                    title: "Type"
-                }),
-            cell: ({ row })=>/*#__PURE__*/ jsx("span", {
-                    className: "text-muted-foreground",
-                    children: getTypeLabel(row.original.type)
-                })
-        },
-        {
-            accessorKey: 'status',
-            header: ({ column })=>/*#__PURE__*/ jsx(DataTableColumnHeader, {
-                    column: column,
-                    title: "Status"
-                }),
-            cell: ({ row })=>{
-                const status = row.original.status;
-                return status ? /*#__PURE__*/ jsx(Badge, {
-                    variant: getStatusVariant(status),
-                    className: "capitalize",
-                    children: status
-                }) : null;
-            }
-        },
-        {
-            accessorKey: 'lastModified',
-            header: ({ column })=>/*#__PURE__*/ jsx(DataTableColumnHeader, {
-                    column: column,
-                    title: "Last Modified"
-                }),
-            cell: ({ row })=>/*#__PURE__*/ jsx("span", {
-                    className: "text-muted-foreground",
-                    children: row.original.lastModified
-                })
-        },
-        {
-            id: 'actions',
-            cell: ({ row })=>/*#__PURE__*/ jsxs(DropdownMenu, {
-                    children: [
-                        /*#__PURE__*/ jsx(DropdownMenuTrigger, {
-                            asChild: true,
-                            children: /*#__PURE__*/ jsx(Button, {
-                                variant: "ghost",
-                                size: "icon",
-                                className: "h-8 w-8",
-                                children: /*#__PURE__*/ jsx(MoreHorizontal, {
-                                    className: "h-4 w-4"
-                                })
-                            })
-                        }),
-                        /*#__PURE__*/ jsxs(DropdownMenuContent, {
-                            align: "end",
-                            children: [
-                                /*#__PURE__*/ jsx(DropdownMenuItem, {
-                                    onClick: ()=>onProjectSelect?.(row.original.id),
-                                    children: "Open"
-                                }),
-                                /*#__PURE__*/ jsx(DropdownMenuItem, {
-                                    children: "Duplicate"
-                                }),
-                                /*#__PURE__*/ jsx(DropdownMenuItem, {
-                                    children: "Archive"
-                                })
-                            ]
-                        })
-                    ]
-                })
-        }
-    ];
-}
-function FlowStartExample({ className, title = 'BUILD YOUR FIRST AGENTIC PROCESS', subtitle = 'What would you like to start with?', processOptions = [], recentProjects = [], showSkeleton = false, defaultViewMode = 'cards', onOptionSelect, onProjectSelect }) {
-    const [selectedOption, setSelectedOption] = useState(null);
-    const [viewMode, setViewMode] = useState(defaultViewMode);
-    const handleOptionSelect = (optionId)=>{
-        setSelectedOption(optionId);
-        onOptionSelect?.(optionId);
-    };
-    const columns = useMemo(()=>createProjectColumns(onProjectSelect), [
-        onProjectSelect
-    ]);
-    return /*#__PURE__*/ jsxs(Column, {
-        minH: "screen",
-        className: className,
-        children: [
-            /*#__PURE__*/ jsxs("div", {
-                className: "bg-muted/40",
-                children: [
-                    /*#__PURE__*/ jsx("header", {
-                        className: "border-b border-border/50 ",
-                        children: /*#__PURE__*/ jsxs(Row, {
-                            justify: "between",
-                            align: "center",
-                            className: "h-14 px-6",
-                            children: [
-                                /*#__PURE__*/ jsx("span", {
-                                    className: "font-semibold text-lg",
-                                    children: "UiPath Maestro"
-                                }),
-                                /*#__PURE__*/ jsx(Skeleton, {
-                                    className: "h-8 w-8 rounded-full"
-                                })
-                            ]
-                        })
-                    }),
-                    /*#__PURE__*/ jsxs(Column, {
-                        className: "px-8 py-16 md:px-16",
-                        children: [
-                            /*#__PURE__*/ jsxs(Column, {
-                                gap: 3,
-                                align: "center",
-                                className: "mb-12 text-center",
-                                children: [
-                                    /*#__PURE__*/ jsx("h1", {
-                                        className: "text-3xl md:text-4xl font-bold tracking-tight uppercase",
-                                        children: title
-                                    }),
-                                    /*#__PURE__*/ jsx("p", {
-                                        className: "text-muted-foreground text-lg",
-                                        children: subtitle
-                                    })
-                                ]
-                            }),
-                            /*#__PURE__*/ jsx(Grid, {
-                                cols: 1,
-                                gap: 4,
-                                className: "sm:grid-cols-2 lg:grid-cols-4 max-w-6xl mx-auto w-full",
-                                children: processOptions.map((option)=>/*#__PURE__*/ jsx(ProcessOptionCard, {
-                                        option: option,
-                                        isSelected: selectedOption === option.id,
-                                        onSelect: ()=>handleOptionSelect(option.id)
-                                    }, option.id))
-                            }),
-                            showSkeleton && /*#__PURE__*/ jsx(Column, {
-                                gap: 12,
-                                className: "max-w-6xl mx-auto w-full mt-16",
-                                children: /*#__PURE__*/ jsxs(Grid, {
-                                    cols: 1,
-                                    gap: 8,
-                                    className: "lg:grid-cols-3",
-                                    children: [
-                                        /*#__PURE__*/ jsx(SkeletonSection, {}),
-                                        /*#__PURE__*/ jsx(SkeletonSection, {}),
-                                        /*#__PURE__*/ jsx(SkeletonSection, {})
-                                    ]
-                                })
-                            })
-                        ]
-                    })
-                ]
-            }),
-            recentProjects.length > 0 && !showSkeleton && /*#__PURE__*/ jsx(Column, {
-                flex: 1,
-                className: "px-8 py-12 md:px-16",
-                children: /*#__PURE__*/ jsxs(Column, {
-                    gap: 6,
-                    className: "max-w-6xl mx-auto w-full",
-                    children: [
-                        /*#__PURE__*/ jsxs(Row, {
-                            justify: "between",
-                            align: "center",
-                            children: [
-                                /*#__PURE__*/ jsx("h2", {
-                                    className: "text-xl font-semibold",
-                                    children: "Recent Projects"
-                                }),
-                                /*#__PURE__*/ jsxs(ButtonGroup, {
-                                    children: [
-                                        /*#__PURE__*/ jsx(Button, {
-                                            variant: 'cards' === viewMode ? 'secondary' : 'outline',
-                                            size: "icon",
-                                            onClick: ()=>setViewMode('cards'),
-                                            "aria-label": "Card view",
-                                            children: /*#__PURE__*/ jsx(LayoutGrid, {
-                                                className: "h-4 w-4"
-                                            })
-                                        }),
-                                        /*#__PURE__*/ jsx(Button, {
-                                            variant: 'table' === viewMode ? 'secondary' : 'outline',
-                                            size: "icon",
-                                            onClick: ()=>setViewMode('table'),
-                                            "aria-label": "Table view",
-                                            children: /*#__PURE__*/ jsx(List, {
-                                                className: "h-4 w-4"
-                                            })
-                                        })
-                                    ]
-                                })
-                            ]
-                        }),
-                        'cards' === viewMode && /*#__PURE__*/ jsx(Grid, {
-                            cols: 1,
-                            gap: 4,
-                            className: "sm:grid-cols-2 lg:grid-cols-4",
-                            children: recentProjects.map((project)=>/*#__PURE__*/ jsx(RecentProjectCard, {
-                                    project: project,
-                                    onSelect: ()=>onProjectSelect?.(project.id)
-                                }, project.id))
-                        }),
-                        'table' === viewMode && /*#__PURE__*/ jsx(DataTable, {
-                            columns: columns,
-                            data: recentProjects,
-                            searchKey: "name",
-                            searchPlaceholder: "Search projects...",
-                            showColumnToggle: false,
-                            showPagination: recentProjects.length > 10,
-                            compact: true
-                        })
-                    ]
-                })
-            }),
-            showSkeleton && /*#__PURE__*/ jsx("div", {
-                className: "bg-background border-t flex-1",
-                children: /*#__PURE__*/ jsx(Row, {
-                    justify: "center",
-                    className: "px-8 py-8",
-                    children: /*#__PURE__*/ jsx(Skeleton, {
-                        className: "h-24 w-full max-w-4xl rounded-lg"
-                    })
-                })
-            })
-        ]
-    });
-}
-export { FlowStartExample };