@motiadev/plugin-observability 0.13.0-beta.162-850424 → 0.13.0-beta.162-080298

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/LICENSE +93 -21
  2. package/dist/api.d.ts +3 -0
  3. package/dist/api.d.ts.map +1 -0
  4. package/dist/components/events/code/argument.d.ts +7 -0
  5. package/dist/components/events/code/argument.d.ts.map +1 -0
  6. package/dist/components/events/code/closing-parenthesis.d.ts +7 -0
  7. package/dist/components/events/code/closing-parenthesis.d.ts.map +1 -0
  8. package/dist/components/events/code/function-call-content.d.ts +9 -0
  9. package/dist/components/events/code/function-call-content.d.ts.map +1 -0
  10. package/dist/components/events/code/function-call.d.ts +10 -0
  11. package/dist/components/events/code/function-call.d.ts.map +1 -0
  12. package/dist/components/events/code/utils.d.ts +2 -0
  13. package/dist/components/events/code/utils.d.ts.map +1 -0
  14. package/dist/components/events/event-icon.d.ts +8 -0
  15. package/dist/components/events/event-icon.d.ts.map +1 -0
  16. package/dist/components/events/trace-emit-event.d.ts +6 -0
  17. package/dist/components/events/trace-emit-event.d.ts.map +1 -0
  18. package/dist/components/events/trace-event.d.ts +6 -0
  19. package/dist/components/events/trace-event.d.ts.map +1 -0
  20. package/dist/components/events/trace-log-event.d.ts +6 -0
  21. package/dist/components/events/trace-log-event.d.ts.map +1 -0
  22. package/dist/components/events/trace-state-event.d.ts +6 -0
  23. package/dist/components/events/trace-state-event.d.ts.map +1 -0
  24. package/dist/components/events/trace-stream-event.d.ts +6 -0
  25. package/dist/components/events/trace-stream-event.d.ts.map +1 -0
  26. package/dist/components/hooks/use-get-endtime.d.ts +3 -0
  27. package/dist/components/hooks/use-get-endtime.d.ts.map +1 -0
  28. package/dist/components/observability-page.d.ts +2 -0
  29. package/dist/components/observability-page.d.ts.map +1 -0
  30. package/dist/components/observability-tab-label.d.ts +2 -0
  31. package/dist/components/observability-tab-label.d.ts.map +1 -0
  32. package/dist/components/search-bar.d.ts +2 -0
  33. package/dist/components/search-bar.d.ts.map +1 -0
  34. package/dist/components/trace-empty-state.d.ts +2 -0
  35. package/dist/components/trace-empty-state.d.ts.map +1 -0
  36. package/dist/components/trace-group-item.d.ts +14 -0
  37. package/dist/components/trace-group-item.d.ts.map +1 -0
  38. package/dist/components/trace-item/trace-event-item.d.ts +9 -0
  39. package/dist/components/trace-item/trace-event-item.d.ts.map +1 -0
  40. package/dist/components/trace-item/trace-item-detail.d.ts +9 -0
  41. package/dist/components/trace-item/trace-item-detail.d.ts.map +1 -0
  42. package/dist/components/trace-item/trace-item.d.ts +14 -0
  43. package/dist/components/trace-item/trace-item.d.ts.map +1 -0
  44. package/dist/components/trace-status.d.ts +9 -0
  45. package/dist/components/trace-status.d.ts.map +1 -0
  46. package/dist/components/trace-timeline.d.ts +3 -0
  47. package/dist/components/trace-timeline.d.ts.map +1 -0
  48. package/dist/components/traces-groups.d.ts +3 -0
  49. package/dist/components/traces-groups.d.ts.map +1 -0
  50. package/dist/components/ui/copy-button.d.ts +8 -0
  51. package/dist/components/ui/copy-button.d.ts.map +1 -0
  52. package/dist/components/ui/popover.d.ts +7 -0
  53. package/dist/components/ui/popover.d.ts.map +1 -0
  54. package/dist/hooks/use-filtered-trace-groups.d.ts +3 -0
  55. package/dist/hooks/use-filtered-trace-groups.d.ts.map +1 -0
  56. package/dist/hooks/use-get-endtime.d.ts +3 -0
  57. package/dist/hooks/use-get-endtime.d.ts.map +1 -0
  58. package/dist/index.cjs +142 -0
  59. package/dist/index.d.ts +3 -89
  60. package/dist/index.d.ts.map +1 -1
  61. package/dist/index.js +5077 -725
  62. package/dist/lib/utils.d.ts +2 -0
  63. package/dist/lib/utils.d.ts.map +1 -0
  64. package/dist/plugin-observability.css +1 -0
  65. package/dist/plugin.cjs +1 -0
  66. package/dist/plugin.d.ts +2 -6
  67. package/dist/plugin.d.ts.map +1 -1
  68. package/dist/plugin.js +36 -36
  69. package/dist/stores/use-observability-store.d.ts +11 -0
  70. package/dist/stores/use-observability-store.d.ts.map +1 -0
  71. package/dist/types/observability.d.ts +79 -0
  72. package/dist/types/observability.d.ts.map +1 -0
  73. package/package.json +30 -22
  74. package/dist/index.css +0 -1369
  75. package/dist/index.css.map +0 -1
  76. package/dist/index.js.map +0 -1
  77. package/dist/plugin.js.map +0 -1
