From 1ced6ece4c1f9968e87717dda0b83e5c4cd016ed Mon Sep 17 00:00:00 2001 From: AI Christianson Date: Thu, 13 Mar 2025 18:25:21 -0400 Subject: [PATCH] agent ui components --- .gitignore | 2 + frontend/common/dist/components/ui/index.d.ts | 3 + frontend/common/dist/components/ui/index.js | 3 + frontend/common/dist/index.d.ts | 5 + frontend/common/dist/index.js | 10 +- frontend/common/dist/styles/global.css | 472 +++++++ frontend/common/dist/utils.d.ts | 1 + frontend/common/dist/utils.js | 2 + frontend/common/package.json | 2 + .../common/src/components/SessionDrawer.js | 66 + .../common/src/components/SessionDrawer.tsx | 90 ++ .../common/src/components/SessionSidebar.js | 53 + .../common/src/components/SessionSidebar.tsx | 73 ++ .../common/src/components/TimelineFeed.js | 103 ++ .../common/src/components/TimelineFeed.tsx | 123 ++ .../common/src/components/TimelineStep.js | 76 ++ .../common/src/components/TimelineStep.tsx | 86 ++ frontend/common/src/components/ui/button.js | 48 + frontend/common/src/components/ui/card.js | 52 + .../common/src/components/ui/collapsible.js | 29 + .../common/src/components/ui/collapsible.tsx | 27 + frontend/common/src/components/ui/index.js | 23 + frontend/common/src/components/ui/index.ts | 5 +- frontend/common/src/components/ui/input.js | 22 + .../common/src/components/ui/scroll-area.js | 40 + .../common/src/components/ui/scroll-area.tsx | 47 + frontend/common/src/components/ui/sheet.js | 83 ++ frontend/common/src/components/ui/sheet.tsx | 134 ++ frontend/common/src/components/ui/switch.js | 25 + frontend/common/src/index.js | 38 + frontend/common/src/index.ts | 20 +- frontend/common/src/utils.js | 32 + frontend/common/src/utils.ts | 5 +- frontend/common/src/utils/index.js | 32 + frontend/common/src/utils/index.ts | 13 + frontend/common/src/utils/sample-data.js | 163 +++ frontend/common/src/utils/sample-data.ts | 187 +++ frontend/common/tsconfig.json | 5 +- frontend/package-lock.json | 1083 +++++++++++++++-- frontend/web/src/index.tsx | 254 ++-- frontend/web/vite.config.js | 4 +- 41 files changed, 3263 insertions(+), 278 deletions(-) create mode 100644 frontend/common/src/components/SessionDrawer.js create mode 100644 frontend/common/src/components/SessionDrawer.tsx create mode 100644 frontend/common/src/components/SessionSidebar.js create mode 100644 frontend/common/src/components/SessionSidebar.tsx create mode 100644 frontend/common/src/components/TimelineFeed.js create mode 100644 frontend/common/src/components/TimelineFeed.tsx create mode 100644 frontend/common/src/components/TimelineStep.js create mode 100644 frontend/common/src/components/TimelineStep.tsx create mode 100644 frontend/common/src/components/ui/button.js create mode 100644 frontend/common/src/components/ui/card.js create mode 100644 frontend/common/src/components/ui/collapsible.js create mode 100644 frontend/common/src/components/ui/collapsible.tsx create mode 100644 frontend/common/src/components/ui/index.js create mode 100644 frontend/common/src/components/ui/input.js create mode 100644 frontend/common/src/components/ui/scroll-area.js create mode 100644 frontend/common/src/components/ui/scroll-area.tsx create mode 100644 frontend/common/src/components/ui/sheet.js create mode 100644 frontend/common/src/components/ui/sheet.tsx create mode 100644 frontend/common/src/components/ui/switch.js create mode 100644 frontend/common/src/index.js create mode 100644 frontend/common/src/utils.js create mode 100644 frontend/common/src/utils/index.js create mode 100644 frontend/common/src/utils/index.ts create mode 100644 frontend/common/src/utils/sample-data.js create mode 100644 frontend/common/src/utils/sample-data.ts diff --git a/.gitignore b/.gitignore index ae783cf..b449eac 100644 --- a/.gitignore +++ b/.gitignore @@ -17,3 +17,5 @@ appmap.log /vsc/node_modules /vsc/dist node_modules/ +/frontend/common/dist +/frontend/web/dist/ diff --git a/frontend/common/dist/components/ui/index.d.ts b/frontend/common/dist/components/ui/index.d.ts index 98d6cb9..744def9 100644 --- a/frontend/common/dist/components/ui/index.d.ts +++ b/frontend/common/dist/components/ui/index.d.ts @@ -1,4 +1,7 @@ export * from './button'; export * from './card'; +export * from './collapsible'; export * from './input'; +export * from './sheet'; export * from './switch'; +export * from './scroll-area'; diff --git a/frontend/common/dist/components/ui/index.js b/frontend/common/dist/components/ui/index.js index 98d6cb9..744def9 100644 --- a/frontend/common/dist/components/ui/index.js +++ b/frontend/common/dist/components/ui/index.js @@ -1,4 +1,7 @@ export * from './button'; export * from './card'; +export * from './collapsible'; export * from './input'; +export * from './sheet'; export * from './switch'; +export * from './scroll-area'; diff --git a/frontend/common/dist/index.d.ts b/frontend/common/dist/index.d.ts index a41611b..debff1f 100644 --- a/frontend/common/dist/index.d.ts +++ b/frontend/common/dist/index.d.ts @@ -1,4 +1,9 @@ import './styles/global.css'; export * from './utils'; export * from './components/ui'; +export * from './components/TimelineStep'; +export * from './components/TimelineFeed'; +export * from './components/SessionDrawer'; +export * from './components/SessionSidebar'; export declare const hello: () => void; +export { getSampleAgentSteps, getSampleAgentSessions, type AgentStep, type AgentSession } from './utils/sample-data'; diff --git a/frontend/common/dist/index.js b/frontend/common/dist/index.js index e728e96..6a1ebf0 100644 --- a/frontend/common/dist/index.js +++ b/frontend/common/dist/index.js @@ -1,10 +1,18 @@ // Entry point for @ra-aid/common package import './styles/global.css'; -// Export utility functions +// Export utility functions (excluding sample data to avoid circular references) export * from './utils'; // Export all UI components export * from './components/ui'; +// Export timeline components +export * from './components/TimelineStep'; +export * from './components/TimelineFeed'; +// Export session navigation components +export * from './components/SessionDrawer'; +export * from './components/SessionSidebar'; // Export the hello function (temporary example) export const hello = () => { console.log("Hello from @ra-aid/common"); }; +// Directly export sample data functions and types to avoid circular references +export { getSampleAgentSteps, getSampleAgentSessions } from './utils/sample-data'; diff --git a/frontend/common/dist/styles/global.css b/frontend/common/dist/styles/global.css index 1dadc73..4251603 100644 --- a/frontend/common/dist/styles/global.css +++ b/frontend/common/dist/styles/global.css @@ -539,9 +539,85 @@ video { color: hsl(var(--foreground)); font-feature-settings: "rlig" 1, "calt" 1; } +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border-width: 0; +} .pointer-events-none { pointer-events: none; } +.fixed { + position: fixed; +} +.absolute { + position: absolute; +} +.relative { + position: relative; +} +.inset-0 { + inset: 0px; +} +.inset-x-0 { + left: 0px; + right: 0px; +} +.inset-y-0 { + top: 0px; + bottom: 0px; +} +.bottom-0 { + bottom: 0px; +} +.left-0 { + left: 0px; +} +.right-0 { + right: 0px; +} +.right-4 { + right: 1rem; +} +.top-0 { + top: 0px; +} +.top-4 { + top: 1rem; +} +.z-50 { + z-index: 50; +} +.mb-2 { + margin-bottom: 0.5rem; +} +.mb-4 { + margin-bottom: 1rem; +} +.mr-2 { + margin-right: 0.5rem; +} +.mr-3 { + margin-right: 0.75rem; +} +.mt-1 { + margin-top: 0.25rem; +} +.mt-1\.5 { + margin-top: 0.375rem; +} +.mt-3 { + margin-top: 0.75rem; +} +.mt-6 { + margin-top: 1.5rem; +} .block { display: block; } @@ -551,9 +627,18 @@ video { .inline-flex { display: inline-flex; } +.hidden { + display: none; +} .h-10 { height: 2.5rem; } +.h-2\.5 { + height: 0.625rem; +} +.h-3 { + height: 0.75rem; +} .h-4 { height: 1rem; } @@ -566,44 +651,142 @@ video { .h-9 { height: 2.25rem; } +.h-\[calc\(100vh-5rem\)\] { + height: calc(100vh - 5rem); +} +.h-full { + height: 100%; +} +.h-screen { + height: 100vh; +} +.w-2\.5 { + width: 0.625rem; +} +.w-3 { + width: 0.75rem; +} +.w-3\/4 { + width: 75%; +} .w-4 { width: 1rem; } +.w-5 { + width: 1.25rem; +} .w-9 { width: 2.25rem; } +.w-\[250px\] { + width: 250px; +} +.w-\[85\%\] { + width: 85%; +} .w-full { width: 100%; } +.min-w-0 { + min-width: 0px; +} +.max-w-xs { + max-width: 20rem; +} +.flex-1 { + flex: 1 1 0%; +} +.flex-shrink-0 { + flex-shrink: 0; +} .shrink-0 { flex-shrink: 0; } .cursor-pointer { cursor: pointer; } +.touch-none { + touch-action: none; +} +.select-none { + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; +} .flex-col { flex-direction: column; } +.flex-col-reverse { + flex-direction: column-reverse; +} +.items-start { + align-items: flex-start; +} +.items-end { + align-items: flex-end; +} .items-center { align-items: center; } .justify-center { justify-content: center; } +.justify-between { + justify-content: space-between; +} +.gap-2 { + gap: 0.5rem; +} +.gap-4 { + gap: 1rem; +} .space-y-1\.5 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(0.375rem * var(--tw-space-y-reverse)); } +.space-y-2 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); +} +.space-y-4 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(1rem * var(--tw-space-y-reverse)); +} +.overflow-hidden { + overflow: hidden; +} +.overflow-x-auto { + overflow-x: auto; +} +.truncate { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} .whitespace-nowrap { white-space: nowrap; } +.whitespace-pre-wrap { + white-space: pre-wrap; +} +.rounded { + border-radius: 0.25rem; +} +.rounded-\[inherit\] { + border-radius: inherit; +} .rounded-full { border-radius: 9999px; } .rounded-md { border-radius: calc(var(--radius) - 2px); } +.rounded-sm { + border-radius: calc(var(--radius) - 4px); +} .rounded-xl { border-radius: 0.75rem; } @@ -613,30 +796,96 @@ video { .border-2 { border-width: 2px; } +.border-b { + border-bottom-width: 1px; +} +.border-l { + border-left-width: 1px; +} +.border-r { + border-right-width: 1px; +} +.border-t { + border-top-width: 1px; +} +.border-border { + border-color: hsl(var(--border)); +} .border-input { border-color: hsl(var(--input)); } .border-transparent { border-color: transparent; } +.border-l-transparent { + border-left-color: transparent; +} +.border-t-transparent { + border-top-color: transparent; +} +.bg-accent { + background-color: hsl(var(--accent)); +} .bg-background { background-color: hsl(var(--background)); } +.bg-background\/80 { + background-color: hsl(var(--background) / 0.8); +} +.bg-blue-500 { + --tw-bg-opacity: 1; + background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1)); +} +.bg-border { + background-color: hsl(var(--border)); +} .bg-card { background-color: hsl(var(--card)); } .bg-destructive { background-color: hsl(var(--destructive)); } +.bg-gray-500 { + --tw-bg-opacity: 1; + background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1)); +} +.bg-green-500 { + --tw-bg-opacity: 1; + background-color: rgb(34 197 94 / var(--tw-bg-opacity, 1)); +} .bg-primary { background-color: hsl(var(--primary)); } +.bg-red-500 { + --tw-bg-opacity: 1; + background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1)); +} .bg-secondary { background-color: hsl(var(--secondary)); } +.bg-secondary\/50 { + background-color: hsl(var(--secondary) / 0.5); +} +.bg-yellow-500 { + --tw-bg-opacity: 1; + background-color: rgb(234 179 8 / var(--tw-bg-opacity, 1)); +} +.p-3 { + padding: 0.75rem; +} +.p-4 { + padding: 1rem; +} .p-6 { padding: 1.5rem; } +.p-\[1px\] { + padding: 1px; +} +.px-2 { + padding-left: 0.5rem; + padding-right: 0.5rem; +} .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; @@ -657,9 +906,29 @@ video { padding-top: 0.5rem; padding-bottom: 0.5rem; } +.py-8 { + padding-top: 2rem; + padding-bottom: 2rem; +} +.pb-2 { + padding-bottom: 0.5rem; +} .pt-0 { padding-top: 0px; } +.pt-3 { + padding-top: 0.75rem; +} +.text-left { + text-align: left; +} +.text-center { + text-align: center; +} +.text-lg { + font-size: 1.125rem; + line-height: 1.75rem; +} .text-sm { font-size: 0.875rem; line-height: 1.25rem; @@ -674,6 +943,9 @@ video { .font-semibold { font-weight: 600; } +.capitalize { + text-transform: capitalize; +} .leading-none { line-height: 1; } @@ -686,6 +958,9 @@ video { .text-destructive-foreground { color: hsl(var(--destructive-foreground)); } +.text-foreground { + color: hsl(var(--foreground)); +} .text-muted-foreground { color: hsl(var(--muted-foreground)); } @@ -701,6 +976,9 @@ video { .underline-offset-4 { text-underline-offset: 4px; } +.opacity-70 { + opacity: 0.7; +} .shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); @@ -724,16 +1002,50 @@ video { --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } +.ring-offset-background { + --tw-ring-offset-color: hsl(var(--background)); +} +.filter { + filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); +} +.backdrop-blur-sm { + --tw-backdrop-blur: blur(4px); + -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); + backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); +} +.transition { + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} +.transition-all { + transition-property: all; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} .transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } +.transition-opacity { + transition-property: opacity; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; +} .transition-transform { transition-property: transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } +.duration-200 { + transition-duration: 200ms; +} +.ease-in-out { + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); +} @keyframes enter { from { @@ -748,6 +1060,12 @@ video { transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0)); } } +.duration-200 { + animation-duration: 200ms; +} +.ease-in-out { + animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); +} .file\:border-0::file-selector-button { border-width: 0px; } @@ -770,6 +1088,9 @@ video { .hover\:bg-accent:hover { background-color: hsl(var(--accent)); } +.hover\:bg-accent\/50:hover { + background-color: hsl(var(--accent) / 0.5); +} .hover\:bg-destructive\/90:hover { background-color: hsl(var(--destructive) / 0.9); } @@ -785,6 +1106,24 @@ video { .hover\:underline:hover { text-decoration-line: underline; } +.hover\:opacity-100:hover { + opacity: 1; +} +.focus\:outline-none:focus { + outline: 2px solid transparent; + outline-offset: 2px; +} +.focus\:ring-2:focus { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} +.focus\:ring-ring:focus { + --tw-ring-color: hsl(var(--ring)); +} +.focus\:ring-offset-2:focus { + --tw-ring-offset-width: 2px; +} .focus-visible\:outline-none:focus-visible { outline: 2px solid transparent; outline-offset: 2px; @@ -825,9 +1164,142 @@ video { --tw-translate-x: 0px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } +@keyframes accordion-up { + + from { + height: var(--radix-accordion-content-height); + } + + to { + height: 0; + } +} +.data-\[state\=closed\]\:animate-accordion-up[data-state="closed"] { + animation: accordion-up 0.2s ease-out; +} +@keyframes accordion-down { + + from { + height: 0; + } + + to { + height: var(--radix-accordion-content-height); + } +} +.data-\[state\=open\]\:animate-accordion-down[data-state="open"] { + animation: accordion-down 0.2s ease-out; +} .data-\[state\=checked\]\:bg-primary[data-state="checked"] { background-color: hsl(var(--primary)); } +.data-\[state\=open\]\:bg-secondary[data-state="open"] { + background-color: hsl(var(--secondary)); +} .data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] { background-color: hsl(var(--input)); +} +.data-\[state\=closed\]\:duration-300[data-state="closed"] { + transition-duration: 300ms; +} +.data-\[state\=open\]\:duration-500[data-state="open"] { + transition-duration: 500ms; +} +.data-\[state\=open\]\:animate-in[data-state="open"] { + animation-name: enter; + animation-duration: 150ms; + --tw-enter-opacity: initial; + --tw-enter-scale: initial; + --tw-enter-rotate: initial; + --tw-enter-translate-x: initial; + --tw-enter-translate-y: initial; +} +.data-\[state\=closed\]\:animate-out[data-state="closed"] { + animation-name: exit; + animation-duration: 150ms; + --tw-exit-opacity: initial; + --tw-exit-scale: initial; + --tw-exit-rotate: initial; + --tw-exit-translate-x: initial; + --tw-exit-translate-y: initial; +} +.data-\[state\=closed\]\:fade-out-0[data-state="closed"] { + --tw-exit-opacity: 0; +} +.data-\[state\=open\]\:fade-in-0[data-state="open"] { + --tw-enter-opacity: 0; +} +.data-\[state\=closed\]\:slide-out-to-bottom[data-state="closed"] { + --tw-exit-translate-y: 100%; +} +.data-\[state\=closed\]\:slide-out-to-left[data-state="closed"] { + --tw-exit-translate-x: -100%; +} +.data-\[state\=closed\]\:slide-out-to-right[data-state="closed"] { + --tw-exit-translate-x: 100%; +} +.data-\[state\=closed\]\:slide-out-to-top[data-state="closed"] { + --tw-exit-translate-y: -100%; +} +.data-\[state\=open\]\:slide-in-from-bottom[data-state="open"] { + --tw-enter-translate-y: 100%; +} +.data-\[state\=open\]\:slide-in-from-left[data-state="open"] { + --tw-enter-translate-x: -100%; +} +.data-\[state\=open\]\:slide-in-from-right[data-state="open"] { + --tw-enter-translate-x: 100%; +} +.data-\[state\=open\]\:slide-in-from-top[data-state="open"] { + --tw-enter-translate-y: -100%; +} +.data-\[state\=closed\]\:duration-300[data-state="closed"] { + animation-duration: 300ms; +} +.data-\[state\=open\]\:duration-500[data-state="open"] { + animation-duration: 500ms; +} +@media (min-width: 640px) { + + .sm\:max-w-md { + max-width: 28rem; + } + + .sm\:max-w-sm { + max-width: 24rem; + } + + .sm\:flex-row { + flex-direction: row; + } + + .sm\:justify-end { + justify-content: flex-end; + } + + .sm\:space-x-2 > :not([hidden]) ~ :not([hidden]) { + --tw-space-x-reverse: 0; + margin-right: calc(0.5rem * var(--tw-space-x-reverse)); + margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); + } + + .sm\:text-left { + text-align: left; + } +} +@media (min-width: 768px) { + + .md\:block { + display: block; + } + + .md\:hidden { + display: none; + } +} +@media (min-width: 1024px) { + + .lg\:w-\[300px\] { + width: 300px; + } } \ No newline at end of file diff --git a/frontend/common/dist/utils.d.ts b/frontend/common/dist/utils.d.ts index cb5c09c..4e0c4fb 100644 --- a/frontend/common/dist/utils.d.ts +++ b/frontend/common/dist/utils.d.ts @@ -4,3 +4,4 @@ import { type ClassValue } from "clsx"; * Combines clsx for conditional logic and tailwind-merge for handling conflicting tailwind classes */ export declare function cn(...inputs: ClassValue[]): string; +export * from './utils'; diff --git a/frontend/common/dist/utils.js b/frontend/common/dist/utils.js index f6d397a..486f242 100644 --- a/frontend/common/dist/utils.js +++ b/frontend/common/dist/utils.js @@ -7,3 +7,5 @@ import { twMerge } from "tailwind-merge"; export function cn(...inputs) { return twMerge(clsx(inputs)); } +// Re-export everything from utils directory +export * from './utils'; diff --git a/frontend/common/package.json b/frontend/common/package.json index 9f18aae..a876539 100644 --- a/frontend/common/package.json +++ b/frontend/common/package.json @@ -9,9 +9,11 @@ "dev": "concurrently \"tsc --watch\" \"postcss src/styles/global.css -o dist/styles/global.css --watch\"" }, "dependencies": { + "@radix-ui/react-collapsible": "^1.1.3", "@radix-ui/react-dialog": "^1.0.5", "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-popover": "^1.0.7", + "@radix-ui/react-scroll-area": "^1.2.3", "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", "@radix-ui/react-switch": "^1.1.3", diff --git a/frontend/common/src/components/SessionDrawer.js b/frontend/common/src/components/SessionDrawer.js new file mode 100644 index 0000000..f1b6311 --- /dev/null +++ b/frontend/common/src/components/SessionDrawer.js @@ -0,0 +1,66 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.SessionDrawer = void 0; +var react_1 = require("react"); +var lucide_react_1 = require("lucide-react"); +var sheet_1 = require("./ui/sheet"); +var button_1 = require("./ui/button"); +var scroll_area_1 = require("./ui/scroll-area"); +var sample_data_1 = require("../utils/sample-data"); +var SessionDrawer = function (_a) { + var onSelectSession = _a.onSelectSession, currentSessionId = _a.currentSessionId, _b = _a.sessions, sessions = _b === void 0 ? (0, sample_data_1.getSampleAgentSessions)() : _b; + // Get status color + var getStatusColor = function (status) { + switch (status) { + case 'active': + return 'bg-blue-500'; + case 'completed': + return 'bg-green-500'; + case 'error': + return 'bg-red-500'; + default: + return 'bg-gray-500'; + } + }; + // Format timestamp + var formatDate = function (date) { + return date.toLocaleDateString([], { + month: 'short', + day: 'numeric', + hour: '2-digit', + minute: '2-digit' + }); + }; + return ( + + + + Toggle navigation + + + + + Sessions + + +
+ {sessions.map(function (session) { return ( + + ); })} +
+ + + ); +}; +exports.SessionDrawer = SessionDrawer; diff --git a/frontend/common/src/components/SessionDrawer.tsx b/frontend/common/src/components/SessionDrawer.tsx new file mode 100644 index 0000000..67fbf65 --- /dev/null +++ b/frontend/common/src/components/SessionDrawer.tsx @@ -0,0 +1,90 @@ +import React from 'react'; +import { Menu } from 'lucide-react'; +import { + Sheet, + SheetTrigger, + SheetContent, + SheetHeader, + SheetTitle, + SheetClose +} from './ui/sheet'; +import { Button } from './ui/button'; +import { ScrollArea } from './ui/scroll-area'; +import { AgentSession, getSampleAgentSessions } from '../utils/sample-data'; + +interface SessionDrawerProps { + onSelectSession?: (sessionId: string) => void; + currentSessionId?: string; + sessions?: AgentSession[]; +} + +export const SessionDrawer: React.FC = ({ + onSelectSession, + currentSessionId, + sessions = getSampleAgentSessions() +}) => { + // Get status color + const getStatusColor = (status: string) => { + switch (status) { + case 'active': + return 'bg-blue-500'; + case 'completed': + return 'bg-green-500'; + case 'error': + return 'bg-red-500'; + default: + return 'bg-gray-500'; + } + }; + + // Format timestamp + const formatDate = (date: Date) => { + return date.toLocaleDateString([], { + month: 'short', + day: 'numeric', + hour: '2-digit', + minute: '2-digit' + }); + }; + + return ( + + + + + + + Sessions + + +
+ {sessions.map((session) => ( + + + + ))} +
+ + + + ); +}; \ No newline at end of file diff --git a/frontend/common/src/components/SessionSidebar.js b/frontend/common/src/components/SessionSidebar.js new file mode 100644 index 0000000..e4b4808 --- /dev/null +++ b/frontend/common/src/components/SessionSidebar.js @@ -0,0 +1,53 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.SessionSidebar = void 0; +var react_1 = require("react"); +var scroll_area_1 = require("./ui/scroll-area"); +var sample_data_1 = require("../utils/sample-data"); +var SessionSidebar = function (_a) { + var onSelectSession = _a.onSelectSession, currentSessionId = _a.currentSessionId, _b = _a.sessions, sessions = _b === void 0 ? (0, sample_data_1.getSampleAgentSessions)() : _b, _c = _a.className, className = _c === void 0 ? '' : _c; + // Get status color + var getStatusColor = function (status) { + switch (status) { + case 'active': + return 'bg-blue-500'; + case 'completed': + return 'bg-green-500'; + case 'error': + return 'bg-red-500'; + default: + return 'bg-gray-500'; + } + }; + // Format timestamp + var formatDate = function (date) { + return date.toLocaleDateString([], { + month: 'short', + day: 'numeric', + hour: '2-digit', + minute: '2-digit' + }); + }; + return (
+
+

Sessions

+
+ +
+ {sessions.map(function (session) { return (); })} +
+ +
); +}; +exports.SessionSidebar = SessionSidebar; diff --git a/frontend/common/src/components/SessionSidebar.tsx b/frontend/common/src/components/SessionSidebar.tsx new file mode 100644 index 0000000..2fb9e4f --- /dev/null +++ b/frontend/common/src/components/SessionSidebar.tsx @@ -0,0 +1,73 @@ +import React from 'react'; +import { ScrollArea } from './ui/scroll-area'; +import { AgentSession, getSampleAgentSessions } from '../utils/sample-data'; + +interface SessionSidebarProps { + onSelectSession?: (sessionId: string) => void; + currentSessionId?: string; + sessions?: AgentSession[]; + className?: string; +} + +export const SessionSidebar: React.FC = ({ + onSelectSession, + currentSessionId, + sessions = getSampleAgentSessions(), + className = '' +}) => { + // Get status color + const getStatusColor = (status: string) => { + switch (status) { + case 'active': + return 'bg-blue-500'; + case 'completed': + return 'bg-green-500'; + case 'error': + return 'bg-red-500'; + default: + return 'bg-gray-500'; + } + }; + + // Format timestamp + const formatDate = (date: Date) => { + return date.toLocaleDateString([], { + month: 'short', + day: 'numeric', + hour: '2-digit', + minute: '2-digit' + }); + }; + + return ( +
+
+

Sessions

+
+ +
+ {sessions.map((session) => ( + + ))} +
+ +
+ ); +}; \ No newline at end of file diff --git a/frontend/common/src/components/TimelineFeed.js b/frontend/common/src/components/TimelineFeed.js new file mode 100644 index 0000000..1d0694c --- /dev/null +++ b/frontend/common/src/components/TimelineFeed.js @@ -0,0 +1,103 @@ +"use strict"; +var __assign = (this && this.__assign) || function () { + __assign = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign.apply(this, arguments); +}; +var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) { + if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { + if (ar || !(i in from)) { + if (!ar) ar = Array.prototype.slice.call(from, 0, i); + ar[i] = from[i]; + } + } + return to.concat(ar || Array.prototype.slice.call(from)); +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.TimelineFeed = void 0; +var react_1 = require("react"); +var scroll_area_1 = require("./ui/scroll-area"); +var TimelineStep_1 = require("./TimelineStep"); +var TimelineFeed = function (_a) { + var steps = _a.steps, _b = _a.maxHeight, maxHeight = _b === void 0 ? '500px' : _b, filter = _a.filter, _c = _a.sortOrder, sortOrder = _c === void 0 ? 'desc' : _c; + // State for filtered and sorted steps + var _d = (0, react_1.useState)(filter), activeFilter = _d[0], setActiveFilter = _d[1]; + var _e = (0, react_1.useState)(sortOrder), activeSortOrder = _e[0], setActiveSortOrder = _e[1]; + // Apply filters and sorting + var filteredSteps = steps.filter(function (step) { + if (!activeFilter) + return true; + var typeMatch = !activeFilter.types || activeFilter.types.length === 0 || + activeFilter.types.includes(step.type); + var statusMatch = !activeFilter.status || activeFilter.status.length === 0 || + activeFilter.status.includes(step.status); + return typeMatch && statusMatch; + }); + // Sort steps + var sortedSteps = __spreadArray([], filteredSteps, true).sort(function (a, b) { + if (activeSortOrder === 'asc') { + return a.timestamp.getTime() - b.timestamp.getTime(); + } + else { + return b.timestamp.getTime() - a.timestamp.getTime(); + } + }); + // Toggle sort order + var toggleSortOrder = function () { + setActiveSortOrder(function (prevOrder) { return prevOrder === 'asc' ? 'desc' : 'asc'; }); + }; + // Filter by type + var filterTypes = [ + 'all', + 'tool-execution', + 'thinking', + 'planning', + 'implementation', + 'user-input' + ]; + var handleFilterChange = function (type) { + if (type === 'all') { + setActiveFilter(__assign(__assign({}, activeFilter), { types: [] })); + } + else { + setActiveFilter(__assign(__assign({}, activeFilter), { types: [type] })); + } + }; + return (
+
+
+

Timeline Feed

+ +
+ +
+ {filterTypes.map(function (type) { + var _a; + return (); + })} +
+
+ + +
+ {sortedSteps.length > 0 ? (sortedSteps.map(function (step) { return (); })) : (
+ No steps to display +
)} +
+ +
); +}; +exports.TimelineFeed = TimelineFeed; diff --git a/frontend/common/src/components/TimelineFeed.tsx b/frontend/common/src/components/TimelineFeed.tsx new file mode 100644 index 0000000..37ef12d --- /dev/null +++ b/frontend/common/src/components/TimelineFeed.tsx @@ -0,0 +1,123 @@ +import React, { useState } from 'react'; +import { ScrollArea } from './ui/scroll-area'; +import { TimelineStep } from './TimelineStep'; +import { AgentStep } from '../utils/sample-data'; + +interface TimelineFeedProps { + steps: AgentStep[]; + maxHeight?: string; + filter?: { + types?: string[]; + status?: string[]; + }; + sortOrder?: 'asc' | 'desc'; +} + +export const TimelineFeed: React.FC = ({ + steps, + maxHeight = '500px', + filter, + sortOrder = 'desc' +}) => { + // State for filtered and sorted steps + const [activeFilter, setActiveFilter] = useState(filter); + const [activeSortOrder, setActiveSortOrder] = useState<'asc' | 'desc'>(sortOrder); + + // Apply filters and sorting + const filteredSteps = steps.filter(step => { + if (!activeFilter) return true; + + const typeMatch = !activeFilter.types || activeFilter.types.length === 0 || + activeFilter.types.includes(step.type); + + const statusMatch = !activeFilter.status || activeFilter.status.length === 0 || + activeFilter.status.includes(step.status); + + return typeMatch && statusMatch; + }); + + // Sort steps + const sortedSteps = [...filteredSteps].sort((a, b) => { + if (activeSortOrder === 'asc') { + return a.timestamp.getTime() - b.timestamp.getTime(); + } else { + return b.timestamp.getTime() - a.timestamp.getTime(); + } + }); + + // Toggle sort order + const toggleSortOrder = () => { + setActiveSortOrder(prevOrder => prevOrder === 'asc' ? 'desc' : 'asc'); + }; + + // Filter by type + const filterTypes = [ + 'all', + 'tool-execution', + 'thinking', + 'planning', + 'implementation', + 'user-input' + ]; + + const handleFilterChange = (type: string) => { + if (type === 'all') { + setActiveFilter({ + ...activeFilter, + types: [] + }); + } else { + setActiveFilter({ + ...activeFilter, + types: [type] + }); + } + }; + + return ( +
+
+
+

Timeline Feed

+ +
+ +
+ {filterTypes.map(type => ( + + ))} +
+
+ + +
+ {sortedSteps.length > 0 ? ( + sortedSteps.map((step) => ( + + )) + ) : ( +
+ No steps to display +
+ )} +
+ +
+ ); +}; \ No newline at end of file diff --git a/frontend/common/src/components/TimelineStep.js b/frontend/common/src/components/TimelineStep.js new file mode 100644 index 0000000..931af59 --- /dev/null +++ b/frontend/common/src/components/TimelineStep.js @@ -0,0 +1,76 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.TimelineStep = void 0; +var react_1 = require("react"); +var collapsible_1 = require("./ui/collapsible"); +var TimelineStep = function (_a) { + var step = _a.step; + // Get status color + var getStatusColor = function (status) { + switch (status) { + case 'completed': + return 'bg-green-500'; + case 'in-progress': + return 'bg-blue-500'; + case 'error': + return 'bg-red-500'; + case 'pending': + return 'bg-yellow-500'; + default: + return 'bg-gray-500'; + } + }; + // Get icon based on step type + var getTypeIcon = function (type) { + switch (type) { + case 'tool-execution': + return '🛠️'; + case 'thinking': + return '💭'; + case 'planning': + return '📝'; + case 'implementation': + return '💻'; + case 'user-input': + return '👤'; + default: + return '▶️'; + } + }; + // Format timestamp + var formatTime = function (timestamp) { + return timestamp.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }); + }; + return ( + +
+
+
{getTypeIcon(step.type)}
+
+
{step.title}
+
+ {step.type === 'tool-execution' ? 'Run tool' : step.content.substring(0, 60)} + {step.content.length > 60 ? '...' : ''} +
+
+
+
+ {formatTime(step.timestamp)} + {step.duration && ({(step.duration / 1000).toFixed(1)}s)} +
+ + +
+
+ {step.content} +
+ {step.duration && (
+
+ Duration: {(step.duration / 1000).toFixed(1)} seconds +
+
)} +
+ + ); +}; +exports.TimelineStep = TimelineStep; diff --git a/frontend/common/src/components/TimelineStep.tsx b/frontend/common/src/components/TimelineStep.tsx new file mode 100644 index 0000000..52522fa --- /dev/null +++ b/frontend/common/src/components/TimelineStep.tsx @@ -0,0 +1,86 @@ +import React from 'react'; +import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible'; +import { AgentStep } from '../utils/sample-data'; + +interface TimelineStepProps { + step: AgentStep; +} + +export const TimelineStep: React.FC = ({ step }) => { + // Get status color + const getStatusColor = (status: string) => { + switch (status) { + case 'completed': + return 'bg-green-500'; + case 'in-progress': + return 'bg-blue-500'; + case 'error': + return 'bg-red-500'; + case 'pending': + return 'bg-yellow-500'; + default: + return 'bg-gray-500'; + } + }; + + // Get icon based on step type + const getTypeIcon = (type: string) => { + switch (type) { + case 'tool-execution': + return '🛠️'; + case 'thinking': + return '💭'; + case 'planning': + return '📝'; + case 'implementation': + return '💻'; + case 'user-input': + return '👤'; + default: + return '▶️'; + } + }; + + // Format timestamp + const formatTime = (timestamp: Date) => { + return timestamp.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }); + }; + + return ( + + +
+
+
{getTypeIcon(step.type)}
+
+
{step.title}
+
+ {step.type === 'tool-execution' ? 'Run tool' : step.content.substring(0, 60)} + {step.content.length > 60 ? '...' : ''} +
+
+
+
+ {formatTime(step.timestamp)} + {step.duration && ( + {(step.duration / 1000).toFixed(1)}s + )} +
+ + +
+
+ {step.content} +
+ {step.duration && ( +
+
+ Duration: {(step.duration / 1000).toFixed(1)} seconds +
+
+ )} +
+ + + ); +}; \ No newline at end of file diff --git a/frontend/common/src/components/ui/button.js b/frontend/common/src/components/ui/button.js new file mode 100644 index 0000000..016289f --- /dev/null +++ b/frontend/common/src/components/ui/button.js @@ -0,0 +1,48 @@ +"use strict"; +var __rest = (this && this.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.buttonVariants = exports.Button = void 0; +var React = require("react"); +var react_slot_1 = require("@radix-ui/react-slot"); +var class_variance_authority_1 = require("class-variance-authority"); +var utils_1 = require("../../utils"); +var buttonVariants = (0, class_variance_authority_1.cva)("inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", { + variants: { + variant: { + default: "bg-primary text-primary-foreground shadow hover:bg-primary/90", + destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90", + outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground", + secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80", + ghost: "hover:bg-accent hover:text-accent-foreground", + link: "text-primary underline-offset-4 hover:underline", + }, + size: { + default: "h-9 px-4 py-2", + sm: "h-8 rounded-md px-3 text-xs", + lg: "h-10 rounded-md px-8", + icon: "h-9 w-9", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, +}); +exports.buttonVariants = buttonVariants; +var Button = React.forwardRef(function (_a, ref) { + var className = _a.className, variant = _a.variant, size = _a.size, _b = _a.asChild, asChild = _b === void 0 ? false : _b, props = __rest(_a, ["className", "variant", "size", "asChild"]); + var Comp = asChild ? react_slot_1.Slot : "button"; + return (); +}); +exports.Button = Button; +Button.displayName = "Button"; diff --git a/frontend/common/src/components/ui/card.js b/frontend/common/src/components/ui/card.js new file mode 100644 index 0000000..aeb7227 --- /dev/null +++ b/frontend/common/src/components/ui/card.js @@ -0,0 +1,52 @@ +"use strict"; +var __rest = (this && this.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.CardContent = exports.CardDescription = exports.CardTitle = exports.CardFooter = exports.CardHeader = exports.Card = void 0; +var React = require("react"); +var utils_1 = require("../../utils"); +var Card = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (
); +}); +exports.Card = Card; +Card.displayName = "Card"; +var CardHeader = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (
); +}); +exports.CardHeader = CardHeader; +CardHeader.displayName = "CardHeader"; +var CardTitle = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (

); +}); +exports.CardTitle = CardTitle; +CardTitle.displayName = "CardTitle"; +var CardDescription = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (

); +}); +exports.CardDescription = CardDescription; +CardDescription.displayName = "CardDescription"; +var CardContent = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (

); +}); +exports.CardContent = CardContent; +CardContent.displayName = "CardContent"; +var CardFooter = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (
); +}); +exports.CardFooter = CardFooter; +CardFooter.displayName = "CardFooter"; diff --git a/frontend/common/src/components/ui/collapsible.js b/frontend/common/src/components/ui/collapsible.js new file mode 100644 index 0000000..03b31ea --- /dev/null +++ b/frontend/common/src/components/ui/collapsible.js @@ -0,0 +1,29 @@ +"use strict"; +var __rest = (this && this.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.CollapsibleContent = exports.CollapsibleTrigger = exports.Collapsible = void 0; +var React = require("react"); +var CollapsiblePrimitive = require("@radix-ui/react-collapsible"); +var utils_1 = require("../../utils"); +var Collapsible = CollapsiblePrimitive.Root; +exports.Collapsible = Collapsible; +var CollapsibleTrigger = CollapsiblePrimitive.Trigger; +exports.CollapsibleTrigger = CollapsibleTrigger; +var CollapsibleContent = React.forwardRef(function (_a, ref) { + var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]); + return ( + {children} + ); +}); +exports.CollapsibleContent = CollapsibleContent; +CollapsibleContent.displayName = "CollapsibleContent"; diff --git a/frontend/common/src/components/ui/collapsible.tsx b/frontend/common/src/components/ui/collapsible.tsx new file mode 100644 index 0000000..fa6a1ad --- /dev/null +++ b/frontend/common/src/components/ui/collapsible.tsx @@ -0,0 +1,27 @@ +import * as React from "react" +import * as CollapsiblePrimitive from "@radix-ui/react-collapsible" + +import { cn } from "../../utils" + +const Collapsible = CollapsiblePrimitive.Root + +const CollapsibleTrigger = CollapsiblePrimitive.Trigger + +const CollapsibleContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + {children} + +)) +CollapsibleContent.displayName = "CollapsibleContent" + +export { Collapsible, CollapsibleTrigger, CollapsibleContent } \ No newline at end of file diff --git a/frontend/common/src/components/ui/index.js b/frontend/common/src/components/ui/index.js new file mode 100644 index 0000000..3aedba0 --- /dev/null +++ b/frontend/common/src/components/ui/index.js @@ -0,0 +1,23 @@ +"use strict"; +var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + var desc = Object.getOwnPropertyDescriptor(m, k); + if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { + desc = { enumerable: true, get: function() { return m[k]; } }; + } + Object.defineProperty(o, k2, desc); +}) : (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + o[k2] = m[k]; +})); +var __exportStar = (this && this.__exportStar) || function(m, exports) { + for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p); +}; +Object.defineProperty(exports, "__esModule", { value: true }); +__exportStar(require("./button"), exports); +__exportStar(require("./card"), exports); +__exportStar(require("./collapsible"), exports); +__exportStar(require("./input"), exports); +__exportStar(require("./sheet"), exports); +__exportStar(require("./switch"), exports); +__exportStar(require("./scroll-area"), exports); diff --git a/frontend/common/src/components/ui/index.ts b/frontend/common/src/components/ui/index.ts index 52c3709..b84f12d 100644 --- a/frontend/common/src/components/ui/index.ts +++ b/frontend/common/src/components/ui/index.ts @@ -1,4 +1,7 @@ export * from './button'; export * from './card'; +export * from './collapsible'; export * from './input'; -export * from './switch'; \ No newline at end of file +export * from './sheet'; +export * from './switch'; +export * from './scroll-area'; \ No newline at end of file diff --git a/frontend/common/src/components/ui/input.js b/frontend/common/src/components/ui/input.js new file mode 100644 index 0000000..47ac0f8 --- /dev/null +++ b/frontend/common/src/components/ui/input.js @@ -0,0 +1,22 @@ +"use strict"; +var __rest = (this && this.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.Input = void 0; +var React = require("react"); +var utils_1 = require("../../utils"); +var Input = React.forwardRef(function (_a, ref) { + var className = _a.className, type = _a.type, props = __rest(_a, ["className", "type"]); + return (); +}); +exports.Input = Input; +Input.displayName = "Input"; diff --git a/frontend/common/src/components/ui/scroll-area.js b/frontend/common/src/components/ui/scroll-area.js new file mode 100644 index 0000000..4c5c39e --- /dev/null +++ b/frontend/common/src/components/ui/scroll-area.js @@ -0,0 +1,40 @@ +"use strict"; +var __rest = (this && this.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.ScrollBar = exports.ScrollArea = void 0; +var React = require("react"); +var ScrollAreaPrimitive = require("@radix-ui/react-scroll-area"); +var utils_1 = require("../../utils"); +var ScrollArea = React.forwardRef(function (_a, ref) { + var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]); + return ( + + {children} + + + + + ); +}); +exports.ScrollArea = ScrollArea; +ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName; +var ScrollBar = React.forwardRef(function (_a, ref) { + var className = _a.className, _b = _a.orientation, orientation = _b === void 0 ? "vertical" : _b, props = __rest(_a, ["className", "orientation"]); + return ( + + ); +}); +exports.ScrollBar = ScrollBar; +ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName; diff --git a/frontend/common/src/components/ui/scroll-area.tsx b/frontend/common/src/components/ui/scroll-area.tsx new file mode 100644 index 0000000..aaf35eb --- /dev/null +++ b/frontend/common/src/components/ui/scroll-area.tsx @@ -0,0 +1,47 @@ +import * as React from "react" +import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area" + +import { cn } from "../../utils" + +const ScrollArea = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + {children} + + + + + +)) +ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName + +const ScrollBar = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, orientation = "vertical", ...props }, ref) => ( + + + +)) +ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName + +export { ScrollArea, ScrollBar } \ No newline at end of file diff --git a/frontend/common/src/components/ui/sheet.js b/frontend/common/src/components/ui/sheet.js new file mode 100644 index 0000000..a56b653 --- /dev/null +++ b/frontend/common/src/components/ui/sheet.js @@ -0,0 +1,83 @@ +"use strict"; +var __rest = (this && this.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.SheetDescription = exports.SheetTitle = exports.SheetFooter = exports.SheetHeader = exports.SheetContent = exports.SheetClose = exports.SheetTrigger = exports.Sheet = void 0; +var React = require("react"); +var SheetPrimitive = require("@radix-ui/react-dialog"); +var class_variance_authority_1 = require("class-variance-authority"); +var lucide_react_1 = require("lucide-react"); +var utils_1 = require("../../utils"); +var Sheet = SheetPrimitive.Root; +exports.Sheet = Sheet; +var SheetTrigger = SheetPrimitive.Trigger; +exports.SheetTrigger = SheetTrigger; +var SheetClose = SheetPrimitive.Close; +exports.SheetClose = SheetClose; +var SheetPortal = SheetPrimitive.Portal; +var SheetOverlay = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (); +}); +SheetOverlay.displayName = SheetPrimitive.Overlay.displayName; +var sheetVariants = (0, class_variance_authority_1.cva)("fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500", { + variants: { + side: { + top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top", + right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm", + bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", + left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm", + }, + }, + defaultVariants: { + side: "right", + }, +}); +var SheetContent = React.forwardRef(function (_a, ref) { + var _b = _a.side, side = _b === void 0 ? "right" : _b, className = _a.className, children = _a.children, props = __rest(_a, ["side", "className", "children"]); + return ( + + + {children} + + + Close + + + ); +}); +exports.SheetContent = SheetContent; +SheetContent.displayName = SheetPrimitive.Content.displayName; +var SheetHeader = function (_a) { + var className = _a.className, props = __rest(_a, ["className"]); + return (
); +}; +exports.SheetHeader = SheetHeader; +SheetHeader.displayName = "SheetHeader"; +var SheetFooter = function (_a) { + var className = _a.className, props = __rest(_a, ["className"]); + return (
); +}; +exports.SheetFooter = SheetFooter; +SheetFooter.displayName = "SheetFooter"; +var SheetTitle = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (); +}); +exports.SheetTitle = SheetTitle; +SheetTitle.displayName = SheetPrimitive.Title.displayName; +var SheetDescription = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return (); +}); +exports.SheetDescription = SheetDescription; +SheetDescription.displayName = SheetPrimitive.Description.displayName; diff --git a/frontend/common/src/components/ui/sheet.tsx b/frontend/common/src/components/ui/sheet.tsx new file mode 100644 index 0000000..e8b5a68 --- /dev/null +++ b/frontend/common/src/components/ui/sheet.tsx @@ -0,0 +1,134 @@ +import * as React from "react" +import * as SheetPrimitive from "@radix-ui/react-dialog" +import { cva, type VariantProps } from "class-variance-authority" +import { X } from "lucide-react" + +import { cn } from "../../utils" + +const Sheet = SheetPrimitive.Root + +const SheetTrigger = SheetPrimitive.Trigger + +const SheetClose = SheetPrimitive.Close + +const SheetPortal = SheetPrimitive.Portal + +const SheetOverlay = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +SheetOverlay.displayName = SheetPrimitive.Overlay.displayName + +const sheetVariants = cva( + "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500", + { + variants: { + side: { + top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top", + right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm", + bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", + left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm", + }, + }, + defaultVariants: { + side: "right", + }, + } +) + +interface SheetContentProps + extends React.ComponentPropsWithoutRef, + VariantProps {} + +const SheetContent = React.forwardRef< + React.ElementRef, + SheetContentProps +>(({ side = "right", className, children, ...props }, ref) => ( + + + + {children} + + + Close + + + +)) +SheetContent.displayName = SheetPrimitive.Content.displayName + +const SheetHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +SheetHeader.displayName = "SheetHeader" + +const SheetFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +SheetFooter.displayName = "SheetFooter" + +const SheetTitle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +SheetTitle.displayName = SheetPrimitive.Title.displayName + +const SheetDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +SheetDescription.displayName = SheetPrimitive.Description.displayName + +export { + Sheet, + SheetTrigger, + SheetClose, + SheetContent, + SheetHeader, + SheetFooter, + SheetTitle, + SheetDescription, +} \ No newline at end of file diff --git a/frontend/common/src/components/ui/switch.js b/frontend/common/src/components/ui/switch.js new file mode 100644 index 0000000..c56cb22 --- /dev/null +++ b/frontend/common/src/components/ui/switch.js @@ -0,0 +1,25 @@ +"use strict"; +var __rest = (this && this.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.Switch = void 0; +var React = require("react"); +var SwitchPrimitives = require("@radix-ui/react-switch"); +var utils_1 = require("../../utils"); +var Switch = React.forwardRef(function (_a, ref) { + var className = _a.className, props = __rest(_a, ["className"]); + return ( + + ); +}); +exports.Switch = Switch; +Switch.displayName = SwitchPrimitives.Root.displayName; diff --git a/frontend/common/src/index.js b/frontend/common/src/index.js new file mode 100644 index 0000000..286b602 --- /dev/null +++ b/frontend/common/src/index.js @@ -0,0 +1,38 @@ +"use strict"; +var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + var desc = Object.getOwnPropertyDescriptor(m, k); + if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { + desc = { enumerable: true, get: function() { return m[k]; } }; + } + Object.defineProperty(o, k2, desc); +}) : (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + o[k2] = m[k]; +})); +var __exportStar = (this && this.__exportStar) || function(m, exports) { + for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p); +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.hello = exports.getSampleAgentSteps = exports.getSampleAgentSessions = void 0; +// Entry point for @ra-aid/common package +require("./styles/global.css"); +// Direct imports from sample-data +var sample_data_1 = require("./utils/sample-data"); +Object.defineProperty(exports, "getSampleAgentSessions", { enumerable: true, get: function () { return sample_data_1.getSampleAgentSessions; } }); +Object.defineProperty(exports, "getSampleAgentSteps", { enumerable: true, get: function () { return sample_data_1.getSampleAgentSteps; } }); +// Export utility functions +__exportStar(require("./utils"), exports); +// Export all UI components +__exportStar(require("./components/ui"), exports); +// Export timeline components +__exportStar(require("./components/TimelineStep"), exports); +__exportStar(require("./components/TimelineFeed"), exports); +// Export session navigation components +__exportStar(require("./components/SessionDrawer"), exports); +__exportStar(require("./components/SessionSidebar"), exports); +// Export the hello function (temporary example) +var hello = function () { + console.log("Hello from @ra-aid/common"); +}; +exports.hello = hello; diff --git a/frontend/common/src/index.ts b/frontend/common/src/index.ts index 6ee03c1..56ce87c 100644 --- a/frontend/common/src/index.ts +++ b/frontend/common/src/index.ts @@ -1,13 +1,29 @@ // Entry point for @ra-aid/common package import './styles/global.css'; -// Export utility functions +// Export utility functions (excluding sample data to avoid circular references) export * from './utils'; // Export all UI components export * from './components/ui'; +// Export timeline components +export * from './components/TimelineStep'; +export * from './components/TimelineFeed'; + +// Export session navigation components +export * from './components/SessionDrawer'; +export * from './components/SessionSidebar'; + // Export the hello function (temporary example) export const hello = (): void => { console.log("Hello from @ra-aid/common"); -}; \ No newline at end of file +}; + +// Directly export sample data functions and types to avoid circular references +export { + getSampleAgentSteps, + getSampleAgentSessions, + type AgentStep, + type AgentSession +} from './utils/sample-data'; \ No newline at end of file diff --git a/frontend/common/src/utils.js b/frontend/common/src/utils.js new file mode 100644 index 0000000..f4f70f3 --- /dev/null +++ b/frontend/common/src/utils.js @@ -0,0 +1,32 @@ +"use strict"; +var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + var desc = Object.getOwnPropertyDescriptor(m, k); + if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { + desc = { enumerable: true, get: function() { return m[k]; } }; + } + Object.defineProperty(o, k2, desc); +}) : (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + o[k2] = m[k]; +})); +var __exportStar = (this && this.__exportStar) || function(m, exports) { + for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p); +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.cn = cn; +var clsx_1 = require("clsx"); +var tailwind_merge_1 = require("tailwind-merge"); +/** + * Merges class names with Tailwind CSS classes + * Combines clsx for conditional logic and tailwind-merge for handling conflicting tailwind classes + */ +function cn() { + var inputs = []; + for (var _i = 0; _i < arguments.length; _i++) { + inputs[_i] = arguments[_i]; + } + return (0, tailwind_merge_1.twMerge)((0, clsx_1.clsx)(inputs)); +} +// Re-export everything from utils directory +__exportStar(require("./utils"), exports); diff --git a/frontend/common/src/utils.ts b/frontend/common/src/utils.ts index e02afa6..aa9e0b6 100644 --- a/frontend/common/src/utils.ts +++ b/frontend/common/src/utils.ts @@ -7,4 +7,7 @@ import { twMerge } from "tailwind-merge"; */ export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)); -} \ No newline at end of file +} + +// Re-export everything from utils directory +export * from './utils'; \ No newline at end of file diff --git a/frontend/common/src/utils/index.js b/frontend/common/src/utils/index.js new file mode 100644 index 0000000..6cc63b7 --- /dev/null +++ b/frontend/common/src/utils/index.js @@ -0,0 +1,32 @@ +"use strict"; +var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + var desc = Object.getOwnPropertyDescriptor(m, k); + if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { + desc = { enumerable: true, get: function() { return m[k]; } }; + } + Object.defineProperty(o, k2, desc); +}) : (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + o[k2] = m[k]; +})); +var __exportStar = (this && this.__exportStar) || function(m, exports) { + for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p); +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.cn = cn; +var clsx_1 = require("clsx"); +var tailwind_merge_1 = require("tailwind-merge"); +/** + * Merges class names with Tailwind CSS classes + * Combines clsx for conditional logic and tailwind-merge for handling conflicting tailwind classes + */ +function cn() { + var inputs = []; + for (var _i = 0; _i < arguments.length; _i++) { + inputs[_i] = arguments[_i]; + } + return (0, tailwind_merge_1.twMerge)((0, clsx_1.clsx)(inputs)); +} +// Export sample data utilities +__exportStar(require("./sample-data"), exports); diff --git a/frontend/common/src/utils/index.ts b/frontend/common/src/utils/index.ts new file mode 100644 index 0000000..52a335f --- /dev/null +++ b/frontend/common/src/utils/index.ts @@ -0,0 +1,13 @@ +import { clsx, type ClassValue } from "clsx"; +import { twMerge } from "tailwind-merge"; + +/** + * Merges class names with Tailwind CSS classes + * Combines clsx for conditional logic and tailwind-merge for handling conflicting tailwind classes + */ +export function cn(...inputs: ClassValue[]) { + return twMerge(clsx(inputs)); +} + +// Note: Sample data functions and types are now exported directly from the root index.ts +// to avoid circular references \ No newline at end of file diff --git a/frontend/common/src/utils/sample-data.js b/frontend/common/src/utils/sample-data.js new file mode 100644 index 0000000..c6bc520 --- /dev/null +++ b/frontend/common/src/utils/sample-data.js @@ -0,0 +1,163 @@ +"use strict"; +/** + * Sample data utility for agent UI components demonstration + */ +Object.defineProperty(exports, "__esModule", { value: true }); +exports.getSampleAgentSteps = getSampleAgentSteps; +exports.getSampleAgentSessions = getSampleAgentSessions; +/** + * Returns an array of sample agent steps + */ +function getSampleAgentSteps() { + return [ + { + id: "step-1", + timestamp: new Date(Date.now() - 30 * 60000), // 30 minutes ago + status: 'completed', + type: 'planning', + title: 'Initial Planning', + content: 'I need to analyze the codebase structure to understand the existing components and their relationships.', + duration: 5200 + }, + { + id: "step-2", + timestamp: new Date(Date.now() - 25 * 60000), // 25 minutes ago + status: 'completed', + type: 'tool-execution', + title: 'List Directory Structure', + content: 'Executing: list_directory_tree(path="src/", max_depth=2)\n\n📁 /project/src/\n├── 📁 components/\n│ ├── 📁 ui/\n│ └── App.tsx\n├── 📁 utils/\n└── index.tsx', + duration: 1800 + }, + { + id: "step-3", + timestamp: new Date(Date.now() - 20 * 60000), // 20 minutes ago + status: 'completed', + type: 'thinking', + title: 'Component Analysis', + content: 'Based on the directory structure, I see that the UI components are organized in a dedicated folder. I should examine the existing component patterns before implementing new ones.', + duration: 3500 + }, + { + id: "step-4", + timestamp: new Date(Date.now() - 15 * 60000), // 15 minutes ago + status: 'completed', + type: 'tool-execution', + title: 'Read Component Code', + content: 'Executing: read_file_tool(filepath="src/components/ui/Button.tsx")\n\n```tsx\nimport { cn } from "../../utils";\n\nexport interface ButtonProps {\n // Component props...\n}\n\nexport function Button({ children, ...props }: ButtonProps) {\n // Component implementation...\n}\n```', + duration: 2100 + }, + { + id: "step-5", + timestamp: new Date(Date.now() - 10 * 60000), // 10 minutes ago + status: 'completed', + type: 'implementation', + title: 'Creating NavBar Component', + content: 'I\'m creating a NavBar component following the design system patterns:\n\n```tsx\nimport { cn } from "../../utils";\n\nexport interface NavBarProps {\n // New component props...\n}\n\nexport function NavBar({ ...props }: NavBarProps) {\n // New component implementation...\n}\n```', + duration: 6800 + }, + { + id: "step-6", + timestamp: new Date(Date.now() - 5 * 60000), // 5 minutes ago + status: 'in-progress', + type: 'implementation', + title: 'Styling Timeline Component', + content: 'Currently working on styling the Timeline component to match the design system:\n\n```tsx\n// Work in progress...\nexport function Timeline({ steps, ...props }: TimelineProps) {\n // Current implementation...\n}\n```', + }, + { + id: "step-7", + timestamp: new Date(Date.now() - 2 * 60000), // 2 minutes ago + status: 'error', + type: 'tool-execution', + title: 'Running Tests', + content: 'Error executing: run_shell_command(command="npm test")\n\nTest failed: TypeError: Cannot read property \'steps\' of undefined', + duration: 3200 + }, + { + id: "step-8", + timestamp: new Date(), // Now + status: 'pending', + type: 'planning', + title: 'Next Steps', + content: 'Need to plan the implementation of the SessionDrawer component...', + } + ]; +} +/** + * Returns an array of sample agent sessions + */ +function getSampleAgentSessions() { + var steps = getSampleAgentSteps(); + return [ + { + id: "session-1", + name: "UI Component Implementation", + created: new Date(Date.now() - 35 * 60000), // 35 minutes ago + updated: new Date(), // Now + status: 'active', + steps: steps + }, + { + id: "session-2", + name: "API Integration", + created: new Date(Date.now() - 2 * 3600000), // 2 hours ago + updated: new Date(Date.now() - 30 * 60000), // 30 minutes ago + status: 'completed', + steps: [ + { + id: "other-step-1", + timestamp: new Date(Date.now() - 2 * 3600000), // 2 hours ago + status: 'completed', + type: 'planning', + title: 'API Integration Planning', + content: 'Planning the integration with the backend API...', + duration: 4500 + }, + { + id: "other-step-2", + timestamp: new Date(Date.now() - 1.5 * 3600000), // 1.5 hours ago + status: 'completed', + type: 'implementation', + title: 'Implementing API Client', + content: 'Creating API client with fetch utilities...', + duration: 7200 + }, + { + id: "other-step-3", + timestamp: new Date(Date.now() - 1 * 3600000), // 1 hour ago + status: 'completed', + type: 'tool-execution', + title: 'Testing API Endpoints', + content: 'Running tests against API endpoints...', + duration: 5000 + } + ] + }, + { + id: "session-3", + name: "Bug Fixes", + created: new Date(Date.now() - 5 * 3600000), // 5 hours ago + updated: new Date(Date.now() - 4 * 3600000), // 4 hours ago + status: 'error', + steps: [ + { + id: "bug-step-1", + timestamp: new Date(Date.now() - 5 * 3600000), // 5 hours ago + status: 'completed', + type: 'planning', + title: 'Bug Analysis', + content: 'Analyzing reported bugs from issue tracker...', + duration: 3600 + }, + { + id: "bug-step-2", + timestamp: new Date(Date.now() - 4.5 * 3600000), // 4.5 hours ago + status: 'error', + type: 'implementation', + title: 'Fixing Authentication Bug', + content: 'Error: Unable to resolve dependency conflict with auth package', + duration: 2500 + } + ] + } + ]; +} diff --git a/frontend/common/src/utils/sample-data.ts b/frontend/common/src/utils/sample-data.ts new file mode 100644 index 0000000..c4c2fc8 --- /dev/null +++ b/frontend/common/src/utils/sample-data.ts @@ -0,0 +1,187 @@ +/** + * Sample data utility for agent UI components demonstration + */ + +/** + * Represents a single step in the agent process + */ +export interface AgentStep { + id: string; + timestamp: Date; + status: 'completed' | 'in-progress' | 'error' | 'pending'; + type: 'tool-execution' | 'thinking' | 'planning' | 'implementation' | 'user-input'; + title: string; + content: string; + duration?: number; // in milliseconds +} + +/** + * Represents a session with multiple steps + */ +export interface AgentSession { + id: string; + name: string; + created: Date; + updated: Date; + status: 'active' | 'completed' | 'error'; + steps: AgentStep[]; +} + +/** + * Returns an array of sample agent steps + */ +export function getSampleAgentSteps(): AgentStep[] { + return [ + { + id: "step-1", + timestamp: new Date(Date.now() - 30 * 60000), // 30 minutes ago + status: 'completed', + type: 'planning', + title: 'Initial Planning', + content: 'I need to analyze the codebase structure to understand the existing components and their relationships.', + duration: 5200 + }, + { + id: "step-2", + timestamp: new Date(Date.now() - 25 * 60000), // 25 minutes ago + status: 'completed', + type: 'tool-execution', + title: 'List Directory Structure', + content: 'Executing: list_directory_tree(path="src/", max_depth=2)\n\n📁 /project/src/\n├── 📁 components/\n│ ├── 📁 ui/\n│ └── App.tsx\n├── 📁 utils/\n└── index.tsx', + duration: 1800 + }, + { + id: "step-3", + timestamp: new Date(Date.now() - 20 * 60000), // 20 minutes ago + status: 'completed', + type: 'thinking', + title: 'Component Analysis', + content: 'Based on the directory structure, I see that the UI components are organized in a dedicated folder. I should examine the existing component patterns before implementing new ones.', + duration: 3500 + }, + { + id: "step-4", + timestamp: new Date(Date.now() - 15 * 60000), // 15 minutes ago + status: 'completed', + type: 'tool-execution', + title: 'Read Component Code', + content: 'Executing: read_file_tool(filepath="src/components/ui/Button.tsx")\n\n```tsx\nimport { cn } from "../../utils";\n\nexport interface ButtonProps {\n // Component props...\n}\n\nexport function Button({ children, ...props }: ButtonProps) {\n // Component implementation...\n}\n```', + duration: 2100 + }, + { + id: "step-5", + timestamp: new Date(Date.now() - 10 * 60000), // 10 minutes ago + status: 'completed', + type: 'implementation', + title: 'Creating NavBar Component', + content: 'I\'m creating a NavBar component following the design system patterns:\n\n```tsx\nimport { cn } from "../../utils";\n\nexport interface NavBarProps {\n // New component props...\n}\n\nexport function NavBar({ ...props }: NavBarProps) {\n // New component implementation...\n}\n```', + duration: 6800 + }, + { + id: "step-6", + timestamp: new Date(Date.now() - 5 * 60000), // 5 minutes ago + status: 'in-progress', + type: 'implementation', + title: 'Styling Timeline Component', + content: 'Currently working on styling the Timeline component to match the design system:\n\n```tsx\n// Work in progress...\nexport function Timeline({ steps, ...props }: TimelineProps) {\n // Current implementation...\n}\n```', + }, + { + id: "step-7", + timestamp: new Date(Date.now() - 2 * 60000), // 2 minutes ago + status: 'error', + type: 'tool-execution', + title: 'Running Tests', + content: 'Error executing: run_shell_command(command="npm test")\n\nTest failed: TypeError: Cannot read property \'steps\' of undefined', + duration: 3200 + }, + { + id: "step-8", + timestamp: new Date(), // Now + status: 'pending', + type: 'planning', + title: 'Next Steps', + content: 'Need to plan the implementation of the SessionDrawer component...', + } + ]; +} + +/** + * Returns an array of sample agent sessions + */ +export function getSampleAgentSessions(): AgentSession[] { + const steps = getSampleAgentSteps(); + + return [ + { + id: "session-1", + name: "UI Component Implementation", + created: new Date(Date.now() - 35 * 60000), // 35 minutes ago + updated: new Date(), // Now + status: 'active', + steps: steps + }, + { + id: "session-2", + name: "API Integration", + created: new Date(Date.now() - 2 * 3600000), // 2 hours ago + updated: new Date(Date.now() - 30 * 60000), // 30 minutes ago + status: 'completed', + steps: [ + { + id: "other-step-1", + timestamp: new Date(Date.now() - 2 * 3600000), // 2 hours ago + status: 'completed', + type: 'planning', + title: 'API Integration Planning', + content: 'Planning the integration with the backend API...', + duration: 4500 + }, + { + id: "other-step-2", + timestamp: new Date(Date.now() - 1.5 * 3600000), // 1.5 hours ago + status: 'completed', + type: 'implementation', + title: 'Implementing API Client', + content: 'Creating API client with fetch utilities...', + duration: 7200 + }, + { + id: "other-step-3", + timestamp: new Date(Date.now() - 1 * 3600000), // 1 hour ago + status: 'completed', + type: 'tool-execution', + title: 'Testing API Endpoints', + content: 'Running tests against API endpoints...', + duration: 5000 + } + ] + }, + { + id: "session-3", + name: "Bug Fixes", + created: new Date(Date.now() - 5 * 3600000), // 5 hours ago + updated: new Date(Date.now() - 4 * 3600000), // 4 hours ago + status: 'error', + steps: [ + { + id: "bug-step-1", + timestamp: new Date(Date.now() - 5 * 3600000), // 5 hours ago + status: 'completed', + type: 'planning', + title: 'Bug Analysis', + content: 'Analyzing reported bugs from issue tracker...', + duration: 3600 + }, + { + id: "bug-step-2", + timestamp: new Date(Date.now() - 4.5 * 3600000), // 4.5 hours ago + status: 'error', + type: 'implementation', + title: 'Fixing Authentication Bug', + content: 'Error: Unable to resolve dependency conflict with auth package', + duration: 2500 + } + ] + } + ]; +} \ No newline at end of file diff --git a/frontend/common/tsconfig.json b/frontend/common/tsconfig.json index 1f30e25..6d0c085 100644 --- a/frontend/common/tsconfig.json +++ b/frontend/common/tsconfig.json @@ -10,7 +10,8 @@ "skipLibCheck": true, "forceConsistentCasingInFileNames": true, "outDir": "dist", - "rootDir": "src" + "rootDir": "src", + "lib": ["DOM", "DOM.Iterable", "ESNext", "ES2016"] }, "include": ["src"] -} +} \ No newline at end of file diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 7908fa2..5ea1e96 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -14,20 +14,40 @@ "common": { "name": "@ra-aid/common", "version": "1.0.0", + "dependencies": { + "@radix-ui/react-collapsible": "^1.1.3", + "@radix-ui/react-dialog": "^1.0.5", + "@radix-ui/react-label": "^2.0.2", + "@radix-ui/react-popover": "^1.0.7", + "@radix-ui/react-scroll-area": "^1.2.3", + "@radix-ui/react-select": "^2.0.0", + "@radix-ui/react-slot": "^1.0.2", + "@radix-ui/react-switch": "^1.1.3", + "class-variance-authority": "^0.7.0", + "clsx": "^2.1.0", + "lucide-react": "^0.363.0", + "tailwind-merge": "^2.2.0", + "tailwindcss-animate": "^1.0.7" + }, "devDependencies": { + "@types/react": "^18.2.64", + "@types/react-dom": "^18.2.21", "autoprefixer": "^10.4.17", "concurrently": "^8.2.2", "postcss": "^8.4.35", "postcss-cli": "^10.1.0", "tailwindcss": "^3.4.1", "typescript": "^5.0.0" + }, + "peerDependencies": { + "react": ">=18.0.0", + "react-dom": ">=18.0.0" } }, "node_modules/@alloc/quick-lru": { "version": "5.2.0", "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz", "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=10" @@ -760,11 +780,48 @@ "node": ">=12" } }, + "node_modules/@floating-ui/core": { + "version": "1.6.9", + "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.9.tgz", + "integrity": "sha512-uMXCuQ3BItDUbAMhIXw7UPXRfAlOAvZzdK9BWpE60MCn+Svt3aLn9jsPTi/WNGlRUu2uI0v5S7JiIUsbsvh3fw==", + "license": "MIT", + "dependencies": { + "@floating-ui/utils": "^0.2.9" + } + }, + "node_modules/@floating-ui/dom": { + "version": "1.6.13", + "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.13.tgz", + "integrity": "sha512-umqzocjDgNRGTuO7Q8CU32dkHkECqI8ZdMZ5Swb6QAM0t5rnlrN3lGo1hdpscRd3WS8T6DKYK4ephgIH9iRh3w==", + "license": "MIT", + "dependencies": { + "@floating-ui/core": "^1.6.0", + "@floating-ui/utils": "^0.2.9" + } + }, + "node_modules/@floating-ui/react-dom": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.2.tgz", + "integrity": "sha512-06okr5cgPzMNBy+Ycse2A6udMi4bqwW/zgBF/rwjcNqWkyr82Mcg8b0vjX8OJpZFy/FKjJmw6wV7t44kK6kW7A==", + "license": "MIT", + "dependencies": { + "@floating-ui/dom": "^1.0.0" + }, + "peerDependencies": { + "react": ">=16.8.0", + "react-dom": ">=16.8.0" + } + }, + "node_modules/@floating-ui/utils": { + "version": "0.2.9", + "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.9.tgz", + "integrity": "sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==", + "license": "MIT" + }, "node_modules/@isaacs/cliui": { "version": "8.0.2", "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz", "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==", - "devOptional": true, "license": "ISC", "dependencies": { "string-width": "^5.1.2", @@ -782,7 +839,6 @@ "version": "0.3.8", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz", "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==", - "devOptional": true, "license": "MIT", "dependencies": { "@jridgewell/set-array": "^1.2.1", @@ -797,7 +853,6 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz", "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=6.0.0" @@ -807,7 +862,6 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz", "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=6.0.0" @@ -817,14 +871,12 @@ "version": "1.5.0", "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz", "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==", - "devOptional": true, "license": "MIT" }, "node_modules/@jridgewell/trace-mapping": { "version": "0.3.25", "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz", "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==", - "devOptional": true, "license": "MIT", "dependencies": { "@jridgewell/resolve-uri": "^3.1.0", @@ -835,7 +887,6 @@ "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", - "devOptional": true, "license": "MIT", "dependencies": { "@nodelib/fs.stat": "2.0.5", @@ -849,7 +900,6 @@ "version": "2.0.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", - "devOptional": true, "license": "MIT", "engines": { "node": ">= 8" @@ -859,7 +909,6 @@ "version": "1.2.8", "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", - "devOptional": true, "license": "MIT", "dependencies": { "@nodelib/fs.scandir": "2.1.5", @@ -873,7 +922,6 @@ "version": "0.11.0", "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz", "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==", - "dev": true, "license": "MIT", "optional": true, "engines": { @@ -888,6 +936,693 @@ "resolved": "web", "link": true }, + "node_modules/@radix-ui/number": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/number/-/number-1.1.0.tgz", + "integrity": "sha512-V3gRzhVNU1ldS5XhAPTom1fOIo4ccrjjJgmE+LI2h/WaFpHmx0MQApT+KZHnx8abG6Avtfcz4WoEciMnpFT3HQ==", + "license": "MIT" + }, + "node_modules/@radix-ui/primitive": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/@radix-ui/primitive/-/primitive-1.1.1.tgz", + "integrity": "sha512-SJ31y+Q/zAyShtXJc8x83i9TYdbAfHZ++tUZnvjJJqFjzsdUnKsxPL6IEtBlxKkU7yzer//GQtZSV4GbldL3YA==", + "license": "MIT" + }, + "node_modules/@radix-ui/react-arrow": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.1.2.tgz", + "integrity": "sha512-G+KcpzXHq24iH0uGG/pF8LyzpFJYGD4RfLjCIBfGdSLXvjLHST31RUiRVrupIBMvIppMgSzQ6l66iAxl03tdlg==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-primitive": "2.0.2" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-collapsible": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/@radix-ui/react-collapsible/-/react-collapsible-1.1.3.tgz", + "integrity": "sha512-jFSerheto1X03MUC0g6R7LedNW9EEGWdg9W1+MlpkMLwGkgkbUXLPBH/KIuWKXUoeYRVY11llqbTBDzuLg7qrw==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-presence": "1.1.2", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-use-controllable-state": "1.1.0", + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-collection": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-collection/-/react-collection-1.1.2.tgz", + "integrity": "sha512-9z54IEKRxIa9VityapoEYMuByaG42iSy1ZXlY2KcuLSEtq8x4987/N6m15ppoMffgZX72gER2uHe1D9Y6Unlcw==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-slot": "1.1.2" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-compose-refs": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/@radix-ui/react-compose-refs/-/react-compose-refs-1.1.1.tgz", + "integrity": "sha512-Y9VzoRDSJtgFMUCoiZBDVo084VQ5hfpXxVE+NgkdNsjiDBByiImMZKKhxMwCbdHvhlENG6a833CbFkOQvTricw==", + "license": "MIT", + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-context": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/@radix-ui/react-context/-/react-context-1.1.1.tgz", + "integrity": "sha512-UASk9zi+crv9WteK/NU4PLvOoL3OuE6BWVKNF6hPRBtYBDXQ2u5iu3O59zUlJiTVvkyuycnqrztsHVJwcK9K+Q==", + "license": "MIT", + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-dialog": { + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/@radix-ui/react-dialog/-/react-dialog-1.1.6.tgz", + "integrity": "sha512-/IVhJV5AceX620DUJ4uYVMymzsipdKBzo3edo+omeskCKGm9FRHM0ebIdbPnlQVJqyuHbuBltQUOG2mOTq2IYw==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-dismissable-layer": "1.1.5", + "@radix-ui/react-focus-guards": "1.1.1", + "@radix-ui/react-focus-scope": "1.1.2", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-portal": "1.1.4", + "@radix-ui/react-presence": "1.1.2", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-slot": "1.1.2", + "@radix-ui/react-use-controllable-state": "1.1.0", + "aria-hidden": "^1.2.4", + "react-remove-scroll": "^2.6.3" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-direction": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-direction/-/react-direction-1.1.0.tgz", + "integrity": "sha512-BUuBvgThEiAXh2DWu93XsT+a3aWrGqolGlqqw5VU1kG7p/ZH2cuDlM1sRLNnY3QcBS69UIz2mcKhMxDsdewhjg==", + "license": "MIT", + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-dismissable-layer": { + "version": "1.1.5", + "resolved": "https://registry.npmjs.org/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.1.5.tgz", + "integrity": "sha512-E4TywXY6UsXNRhFrECa5HAvE5/4BFcGyfTyK36gP+pAW1ed7UTK4vKwdr53gAJYwqbfCWC6ATvJa3J3R/9+Qrg==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-use-callback-ref": "1.1.0", + "@radix-ui/react-use-escape-keydown": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-focus-guards": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/@radix-ui/react-focus-guards/-/react-focus-guards-1.1.1.tgz", + "integrity": "sha512-pSIwfrT1a6sIoDASCSpFwOasEwKTZWDw/iBdtnqKO7v6FeOzYJ7U53cPzYFVR3geGGXgVHaH+CdngrrAzqUGxg==", + "license": "MIT", + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-focus-scope": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-focus-scope/-/react-focus-scope-1.1.2.tgz", + "integrity": "sha512-zxwE80FCU7lcXUGWkdt6XpTTCKPitG1XKOwViTxHVKIJhZl9MvIl2dVHeZENCWD9+EdWv05wlaEkRXUykU27RA==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-use-callback-ref": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-id": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-id/-/react-id-1.1.0.tgz", + "integrity": "sha512-EJUrI8yYh7WOjNOqpoJaf1jlFIH2LvtgAl+YcFqNCa+4hj64ZXmPkAKOFs/ukjz3byN6bdb/AVUqHkI8/uWWMA==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-label": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-label/-/react-label-2.1.2.tgz", + "integrity": "sha512-zo1uGMTaNlHehDyFQcDZXRJhUPDuukcnHz0/jnrup0JA6qL+AFpAnty+7VKa9esuU5xTblAZzTGYJKSKaBxBhw==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-primitive": "2.0.2" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-popover": { + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/@radix-ui/react-popover/-/react-popover-1.1.6.tgz", + "integrity": "sha512-NQouW0x4/GnkFJ/pRqsIS3rM/k97VzKnVb2jB7Gq7VEGPy5g7uNV1ykySFt7eWSp3i2uSGFwaJcvIRJBAHmmFg==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-dismissable-layer": "1.1.5", + "@radix-ui/react-focus-guards": "1.1.1", + "@radix-ui/react-focus-scope": "1.1.2", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-popper": "1.2.2", + "@radix-ui/react-portal": "1.1.4", + "@radix-ui/react-presence": "1.1.2", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-slot": "1.1.2", + "@radix-ui/react-use-controllable-state": "1.1.0", + "aria-hidden": "^1.2.4", + "react-remove-scroll": "^2.6.3" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-popper": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.2.2.tgz", + "integrity": "sha512-Rvqc3nOpwseCyj/rgjlJDYAgyfw7OC1tTkKn2ivhaMGcYt8FSBlahHOZak2i3QwkRXUXgGgzeEe2RuqeEHuHgA==", + "license": "MIT", + "dependencies": { + "@floating-ui/react-dom": "^2.0.0", + "@radix-ui/react-arrow": "1.1.2", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-use-callback-ref": "1.1.0", + "@radix-ui/react-use-layout-effect": "1.1.0", + "@radix-ui/react-use-rect": "1.1.0", + "@radix-ui/react-use-size": "1.1.0", + "@radix-ui/rect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-portal": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/@radix-ui/react-portal/-/react-portal-1.1.4.tgz", + "integrity": "sha512-sn2O9k1rPFYVyKd5LAJfo96JlSGVFpa1fS6UuBJfrZadudiw5tAmru+n1x7aMRQ84qDM71Zh1+SzK5QwU0tJfA==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-presence": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.2.tgz", + "integrity": "sha512-18TFr80t5EVgL9x1SwF/YGtfG+l0BS0PRAlCWBDoBEiDQjeKgnNZRVJp/oVBl24sr3Gbfwc/Qpj4OcWTQMsAEg==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-primitive": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.0.2.tgz", + "integrity": "sha512-Ec/0d38EIuvDF+GZjcMU/Ze6MxntVJYO/fRlCPhCaVUyPY9WTalHJw54tp9sXeJo3tlShWpy41vQRgLRGOuz+w==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-slot": "1.1.2" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-scroll-area": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/@radix-ui/react-scroll-area/-/react-scroll-area-1.2.3.tgz", + "integrity": "sha512-l7+NNBfBYYJa9tNqVcP2AGvxdE3lmE6kFTBXdvHgUaZuy+4wGCL1Cl2AfaR7RKyimj7lZURGLwFO59k4eBnDJQ==", + "license": "MIT", + "dependencies": { + "@radix-ui/number": "1.1.0", + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-direction": "1.1.0", + "@radix-ui/react-presence": "1.1.2", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-use-callback-ref": "1.1.0", + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-select": { + "version": "2.1.6", + "resolved": "https://registry.npmjs.org/@radix-ui/react-select/-/react-select-2.1.6.tgz", + "integrity": "sha512-T6ajELxRvTuAMWH0YmRJ1qez+x4/7Nq7QIx7zJ0VK3qaEWdnWpNbEDnmWldG1zBDwqrLy5aLMUWcoGirVj5kMg==", + "license": "MIT", + "dependencies": { + "@radix-ui/number": "1.1.0", + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-collection": "1.1.2", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-direction": "1.1.0", + "@radix-ui/react-dismissable-layer": "1.1.5", + "@radix-ui/react-focus-guards": "1.1.1", + "@radix-ui/react-focus-scope": "1.1.2", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-popper": "1.2.2", + "@radix-ui/react-portal": "1.1.4", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-slot": "1.1.2", + "@radix-ui/react-use-callback-ref": "1.1.0", + "@radix-ui/react-use-controllable-state": "1.1.0", + "@radix-ui/react-use-layout-effect": "1.1.0", + "@radix-ui/react-use-previous": "1.1.0", + "@radix-ui/react-visually-hidden": "1.1.2", + "aria-hidden": "^1.2.4", + "react-remove-scroll": "^2.6.3" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-slot": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-slot/-/react-slot-1.1.2.tgz", + "integrity": "sha512-YAKxaiGsSQJ38VzKH86/BPRC4rh+b1Jpa+JneA5LRE7skmLPNAyeG8kPJj/oo4STLvlrs8vkf/iYyc3A5stYCQ==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-compose-refs": "1.1.1" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-switch": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/@radix-ui/react-switch/-/react-switch-1.1.3.tgz", + "integrity": "sha512-1nc+vjEOQkJVsJtWPSiISGT6OKm4SiOdjMo+/icLxo2G4vxz1GntC5MzfL4v8ey9OEfw787QCD1y3mUv0NiFEQ==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-primitive": "2.0.2", + "@radix-ui/react-use-controllable-state": "1.1.0", + "@radix-ui/react-use-previous": "1.1.0", + "@radix-ui/react-use-size": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-use-callback-ref": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.1.0.tgz", + "integrity": "sha512-CasTfvsy+frcFkbXtSJ2Zu9JHpN8TYKxkgJGWbjiZhFivxaeW7rMeZt7QELGVLaYVfFMsKHjb7Ak0nMEe+2Vfw==", + "license": "MIT", + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-use-controllable-state": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.1.0.tgz", + "integrity": "sha512-MtfMVJiSr2NjzS0Aa90NPTnvTSg6C/JLCV7ma0W6+OMV78vd8OyRpID+Ng9LxzsPbLeuBnWBA1Nq30AtBIDChw==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-use-callback-ref": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-use-escape-keydown": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.1.0.tgz", + "integrity": "sha512-L7vwWlR1kTTQ3oh7g1O0CBF3YCyyTj8NmhLR+phShpyA50HCfBFKVJTpshm9PzLiKmehsrQzTYTpX9HvmC9rhw==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-use-callback-ref": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-use-layout-effect": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.1.0.tgz", + "integrity": "sha512-+FPE0rOdziWSrH9athwI1R0HDVbWlEhd+FR+aSDk4uWGmSJ9Z54sdZVDQPZAinJhJXwfT+qnj969mCsT2gfm5w==", + "license": "MIT", + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-use-previous": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-previous/-/react-use-previous-1.1.0.tgz", + "integrity": "sha512-Z/e78qg2YFnnXcW88A4JmTtm4ADckLno6F7OXotmkQfeuCVaKuYzqAATPhVzl3delXE7CxIV8shofPn3jPc5Og==", + "license": "MIT", + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-use-rect": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-rect/-/react-use-rect-1.1.0.tgz", + "integrity": "sha512-0Fmkebhr6PiseyZlYAOtLS+nb7jLmpqTrJyv61Pe68MKYW6OWdRE2kI70TaYY27u7H0lajqM3hSMMLFq18Z7nQ==", + "license": "MIT", + "dependencies": { + "@radix-ui/rect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-use-size": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/react-use-size/-/react-use-size-1.1.0.tgz", + "integrity": "sha512-XW3/vWuIXHa+2Uwcc2ABSfcCledmXhhQPlGbfcRXbiUQI5Icjcg19BGCZVKKInYbvUCut/ufbbLLPFC5cbb1hw==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@radix-ui/react-visually-hidden": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.1.2.tgz", + "integrity": "sha512-1SzA4ns2M1aRlvxErqhLHsBHoS5eI5UUcI2awAMgGUp4LoaoWOKYmvqDY2s/tltuPkh3Yk77YF/r3IRj+Amx4Q==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-primitive": "2.0.2" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, + "node_modules/@radix-ui/rect": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@radix-ui/rect/-/rect-1.1.0.tgz", + "integrity": "sha512-A9+lCBZoaMJlVKcRBz2YByCG+Cp2t6nAnMnNba+XiWxnj6r4JUFqfsgwocMBZU9LPtdxC6wB56ySYpc7LQIoJg==", + "license": "MIT" + }, "node_modules/@tailwindcss/forms": { "version": "0.5.10", "resolved": "https://registry.npmjs.org/@tailwindcss/forms/-/forms-0.5.10.tgz", @@ -901,6 +1636,34 @@ "tailwindcss": ">=3.0.0 || >= 3.0.0-alpha.1 || >= 4.0.0-alpha.20 || >= 4.0.0-beta.1" } }, + "node_modules/@types/prop-types": { + "version": "15.7.14", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.14.tgz", + "integrity": "sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ==", + "devOptional": true, + "license": "MIT" + }, + "node_modules/@types/react": { + "version": "18.3.18", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.18.tgz", + "integrity": "sha512-t4yC+vtgnkYjNSKlFx1jkAhH8LgTo2N/7Qvi83kdEaUtMDiwpbLAktKDaAMlRcJ5eSxZkH74eEGt1ky31d7kfQ==", + "devOptional": true, + "license": "MIT", + "dependencies": { + "@types/prop-types": "*", + "csstype": "^3.0.2" + } + }, + "node_modules/@types/react-dom": { + "version": "18.3.5", + "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.5.tgz", + "integrity": "sha512-P4t6saawp+b/dFrUr2cvkVsfvPguwsxtH6dNIYRllMsefqFzkZk5UIjzyDOv5g1dXIPdG4Sp1yCR4Z6RCUsG/Q==", + "devOptional": true, + "license": "MIT", + "peerDependencies": { + "@types/react": "^18.0.0" + } + }, "node_modules/@vitejs/plugin-react": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-3.1.0.tgz", @@ -925,7 +1688,6 @@ "version": "6.1.0", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz", "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=12" @@ -938,7 +1700,6 @@ "version": "6.2.1", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz", "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=12" @@ -951,14 +1712,12 @@ "version": "1.3.0", "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz", "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==", - "devOptional": true, "license": "MIT" }, "node_modules/anymatch": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz", "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==", - "devOptional": true, "license": "ISC", "dependencies": { "normalize-path": "^3.0.0", @@ -972,9 +1731,20 @@ "version": "5.0.2", "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz", "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==", - "devOptional": true, "license": "MIT" }, + "node_modules/aria-hidden": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.4.tgz", + "integrity": "sha512-y+CcFFwelSXpLZk/7fMB2mUbGtX9lKycf1MWJ7CaTIERyitVlyQx6C+sxcROU2BAJ24OiZyK+8wj2i8AlBoS3A==", + "license": "MIT", + "dependencies": { + "tslib": "^2.0.0" + }, + "engines": { + "node": ">=10" + } + }, "node_modules/autoprefixer": { "version": "10.4.21", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.21.tgz", @@ -1017,14 +1787,12 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", - "devOptional": true, "license": "MIT" }, "node_modules/binary-extensions": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz", "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8" @@ -1037,7 +1805,6 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", - "devOptional": true, "license": "MIT", "dependencies": { "balanced-match": "^1.0.0" @@ -1047,7 +1814,6 @@ "version": "3.0.3", "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", - "devOptional": true, "license": "MIT", "dependencies": { "fill-range": "^7.1.1" @@ -1093,7 +1859,6 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz", "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==", - "devOptional": true, "license": "MIT", "engines": { "node": ">= 6" @@ -1170,7 +1935,6 @@ "version": "3.6.0", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==", - "devOptional": true, "license": "MIT", "dependencies": { "anymatch": "~3.1.2", @@ -1195,7 +1959,6 @@ "version": "5.1.2", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", - "devOptional": true, "license": "ISC", "dependencies": { "is-glob": "^4.0.1" @@ -1204,6 +1967,18 @@ "node": ">= 6" } }, + "node_modules/class-variance-authority": { + "version": "0.7.1", + "resolved": "https://registry.npmjs.org/class-variance-authority/-/class-variance-authority-0.7.1.tgz", + "integrity": "sha512-Ka+9Trutv7G8M6WT6SeiRWz792K5qEqIGEGzXKhAE6xOWAY6pPH8U+9IY3oCMv6kqTmLsv7Xh/2w2RigkePMsg==", + "license": "Apache-2.0", + "dependencies": { + "clsx": "^2.1.1" + }, + "funding": { + "url": "https://polar.sh/cva" + } + }, "node_modules/cliui": { "version": "8.0.1", "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz", @@ -1298,11 +2073,19 @@ "url": "https://github.com/chalk/wrap-ansi?sponsor=1" } }, + "node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "node_modules/color-convert": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "devOptional": true, "license": "MIT", "dependencies": { "color-name": "~1.1.4" @@ -1315,14 +2098,12 @@ "version": "1.1.4", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "devOptional": true, "license": "MIT" }, "node_modules/commander": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz", "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==", - "devOptional": true, "license": "MIT", "engines": { "node": ">= 6" @@ -1367,7 +2148,6 @@ "version": "7.0.6", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==", - "devOptional": true, "license": "MIT", "dependencies": { "path-key": "^3.1.0", @@ -1382,7 +2162,6 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", - "devOptional": true, "license": "MIT", "bin": { "cssesc": "bin/cssesc" @@ -1391,6 +2170,13 @@ "node": ">=4" } }, + "node_modules/csstype": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", + "devOptional": true, + "license": "MIT" + }, "node_modules/date-fns": { "version": "2.30.0", "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz", @@ -1436,11 +2222,16 @@ "node": ">= 0.6.0" } }, + "node_modules/detect-node-es": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/detect-node-es/-/detect-node-es-1.1.0.tgz", + "integrity": "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==", + "license": "MIT" + }, "node_modules/didyoumean": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz", "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==", - "devOptional": true, "license": "Apache-2.0" }, "node_modules/dir-glob": { @@ -1460,14 +2251,12 @@ "version": "1.1.3", "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz", "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==", - "devOptional": true, "license": "MIT" }, "node_modules/eastasianwidth": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz", "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==", - "devOptional": true, "license": "MIT" }, "node_modules/electron-to-chromium": { @@ -1481,7 +2270,6 @@ "version": "9.2.2", "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz", "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==", - "devOptional": true, "license": "MIT" }, "node_modules/esbuild": { @@ -1536,7 +2324,6 @@ "version": "3.3.3", "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", - "devOptional": true, "license": "MIT", "dependencies": { "@nodelib/fs.stat": "^2.0.2", @@ -1553,7 +2340,6 @@ "version": "5.1.2", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", - "devOptional": true, "license": "ISC", "dependencies": { "is-glob": "^4.0.1" @@ -1566,7 +2352,6 @@ "version": "1.19.1", "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.19.1.tgz", "integrity": "sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==", - "devOptional": true, "license": "ISC", "dependencies": { "reusify": "^1.0.4" @@ -1576,7 +2361,6 @@ "version": "7.1.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", - "devOptional": true, "license": "MIT", "dependencies": { "to-regex-range": "^5.0.1" @@ -1589,7 +2373,6 @@ "version": "3.3.1", "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz", "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==", - "devOptional": true, "license": "ISC", "dependencies": { "cross-spawn": "^7.0.6", @@ -1635,7 +2418,6 @@ "version": "2.3.3", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", - "dev": true, "hasInstallScript": true, "license": "MIT", "optional": true, @@ -1650,7 +2432,6 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", - "devOptional": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -1676,6 +2457,15 @@ "node": "6.* || 8.* || >= 10.*" } }, + "node_modules/get-nonce": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/get-nonce/-/get-nonce-1.0.1.tgz", + "integrity": "sha512-FJhYRoDaiatfEkUK8HKlicmu/3SGFD51q3itKDGoSTysQJBnfOcxU5GxnhE1E6soB76MbT0MBtnKJuXyAx+96Q==", + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "node_modules/get-stdin": { "version": "9.0.0", "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-9.0.0.tgz", @@ -1693,7 +2483,6 @@ "version": "10.4.5", "resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz", "integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==", - "devOptional": true, "license": "ISC", "dependencies": { "foreground-child": "^3.1.0", @@ -1714,7 +2503,6 @@ "version": "6.0.2", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz", "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==", - "devOptional": true, "license": "ISC", "dependencies": { "is-glob": "^4.0.3" @@ -1787,7 +2575,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz", "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==", - "devOptional": true, "license": "MIT", "dependencies": { "function-bind": "^1.1.2" @@ -1810,7 +2597,6 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", - "devOptional": true, "license": "MIT", "dependencies": { "binary-extensions": "^2.0.0" @@ -1823,7 +2609,6 @@ "version": "2.16.1", "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz", "integrity": "sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==", - "devOptional": true, "license": "MIT", "dependencies": { "hasown": "^2.0.2" @@ -1839,7 +2624,6 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -1849,7 +2633,6 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz", "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8" @@ -1859,7 +2642,6 @@ "version": "4.0.3", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", - "devOptional": true, "license": "MIT", "dependencies": { "is-extglob": "^2.1.1" @@ -1872,7 +2654,6 @@ "version": "7.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=0.12.0" @@ -1882,14 +2663,12 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==", - "devOptional": true, "license": "ISC" }, "node_modules/jackspeak": { "version": "3.4.3", "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz", "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==", - "devOptional": true, "license": "BlueOak-1.0.0", "dependencies": { "@isaacs/cliui": "^8.0.2" @@ -1905,7 +2684,6 @@ "version": "1.21.7", "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz", "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==", - "devOptional": true, "license": "MIT", "bin": { "jiti": "bin/jiti.js" @@ -1960,7 +2738,6 @@ "version": "3.1.3", "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz", "integrity": "sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=14" @@ -1973,7 +2750,6 @@ "version": "1.2.4", "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz", "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==", - "devOptional": true, "license": "MIT" }, "node_modules/lodash": { @@ -2005,6 +2781,15 @@ "yallist": "^3.0.2" } }, + "node_modules/lucide-react": { + "version": "0.363.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.363.0.tgz", + "integrity": "sha512-AlsfPCsXQyQx7wwsIgzcKOL9LwC498LIMAo+c0Es5PkHJa33xwmYAkkSoKoJWWWSYQEStqu58/jT4tL2gi32uQ==", + "license": "ISC", + "peerDependencies": { + "react": "^16.5.1 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/magic-string": { "version": "0.27.0", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.27.0.tgz", @@ -2022,7 +2807,6 @@ "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", - "devOptional": true, "license": "MIT", "engines": { "node": ">= 8" @@ -2032,7 +2816,6 @@ "version": "4.0.8", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz", "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==", - "devOptional": true, "license": "MIT", "dependencies": { "braces": "^3.0.3", @@ -2056,7 +2839,6 @@ "version": "9.0.5", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", - "devOptional": true, "license": "ISC", "dependencies": { "brace-expansion": "^2.0.1" @@ -2072,7 +2854,6 @@ "version": "7.1.2", "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz", "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==", - "devOptional": true, "license": "ISC", "engines": { "node": ">=16 || 14 >=14.17" @@ -2089,7 +2870,6 @@ "version": "2.7.0", "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz", "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==", - "devOptional": true, "license": "MIT", "dependencies": { "any-promise": "^1.0.0", @@ -2101,7 +2881,6 @@ "version": "3.3.9", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.9.tgz", "integrity": "sha512-SppoicMGpZvbF1l3z4x7No3OlIjP7QJvC9XR7AhZr1kL133KHnKPztkKDc+Ir4aJ/1VhTySrtKhrsycmrMQfvg==", - "devOptional": true, "funding": [ { "type": "github", @@ -2127,7 +2906,6 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -2147,7 +2925,6 @@ "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -2157,7 +2934,6 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz", "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==", - "devOptional": true, "license": "MIT", "engines": { "node": ">= 6" @@ -2167,14 +2943,12 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz", "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==", - "devOptional": true, "license": "BlueOak-1.0.0" }, "node_modules/path-key": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz", "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8" @@ -2184,14 +2958,12 @@ "version": "1.0.7", "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==", - "devOptional": true, "license": "MIT" }, "node_modules/path-scurry": { "version": "1.11.1", "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz", "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==", - "devOptional": true, "license": "BlueOak-1.0.0", "dependencies": { "lru-cache": "^10.2.0", @@ -2208,7 +2980,6 @@ "version": "10.4.3", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz", "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==", - "devOptional": true, "license": "ISC" }, "node_modules/path-type": { @@ -2225,14 +2996,12 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==", - "devOptional": true, "license": "ISC" }, "node_modules/picomatch": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8.6" @@ -2245,7 +3014,6 @@ "version": "2.3.0", "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -2255,7 +3023,6 @@ "version": "4.0.6", "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz", "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==", - "devOptional": true, "license": "MIT", "engines": { "node": ">= 6" @@ -2265,7 +3032,6 @@ "version": "8.5.3", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz", "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==", - "devOptional": true, "funding": [ { "type": "opencollective", @@ -2324,7 +3090,6 @@ "version": "15.1.0", "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz", "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==", - "devOptional": true, "license": "MIT", "dependencies": { "postcss-value-parser": "^4.0.0", @@ -2342,7 +3107,6 @@ "version": "4.0.1", "resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz", "integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==", - "devOptional": true, "license": "MIT", "dependencies": { "camelcase-css": "^2.0.1" @@ -2362,7 +3126,6 @@ "version": "4.0.2", "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz", "integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==", - "devOptional": true, "funding": [ { "type": "opencollective", @@ -2398,7 +3161,6 @@ "version": "6.2.0", "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.2.0.tgz", "integrity": "sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==", - "devOptional": true, "funding": [ { "type": "opencollective", @@ -2451,7 +3213,6 @@ "version": "6.1.2", "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz", "integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==", - "devOptional": true, "license": "MIT", "dependencies": { "cssesc": "^3.0.0", @@ -2465,7 +3226,6 @@ "version": "4.2.0", "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", - "devOptional": true, "license": "MIT" }, "node_modules/pretty-hrtime": { @@ -2482,7 +3242,6 @@ "version": "1.2.3", "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", - "devOptional": true, "funding": [ { "type": "github", @@ -2538,11 +3297,79 @@ "node": ">=0.10.0" } }, + "node_modules/react-remove-scroll": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.6.3.tgz", + "integrity": "sha512-pnAi91oOk8g8ABQKGF5/M9qxmmOPxaAnopyTHYfqYEwJhyFrbbBtHuSgtKEoH0jpcxx5o3hXqH1mNd9/Oi+8iQ==", + "license": "MIT", + "dependencies": { + "react-remove-scroll-bar": "^2.3.7", + "react-style-singleton": "^2.2.3", + "tslib": "^2.1.0", + "use-callback-ref": "^1.3.3", + "use-sidecar": "^1.1.3" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/react-remove-scroll-bar": { + "version": "2.3.8", + "resolved": "https://registry.npmjs.org/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.8.tgz", + "integrity": "sha512-9r+yi9+mgU33AKcj6IbT9oRCO78WriSj6t/cF8DWBZJ9aOGPOTEDvdUDz1FwKim7QXWwmHqtdHnRJfhAxEG46Q==", + "license": "MIT", + "dependencies": { + "react-style-singleton": "^2.2.2", + "tslib": "^2.0.0" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/react-style-singleton": { + "version": "2.2.3", + "resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.3.tgz", + "integrity": "sha512-b6jSvxvVnyptAiLjbkWLE/lOnR4lfTtDAl+eUC7RZy+QQWc6wRzIV2CE6xBuMmDxc2qIihtDCZD5NPOFl7fRBQ==", + "license": "MIT", + "dependencies": { + "get-nonce": "^1.0.0", + "tslib": "^2.0.0" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, "node_modules/read-cache": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==", - "devOptional": true, "license": "MIT", "dependencies": { "pify": "^2.3.0" @@ -2552,7 +3379,6 @@ "version": "3.6.0", "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", - "devOptional": true, "license": "MIT", "dependencies": { "picomatch": "^2.2.1" @@ -2582,7 +3408,6 @@ "version": "1.22.10", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz", "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==", - "devOptional": true, "license": "MIT", "dependencies": { "is-core-module": "^2.16.0", @@ -2603,7 +3428,6 @@ "version": "1.1.0", "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz", "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==", - "devOptional": true, "license": "MIT", "engines": { "iojs": ">=1.0.0", @@ -2631,7 +3455,6 @@ "version": "1.2.0", "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", - "devOptional": true, "funding": [ { "type": "github", @@ -2684,7 +3507,6 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==", - "devOptional": true, "license": "MIT", "dependencies": { "shebang-regex": "^3.0.0" @@ -2697,7 +3519,6 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz", "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8" @@ -2720,7 +3541,6 @@ "version": "4.1.0", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz", "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==", - "devOptional": true, "license": "ISC", "engines": { "node": ">=14" @@ -2746,7 +3566,6 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==", - "devOptional": true, "license": "BSD-3-Clause", "engines": { "node": ">=0.10.0" @@ -2762,7 +3581,6 @@ "version": "5.1.2", "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz", "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==", - "devOptional": true, "license": "MIT", "dependencies": { "eastasianwidth": "^0.2.0", @@ -2781,7 +3599,6 @@ "version": "4.2.3", "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", - "devOptional": true, "license": "MIT", "dependencies": { "emoji-regex": "^8.0.0", @@ -2796,7 +3613,6 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8" @@ -2806,14 +3622,12 @@ "version": "8.0.0", "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==", - "devOptional": true, "license": "MIT" }, "node_modules/string-width-cjs/node_modules/strip-ansi": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", - "devOptional": true, "license": "MIT", "dependencies": { "ansi-regex": "^5.0.1" @@ -2826,7 +3640,6 @@ "version": "7.1.0", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz", "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==", - "devOptional": true, "license": "MIT", "dependencies": { "ansi-regex": "^6.0.1" @@ -2843,7 +3656,6 @@ "version": "6.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", - "devOptional": true, "license": "MIT", "dependencies": { "ansi-regex": "^5.0.1" @@ -2856,7 +3668,6 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8" @@ -2866,7 +3677,6 @@ "version": "3.35.0", "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.0.tgz", "integrity": "sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==", - "devOptional": true, "license": "MIT", "dependencies": { "@jridgewell/gen-mapping": "^0.3.2", @@ -2905,7 +3715,6 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==", - "devOptional": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -2914,11 +3723,20 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/tailwind-merge": { + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-2.6.0.tgz", + "integrity": "sha512-P+Vu1qXfzediirmHOC3xKGAYeZtPcV9g76X+xg2FD4tYgR71ewMA35Y3sCz3zhiN/dwefRpJX0yBcgwi1fXNQA==", + "license": "MIT", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/dcastil" + } + }, "node_modules/tailwindcss": { "version": "3.4.17", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.17.tgz", "integrity": "sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==", - "devOptional": true, "license": "MIT", "dependencies": { "@alloc/quick-lru": "^5.2.0", @@ -2952,6 +3770,15 @@ "node": ">=14.0.0" } }, + "node_modules/tailwindcss-animate": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/tailwindcss-animate/-/tailwindcss-animate-1.0.7.tgz", + "integrity": "sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==", + "license": "MIT", + "peerDependencies": { + "tailwindcss": ">=3.0.0 || insiders" + } + }, "node_modules/thenby": { "version": "1.3.4", "resolved": "https://registry.npmjs.org/thenby/-/thenby-1.3.4.tgz", @@ -2963,7 +3790,6 @@ "version": "3.3.1", "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz", "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==", - "devOptional": true, "license": "MIT", "dependencies": { "any-promise": "^1.0.0" @@ -2973,7 +3799,6 @@ "version": "1.6.0", "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz", "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==", - "devOptional": true, "license": "MIT", "dependencies": { "thenify": ">= 3.1.0 < 4" @@ -2986,7 +3811,6 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", - "devOptional": true, "license": "MIT", "dependencies": { "is-number": "^7.0.0" @@ -3009,14 +3833,12 @@ "version": "0.1.13", "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz", "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==", - "devOptional": true, "license": "Apache-2.0" }, "node_modules/tslib": { "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", - "dev": true, "license": "0BSD" }, "node_modules/typescript": { @@ -3074,11 +3896,53 @@ "browserslist": ">= 4.21.0" } }, + "node_modules/use-callback-ref": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.3.3.tgz", + "integrity": "sha512-jQL3lRnocaFtu3V00JToYz/4QkNWswxijDaCVNZRiRTO3HQDLsdu1ZtmIUvV4yPp+rvWm5j0y0TG/S61cuijTg==", + "license": "MIT", + "dependencies": { + "tslib": "^2.0.0" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/use-sidecar": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/use-sidecar/-/use-sidecar-1.1.3.tgz", + "integrity": "sha512-Fedw0aZvkhynoPYlA5WXrMCAMm+nSWdZt6lzJQ7Ok8S6Q+VsHmHpRWndVRJ8Be0ZbkfPc5LRYH+5XrzXcEeLRQ==", + "license": "MIT", + "dependencies": { + "detect-node-es": "^1.1.0", + "tslib": "^2.0.0" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "@types/react": "*", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, "node_modules/util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", - "devOptional": true, "license": "MIT" }, "node_modules/vite": { @@ -3141,7 +4005,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz", "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==", - "devOptional": true, "license": "ISC", "dependencies": { "isexe": "^2.0.0" @@ -3157,7 +4020,6 @@ "version": "8.1.0", "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz", "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==", - "devOptional": true, "license": "MIT", "dependencies": { "ansi-styles": "^6.1.0", @@ -3176,7 +4038,6 @@ "version": "7.0.0", "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz", "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==", - "devOptional": true, "license": "MIT", "dependencies": { "ansi-styles": "^4.0.0", @@ -3194,7 +4055,6 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", - "devOptional": true, "license": "MIT", "engines": { "node": ">=8" @@ -3204,7 +4064,6 @@ "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "devOptional": true, "license": "MIT", "dependencies": { "color-convert": "^2.0.1" @@ -3220,14 +4079,12 @@ "version": "8.0.0", "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==", - "devOptional": true, "license": "MIT" }, "node_modules/wrap-ansi-cjs/node_modules/string-width": { "version": "4.2.3", "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", - "devOptional": true, "license": "MIT", "dependencies": { "emoji-regex": "^8.0.0", @@ -3242,7 +4099,6 @@ "version": "6.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", - "devOptional": true, "license": "MIT", "dependencies": { "ansi-regex": "^5.0.1" @@ -3272,7 +4128,6 @@ "version": "2.7.0", "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.7.0.tgz", "integrity": "sha512-+hSoy/QHluxmC9kCIJyL/uyFmLmc+e5CFR5Wa+bpIhIj85LVb9ZH2nVnqrHoSvKogwODv0ClqZkmiSSaIH5LTA==", - "devOptional": true, "license": "ISC", "bin": { "yaml": "bin.mjs" diff --git a/frontend/web/src/index.tsx b/frontend/web/src/index.tsx index 8d55175..2697b5a 100644 --- a/frontend/web/src/index.tsx +++ b/frontend/web/src/index.tsx @@ -1,170 +1,114 @@ -import React, { useState } from 'react'; +import React, { useState, useEffect } from 'react'; import ReactDOM from 'react-dom/client'; import { - hello, - Button, - Card, - CardHeader, - CardTitle, - CardDescription, - CardContent, - CardFooter, - Input, - Switch + Button, + SessionDrawer, + SessionSidebar, + TimelineFeed, + getSampleAgentSessions, + getSampleAgentSteps } from '@ra-aid/common'; // The CSS import happens through the common package's index.ts -hello(); - const App = () => { - const [inputValue, setInputValue] = useState(''); - const [switchState, setSwitchState] = useState(false); - const [loading, setLoading] = useState(false); - - const handleLoadingClick = () => { - setLoading(true); - setTimeout(() => setLoading(false), 2000); + // State for drawer open/close + const [isDrawerOpen, setIsDrawerOpen] = useState(false); + + // State for selected session + const [selectedSessionId, setSelectedSessionId] = useState(null); + + // Get sample data + const sessions = getSampleAgentSessions(); + const allSteps = getSampleAgentSteps(); + + // Set initial selected session if none selected + useEffect(() => { + if (!selectedSessionId && sessions.length > 0) { + setSelectedSessionId(sessions[0].id); + } + }, [sessions, selectedSessionId]); + + // Filter steps for selected session + const selectedSessionSteps = selectedSessionId + ? allSteps.filter(step => sessions.find(s => s.id === selectedSessionId)?.steps.some(s => s.id === step.id)) + : []; + + // Handle session selection + const handleSessionSelect = (sessionId: string) => { + setSelectedSessionId(sessionId); + setIsDrawerOpen(false); // Close drawer on selection (mobile) }; - + return ( -
-
-
-

