@motiadev/workbench 0.7.2-beta.135-685562 → 0.7.2-beta.135-604391

package/dist/src/App.js

@@ -4,15 +4,15 @@ import { analytics } from '@/lib/analytics';
 import { ReactFlowProvider } from '@xyflow/react';
 import { File, GanttChart, Link2, LogsIcon } from 'lucide-react';
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { EndpointsPage } from './components/endpoints/endpoints-page';
 import { FlowPage } from './components/flow/flow-page';
 import { FlowTabMenuItem } from './components/flow/flow-tab-menu-item';
 import { Header } from './components/header/header';
 import { LogsPage } from './components/logs/logs-page';
 import { TracesPage } from './components/observability/traces-page';
-import { APP_SIDEBAR_CONTAINER_ID } from './components/sidebar/sidebar';
+import { APP_SIDEBAR_CONTAINER_ID } from '@motiadev/ui';
 import { StatesPage } from './components/states/states-page';
 import { useTabsStore } from './stores/use-tabs-store';
+import { EndpointsPage } from '@motiadev/plugin-endpoint';
 var TabLocation;
 (function (TabLocation) {
     TabLocation["TOP"] = "top";

package/dist/src/components/flow/base-edge.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { BaseEdge as BaseReactFlowEdge, EdgeLabelRenderer, getSmoothStepPath } from '@xyflow/react';
 import { cva } from 'class-variance-authority';
-import { cn } from '@/lib/utils';
+import { cn } from '@motiadev/ui';
 const labelVariants = cva('absolute pointer-events-all text-cs border p-1 px-2', {
     variants: {
         color: {

package/dist/src/components/logs/log-detail.js

@@ -5,7 +5,7 @@ import ReactJson from 'react18-json-view';
 import 'react18-json-view/src/dark.css';
 import 'react18-json-view/src/style.css';
 import { LogLevelDot } from './log-level-dot';
-import { Sidebar } from '@/components/sidebar/sidebar';
+import { Sidebar } from '@motiadev/ui';
 import { X } from 'lucide-react';
 const defaultProps = ['id', 'msg', 'time', 'level', 'step', 'flows', 'traceId'];
 export const LogDetail = ({ log, onClose }) => {

package/dist/src/components/observability/trace-item/trace-item-detail.js

@@ -1,6 +1,5 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { Sidebar } from '@/components/sidebar/sidebar';
-import { Badge } from '@motiadev/ui';
+import { Sidebar, Badge } from '@motiadev/ui';
 import { formatDuration } from '@/lib/utils';
 import { X } from 'lucide-react';
 import { memo } from 'react';

package/dist/src/components/observability/trace-item/trace-item.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '@/lib/utils';
+import { cn } from '@motiadev/ui';
 export const TraceItem = ({ trace, group, groupEndTime, onExpand }) => {
     return (_jsxs("div", { className: "flex hover:bg-muted-foreground/10 relative cursor-pointer", onClick: () => onExpand(trace.id), "data-testid": "trace-timeline-item", children: [_jsx("div", { className: "flex items-center min-w-[200px] max-w-[200px] h-[32px] max-h-[32px] py-4 px-2 text-sm font-semibold text-foreground truncate sticky left-0 bg-card z-9", children: trace.name }), _jsx("div", { className: "flex w-full flex-row items-center hover:bg-muted/50 rounded-md", children: _jsx("div", { className: "relative w-full h-[32px] flex items-center", children: _jsx("div", { className: cn('h-[24px] rounded-[4px] hover:opacity-80 transition-all duration-200', {
                             'bg-[repeating-linear-gradient(140deg,#BEFE29,#BEFE29_8px,#ABE625_8px,#ABE625_16px)]': trace.status === 'running',

package/dist/src/components/observability/traces-groups.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '@/lib/utils';
+import { cn } from '@motiadev/ui';
 import { formatDistanceToNow } from 'date-fns';
 import { memo } from 'react';
 import { TraceStatusBadge } from './trace-status';

package/dist/src/components/states/state-editor.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { Button } from '@motiadev/ui';
 import { AlertCircle, Check, Loader2, Save } from 'lucide-react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { JsonEditor } from '../endpoints/json-editor';
+import { JsonEditor } from '../ui/json-editor';
 export const StateEditor = ({ state }) => {
     const [isRequestLoading, setIsRequestLoading] = useState(false);
     const [isValid, setIsValid] = useState(true);

package/dist/src/components/states/state-sidebar.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Sidebar } from '@/components/sidebar/sidebar';
+import { Sidebar } from '@motiadev/ui';
 import { X } from 'lucide-react';
 import { StateDetails } from './state-details';
 import { StateEditor } from './state-editor';

package/dist/src/components/ui/table.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
-import { cn } from '@/lib/utils';
+import { cn } from '@motiadev/ui';
 const Table = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { className: "relative w-full overflow-auto", children: _jsx("table", { ref: ref, className: cn('w-full caption-bottom text-sm', className), ...props }) })));
 Table.displayName = 'Table';
 const TableHeader = React.forwardRef(({ className, ...props }, ref) => _jsx("thead", { ref: ref, className: cn('[&_tr]:border-b', className), ...props }));

package/dist/src/components/ui/theme-toggle.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Moon, Sun } from 'lucide-react';
 import { useThemeStore } from '@/stores/use-theme-store';
-import { cn } from '@/lib/utils';
+import { cn } from '@motiadev/ui';
 import { useEffect } from 'react';
 export const ThemeToggle = () => {
     const theme = useThemeStore((state) => state.theme);

package/dist/src/index.css

@@ -1,5 +1,7 @@
-@import "@motiadev/ui/styles.css";
-@import "@motiadev/ui/globals.css";
+@import '@motiadev/plugin-endpoint/styles.css';
+@import '@motiadev/ui/styles.css';
+@import '@motiadev/ui/globals.css';
+
 @import 'tw-animate-css';
 @config "../tailwind.config.js";
 
@@ -13,12 +15,12 @@
 }
 
 .json-view {
-  background:rgba(0, 0, 0, 0.1);
+  background: rgba(0, 0, 0, 0.1);
 }
 
 .dark {
   .react-flow__panel {
-    background: var(--background)
+    background: var(--background);
   }
   .json-view {
     background: rgba(0, 0, 0, 0.8);
@@ -45,10 +47,12 @@
   font-weight: 500;
 }
 
-.json-view--pair, .json-view--property, .json-view > span {
+.json-view--pair,
+.json-view--property,
+.json-view > span {
   line-height: 24px;
 }
 
 .json-view--property {
   font-weight: 600;
-}
+}

package/dist/src/lib/utils.d.ts

@@ -1,4 +1,2 @@
-import { type ClassValue } from 'clsx';
-export declare function cn(...inputs: ClassValue[]): string;
 export declare const formatDuration: (duration?: number) => string;
 export declare const formatTimestamp: (time: number) => string;

package/dist/src/lib/utils.js

@@ -1,8 +1,3 @@
-import { clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-export function cn(...inputs) {
-    return twMerge(clsx(inputs));
-}
 export const formatDuration = (duration) => {
     if (!duration)
         return 'N/A';

package/dist/src/publicComponents/base-node/feature-card.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '@/lib/utils';
+import { cn } from '@motiadev/ui';
 export const FeatureCard = ({ feature, highlighted, onClick, onHover }) => {
     return (_jsxs("div", { "data-feature-id": feature.id, className: cn('p-4 rounded-lg bg-card shadow-sm cursor-pointer hover:bg-card/50 border-2 border-transparent', highlighted && 'border-2 border-accent-1000 bg-accent-100'), onClick: onClick, onMouseEnter: onHover, children: [_jsx("div", { className: "text-md font-semibold text-foreground leading-tight whitespace-nowrap mb-2", children: feature.title }), _jsx("div", { className: "text-sm font-medium text-muted-foreground leading-tight", children: feature.description }), feature.link && (_jsx("div", { className: "text-sm font-medium text-muted-foreground leading-tight", children: _jsx("a", { href: feature.link, children: "Learn more" }) }))] }));
 };

package/dist/src/publicComponents/base-node/node-header.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '@/lib/utils';
+import { cn } from '@motiadev/ui';
 import { cva } from 'class-variance-authority';
 import { CalendarClock, CircleOff, Link2, Waypoints } from 'lucide-react';
 const baseIcon = cva('rounded-md p-2', {

package/dist/src/publicComponents/base-node/node-sidebar.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Sidebar } from '@/components/sidebar/sidebar';
+import { Sidebar } from '@motiadev/ui';
 import { X } from 'lucide-react';
 import { CodeDisplay } from './code-display';
 export const NodeSidebar = ({ content, title, subtitle, language, isOpen, onClose, features, }) => {