package/dist/index.css.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.css","names":[],"sources":["../src/styles.css"],"sourcesContent":["/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root, :host {\n --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-red-400: oklch(70.4% 0.191 22.216);\n --color-red-800: oklch(44.4% 0.177 26.899);\n --color-green-500: oklch(72.3% 0.219 149.579);\n --color-emerald-500: oklch(69.6% 0.17 162.48);\n --color-blue-100: oklch(93.2% 0.032 255.585);\n --color-blue-500: oklch(62.3% 0.214 259.815);\n --color-blue-600: oklch(54.6% 0.245 262.881);\n --color-pink-500: oklch(65.6% 0.241 354.308);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-500: oklch(55.1% 0.027 264.364);\n --spacing: 0.25rem;\n --container-2xl: 42rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-sm: 0.25rem;\n --radius-md: 0.375rem;\n --blur-md: 12px;\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n --font-weight-500: var(--font-weight-500);\n --font-weight-600: var(--font-weight-600);\n --font-weight-700: var(--font-weight-700);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n .absolute {\n position: absolute;\n }\n .relative {\n position: relative;\n }\n .sticky {\n position: sticky;\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .top-1\\/2 {\n top: calc(1/2 * 100%);\n }\n .top-4 {\n top: calc(var(--spacing) * 4);\n }\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n .right-4 {\n right: calc(var(--spacing) * 4);\n }\n .bottom-\\[-4px\\] {\n bottom: -4px;\n }\n .left-0 {\n left: calc(var(--spacing) * 0);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-9 {\n z-index: 9;\n }\n .z-10 {\n z-index: 10;\n }\n .z-50 {\n z-index: 50;\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .-ml-\\[26px\\] {\n margin-left: calc(26px * -1);\n }\n .ml-2 {\n margin-left: calc(var(--spacing) * 2);\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline-block {\n display: inline-block;\n }\n .h-1 {\n height: calc(var(--spacing) * 1);\n }\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n .h-\\[24px\\] {\n height: 24px;\n }\n .h-\\[32px\\] {\n height: 32px;\n }\n .h-\\[34px\\] {\n height: 34px;\n }\n .h-\\[37px\\] {\n height: 37px;\n }\n .h-full {\n height: 100%;\n }\n .max-h-\\[32px\\] {\n max-height: 32px;\n }\n .max-h-\\[50vh\\] {\n max-height: 50vh;\n }\n .min-h-\\[37px\\] {\n min-height: 37px;\n }\n .w-1 {\n width: calc(var(--spacing) * 1);\n }\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n .w-72 {\n width: calc(var(--spacing) * 72);\n }\n .w-\\[1px\\] {\n width: 1px;\n }\n .w-\\[300px\\] {\n width: 300px;\n }\n .w-auto {\n width: auto;\n }\n .w-full {\n width: 100%;\n }\n .max-w-2xl {\n max-width: var(--container-2xl);\n }\n .max-w-\\[200px\\] {\n max-width: 200px;\n }\n .min-w-0 {\n min-width: calc(var(--spacing) * 0);\n }\n .min-w-\\[200px\\] {\n min-width: 200px;\n }\n .min-w-full {\n min-width: 100%;\n }\n .flex-1 {\n flex: 1;\n }\n .origin-\\(--radix-popover-content-transform-origin\\) {\n transform-origin: var(--radix-popover-content-transform-origin);\n }\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .cursor-pointer {\n cursor: pointer;\n }\n .grid-cols-\\[300px_1fr\\] {\n grid-template-columns: 300px 1fr;\n }\n .grid-cols-\\[auto_1fr\\] {\n grid-template-columns: auto 1fr;\n }\n .grid-cols-\\[auto_auto_auto_1fr\\] {\n grid-template-columns: auto auto auto 1fr;\n }\n .grid-rows-\\[auto_1fr\\] {\n grid-template-rows: auto 1fr;\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .place-items-center {\n place-items: center;\n }\n .place-items-start {\n place-items: start;\n }\n .items-center {\n align-items: center;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .gap-x-2 {\n column-gap: calc(var(--spacing) * 2);\n }\n .gap-y-3 {\n row-gap: calc(var(--spacing) * 3);\n }\n .truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .overflow-auto {\n overflow: auto;\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-x-auto {\n overflow-x: auto;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .rounded-\\[4px\\] {\n border-radius: 4px;\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-md {\n border-radius: var(--radius-md);\n }\n .rounded-sm {\n border-radius: var(--radius-sm);\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n .border-l-1 {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n .border-border {\n border-color: var(--border);\n }\n .border-gray-500\\/40 {\n border-color: color-mix(in srgb, oklch(55.1% 0.027 264.364) 40%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n border-color: color-mix(in oklab, var(--color-gray-500) 40%, transparent);\n }\n }\n .bg-background {\n background-color: var(--background);\n }\n .bg-blue-500 {\n background-color: var(--color-blue-500);\n }\n .bg-card {\n background-color: var(--card);\n }\n .bg-emerald-500 {\n background-color: var(--color-emerald-500);\n }\n .bg-muted-foreground\\/10 {\n background-color: var(--muted-foreground);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--muted-foreground) 10%, transparent);\n }\n }\n .bg-popover {\n background-color: var(--popover);\n }\n .bg-red-800\\/10 {\n background-color: color-mix(in srgb, oklch(44.4% 0.177 26.899) 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-red-800) 10%, transparent);\n }\n }\n .bg-\\[repeating-linear-gradient\\(140deg\\,\\#2862FE\\,\\#2862FE_8px\\,\\#2358E5_8px\\,\\#2358E5_16px\\)\\] {\n background-image: repeating-linear-gradient(140deg,#2862FE,#2862FE 8px,#2358E5 8px,#2358E5 16px);\n }\n .bg-\\[repeating-linear-gradient\\(140deg\\,\\#BEFE29\\,\\#BEFE29_8px\\,\\#ABE625_8px\\,\\#ABE625_16px\\)\\] {\n background-image: repeating-linear-gradient(140deg,#BEFE29,#BEFE29 8px,#ABE625 8px,#ABE625 16px);\n }\n .bg-\\[repeating-linear-gradient\\(140deg\\,\\#EA2069\\,\\#EA2069_8px\\,\\#D41E60_8px\\,\\#D41E60_16px\\)\\] {\n background-image: repeating-linear-gradient(140deg,#EA2069,#EA2069 8px,#D41E60 8px,#D41E60 16px);\n }\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n .px-9\\! {\n padding-inline: calc(var(--spacing) * 9) !important;\n }\n .px-\\[4px\\] {\n padding-inline: 4px;\n }\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n .py-\\[2px\\] {\n padding-block: 2px;\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n .pl-6 {\n padding-left: calc(var(--spacing) * 6);\n }\n .text-left {\n text-align: left;\n }\n .font-mono {\n font-family: var(--font-mono);\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .font-bold {\n --tw-font-weight: var(--font-weight-bold);\n font-weight: var(--font-weight-bold);\n }\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n .tracking-\\[1px\\] {\n --tw-tracking: 1px;\n letter-spacing: 1px;\n }\n .text-blue-100 {\n color: var(--color-blue-100);\n }\n .text-blue-500 {\n color: var(--color-blue-500);\n }\n .text-blue-600 {\n color: var(--color-blue-600);\n }\n .text-emerald-500 {\n color: var(--color-emerald-500);\n }\n .text-foreground {\n color: var(--foreground);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-green-500 {\n color: var(--color-green-500);\n }\n .text-muted-foreground {\n color: var(--muted-foreground);\n }\n .text-muted-foreground\\/50 {\n color: var(--muted-foreground);\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);\n }\n }\n .text-pink-500 {\n color: var(--color-pink-500);\n }\n .text-popover-foreground {\n color: var(--popover-foreground);\n }\n .text-red-800 {\n color: var(--color-red-800);\n }\n .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .outline-hidden {\n --tw-outline-style: none;\n outline-style: none;\n @media (forced-colors: active) {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n }\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n .outline-2 {\n outline-style: var(--tw-outline-style);\n outline-width: 2px;\n }\n .outline-emerald-500\\/50 {\n outline-color: color-mix(in srgb, oklch(69.6% 0.17 162.48) 50%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n outline-color: color-mix(in oklab, var(--color-emerald-500) 50%, transparent);\n }\n }\n .backdrop-blur-\\[4px\\] {\n --tw-backdrop-blur: blur(4px);\n -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,);\n 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,);\n }\n .backdrop-blur-md {\n --tw-backdrop-blur: blur(var(--blur-md));\n -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,);\n 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,);\n }\n .backdrop-filter {\n -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,);\n 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,);\n }\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .running {\n animation-play-state: running;\n }\n .hover\\:bg-muted-foreground\\/10 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--muted-foreground);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--muted-foreground) 10%, transparent);\n }\n }\n }\n }\n .hover\\:bg-muted\\/50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--muted);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n }\n }\n .hover\\:bg-muted\\/70 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--muted);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--muted) 70%, transparent);\n }\n }\n }\n }\n .hover\\:text-muted-foreground {\n &:hover {\n @media (hover: hover) {\n color: var(--muted-foreground);\n }\n }\n }\n .hover\\:opacity-80 {\n &:hover {\n @media (hover: hover) {\n opacity: 80%;\n }\n }\n }\n .data-\\[side\\=bottom\\]\\:slide-in-from-top-2 {\n &[data-side=\"bottom\"] {\n --tw-enter-translate-y: calc(2*var(--spacing)*-1);\n }\n }\n .data-\\[side\\=left\\]\\:slide-in-from-right-2 {\n &[data-side=\"left\"] {\n --tw-enter-translate-x: calc(2*var(--spacing));\n }\n }\n .data-\\[side\\=right\\]\\:slide-in-from-left-2 {\n &[data-side=\"right\"] {\n --tw-enter-translate-x: calc(2*var(--spacing)*-1);\n }\n }\n .data-\\[side\\=top\\]\\:slide-in-from-bottom-2 {\n &[data-side=\"top\"] {\n --tw-enter-translate-y: calc(2*var(--spacing));\n }\n }\n .data-\\[state\\=closed\\]\\:animate-out {\n &[data-state=\"closed\"] {\n animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);\n }\n }\n .data-\\[state\\=closed\\]\\:fade-out-0 {\n &[data-state=\"closed\"] {\n --tw-exit-opacity: calc(0/100);\n --tw-exit-opacity: 0;\n }\n }\n .data-\\[state\\=closed\\]\\:zoom-out-95 {\n &[data-state=\"closed\"] {\n --tw-exit-scale: calc(95*1%);\n --tw-exit-scale: .95;\n }\n }\n .data-\\[state\\=open\\]\\:animate-in {\n &[data-state=\"open\"] {\n animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);\n }\n }\n .data-\\[state\\=open\\]\\:fade-in-0 {\n &[data-state=\"open\"] {\n --tw-enter-opacity: calc(0/100);\n --tw-enter-opacity: 0;\n }\n }\n .data-\\[state\\=open\\]\\:zoom-in-95 {\n &[data-state=\"open\"] {\n --tw-enter-scale: calc(95*1%);\n --tw-enter-scale: .95;\n }\n }\n .dark\\:text-red-400 {\n &:is(.dark *) {\n color: var(--color-red-400);\n }\n }\n}\n:root {\n --default-font-family: \"DM Sans\", ui-sans-serif, sans-serif;\n --font-dm-mono: \"DM Mono\", ui-monospace, monospace;\n line-height: 1.5;\n font-size: 16px;\n color-scheme: light dark;\n font-family: var( --default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\" ), serif;\n font-synthesis: none;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n width: 100%;\n font-optical-sizing: auto;\n --font-weight-500: 500;\n --font-weight-600: 600;\n --font-weight-700: 700;\n --accent-1000: #2862fe;\n --accent-970: #2862fef7;\n --accent-950: #2862fef2;\n --accent-900: #2862fee5;\n --accent-800: #2862fecc;\n --accent-700: #2862feb2;\n --accent-600: #2862fe99;\n --accent-500: #2862fe80;\n --accent-400: #2862fe66;\n --accent-300: #2862fe4d;\n --accent-200: #2862fe33;\n --accent-100: #2862fe1a;\n --accent-50: #2862fe0d;\n --accent-30: #2862fe08;\n --dark-1000: #0a0a0a;\n --dark-970: #0a0a0af7;\n --dark-950: #0a0a0af2;\n --dark-900: #0a0a0ae5;\n --dark-800: #0a0a0acc;\n --dark-700: #0a0a0ab2;\n --dark-600: #0a0a0a99;\n --dark-500: #0a0a0a80;\n --dark-400: #0a0a0a66;\n --dark-300: #0a0a0a4d;\n --dark-200: #0a0a0a33;\n --dark-100: #0a0a0a1a;\n --dark-50: #0a0a0a0d;\n --dark-30: #0a0a0a08;\n --light-1000: #ffffff;\n --light-970: #fffffff7;\n --light-950: #fffffff2;\n --light-900: #ffffffe5;\n --light-800: #ffffffcc;\n --light-700: #ffffffb2;\n --light-600: #ffffff99;\n --light-500: #ffffff80;\n --light-400: #ffffff66;\n --light-300: #ffffff4d;\n --light-200: #ffffff33;\n --light-100: #ffffff1a;\n --light-50: #ffffff0d;\n --light-30: #ffffff08;\n --error: #d61355;\n --canvas-background: #ebebeb;\n --background: var(--light-1000);\n --foreground: var(--dark-1000);\n --surface-content: var(--dark-30);\n --surface-component: var(--dark-50);\n --surface-light-100: var(--dark-100);\n --surface-light-200: var(--dark-200);\n --border: var(--dark-100);\n --border-accent: var(--accent-1000);\n --states-hover: var(--dark-30);\n --states-selected: var(--dark-100);\n --states-active: var(--accent-1000);\n --text-header: var(--dark-1000);\n --text-body: var(--dark-600);\n --text-placeholder: var(--dark-400);\n --text-accent: var(--accent-1000);\n --text-error: var(--error);\n --icon-active: var(--dark-1000);\n --icon-light: var(--dark-600);\n --icon-component: var(--dark-400);\n --icon-accent: var(--accent-1000);\n --primary: var(--accent-1000);\n --primary-foreground: var(--light-1000);\n --secondary: var(--surface-component);\n --secondary-foreground: var(--text-body);\n --muted: var(--surface-light-100);\n --muted-foreground: var(--text-body);\n --accent: var(--accent-1000);\n --accent-foreground: var(--light-1000);\n --destructive: var(--error);\n --destructive-foreground: var(--light-1000);\n --card: var(--surface-content);\n --card-foreground: var(--foreground);\n --popover: var(--surface-content);\n --popover-foreground: var(--foreground);\n --input: var(--states-hover);\n --ring: var(--border-accent);\n --chart-1: var(--accent-1000);\n --chart-2: var(--accent-800);\n --chart-3: var(--accent-600);\n --chart-4: var(--accent-400);\n --chart-5: var(--accent-200);\n --header: var(--background);\n --header-foreground: var(--text-header);\n --header-primary: var(--primary);\n --header-primary-foreground: var(--primary-foreground);\n --header-accent: var(--surface-component);\n --header-accent-foreground: var(--text-body);\n --header-border: var(--border);\n --header-ring: var(--ring);\n --sidebar: var(--background);\n --sidebar-foreground: var(--text-header);\n --sidebar-primary: var(--primary);\n --sidebar-primary-foreground: var(--primary-foreground);\n --sidebar-accent: var(--surface-component);\n --sidebar-accent-foreground: var(--text-body);\n --sidebar-border: var(--border);\n --sidebar-ring: var(--ring);\n}\n.dark {\n --canvas-background: #030303;\n --background: var(--dark-1000);\n --foreground: var(--light-1000);\n --surface-content: var(--light-30);\n --surface-component: var(--light-50);\n --surface-light-100: var(--light-100);\n --surface-light-200: var(--light-200);\n --border: var(--light-100);\n --states-hover: var(--light-30);\n --states-selected: var(--light-100);\n --text-header: var(--light-1000);\n --text-body: var(--light-600);\n --text-placeholder: var(--light-400);\n --icon-active: var(--light-1000);\n --icon-light: var(--light-600);\n --icon-component: var(--light-400);\n --secondary-foreground: var(--light-600);\n --muted-foreground: var(--light-600);\n --card: var(--surface-content);\n --card-foreground: var(--foreground);\n --popover: var(--surface-content);\n --popover-foreground: var(--foreground);\n --input: var(--states-hover);\n --ring: var(--border-accent);\n --chart-1: var(--accent-1000);\n --chart-2: var(--accent-800);\n --chart-3: var(--accent-600);\n --chart-4: var(--accent-400);\n --chart-5: var(--accent-200);\n --header: var(--background);\n --header-foreground: var(--text-header);\n --header-primary: var(--primary);\n --header-primary-foreground: var(--primary-foreground);\n --header-accent: var(--surface-component);\n --header-accent-foreground: var(--text-body);\n --header-border: var(--border);\n --header-ring: var(--ring);\n --sidebar: var(--background);\n --sidebar-foreground: var(--text-header);\n --sidebar-primary: var(--primary);\n --sidebar-primary-foreground: var(--primary-foreground);\n --sidebar-accent: var(--surface-component);\n --sidebar-accent-foreground: var(--text-body);\n --sidebar-border: var(--border);\n --sidebar-ring: var(--ring);\n}\n@layer base {\n * {\n border-color: var(--border);\n }\n body {\n background-color: var(--background);\n color: var(--foreground);\n }\n}\n@layer theme, base, components, utilities;\n@layer theme;\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n}\n@layer utilities;\n@property --tw-animation-delay {\n syntax: \"*\";\n inherits: false;\n initial-value: 0s;\n}\n@property --tw-animation-direction {\n syntax: \"*\";\n inherits: false;\n initial-value: normal;\n}\n@property --tw-animation-duration {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-animation-fill-mode {\n syntax: \"*\";\n inherits: false;\n initial-value: none;\n}\n@property --tw-animation-iteration-count {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-enter-blur {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-enter-opacity {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-enter-rotate {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-enter-scale {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-enter-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-enter-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-exit-blur {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-exit-opacity {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-exit-rotate {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-exit-scale {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-exit-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-exit-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-backdrop-blur {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-brightness {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-contrast {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-grayscale {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-hue-rotate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-invert {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-opacity {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-saturate {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-backdrop-sepia {\n syntax: \"*\";\n inherits: false;\n}\n@property --tw-duration {\n syntax: \"*\";\n inherits: false;\n}\n@keyframes enter {\n from {\n opacity: var(--tw-enter-opacity,1);\n transform: translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0));\n filter: blur(var(--tw-enter-blur,0));\n }\n}\n@keyframes exit {\n to {\n opacity: var(--tw-exit-opacity,1);\n 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));\n filter: blur(var(--tw-exit-blur,0));\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-backdrop-blur: initial;\n --tw-backdrop-brightness: initial;\n --tw-backdrop-contrast: initial;\n --tw-backdrop-grayscale: initial;\n --tw-backdrop-hue-rotate: initial;\n --tw-backdrop-invert: initial;\n --tw-backdrop-opacity: initial;\n --tw-backdrop-saturate: initial;\n --tw-backdrop-sepia: initial;\n --tw-duration: initial;\n --tw-animation-delay: 0s;\n --tw-animation-direction: normal;\n --tw-animation-duration: initial;\n --tw-animation-fill-mode: none;\n --tw-animation-iteration-count: 1;\n --tw-enter-blur: 0;\n --tw-enter-opacity: 1;\n --tw-enter-rotate: 0;\n --tw-enter-scale: 1;\n --tw-enter-translate-x: 0;\n --tw-enter-translate-y: 0;\n --tw-exit-blur: 0;\n --tw-exit-opacity: 1;\n --tw-exit-rotate: 0;\n --tw-exit-scale: 1;\n --tw-exit-translate-x: 0;\n --tw-exit-translate-y: 0;\n }\n }\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
package/dist/index.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","names":["TraceEmptyState: React.FC","interval: NodeJS.Timeout","TraceItem: React.FC<Props>","EventIcon: React.FC<Props>","CopyButton: React.FC<CopyButtonProps>","Popover: FC<ComponentProps<typeof PopoverPrimitive.Root>>","PopoverTrigger: FC<ComponentProps<typeof PopoverPrimitive.Trigger>>","PopoverContent: FC<ComponentProps<typeof PopoverPrimitive.Content>>","Argument: React.FC<ArgumentProps>","ClosingParenthesis: React.FC<ClosingParenthesisProps>","FunctionCall: React.FC<Props>","TraceEmitEvent: React.FC<{ event: EmitEvent }>","TraceLogEvent: React.FC<{ event: LogEntry }>","TraceStateEvent: React.FC<{ event: StateEvent }>","TraceStreamEvent: React.FC<{ event: StreamEvent }>","TraceEvent: React.FC<{ event: TraceEventType }>","TraceEventItem: React.FC<Props>","TraceItemDetail: React.FC<Props>","TraceTimeline: React.FC","TraceTimelineComponent: React.FC<TraceTimelineComponentProps>","TraceStatusBadge: React.FC<Props>","TraceGroupItem: React.FC<TraceGroupItemProps>","TracesGroups: React.FC"],"sources":["../src/stores/use-observability-store.ts","../src/components/search-bar.tsx","../src/components/trace-empty-state.tsx","../src/hooks/use-get-endtime.ts","../src/lib/utils.ts","../src/components/trace-item/trace-item.tsx","../src/components/events/event-icon.tsx","../src/components/ui/copy-button.tsx","../src/components/ui/popover.tsx","../src/components/events/code/utils.ts","../src/components/events/code/argument.tsx","../src/components/events/code/closing-parenthesis.tsx","../src/components/events/code/function-call-content.tsx","../src/components/events/code/function-call.tsx","../src/components/events/trace-emit-event.tsx","../src/components/events/trace-log-event.tsx","../src/components/events/trace-state-event.tsx","../src/components/events/trace-stream-event.tsx","../src/components/events/trace-event.tsx","../src/components/trace-item/trace-event-item.tsx","../src/components/trace-item/trace-item-detail.tsx","../src/components/trace-timeline.tsx","../src/hooks/use-filtered-trace-groups.ts","../src/components/trace-status.tsx","../src/components/trace-group-item.tsx","../src/components/traces-groups.tsx","../src/components/observability-page.tsx","../src/components/observability-tab-label.tsx"],"sourcesContent":["import { create } from 'zustand'\n\nexport type ObservabilityState = {\n selectedTraceGroupId: string\n selectedTraceId?: string\n search: string\n selectTraceGroupId: (groupId?: string) => void\n selectTraceId: (traceId?: string) => void\n setSearch: (search: string) => void\n clearTraces: () => void\n}\n\nexport const useObservabilityStore = create<ObservabilityState>()((set) => ({\n selectedTraceGroupId: '',\n selectedTraceId: undefined,\n search: '',\n selectTraceGroupId: (groupId) => set({ selectedTraceGroupId: groupId }),\n selectTraceId: (traceId) => set({ selectedTraceId: traceId }),\n setSearch: (search) => set({ search }),\n clearTraces: () => {\n fetch('/__motia/trace/clear', { method: 'POST' })\n },\n}))\n","import { Button, cn, Input } from '@motiadev/ui'\nimport { Search, Trash, X } from 'lucide-react'\nimport { memo } from 'react'\nimport { useObservabilityStore } from '../stores/use-observability-store'\n\nexport const SearchBar = memo(() => {\n const search = useObservabilityStore((state) => state.search)\n const setSearch = useObservabilityStore((state) => state.setSearch)\n const clearTraces = useObservabilityStore((state) => state.clearTraces)\n\n return (\n <div className=\"flex p-2 border-b gap-2\" data-testid=\"logs-search-container\">\n <div className=\"flex-1 relative\">\n <Input\n variant=\"shade\"\n value={search}\n onChange={(e) => setSearch(e.target.value)}\n className=\"px-9! font-medium\"\n placeholder=\"Search by Trace ID or Step Name\"\n />\n <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50\" />\n <X\n className={cn(\n 'cursor-pointer absolute right-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground/50 hover:text-muted-foreground',\n {\n visible: search !== '',\n invisible: search === '',\n },\n )}\n onClick={() => setSearch('')}\n />\n </div>\n <Button variant=\"default\" onClick={clearTraces} className=\"h-[34px]\">\n <Trash /> Clear\n </Button>\n </div>\n )\n})\n\nSearchBar.displayName = 'SearchBar'\n","import { memo } from 'react'\nimport { useObservabilityStore } from '../stores/use-observability-store'\n\nexport const TraceEmptyState: React.FC = memo(() => {\n const selectedGroupId = useObservabilityStore((state) => state.selectedTraceGroupId)\n\n if (selectedGroupId) {\n return null\n }\n\n return (\n <div className=\"flex items-center justify-center h-full text-muted-foreground\">\n Select a trace or trace group to view the timeline\n </div>\n )\n})\nTraceEmptyState.displayName = 'TraceEmptyState'\n","import { useEffect, useState } from 'react'\nimport type { TraceGroup } from '../types/observability'\n\nexport const useGetEndTime = (group: TraceGroup | undefined | null) => {\n const groupEndTime = group?.endTime\n const [endTime, setEndTime] = useState(() => groupEndTime || Date.now())\n\n useEffect(() => {\n let interval: NodeJS.Timeout\n if (groupEndTime) {\n if (groupEndTime !== endTime) {\n setEndTime(groupEndTime)\n }\n } else {\n interval = setInterval(() => setEndTime(Date.now()), 100)\n }\n\n return () => clearInterval(interval)\n }, [groupEndTime, endTime])\n\n return endTime\n}\n","export const formatDuration = (duration?: number) => {\n if (duration === undefined || duration === null) return 'N/A'\n if (duration < 1000) return `${duration}ms`\n if (duration < 60000) return `${(duration / 1000).toFixed(1)}s`\n if (duration < 3600000) return `${(duration / 60000).toFixed(1)}min`\n return `${(duration / 3600000).toFixed(1)}h`\n}\n","import { cn } from '@motiadev/ui'\nimport type React from 'react'\nimport { memo, useCallback, useMemo } from 'react'\n\nconst GRADIENT_CLASSES = {\n running: 'bg-[repeating-linear-gradient(140deg,#BEFE29,#BEFE29_8px,#ABE625_8px,#ABE625_16px)]',\n completed: 'bg-[repeating-linear-gradient(140deg,#2862FE,#2862FE_8px,#2358E5_8px,#2358E5_16px)]',\n failed: 'bg-[repeating-linear-gradient(140deg,#EA2069,#EA2069_8px,#D41E60_8px,#D41E60_16px)]',\n} as const\n\ntype Props = {\n traceId: string\n traceName: string\n traceStatus: 'running' | 'completed' | 'failed'\n traceStartTime: number\n traceEndTime: number | undefined\n groupStartTime: number\n groupEndTime: number\n onExpand: (traceId: string) => void\n}\n\nexport const TraceItem: React.FC<Props> = memo(\n ({ traceId, traceName, traceStatus, traceStartTime, traceEndTime, groupStartTime, groupEndTime, onExpand }) => {\n const handleClick = useCallback(() => {\n onExpand(traceId)\n }, [onExpand, traceId])\n\n const barClassName = useMemo(\n () => cn('h-[24px] rounded-[4px] hover:opacity-80 transition-all duration-200', GRADIENT_CLASSES[traceStatus]),\n [traceStatus],\n )\n\n const barStyle = useMemo(\n () => ({\n marginLeft: `${((traceStartTime - groupStartTime) / (groupEndTime - groupStartTime)) * 100}%`,\n width: traceEndTime\n ? `${((traceEndTime - traceStartTime) / (groupEndTime - groupStartTime)) * 100}%`\n : `${((Date.now() - traceStartTime) / (groupEndTime - groupStartTime)) * 100}%`,\n }),\n [traceStartTime, traceEndTime, groupStartTime, groupEndTime],\n )\n\n return (\n <div\n className=\"flex hover:bg-muted-foreground/10 relative cursor-pointer\"\n onClick={handleClick}\n data-testid=\"trace-timeline-item\"\n >\n <div className=\"flex items-center min-w-[200px] max-w-[200px] h-[32px] max-h-[32px] py-4 px-2 text-sm font-semibold text-foreground truncate sticky left-0 bg-card z-9\">\n {traceName}\n </div>\n <div className=\"flex w-full flex-row items-center hover:bg-muted/50 rounded-md\">\n <div className=\"relative w-full h-[32px] flex items-center\">\n <div className={barClassName} style={barStyle} />\n </div>\n </div>\n </div>\n )\n },\n)\nTraceItem.displayName = 'TraceItem'\n","import { MessageCircle, Package, Radio, ScrollText } from 'lucide-react'\nimport type React from 'react'\nimport type { TraceEvent as TraceEventType } from '../../types/observability'\n\ntype Props = {\n event: TraceEventType\n}\n\nexport const EventIcon: React.FC<Props> = ({ event }) => {\n if (event.type === 'log') {\n return <ScrollText className=\"w-4 h-4 text-muted-foreground\" />\n } else if (event.type === 'emit') {\n return <MessageCircle className=\"w-4 h-4 text-muted-foreground\" />\n } else if (event.type === 'state') {\n return <Package className=\"w-4 h-4 text-muted-foreground\" />\n } else if (event.type === 'stream') {\n return <Radio className=\"w-4 h-4 text-muted-foreground\" />\n }\n}\n","import { Button, cn } from '@motiadev/ui'\nimport { Check, Copy } from 'lucide-react'\nimport { useCallback, useState } from 'react'\n\ntype CopyButtonProps = {\n textToCopy: string\n className?: string\n title?: string\n}\n\nexport const CopyButton: React.FC<CopyButtonProps> = ({ textToCopy, className, title }) => {\n const [copied, setCopied] = useState(false)\n\n const handleCopy = useCallback(async () => {\n try {\n await navigator.clipboard.writeText(textToCopy)\n setCopied(true)\n setTimeout(() => setCopied(false), 2000)\n } catch (error) {\n console.error('Failed to copy:', error)\n }\n }, [textToCopy])\n\n return (\n <Button\n variant=\"icon\"\n size=\"icon\"\n onClick={handleCopy}\n className={cn('cursor-pointer p-3 rounded-full', className)}\n title={title ?? (copied ? 'Copied!' : 'Copy')}\n >\n {copied ? <Check className=\"w-4 h-4 text-green-500\" /> : <Copy className=\"w-4 h-4 text-gray-400\" />}\n </Button>\n )\n}\n","import { cn } from '@motiadev/ui'\nimport * as PopoverPrimitive from '@radix-ui/react-popover'\nimport type { ComponentProps, FC } from 'react'\n\nexport const Popover: FC<ComponentProps<typeof PopoverPrimitive.Root>> = ({ ...props }) => {\n return <PopoverPrimitive.Root data-slot=\"popover\" {...props} />\n}\n\nexport const PopoverTrigger: FC<ComponentProps<typeof PopoverPrimitive.Trigger>> = ({ ...props }) => {\n return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />\n}\n\nexport const PopoverContent: FC<ComponentProps<typeof PopoverPrimitive.Content>> = ({\n className,\n align = 'center',\n sideOffset = 4,\n ...props\n}) => {\n return (\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n data-slot=\"popover-content\"\n align={align}\n sideOffset={sideOffset}\n className={cn(\n 'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',\n className,\n )}\n {...props}\n />\n </PopoverPrimitive.Portal>\n )\n}\n\nexport const PopoverAnchor: FC<ComponentProps<typeof PopoverPrimitive.Anchor>> = ({ ...props }) => {\n return <PopoverPrimitive.Anchor data-slot=\"popover-anchor\" {...props} />\n}\n","export const formatArgumentValue = (arg: string | object | false | null): string => {\n if (typeof arg === 'object' && arg !== null) {\n return JSON.stringify(arg, null, 1)\n }\n if (arg === null) {\n return 'null'\n }\n\n return arg.toString()\n}\n","import { memo, useMemo } from 'react'\nimport ReactJson from 'react18-json-view'\nimport { CopyButton } from '../../../components/ui/copy-button'\nimport { Popover, PopoverContent, PopoverTrigger } from '../../../components/ui/popover'\nimport 'react18-json-view/src/dark.css'\nimport 'react18-json-view/src/style.css'\nimport { formatArgumentValue } from './utils'\n\ntype ArgumentProps = {\n arg: string | object | false\n popover?: boolean\n}\n\nexport const Argument: React.FC<ArgumentProps> = memo(({ arg, popover = true }) => {\n const isObject = useMemo(() => typeof arg === 'object' && arg !== null, [arg])\n\n const value = useMemo(() => formatArgumentValue(arg), [arg])\n\n const textToCopy = useMemo(() => JSON.stringify(arg, null, 2), [arg])\n\n if (!popover) {\n return (\n <>\n {isObject ? (\n <ReactJson src={arg} theme=\"default\" enableClipboard={false} style={{ padding: 0 }} />\n ) : (\n <span className=\"font-mono text-blue-500\">{value}</span>\n )}\n </>\n )\n }\n\n return (\n <Popover>\n <PopoverTrigger asChild>\n <span className=\"truncate font-mono text-blue-500 cursor-pointer inline-block\">{value}</span>\n </PopoverTrigger>\n <PopoverContent\n className=\"backdrop-blur-md w-auto max-w-2xl relative max-h-[50vh] overflow-y-auto\"\n hideWhenDetached\n >\n {isObject ? (\n <div>\n <CopyButton textToCopy={textToCopy} className=\"absolute top-4 right-4\" title=\"Copy JSON\" />\n <ReactJson src={arg} theme=\"default\" enableClipboard={false} style={{ padding: 0 }} />\n </div>\n ) : (\n <div className=\"flex items-center justify-between\">\n <span>{value}</span>\n <CopyButton textToCopy={textToCopy} className=\"ml-2\" title=\"Copy JSON\" />\n </div>\n )}\n </PopoverContent>\n </Popover>\n )\n})\nArgument.displayName = 'Argument'\n","import { memo } from 'react'\n\ntype ClosingParenthesisProps = {\n callsQuantity?: number\n noQuantity?: boolean\n}\n\nexport const ClosingParenthesis: React.FC<ClosingParenthesisProps> = memo(({ callsQuantity, noQuantity = false }) => {\n const hasCalls = callsQuantity && callsQuantity > 1\n\n return (\n <div className=\"flex items-center\">\n <span className=\"font-mono text-emerald-500\">)</span>\n {!noQuantity && hasCalls && <span className=\"font-mono text-muted-foreground\"> x{callsQuantity}</span>}\n </div>\n )\n})\nClosingParenthesis.displayName = 'ClosingParenthesis'\n","import { cn } from '@motiadev/ui'\nimport { forwardRef } from 'react'\n\ntype FunctionCallContentProps = {\n topLevelClassName?: string\n objectName?: string\n functionName: string\n className?: string\n}\n\nexport const FunctionCallContent = forwardRef<HTMLDivElement, FunctionCallContentProps>(\n ({ topLevelClassName, objectName, functionName, className, ...props }, ref) => {\n return (\n <div ref={ref} className={cn('flex items-center', className)} {...props}>\n {topLevelClassName && (\n <>\n <span className=\"font-mono text-pink-500\">{topLevelClassName}</span>\n <span>.</span>\n </>\n )}\n {objectName && (\n <>\n <span className=\"font-mono text-pink-500\">{objectName}</span>\n <span>.</span>\n </>\n )}\n <span className=\"font-mono text-pink-500\">{functionName}</span>\n <span className=\"font-mono text-emerald-500\">(</span>\n </div>\n )\n },\n)\nFunctionCallContent.displayName = 'FunctionCallContent'\n","import { Fragment, memo, useMemo } from 'react'\nimport { CopyButton } from '../../../components/ui/copy-button'\nimport { Popover, PopoverContent, PopoverTrigger } from '../../../components/ui/popover'\nimport { Argument } from './argument'\nimport { ClosingParenthesis } from './closing-parenthesis'\nimport { FunctionCallContent } from './function-call-content'\n\ntype Props = {\n topLevelClassName?: string\n objectName?: string\n functionName: string\n args: Array<string | object | false | undefined>\n callsQuantity?: number\n}\n\nconst GRID_LAYOUT_STYLE = { gridTemplateColumns: 'max-content 1fr max-content' }\n\nexport const FunctionCall: React.FC<Props> = memo(\n ({ topLevelClassName, objectName, functionName, args, callsQuantity }) => {\n const filteredArgs = useMemo(() => args.filter((arg) => arg !== undefined), [args])\n\n const argsGridStyle = useMemo(\n () => ({ gridTemplateColumns: `repeat(${filteredArgs.length * 2}, minmax(0, auto))` }),\n [filteredArgs.length],\n )\n\n const functionCallText = useMemo(() => {\n const prefix = [topLevelClassName, objectName].filter(Boolean).join('.')\n const fullPrefix = prefix ? `${prefix}.` : ''\n const argsString = filteredArgs\n .map((arg) => {\n if (typeof arg === 'object' && arg !== null) {\n return JSON.stringify(arg, null, 2)\n }\n if (arg === null) {\n return 'null'\n }\n if (typeof arg === 'string') {\n return `'${arg}'`\n }\n return String(arg)\n })\n .join(', ')\n return `${fullPrefix}${functionName}(${argsString})`\n }, [topLevelClassName, objectName, functionName, filteredArgs])\n\n return (\n <div className=\"grid overflow-hidden items-center\" style={GRID_LAYOUT_STYLE}>\n <Popover>\n <PopoverTrigger asChild>\n <FunctionCallContent\n className=\"cursor-pointer\"\n functionName={functionName}\n topLevelClassName={topLevelClassName}\n objectName={objectName}\n />\n </PopoverTrigger>\n <PopoverContent\n className=\"grid grid-rows-auto backdrop-blur-md w-auto max-w-2xl max-h-[50vh] overflow-y-auto\"\n hideWhenDetached\n >\n <div className=\"flex items-center justify-between gap-2\">\n <FunctionCallContent\n functionName={functionName}\n topLevelClassName={topLevelClassName}\n objectName={objectName}\n />\n <CopyButton textToCopy={functionCallText} />\n </div>\n {filteredArgs.map((arg, index) => (\n <div key={index} className=\"grid grid-cols-[auto_1fr] items-center pl-4\">\n <Argument arg={arg} popover={false} />\n {index < filteredArgs.length - 1 && <span>, </span>}\n </div>\n ))}\n <ClosingParenthesis callsQuantity={callsQuantity} noQuantity />\n </PopoverContent>\n </Popover>\n <div className=\"grid items-center min-w-0\" style={argsGridStyle}>\n {filteredArgs.map((arg, index) => (\n <Fragment key={index}>\n <Argument arg={arg} />\n {index < filteredArgs.length - 1 && <span>, </span>}\n </Fragment>\n ))}\n </div>\n <ClosingParenthesis callsQuantity={callsQuantity} />\n </div>\n )\n },\n)\nFunctionCall.displayName = 'FunctionCall'\n","import type React from 'react'\nimport { memo, useMemo } from 'react'\nimport type { EmitEvent } from '../../types/observability'\nimport { FunctionCall } from './code/function-call'\n\nexport const TraceEmitEvent: React.FC<{ event: EmitEvent }> = memo(({ event }) => {\n const args = useMemo(() => [{ topic: event.topic, data: event.data }], [event])\n return <FunctionCall functionName=\"emit\" args={args} />\n})\nTraceEmitEvent.displayName = 'TraceEmitEvent'\n","import { LevelDot } from '@motiadev/ui'\nimport type React from 'react'\nimport { memo } from 'react'\nimport type { LogEntry } from '../../types/observability'\n\nexport const TraceLogEvent: React.FC<{ event: LogEntry }> = memo(({ event }) => {\n return (\n <div className=\"flex items-center gap-2\">\n <LevelDot level={event.level} /> {event.message}\n </div>\n )\n})\nTraceLogEvent.displayName = 'TraceLogEvent'\n","import type React from 'react'\nimport { memo, useMemo } from 'react'\nimport type { StateEvent } from '../../types/observability'\nimport { FunctionCall } from './code/function-call'\nexport const TraceStateEvent: React.FC<{ event: StateEvent }> = memo(({ event }) => {\n const args = useMemo(() => [event.data.traceId, event.data.key, event.data.value], [event])\n return <FunctionCall objectName=\"state\" functionName={event.operation} args={args} />\n})\nTraceStateEvent.displayName = 'TraceStateEvent'\n","import type React from 'react'\nimport { memo, useMemo } from 'react'\nimport type { StreamEvent } from '../../types/observability'\nimport { FunctionCall } from './code/function-call'\n\nexport const TraceStreamEvent: React.FC<{ event: StreamEvent }> = memo(({ event }) => {\n const args = useMemo(\n () => [event.data.groupId, event.data.id, event.data.data as unknown as Array<string | object | false | undefined>],\n [event],\n )\n return (\n <FunctionCall\n topLevelClassName=\"streams\"\n objectName={event.streamName}\n functionName={event.operation}\n args={args}\n callsQuantity={event.calls}\n />\n )\n})\nTraceStreamEvent.displayName = 'TraceStreamEvent'\n","import type React from 'react'\nimport { memo } from 'react'\nimport type { TraceEvent as TraceEventType } from '../../types/observability'\nimport { TraceEmitEvent } from './trace-emit-event'\nimport { TraceLogEvent } from './trace-log-event'\nimport { TraceStateEvent } from './trace-state-event'\nimport { TraceStreamEvent } from './trace-stream-event'\n\nexport const TraceEvent: React.FC<{ event: TraceEventType }> = memo(({ event }) => {\n if (event.type === 'log') {\n return <TraceLogEvent event={event} />\n } else if (event.type === 'emit') {\n return <TraceEmitEvent event={event} />\n } else if (event.type === 'state') {\n return <TraceStateEvent event={event} />\n } else if (event.type === 'stream') {\n return <TraceStreamEvent event={event} />\n }\n})\nTraceEvent.displayName = 'TraceEvent'\n","import type React from 'react'\nimport { Fragment, memo } from 'react'\nimport { formatDuration } from '../../lib/utils'\nimport type { TraceEvent as TraceEventType } from '../../types/observability'\nimport { EventIcon } from '../events/event-icon'\nimport { TraceEvent } from '../events/trace-event'\n\ntype Props = {\n event: TraceEventType\n traceStartTime: number\n}\n\nexport const TraceEventItem: React.FC<Props> = memo(({ event, traceStartTime }) => {\n return (\n <Fragment>\n <div className=\"grid place-items-center\">\n <div className=\"w-1 h-1 rounded-full bg-emerald-500 outline outline-2 outline-emerald-500/50 -ml-[26px]\"></div>\n </div>\n <div className=\"grid place-items-center\">\n <EventIcon event={event} />\n </div>\n <div className=\"grid place-items-center\">\n <span className=\"text-sm font-mono text-muted-foreground\">\n +{formatDuration(Math.floor(event.timestamp - traceStartTime))}\n </span>\n </div>\n <div className=\"grid place-items-start\">\n <TraceEvent event={event} />\n </div>\n </Fragment>\n )\n})\nTraceEventItem.displayName = 'TraceEventItem'\n","import { Badge, Sidebar } from '@motiadev/ui'\nimport { X } from 'lucide-react'\nimport type React from 'react'\nimport { memo, useMemo } from 'react'\nimport { formatDuration } from '../../lib/utils'\nimport type { Trace } from '../../types/observability'\nimport { TraceEventItem } from './trace-event-item'\n\ntype Props = {\n trace: Trace\n onClose: () => void\n}\n\nexport const TraceItemDetail: React.FC<Props> = memo(({ trace, onClose }) => {\n const actions = useMemo(() => [{ icon: <X />, onClick: onClose, label: 'Close' }], [onClose])\n return (\n <Sidebar\n onClose={onClose}\n initialWidth={600}\n title=\"Trace Details\"\n subtitle={`Viewing details from step ${trace.name}`}\n actions={actions}\n >\n <div className=\"px-2 overflow-auto\">\n <div className=\"flex items-center gap-4 text-sm text-muted-foreground mb-4\">\n {trace.endTime && <span>Duration: {formatDuration(trace.endTime - trace.startTime)}</span>}\n <div className=\"bg-blue-500 font-bold text-xs px-[4px] py-[2px] rounded-sm text-blue-100\">\n {trace.entryPoint.type}\n </div>\n {trace.correlationId && <Badge variant=\"outline\">Correlated: {trace.correlationId}</Badge>}\n </div>\n <div className=\"grid grid-cols-[auto_auto_auto_1fr] gap-x-2 gap-y-3 font-mono text-xs border-l-1 border-gray-500/40 pl-6\">\n {trace.events.map((event, index) => (\n <TraceEventItem key={index} event={event} traceStartTime={trace.startTime} />\n ))}\n </div>\n </div>\n {trace.error && (\n <div className=\"p-4 bg-red-800/10\">\n <div className=\"text-sm text-red-800 dark:text-red-400 font-semibold\">{trace.error.message}</div>\n <div className=\"text-sm text-red-800 dark:text-red-400 pl-4\">{trace.error.stack}</div>\n </div>\n )}\n </Sidebar>\n )\n})\nTraceItemDetail.displayName = 'TraceItemDetail'\n","import { useStreamGroup, useStreamItem } from '@motiadev/stream-client-react'\nimport { Button } from '@motiadev/ui'\nimport { Minus, Plus } from 'lucide-react'\nimport type React from 'react'\nimport { memo, useCallback, useMemo, useState } from 'react'\nimport { useGetEndTime } from '../hooks/use-get-endtime'\nimport { formatDuration } from '../lib/utils'\nimport { useObservabilityStore } from '../stores/use-observability-store'\nimport type { Trace, TraceGroup } from '../types/observability'\nimport { TraceItem } from './trace-item/trace-item'\nimport { TraceItemDetail } from './trace-item/trace-item-detail'\n\nexport const TraceTimeline: React.FC = memo(() => {\n const groupId = useObservabilityStore((state) => state.selectedTraceGroupId)\n if (!groupId) return null\n return <TraceTimelineComponent groupId={groupId} />\n})\nTraceTimeline.displayName = 'TraceTimeline'\n\ninterface TraceTimelineComponentProps {\n groupId: string\n}\nconst TraceTimelineComponent: React.FC<TraceTimelineComponentProps> = memo(({ groupId }) => {\n const streamItemArgs = useMemo(\n () => ({ streamName: 'motia-trace-group', groupId: 'default', id: groupId }),\n [groupId],\n )\n const { data: group } = useStreamItem<TraceGroup>(streamItemArgs)\n\n const streamGroupArgs = useMemo(() => ({ streamName: 'motia-trace', groupId }), [groupId])\n const { data } = useStreamGroup<Trace>(streamGroupArgs)\n\n const endTime = useGetEndTime(group)\n const [zoom, setZoom] = useState(1)\n const selectedTraceId = useObservabilityStore((state) => state.selectedTraceId)\n const selectTraceId = useObservabilityStore((state) => state.selectTraceId)\n\n const selectedTrace = useMemo(() => data?.find((trace) => trace.id === selectedTraceId), [data, selectedTraceId])\n\n const zoomMinus = useCallback(() => {\n if (zoom > 0.5) setZoom((prev) => prev - 0.1)\n }, [])\n\n const zoomPlus = useCallback(() => {\n setZoom((prev) => prev + 0.1)\n }, [])\n\n if (!group) return null\n\n return (\n <>\n <div className=\"flex flex-col flex-1 overflow-x-auto h-full relative\">\n <div className=\"flex flex-col items-center min-w-full sticky top-0\" style={{ width: `${zoom * 1000}px` }}>\n <div className=\"flex flex-1 w-full sticky top-0 bg-background z-10\">\n <div className=\"w-full min-h-[37px] h-[37px] min-w-[200px] max-w-[200px] flex items-center justify-center gap-2 sticky left-0 top-0 bg-card backdrop-blur-[4px] backdrop-filter\">\n <Button variant=\"icon\" size=\"sm\" className=\"px-2\" onClick={zoomMinus}>\n <Minus className=\"w-4 h-4 cursor-pointer\" />\n </Button>\n <span className=\"text-sm font-bold text-muted-foreground\">{Math.floor(zoom * 100)}%</span>\n <Button variant=\"icon\" size=\"sm\" className=\"px-2\" onClick={zoomPlus}>\n <Plus className=\"w-4 h-4 cursor-pointer\" />\n </Button>\n </div>\n <div className=\"flex justify-between font-mono p-2 w-full text-xs text-muted-foreground bg-card\">\n <span>{formatDuration(0)}</span>\n <span>{formatDuration(Math.floor((endTime - group.startTime) * 0.25))}</span>\n <span>{formatDuration(Math.floor((endTime - group.startTime) * 0.5))}</span>\n <span>{formatDuration(Math.floor((endTime - group.startTime) * 0.75))}</span>\n <span>{formatDuration(Math.floor(endTime - group.startTime))}</span>\n <div className=\"absolute bottom-[-4px] w-full flex justify-between\">\n <span className=\"w-[1px] h-full bg-blue-500\"></span>\n <span className=\"w-[1px] h-full bg-blue-500\"></span>\n <span className=\"w-[1px] h-full bg-blue-500\"></span>\n <span className=\"w-[1px] h-full bg-blue-500\"></span>\n <span className=\"w-[1px] h-full bg-blue-500\"></span>\n </div>\n </div>\n </div>\n\n <div className=\"flex flex-col w-full h-full\">\n {data?.map((trace) => (\n <TraceItem\n key={trace.id}\n traceId={trace.id}\n traceName={trace.name}\n traceStatus={trace.status}\n traceStartTime={trace.startTime}\n traceEndTime={trace.endTime}\n groupStartTime={group.startTime}\n groupEndTime={endTime}\n onExpand={selectTraceId}\n />\n ))}\n </div>\n </div>\n </div>\n {selectedTrace && <TraceItemDetail trace={selectedTrace} onClose={() => selectTraceId(undefined)} />}\n </>\n )\n})\nTraceTimelineComponent.displayName = 'TraceTimelineComponent'\n","import { useStreamGroup } from '@motiadev/stream-client-react'\nimport { useMemo } from 'react'\nimport { useObservabilityStore } from '../stores/use-observability-store'\nimport type { TraceGroup } from '../types/observability'\n\nexport const useFilteredTraceGroups = () => {\n const streamGroupArgs = useMemo(() => ({ streamName: 'motia-trace-group', groupId: 'default' }), [])\n const { data } = useStreamGroup<TraceGroup>(streamGroupArgs)\n\n const search = useObservabilityStore((state) => state.search)\n\n return useMemo(\n () =>\n data?.filter(\n (group) =>\n group.name.toLowerCase().includes(search.toLowerCase()) ||\n group.id.toLowerCase().includes(search.toLowerCase()),\n ),\n [data, search],\n )\n}\n","import { Badge, type BadgeProps } from '@motiadev/ui'\nimport type React from 'react'\nimport { memo } from 'react'\nimport type { TraceGroup } from '@/types/observability'\n\ntype Props = {\n status: TraceGroup['status']\n duration?: string\n}\n\nconst variantMap = {\n running: 'info',\n completed: 'success',\n failed: 'error',\n default: 'default',\n}\n\nexport const TraceStatusBadge: React.FC<Props> = memo(({ status, duration }) => (\n <Badge variant={variantMap[status] as BadgeProps['variant']}>\n {duration && status !== 'failed' ? duration : status}\n </Badge>\n))\n\nTraceStatusBadge.displayName = 'TraceStatusBadge'\n","import { cn } from '@motiadev/ui'\nimport { formatDistanceToNow } from 'date-fns'\nimport type React from 'react'\nimport { memo, useCallback, useMemo } from 'react'\nimport { formatDuration } from '../lib/utils'\nimport { useObservabilityStore } from '../stores/use-observability-store'\nimport { TraceStatusBadge } from './trace-status'\n\ninterface TraceGroupItemProps {\n groupId: string\n groupName: string\n groupStatus: 'running' | 'completed' | 'failed'\n groupStartTime: number\n groupEndTime: number | undefined\n totalSteps: number\n activeSteps: number\n isSelected: boolean\n}\n\nexport const TraceGroupItem: React.FC<TraceGroupItemProps> = memo(\n ({ groupId, groupName, groupStatus, groupStartTime, groupEndTime, totalSteps, activeSteps, isSelected }) => {\n const selectTraceGroupId = useObservabilityStore((state) => state.selectTraceGroupId)\n\n const duration = useMemo(\n () => (groupEndTime ? formatDuration(groupEndTime - groupStartTime) : undefined),\n [groupEndTime, groupStartTime],\n )\n\n const onSelect = useCallback(() => {\n selectTraceGroupId(groupId)\n }, [groupId, selectTraceGroupId])\n\n return (\n <button\n type=\"button\"\n data-testid={`trace-${groupId}`}\n key={groupId}\n className={cn(\n 'motia-trace-group cursor-pointer transition-colors w-full text-left',\n isSelected ? 'bg-muted-foreground/10' : 'hover:bg-muted/70',\n )}\n onClick={onSelect}\n >\n <div className=\"p-3 flex flex-col gap-1\">\n <div className=\"flex flex-row justify-between items-center gap-2\">\n <span className=\"font-semibold text-lg\">{groupName}</span>\n <TraceStatusBadge status={groupStatus} duration={duration} />\n </div>\n\n <div className=\"text-xs text-muted-foreground space-y-1\">\n <div className=\"flex justify-between\">\n <div data-testid=\"trace-id\" className=\"text-xs text-muted-foreground font-mono tracking-[1px]\">\n {groupId}\n </div>\n <span>{totalSteps} steps</span>\n </div>\n <div className=\"flex justify-between\">{formatDistanceToNow(groupStartTime)} ago</div>\n {activeSteps > 0 && <div className=\"text-blue-600\">{activeSteps} active</div>}\n </div>\n </div>\n </button>\n )\n },\n)\nTraceGroupItem.displayName = 'TraceGroupItem'\n","import type React from 'react'\nimport { memo, useEffect, useMemo } from 'react'\nimport { useFilteredTraceGroups } from '../hooks/use-filtered-trace-groups'\nimport { useObservabilityStore } from '../stores/use-observability-store'\nimport { TraceGroupItem } from './trace-group-item'\n\nexport const TracesGroups: React.FC = memo(() => {\n const groups = useFilteredTraceGroups()\n const selectedGroupId = useObservabilityStore((state) => state.selectedTraceGroupId)\n const selectTraceGroupId = useObservabilityStore((state) => state.selectTraceGroupId)\n\n const groupsLength = useMemo(() => groups?.length || 0, [groups])\n const lastRunningGroupId = useMemo(() => {\n if (!groups || groups.length === 0) return ''\n const lastGroup = groups[groups.length - 1]\n return lastGroup?.status === 'running' ? lastGroup.id : ''\n }, [groups])\n\n useEffect(() => {\n if (lastRunningGroupId && lastRunningGroupId !== selectedGroupId) {\n selectTraceGroupId(lastRunningGroupId)\n } else if (!lastRunningGroupId && !groupsLength && selectedGroupId) {\n selectTraceGroupId('')\n }\n }, [lastRunningGroupId, groupsLength])\n\n const reversedGroups = useMemo(() => [...groups].reverse(), [groups])\n\n if (!groups || groups.length === 0) {\n return null\n }\n\n return (\n <div className=\"overflow-auto\">\n {reversedGroups.map((group) => (\n <TraceGroupItem\n key={group.id}\n groupId={group.id}\n groupName={group.name}\n groupStatus={group.status}\n groupStartTime={group.startTime}\n groupEndTime={group.endTime}\n totalSteps={group.metadata.totalSteps}\n activeSteps={group.metadata.activeSteps}\n isSelected={selectedGroupId === group.id}\n />\n ))}\n </div>\n )\n})\nTracesGroups.displayName = 'TracesGroups'\n","import { memo } from 'react'\nimport { SearchBar } from './search-bar'\nimport { TraceEmptyState } from './trace-empty-state'\nimport { TraceTimeline } from './trace-timeline'\nimport { TracesGroups } from './traces-groups'\n\nexport const ObservabilityPage = memo(() => {\n return (\n <div className=\"grid grid-rows-[auto_1fr] h-full\">\n <SearchBar />\n\n <div className=\"grid grid-cols-[300px_1fr] overflow-hidden\">\n <div className=\"w-[300px] border-r border-border overflow-auto h-full\" data-testid=\"traces-container\">\n <TracesGroups />\n </div>\n\n <div className=\"overflow-auto\" data-testid=\"trace-details\">\n <TraceTimeline />\n <TraceEmptyState />\n </div>\n </div>\n </div>\n )\n})\nObservabilityPage.displayName = 'ObservabilityPage'\n","import { GanttChartSquare } from 'lucide-react'\nimport { memo } from 'react'\n\nexport const ObservabilityTabLabel = memo(() => (\n <div data-testid=\"observability-link\">\n <GanttChartSquare aria-hidden=\"true\" />\n <span>Tracing</span>\n </div>\n))\nObservabilityTabLabel.displayName = 'ObservabilityTabLabel'\n"],"mappings":"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"}
package/dist/plugin.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"plugin.js","names":["error: unknown"],"sources":["../src/api.ts","../src/plugin.ts"],"sourcesContent":["import type { ApiResponse, MotiaPluginContext } from '@motiadev/core'\n\nexport const api = ({ tracerFactory, registerApi }: MotiaPluginContext): void => {\n // POST /__motia/trace/clear - Clear all traces\n registerApi(\n {\n method: 'POST',\n path: '/__motia/trace/clear',\n },\n async (): Promise<ApiResponse> => {\n try {\n await tracerFactory.clear()\n return {\n status: 200,\n body: { message: 'Traces cleared' },\n }\n } catch (error: unknown) {\n return {\n status: 500,\n body: { error: error instanceof Error ? error.message : 'Unknown error' },\n }\n }\n },\n )\n}\n","import type { MotiaPlugin, MotiaPluginContext } from '@motiadev/core'\nimport { api } from './api'\n\nexport default function plugin(motia: MotiaPluginContext): MotiaPlugin {\n api(motia)\n\n return {\n workbench: [\n {\n packageName: '@motiadev/plugin-observability',\n cssImports: ['@motiadev/plugin-observability/dist/index.css'],\n label: 'Tracing',\n position: 'bottom',\n componentName: 'ObservabilityPage',\n labelIcon: 'gantt-chart',\n },\n ],\n }\n}\n"],"mappings":";AAEA,MAAa,OAAO,EAAE,eAAe,kBAA4C;AAE/E,aACE;EACE,QAAQ;EACR,MAAM;EACP,EACD,YAAkC;AAChC,MAAI;AACF,SAAM,cAAc,OAAO;AAC3B,UAAO;IACL,QAAQ;IACR,MAAM,EAAE,SAAS,kBAAkB;IACpC;WACMA,OAAgB;AACvB,UAAO;IACL,QAAQ;IACR,MAAM,EAAE,OAAO,iBAAiB,QAAQ,MAAM,UAAU,iBAAiB;IAC1E;;GAGN;;;;;ACpBH,SAAwB,OAAO,OAAwC;AACrE,KAAI,MAAM;AAEV,QAAO,EACL,WAAW,CACT;EACE,aAAa;EACb,YAAY,CAAC,gDAAgD;EAC7D,OAAO;EACP,UAAU;EACV,eAAe;EACf,WAAW;EACZ,CACF,EACF"}