shadcn/ui Components Demo

-

A showcase of UI components from the common package

-
- -
- - - Button Component - Various button variants from shadcn/ui - - -
- - - - - - -
-
-

Button Sizes

-
- - - -
-
-
-

Button States

-
- - -
-
- - - - - - Input Component - Text input with various states - - -
- - setInputValue(e.target.value)} - /> - {inputValue && ( -

You typed: {inputValue}

- )} -
-
- - -
-
- -
- -
- - - - -
-
-
- - - - - - Switch Component - Toggle switch with controlled state - - -
- - -
-

- Current theme: {switchState ? 'Dark' : 'Light'} -

-
- - -
- - -

Click the switch to toggle its state

- - - - - - Card Component - Card with header, content, and footer sections - - -

Cards are versatile containers that group related content and actions.

-
- - {''}
- {' '}
- {' Title'}
- {' Description'}
- {' '}
- {' Content'}
- {' Footer'}
- {''} - -
- - - - - - +
+ {/* Header */} +
+
+

+ RA-Aid +

+ + {/* Mobile drawer toggle - show only on small screens */} +
+ +
- -
-

Built with shadcn/ui components from the RA-Aid common package

-
+
+ + {/* Main content */} +
+ {/* Desktop sidebar - hidden on mobile */} + + + {/* Mobile drawer */} + + + {/* Main content area */} +
+ {selectedSessionId ? ( + <> +

+ Session: {sessions.find(s => s.id === selectedSessionId)?.name || 'Unknown'} +

+ + + ) : ( +
+

Select a session to view details

+
+ )} +
+ +
+

Built with shadcn/ui components from the RA-Aid common package

+
); }; const root = ReactDOM.createRoot(document.getElementById('root')!); -root.render(); \ No newline at end of file +root.render( + + + +); \ No newline at end of file diff --git a/frontend/web/vite.config.js b/frontend/web/vite.config.js index 2c7dda5..6517ea5 100644 --- a/frontend/web/vite.config.js +++ b/frontend/web/vite.config.js @@ -7,14 +7,14 @@ export default defineConfig({ resolve: { // Ensure that Vite treats symlinked packages as local, so HMR works correctly. alias: { - '@ra-aid/common': path.resolve(__dirname, '../common/src') + '@ra-aid/common': path.resolve(__dirname, '../common/dist') } }, server: { watch: { // Watch for changes in the common package. // This pattern forces Vite to notice file changes in the shared library. - paths: ['../common/src/**'] + paths: ['../common/src/**', '../common/dist/**'] } }, css: {