@memberjunction/ng-core-entity-forms 5.11.0 → 5.13.0

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 (102) hide show
  1. package/dist/lib/custom/AIAgents/FlowAgentType/flow-agent-form-section.component.js +2 -2
  2. package/dist/lib/custom/AIAgents/add-action-dialog.component.js +2 -2
  3. package/dist/lib/custom/AIAgents/agent-prompt-advanced-settings-dialog.component.js +2 -2
  4. package/dist/lib/custom/AIAgents/ai-agent-form.component.d.ts +8 -0
  5. package/dist/lib/custom/AIAgents/ai-agent-form.component.d.ts.map +1 -1
  6. package/dist/lib/custom/AIAgents/ai-agent-form.component.js +199 -139
  7. package/dist/lib/custom/AIAgents/ai-agent-form.component.js.map +1 -1
  8. package/dist/lib/custom/AIAgents/create-prompt-dialog.component.js +2 -2
  9. package/dist/lib/custom/AIAgents/create-sub-agent-dialog.component.js +2 -2
  10. package/dist/lib/custom/AIAgents/new-agent-dialog.component.js +2 -2
  11. package/dist/lib/custom/AIAgents/prompt-selector-dialog.component.js +6 -6
  12. package/dist/lib/custom/AIAgents/prompt-selector-dialog.component.js.map +1 -1
  13. package/dist/lib/custom/AIAgents/sub-agent-advanced-settings-dialog.component.js +2 -2
  14. package/dist/lib/custom/AIAgents/sub-agent-selector-dialog.component.js +6 -6
  15. package/dist/lib/custom/AIAgents/sub-agent-selector-dialog.component.js.map +1 -1
  16. package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.js +3 -3
  17. package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.js.map +1 -1
  18. package/dist/lib/custom/AIPromptRuns/chat-message-viewer.component.js +2 -2
  19. package/dist/lib/custom/AIPrompts/ai-prompt-form.component.js +4 -4
  20. package/dist/lib/custom/AIPrompts/ai-prompt-form.component.js.map +1 -1
  21. package/dist/lib/custom/AIPrompts/template-selector-dialog.component.js +2 -2
  22. package/dist/lib/custom/Actions/action-execution-log-form.component.js +5 -5
  23. package/dist/lib/custom/Actions/action-execution-log-form.component.js.map +1 -1
  24. package/dist/lib/custom/Actions/action-form.component.js +22 -22
  25. package/dist/lib/custom/Actions/action-form.component.js.map +1 -1
  26. package/dist/lib/custom/Entities/entity-form.component.d.ts +11 -0
  27. package/dist/lib/custom/Entities/entity-form.component.d.ts.map +1 -1
  28. package/dist/lib/custom/Entities/entity-form.component.js +244 -217
  29. package/dist/lib/custom/Entities/entity-form.component.js.map +1 -1
  30. package/dist/lib/custom/EntityActions/entityaction.form.component.js +3 -3
  31. package/dist/lib/custom/EntityActions/entityaction.form.component.js.map +1 -1
  32. package/dist/lib/custom/Lists/list-form.component.js +8 -8
  33. package/dist/lib/custom/Lists/list-form.component.js.map +1 -1
  34. package/dist/lib/custom/Queries/query-category-dialog.component.js +3 -3
  35. package/dist/lib/custom/Queries/query-category-dialog.component.js.map +1 -1
  36. package/dist/lib/custom/Queries/query-form.component.js +2 -2
  37. package/dist/lib/custom/Queries/query-run-dialog.component.js +3 -3
  38. package/dist/lib/custom/Queries/query-run-dialog.component.js.map +1 -1
  39. package/dist/lib/custom/Templates/template-param-dialog.component.js +107 -111
  40. package/dist/lib/custom/Templates/template-param-dialog.component.js.map +1 -1
  41. package/dist/lib/custom/Templates/template-params-grid.component.js +2 -2
  42. package/dist/lib/custom/Templates/templates-form.component.js +40 -43
  43. package/dist/lib/custom/Templates/templates-form.component.js.map +1 -1
  44. package/dist/lib/custom/Tests/entity-link-pill.component.js +2 -2
  45. package/dist/lib/custom/Tests/entity-link-pill.component.js.map +1 -1
  46. package/dist/lib/custom/Tests/test-form.component.js +2 -2
  47. package/dist/lib/custom/Tests/test-rubric-form.component.js +2 -2
  48. package/dist/lib/custom/Tests/test-rubric-form.component.js.map +1 -1
  49. package/dist/lib/custom/Tests/test-run-feedback-form.component.js +2 -2
  50. package/dist/lib/custom/Tests/test-run-feedback-form.component.js.map +1 -1
  51. package/dist/lib/custom/Tests/test-run-form.component.js +2 -2
  52. package/dist/lib/custom/Tests/test-suite-form.component.js +2 -2
  53. package/dist/lib/custom/Tests/test-suite-run-form.component.js +2 -2
  54. package/dist/lib/custom/ai-agent-run/ai-agent-run-analytics.component.js +2 -2
  55. package/dist/lib/custom/ai-agent-run/ai-agent-run-step-detail.component.js +2 -2
  56. package/dist/lib/custom/ai-agent-run/ai-agent-run-step-node.component.js +2 -2
  57. package/dist/lib/custom/ai-agent-run/ai-agent-run-timeline.component.js +2 -2
  58. package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.d.ts +1 -0
  59. package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.d.ts.map +1 -1
  60. package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.js +28 -18
  61. package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.js.map +1 -1
  62. package/dist/lib/custom/ai-agent-run/ai-agent-run.component.js +2 -2
  63. package/dist/lib/custom/custom-forms.module.d.ts +2 -1
  64. package/dist/lib/custom/custom-forms.module.d.ts.map +1 -1
  65. package/dist/lib/custom/custom-forms.module.js +7 -3
  66. package/dist/lib/custom/custom-forms.module.js.map +1 -1
  67. package/dist/lib/custom/shared/entity-selector-dialog.component.js +2 -2
  68. package/dist/lib/custom/shared/entity-selector-dialog.component.js.map +1 -1
  69. package/dist/lib/generated/Entities/MJAIAgent/mjaiagent.form.component.js +155 -153
  70. package/dist/lib/generated/Entities/MJAIAgent/mjaiagent.form.component.js.map +1 -1
  71. package/dist/lib/generated/Entities/MJAIAgentCategory/mjaiagentcategory.form.component.d.ts +10 -0
  72. package/dist/lib/generated/Entities/MJAIAgentCategory/mjaiagentcategory.form.component.d.ts.map +1 -0
  73. package/dist/lib/generated/Entities/MJAIAgentCategory/mjaiagentcategory.form.component.js +105 -0
  74. package/dist/lib/generated/Entities/MJAIAgentCategory/mjaiagentcategory.form.component.js.map +1 -0
  75. package/dist/lib/generated/Entities/MJAIAgentRequest/mjaiagentrequest.form.component.d.ts.map +1 -1
  76. package/dist/lib/generated/Entities/MJAIAgentRequest/mjaiagentrequest.form.component.js +31 -7
  77. package/dist/lib/generated/Entities/MJAIAgentRequest/mjaiagentrequest.form.component.js.map +1 -1
  78. package/dist/lib/generated/Entities/MJAIAgentRequestType/mjaiagentrequesttype.form.component.d.ts +10 -0
  79. package/dist/lib/generated/Entities/MJAIAgentRequestType/mjaiagentrequesttype.form.component.d.ts.map +1 -0
  80. package/dist/lib/generated/Entities/MJAIAgentRequestType/mjaiagentrequesttype.form.component.js +89 -0
  81. package/dist/lib/generated/Entities/MJAIAgentRequestType/mjaiagentrequesttype.form.component.js.map +1 -0
  82. package/dist/lib/generated/Entities/MJAIAgentRun/mjaiagentrun.form.component.d.ts.map +1 -1
  83. package/dist/lib/generated/Entities/MJAIAgentRun/mjaiagentrun.form.component.js +50 -14
  84. package/dist/lib/generated/Entities/MJAIAgentRun/mjaiagentrun.form.component.js.map +1 -1
  85. package/dist/lib/generated/Entities/MJAIAgentRunStep/mjaiagentrunstep.form.component.d.ts.map +1 -1
  86. package/dist/lib/generated/Entities/MJAIAgentRunStep/mjaiagentrunstep.form.component.js +22 -4
  87. package/dist/lib/generated/Entities/MJAIAgentRunStep/mjaiagentrunstep.form.component.js.map +1 -1
  88. package/dist/lib/generated/Entities/MJAIAgentType/mjaiagenttype.form.component.js +13 -11
  89. package/dist/lib/generated/Entities/MJAIAgentType/mjaiagenttype.form.component.js.map +1 -1
  90. package/dist/lib/generated/Entities/MJAction/mjaction.form.component.js +83 -81
  91. package/dist/lib/generated/Entities/MJAction/mjaction.form.component.js.map +1 -1
  92. package/dist/lib/generated/Entities/MJIntegration/mjintegration.form.component.js +35 -33
  93. package/dist/lib/generated/Entities/MJIntegration/mjintegration.form.component.js.map +1 -1
  94. package/dist/lib/generated/Entities/MJIntegrationObject/mjintegrationobject.form.component.js +25 -19
  95. package/dist/lib/generated/Entities/MJIntegrationObject/mjintegrationobject.form.component.js.map +1 -1
  96. package/dist/lib/generated/generated-forms.module.d.ts +289 -287
  97. package/dist/lib/generated/generated-forms.module.d.ts.map +1 -1
  98. package/dist/lib/generated/generated-forms.module.js +102 -96
  99. package/dist/lib/generated/generated-forms.module.js.map +1 -1
  100. package/dist/lib/shared/components/template-editor.component.js +85 -89
  101. package/dist/lib/shared/components/template-editor.component.js.map +1 -1
  102. package/package.json +31 -31
package/dist/lib/custom/AIPromptRuns/chat-message-viewer.component.js CHANGED
@@ -514,11 +514,11 @@ export class ChatMessageViewerComponent {
514
514
  i0.ɵɵstyleProp("color", ctx.getRoleColor("assistant"));
515
515
  i0.ɵɵadvance(3);
516
516
  i0.ɵɵconditional(ctx.displayMessages.length === 0 ? 18 : 19);
517
- } }, dependencies: [i1.CheckboxControlValueAccessor, i1.NgControlStatus, i1.NgModel, i2.CheckBoxDirective, i3.CodeEditorComponent], styles: [".chat-message-viewer[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden; \n\n}\n\n\n\n\n.filter-controls[_ngcontent-%COMP%] {\n display: flex;\n gap: 1.5rem;\n align-items: center;\n padding: 0.75rem;\n background-color: #f9fafb;\n border-radius: 8px;\n border: 1px solid #e5e7eb;\n margin-bottom: 1rem;\n flex-shrink: 0; \n\n}\n\n.filter-checkbox[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n}\n\n.filter-checkbox[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%] {\n margin-right: 0.5rem;\n}\n\n.filter-label[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.875rem;\n font-weight: 500;\n}\n\n.filter-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n}\n\n\n\n.messages-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n padding: 0.5rem;\n padding-bottom: 1rem; \n\n max-height: 800px;\n}\n\n.empty-state[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 3rem;\n color: #9ca3af;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 3rem;\n margin-bottom: 1rem;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 1rem;\n margin: 0;\n}\n\n\n\n.message-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e5e7eb;\n border-radius: 8px;\n margin-bottom: 0.75rem;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.message-card[_ngcontent-%COMP%]:hover {\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n}\n\n.message-card[_ngcontent-%COMP%]:last-child {\n margin-bottom: 2rem; \n\n}\n\n.message-card[data-role=\"system\"][_ngcontent-%COMP%] {\n border-left: 3px solid #2563eb;\n}\n\n.message-card[data-role=\"user\"][_ngcontent-%COMP%] {\n border-left: 3px solid #059669;\n}\n\n.message-card[data-role=\"assistant\"][_ngcontent-%COMP%] {\n border-left: 3px solid #7c3aed;\n}\n\n\n\n.message-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.75rem 1rem;\n background-color: #f9fafb;\n cursor: pointer;\n user-select: none;\n}\n\n.message-header[_ngcontent-%COMP%]:hover {\n background-color: #f3f4f6;\n}\n\n.message-role[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.sequence-number[_ngcontent-%COMP%] {\n color: #6c757d;\n font-weight: 500;\n font-size: 0.85rem;\n margin-right: 4px;\n}\n\n.message-role[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n}\n\n.content-stats[_ngcontent-%COMP%] {\n margin-left: auto;\n display: flex;\n align-items: center;\n gap: 6px;\n color: #6c757d;\n font-size: 0.8rem;\n font-weight: 400;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n white-space: nowrap;\n}\n\n.stat-divider[_ngcontent-%COMP%] {\n color: #cbd5e0;\n}\n\n.role-label[_ngcontent-%COMP%] {\n font-weight: 600;\n font-size: 0.875rem;\n text-transform: uppercase;\n letter-spacing: 0.025em;\n}\n\n.message-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.action-button[_ngcontent-%COMP%], \n.toggle-button[_ngcontent-%COMP%] {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: #6b7280;\n transition: color 0.2s ease;\n}\n\n.action-button[_ngcontent-%COMP%]:hover, \n.toggle-button[_ngcontent-%COMP%]:hover {\n color: #374151;\n}\n\n.action-button[_ngcontent-%COMP%] {\n padding: 0.25rem 0.5rem;\n}\n\n.action-button[_ngcontent-%COMP%]:hover {\n color: #2563eb;\n}\n\n\n\n.message-content[_ngcontent-%COMP%] {\n padding: 1rem;\n}\n\n.content-blocks[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n margin-bottom: 1rem;\n}\n\n.content-block-indicator[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.25rem 0.75rem;\n background-color: #eff6ff;\n border: 1px solid #dbeafe;\n border-radius: 9999px;\n font-size: 0.75rem;\n color: #1e40af;\n}\n\n.content-block-indicator[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n}\n\n\n\n.text-content[_ngcontent-%COMP%], \n.json-content[_ngcontent-%COMP%] {\n border: 1px solid #e5e7eb;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.json-content[_ngcontent-%COMP%] {\n background-color: #f9fafb;\n}\n\n.text-content[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%], \n.json-content[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n display: block;\n min-height: 100px;\n}\n\n\n\n.multi-part-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.content-part[_ngcontent-%COMP%] {\n border: 1px solid #e5e7eb;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.content-part-label[_ngcontent-%COMP%] {\n background-color: #f3f4f6;\n padding: 0.5rem 1rem;\n font-size: 0.875rem;\n font-weight: 500;\n color: #374151;\n border-bottom: 1px solid #e5e7eb;\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n user-select: none;\n transition: background-color 0.2s;\n}\n\n.content-part-label[_ngcontent-%COMP%]:hover {\n background-color: #e5e7eb;\n}\n\n.content-part-label-content[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.content-part-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.75rem;\n color: #6b7280;\n}\n\n.content-part-toggle[_ngcontent-%COMP%] {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: #6b7280;\n transition: color 0.2s;\n}\n\n.content-part-toggle[_ngcontent-%COMP%]:hover {\n color: #374151;\n}\n\n.content-part.collapsed[_ngcontent-%COMP%] .content-part-label[_ngcontent-%COMP%] {\n border-bottom: none;\n}\n\n.content-part-editor[_ngcontent-%COMP%] {\n background-color: #f9fafb;\n}\n\n.content-part-editor[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n display: block;\n min-height: 80px;\n}\n\n\n\n.chat-message-viewer[_ngcontent-%COMP%] .cm-editor[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n}\n\n.chat-message-viewer[_ngcontent-%COMP%] .cm-editor.cm-focused[_ngcontent-%COMP%] {\n outline: none;\n}\n\n\n\n@media (max-width: 640px) {\n .filter-controls[_ngcontent-%COMP%] {\n flex-wrap: wrap;\n gap: 0.75rem;\n }\n \n .filter-checkbox[_ngcontent-%COMP%] {\n min-width: calc(50% - 0.375rem);\n }\n}"] }); }
517
+ } }, dependencies: [i1.CheckboxControlValueAccessor, i1.NgControlStatus, i1.NgModel, i2.CheckBoxDirective, i3.CodeEditorComponent], styles: [".chat-message-viewer[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden; \n\n}\n\n\n\n\n.filter-controls[_ngcontent-%COMP%] {\n display: flex;\n gap: 1.5rem;\n align-items: center;\n padding: 0.75rem;\n background-color: var(--mj-bg-surface-sunken);\n border-radius: 8px;\n border: 1px solid var(--mj-border-default);\n margin-bottom: 1rem;\n flex-shrink: 0; \n\n}\n\n.filter-checkbox[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n}\n\n.filter-checkbox[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%] {\n margin-right: 0.5rem;\n}\n\n.filter-label[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.875rem;\n font-weight: 500;\n}\n\n.filter-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n}\n\n\n\n.messages-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n padding: 0.5rem;\n padding-bottom: 1rem; \n\n max-height: 800px;\n}\n\n.empty-state[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 3rem;\n color: var(--mj-text-muted);\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 3rem;\n margin-bottom: 1rem;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 1rem;\n margin: 0;\n}\n\n\n\n.message-card[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-card);\n border: 1px solid var(--mj-border-default);\n border-radius: 8px;\n margin-bottom: 0.75rem;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.message-card[_ngcontent-%COMP%]:hover {\n box-shadow: var(--mj-shadow-sm);\n}\n\n.message-card[_ngcontent-%COMP%]:last-child {\n margin-bottom: 2rem; \n\n}\n\n.message-card[data-role=\"system\"][_ngcontent-%COMP%] {\n border-left: 3px solid var(--mj-brand-primary);\n}\n\n.message-card[data-role=\"user\"][_ngcontent-%COMP%] {\n border-left: 3px solid var(--mj-status-success);\n}\n\n.message-card[data-role=\"assistant\"][_ngcontent-%COMP%] {\n border-left: 3px solid var(--mj-brand-primary);\n}\n\n\n\n.message-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.75rem 1rem;\n background-color: var(--mj-bg-surface-sunken);\n cursor: pointer;\n user-select: none;\n}\n\n.message-header[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.message-role[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.sequence-number[_ngcontent-%COMP%] {\n color: var(--mj-text-secondary);\n font-weight: 500;\n font-size: 0.85rem;\n margin-right: 4px;\n}\n\n.message-role[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n}\n\n.content-stats[_ngcontent-%COMP%] {\n margin-left: auto;\n display: flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-text-secondary);\n font-size: 0.8rem;\n font-weight: 400;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n white-space: nowrap;\n}\n\n.stat-divider[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n}\n\n.role-label[_ngcontent-%COMP%] {\n font-weight: 600;\n font-size: 0.875rem;\n text-transform: uppercase;\n letter-spacing: 0.025em;\n}\n\n.message-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.action-button[_ngcontent-%COMP%], \n.toggle-button[_ngcontent-%COMP%] {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: var(--mj-text-secondary);\n transition: color 0.2s ease;\n}\n\n.action-button[_ngcontent-%COMP%]:hover, \n.toggle-button[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.action-button[_ngcontent-%COMP%] {\n padding: 0.25rem 0.5rem;\n}\n\n.action-button[_ngcontent-%COMP%]:hover {\n color: var(--mj-brand-primary);\n}\n\n\n\n.message-content[_ngcontent-%COMP%] {\n padding: 1rem;\n}\n\n.content-blocks[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n margin-bottom: 1rem;\n}\n\n.content-block-indicator[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.25rem 0.75rem;\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n border-radius: 9999px;\n font-size: 0.75rem;\n color: var(--mj-brand-primary-hover);\n}\n\n.content-block-indicator[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n}\n\n\n\n.text-content[_ngcontent-%COMP%], \n.json-content[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: 6px;\n overflow: hidden;\n}\n\n.json-content[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.text-content[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%], \n.json-content[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n display: block;\n min-height: 100px;\n}\n\n\n\n.multi-part-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.content-part[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: 6px;\n overflow: hidden;\n}\n\n.content-part-label[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface-sunken);\n padding: 0.5rem 1rem;\n font-size: 0.875rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n border-bottom: 1px solid var(--mj-border-default);\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n user-select: none;\n transition: background-color 0.2s;\n}\n\n.content-part-label[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-border-default);\n}\n\n.content-part-label-content[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.content-part-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.75rem;\n color: var(--mj-text-secondary);\n}\n\n.content-part-toggle[_ngcontent-%COMP%] {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: var(--mj-text-secondary);\n transition: color 0.2s;\n}\n\n.content-part-toggle[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.content-part.collapsed[_ngcontent-%COMP%] .content-part-label[_ngcontent-%COMP%] {\n border-bottom: none;\n}\n\n.content-part-editor[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.content-part-editor[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n display: block;\n min-height: 80px;\n}\n\n\n\n.chat-message-viewer[_ngcontent-%COMP%] .cm-editor[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n}\n\n.chat-message-viewer[_ngcontent-%COMP%] .cm-editor.cm-focused[_ngcontent-%COMP%] {\n outline: none;\n}\n\n\n\n@media (max-width: 640px) {\n .filter-controls[_ngcontent-%COMP%] {\n flex-wrap: wrap;\n gap: 0.75rem;\n }\n \n .filter-checkbox[_ngcontent-%COMP%] {\n min-width: calc(50% - 0.375rem);\n }\n}"] }); }
518
518
  }
519
519
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ChatMessageViewerComponent, [{
520
520
  type: Component,
521
- args: [{ standalone: false, selector: 'mj-chat-message-viewer', template: "<div class=\"chat-message-viewer\">\n <!-- Filter Controls -->\n <div class=\"filter-controls\">\n <label class=\"filter-checkbox\">\n <input type=\"checkbox\" \n [(ngModel)]=\"showSystem\" \n (ngModelChange)=\"onFilterChange()\"\n kendoCheckBox />\n <span class=\"filter-label\">\n <i class=\"fa-solid fa-cog\" [style.color]=\"getRoleColor('system')\"></i>\n System\n </span>\n </label>\n \n <label class=\"filter-checkbox\">\n <input type=\"checkbox\" \n [(ngModel)]=\"showUser\" \n (ngModelChange)=\"onFilterChange()\"\n kendoCheckBox />\n <span class=\"filter-label\">\n <i class=\"fa-solid fa-user\" [style.color]=\"getRoleColor('user')\"></i>\n User\n </span>\n </label>\n \n <label class=\"filter-checkbox\">\n <input type=\"checkbox\" \n [(ngModel)]=\"showAssistant\" \n (ngModelChange)=\"onFilterChange()\"\n kendoCheckBox />\n <span class=\"filter-label\">\n <i class=\"fa-solid fa-robot\" [style.color]=\"getRoleColor('assistant')\"></i>\n Assistant\n </span>\n </label>\n </div>\n \n <!-- Messages List -->\n <div class=\"messages-container\">\n @if (displayMessages.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-comments\"></i>\n <p>No messages to display</p>\n </div>\n } @else {\n @for (item of displayMessages; track $index; let i = $index) {\n @if (item.visible) {\n <div class=\"message-card\" [attr.data-role]=\"item.message.role\">\n <!-- Message Header -->\n <div class=\"message-header\" (click)=\"toggleMessage(i)\">\n <div class=\"message-role\">\n <span class=\"sequence-number\">#{{ item.sequenceNumber }}</span>\n <i [class]=\"'fa-solid ' + getRoleIcon(item.message.role)\" \n [style.color]=\"getRoleColor(item.message.role)\"></i>\n <span class=\"role-label\">{{ getRoleLabel(item.message.role) }}</span>\n <span class=\"content-stats\">\n <span class=\"stat-item\">{{ getContentStats(item.message.content).chars.toLocaleString() }} chars</span>\n <span class=\"stat-divider\">\u2022</span>\n <span class=\"stat-item\">~{{ getContentStats(item.message.content).approxTokens.toLocaleString() }} tokens</span>\n </span>\n </div>\n <div class=\"message-actions\">\n <button class=\"action-button\" type=\"button\" \n (click)=\"copyMessageContent(item.message.content); $event.stopPropagation()\"\n title=\"Copy message content\">\n <i class=\"fa-solid fa-copy\"></i>\n </button>\n <button class=\"toggle-button\" type=\"button\">\n <i [class]=\"item.expanded ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n </button>\n </div>\n </div>\n \n <!-- Message Content -->\n @if (item.expanded) {\n <div class=\"message-content\">\n <!-- Main content -->\n @if (isStringContent(item.message.content)) {\n <div class=\"text-content\">\n <mj-code-editor \n [value]=\"getContentString(item.message.content)\"\n [readonly]=\"true\"\n [language]=\"getContentLanguage(item.message.content)\"\n style=\"max-height: 600px; overflow-y: auto;\">\n </mj-code-editor>\n </div>\n } @else {\n <!-- Non-string content with multiple parts -->\n <div class=\"multi-part-content\">\n @for (part of getContentParts(item.message.content, i); track part.id) {\n <div class=\"content-part\" [class.collapsed]=\"!part.expanded\">\n <div class=\"content-part-label\" (click)=\"toggleContentPart(part.id)\">\n <div class=\"content-part-label-content\">\n <i class=\"fa-solid fa-tag\"></i>\n {{ part.key }}\n </div>\n <button class=\"content-part-toggle\" type=\"button\">\n <i [class]=\"part.expanded ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n </button>\n </div>\n @if (part.expanded) {\n <div class=\"content-part-editor\">\n <mj-code-editor \n [value]=\"part.value\"\n [readonly]=\"true\"\n [language]=\"part.language\"\n style=\"max-height: 400px; overflow-y: auto;\">\n </mj-code-editor>\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n }\n }\n }\n </div>\n</div>", styles: [".chat-message-viewer {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden; /* Prevent overflow from the parent */\n}\n\n\n/* Filter Controls */\n.filter-controls {\n display: flex;\n gap: 1.5rem;\n align-items: center;\n padding: 0.75rem;\n background-color: #f9fafb;\n border-radius: 8px;\n border: 1px solid #e5e7eb;\n margin-bottom: 1rem;\n flex-shrink: 0; /* Prevent filter from shrinking */\n}\n\n.filter-checkbox {\n display: flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n}\n\n.filter-checkbox input[type=\"checkbox\"] {\n margin-right: 0.5rem;\n}\n\n.filter-label {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.875rem;\n font-weight: 500;\n}\n\n.filter-label i {\n font-size: 1rem;\n}\n\n/* Messages Container */\n.messages-container {\n flex: 1;\n overflow-y: auto;\n padding: 0.5rem;\n padding-bottom: 1rem; /* Small padding at bottom */\n max-height: 800px;\n}\n\n.empty-state {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 3rem;\n color: #9ca3af;\n}\n\n.empty-state i {\n font-size: 3rem;\n margin-bottom: 1rem;\n}\n\n.empty-state p {\n font-size: 1rem;\n margin: 0;\n}\n\n/* Message Card */\n.message-card {\n background: white;\n border: 1px solid #e5e7eb;\n border-radius: 8px;\n margin-bottom: 0.75rem;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.message-card:hover {\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);\n}\n\n.message-card:last-child {\n margin-bottom: 2rem; /* Extra margin on last card to ensure it's fully visible */\n}\n\n.message-card[data-role=\"system\"] {\n border-left: 3px solid #2563eb;\n}\n\n.message-card[data-role=\"user\"] {\n border-left: 3px solid #059669;\n}\n\n.message-card[data-role=\"assistant\"] {\n border-left: 3px solid #7c3aed;\n}\n\n/* Message Header */\n.message-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.75rem 1rem;\n background-color: #f9fafb;\n cursor: pointer;\n user-select: none;\n}\n\n.message-header:hover {\n background-color: #f3f4f6;\n}\n\n.message-role {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.sequence-number {\n color: #6c757d;\n font-weight: 500;\n font-size: 0.85rem;\n margin-right: 4px;\n}\n\n.message-role i {\n font-size: 1.125rem;\n}\n\n.content-stats {\n margin-left: auto;\n display: flex;\n align-items: center;\n gap: 6px;\n color: #6c757d;\n font-size: 0.8rem;\n font-weight: 400;\n}\n\n.stat-item {\n white-space: nowrap;\n}\n\n.stat-divider {\n color: #cbd5e0;\n}\n\n.role-label {\n font-weight: 600;\n font-size: 0.875rem;\n text-transform: uppercase;\n letter-spacing: 0.025em;\n}\n\n.message-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.action-button,\n.toggle-button {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: #6b7280;\n transition: color 0.2s ease;\n}\n\n.action-button:hover,\n.toggle-button:hover {\n color: #374151;\n}\n\n.action-button {\n padding: 0.25rem 0.5rem;\n}\n\n.action-button:hover {\n color: #2563eb;\n}\n\n/* Message Content */\n.message-content {\n padding: 1rem;\n}\n\n.content-blocks {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n margin-bottom: 1rem;\n}\n\n.content-block-indicator {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.25rem 0.75rem;\n background-color: #eff6ff;\n border: 1px solid #dbeafe;\n border-radius: 9999px;\n font-size: 0.75rem;\n color: #1e40af;\n}\n\n.content-block-indicator i {\n font-size: 0.875rem;\n}\n\n/* Text Content */\n.text-content,\n.json-content {\n border: 1px solid #e5e7eb;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.json-content {\n background-color: #f9fafb;\n}\n\n.text-content mj-code-editor,\n.json-content mj-code-editor {\n display: block;\n min-height: 100px;\n}\n\n/* Multi-part Content */\n.multi-part-content {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.content-part {\n border: 1px solid #e5e7eb;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.content-part-label {\n background-color: #f3f4f6;\n padding: 0.5rem 1rem;\n font-size: 0.875rem;\n font-weight: 500;\n color: #374151;\n border-bottom: 1px solid #e5e7eb;\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n user-select: none;\n transition: background-color 0.2s;\n}\n\n.content-part-label:hover {\n background-color: #e5e7eb;\n}\n\n.content-part-label-content {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.content-part-label i {\n font-size: 0.75rem;\n color: #6b7280;\n}\n\n.content-part-toggle {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: #6b7280;\n transition: color 0.2s;\n}\n\n.content-part-toggle:hover {\n color: #374151;\n}\n\n.content-part.collapsed .content-part-label {\n border-bottom: none;\n}\n\n.content-part-editor {\n background-color: #f9fafb;\n}\n\n.content-part-editor mj-code-editor {\n display: block;\n min-height: 80px;\n}\n\n/* CodeMirror Overrides for this component */\n.chat-message-viewer .cm-editor {\n font-size: 0.875rem;\n}\n\n.chat-message-viewer .cm-editor.cm-focused {\n outline: none;\n}\n\n/* Responsive adjustments */\n@media (max-width: 640px) {\n .filter-controls {\n flex-wrap: wrap;\n gap: 0.75rem;\n }\n \n .filter-checkbox {\n min-width: calc(50% - 0.375rem);\n }\n}"] }]
521
+ args: [{ standalone: false, selector: 'mj-chat-message-viewer', template: "<div class=\"chat-message-viewer\">\n <!-- Filter Controls -->\n <div class=\"filter-controls\">\n <label class=\"filter-checkbox\">\n <input type=\"checkbox\" \n [(ngModel)]=\"showSystem\" \n (ngModelChange)=\"onFilterChange()\"\n kendoCheckBox />\n <span class=\"filter-label\">\n <i class=\"fa-solid fa-cog\" [style.color]=\"getRoleColor('system')\"></i>\n System\n </span>\n </label>\n \n <label class=\"filter-checkbox\">\n <input type=\"checkbox\" \n [(ngModel)]=\"showUser\" \n (ngModelChange)=\"onFilterChange()\"\n kendoCheckBox />\n <span class=\"filter-label\">\n <i class=\"fa-solid fa-user\" [style.color]=\"getRoleColor('user')\"></i>\n User\n </span>\n </label>\n \n <label class=\"filter-checkbox\">\n <input type=\"checkbox\" \n [(ngModel)]=\"showAssistant\" \n (ngModelChange)=\"onFilterChange()\"\n kendoCheckBox />\n <span class=\"filter-label\">\n <i class=\"fa-solid fa-robot\" [style.color]=\"getRoleColor('assistant')\"></i>\n Assistant\n </span>\n </label>\n </div>\n \n <!-- Messages List -->\n <div class=\"messages-container\">\n @if (displayMessages.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-comments\"></i>\n <p>No messages to display</p>\n </div>\n } @else {\n @for (item of displayMessages; track $index; let i = $index) {\n @if (item.visible) {\n <div class=\"message-card\" [attr.data-role]=\"item.message.role\">\n <!-- Message Header -->\n <div class=\"message-header\" (click)=\"toggleMessage(i)\">\n <div class=\"message-role\">\n <span class=\"sequence-number\">#{{ item.sequenceNumber }}</span>\n <i [class]=\"'fa-solid ' + getRoleIcon(item.message.role)\" \n [style.color]=\"getRoleColor(item.message.role)\"></i>\n <span class=\"role-label\">{{ getRoleLabel(item.message.role) }}</span>\n <span class=\"content-stats\">\n <span class=\"stat-item\">{{ getContentStats(item.message.content).chars.toLocaleString() }} chars</span>\n <span class=\"stat-divider\">\u2022</span>\n <span class=\"stat-item\">~{{ getContentStats(item.message.content).approxTokens.toLocaleString() }} tokens</span>\n </span>\n </div>\n <div class=\"message-actions\">\n <button class=\"action-button\" type=\"button\" \n (click)=\"copyMessageContent(item.message.content); $event.stopPropagation()\"\n title=\"Copy message content\">\n <i class=\"fa-solid fa-copy\"></i>\n </button>\n <button class=\"toggle-button\" type=\"button\">\n <i [class]=\"item.expanded ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n </button>\n </div>\n </div>\n \n <!-- Message Content -->\n @if (item.expanded) {\n <div class=\"message-content\">\n <!-- Main content -->\n @if (isStringContent(item.message.content)) {\n <div class=\"text-content\">\n <mj-code-editor \n [value]=\"getContentString(item.message.content)\"\n [readonly]=\"true\"\n [language]=\"getContentLanguage(item.message.content)\"\n style=\"max-height: 600px; overflow-y: auto;\">\n </mj-code-editor>\n </div>\n } @else {\n <!-- Non-string content with multiple parts -->\n <div class=\"multi-part-content\">\n @for (part of getContentParts(item.message.content, i); track part.id) {\n <div class=\"content-part\" [class.collapsed]=\"!part.expanded\">\n <div class=\"content-part-label\" (click)=\"toggleContentPart(part.id)\">\n <div class=\"content-part-label-content\">\n <i class=\"fa-solid fa-tag\"></i>\n {{ part.key }}\n </div>\n <button class=\"content-part-toggle\" type=\"button\">\n <i [class]=\"part.expanded ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n </button>\n </div>\n @if (part.expanded) {\n <div class=\"content-part-editor\">\n <mj-code-editor \n [value]=\"part.value\"\n [readonly]=\"true\"\n [language]=\"part.language\"\n style=\"max-height: 400px; overflow-y: auto;\">\n </mj-code-editor>\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n }\n }\n }\n </div>\n</div>", styles: [".chat-message-viewer {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: hidden; /* Prevent overflow from the parent */\n}\n\n\n/* Filter Controls */\n.filter-controls {\n display: flex;\n gap: 1.5rem;\n align-items: center;\n padding: 0.75rem;\n background-color: var(--mj-bg-surface-sunken);\n border-radius: 8px;\n border: 1px solid var(--mj-border-default);\n margin-bottom: 1rem;\n flex-shrink: 0; /* Prevent filter from shrinking */\n}\n\n.filter-checkbox {\n display: flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n}\n\n.filter-checkbox input[type=\"checkbox\"] {\n margin-right: 0.5rem;\n}\n\n.filter-label {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.875rem;\n font-weight: 500;\n}\n\n.filter-label i {\n font-size: 1rem;\n}\n\n/* Messages Container */\n.messages-container {\n flex: 1;\n overflow-y: auto;\n padding: 0.5rem;\n padding-bottom: 1rem; /* Small padding at bottom */\n max-height: 800px;\n}\n\n.empty-state {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 3rem;\n color: var(--mj-text-muted);\n}\n\n.empty-state i {\n font-size: 3rem;\n margin-bottom: 1rem;\n}\n\n.empty-state p {\n font-size: 1rem;\n margin: 0;\n}\n\n/* Message Card */\n.message-card {\n background: var(--mj-bg-surface-card);\n border: 1px solid var(--mj-border-default);\n border-radius: 8px;\n margin-bottom: 0.75rem;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.message-card:hover {\n box-shadow: var(--mj-shadow-sm);\n}\n\n.message-card:last-child {\n margin-bottom: 2rem; /* Extra margin on last card to ensure it's fully visible */\n}\n\n.message-card[data-role=\"system\"] {\n border-left: 3px solid var(--mj-brand-primary);\n}\n\n.message-card[data-role=\"user\"] {\n border-left: 3px solid var(--mj-status-success);\n}\n\n.message-card[data-role=\"assistant\"] {\n border-left: 3px solid var(--mj-brand-primary);\n}\n\n/* Message Header */\n.message-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.75rem 1rem;\n background-color: var(--mj-bg-surface-sunken);\n cursor: pointer;\n user-select: none;\n}\n\n.message-header:hover {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.message-role {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.sequence-number {\n color: var(--mj-text-secondary);\n font-weight: 500;\n font-size: 0.85rem;\n margin-right: 4px;\n}\n\n.message-role i {\n font-size: 1.125rem;\n}\n\n.content-stats {\n margin-left: auto;\n display: flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-text-secondary);\n font-size: 0.8rem;\n font-weight: 400;\n}\n\n.stat-item {\n white-space: nowrap;\n}\n\n.stat-divider {\n color: var(--mj-text-muted);\n}\n\n.role-label {\n font-weight: 600;\n font-size: 0.875rem;\n text-transform: uppercase;\n letter-spacing: 0.025em;\n}\n\n.message-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.action-button,\n.toggle-button {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: var(--mj-text-secondary);\n transition: color 0.2s ease;\n}\n\n.action-button:hover,\n.toggle-button:hover {\n color: var(--mj-text-primary);\n}\n\n.action-button {\n padding: 0.25rem 0.5rem;\n}\n\n.action-button:hover {\n color: var(--mj-brand-primary);\n}\n\n/* Message Content */\n.message-content {\n padding: 1rem;\n}\n\n.content-blocks {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5rem;\n margin-bottom: 1rem;\n}\n\n.content-block-indicator {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.25rem 0.75rem;\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n border-radius: 9999px;\n font-size: 0.75rem;\n color: var(--mj-brand-primary-hover);\n}\n\n.content-block-indicator i {\n font-size: 0.875rem;\n}\n\n/* Text Content */\n.text-content,\n.json-content {\n border: 1px solid var(--mj-border-default);\n border-radius: 6px;\n overflow: hidden;\n}\n\n.json-content {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.text-content mj-code-editor,\n.json-content mj-code-editor {\n display: block;\n min-height: 100px;\n}\n\n/* Multi-part Content */\n.multi-part-content {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.content-part {\n border: 1px solid var(--mj-border-default);\n border-radius: 6px;\n overflow: hidden;\n}\n\n.content-part-label {\n background-color: var(--mj-bg-surface-sunken);\n padding: 0.5rem 1rem;\n font-size: 0.875rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n border-bottom: 1px solid var(--mj-border-default);\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n user-select: none;\n transition: background-color 0.2s;\n}\n\n.content-part-label:hover {\n background-color: var(--mj-border-default);\n}\n\n.content-part-label-content {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.content-part-label i {\n font-size: 0.75rem;\n color: var(--mj-text-secondary);\n}\n\n.content-part-toggle {\n background: none;\n border: none;\n padding: 0.25rem;\n cursor: pointer;\n color: var(--mj-text-secondary);\n transition: color 0.2s;\n}\n\n.content-part-toggle:hover {\n color: var(--mj-text-primary);\n}\n\n.content-part.collapsed .content-part-label {\n border-bottom: none;\n}\n\n.content-part-editor {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.content-part-editor mj-code-editor {\n display: block;\n min-height: 80px;\n}\n\n/* CodeMirror Overrides for this component */\n.chat-message-viewer .cm-editor {\n font-size: 0.875rem;\n}\n\n.chat-message-viewer .cm-editor.cm-focused {\n outline: none;\n}\n\n/* Responsive adjustments */\n@media (max-width: 640px) {\n .filter-controls {\n flex-wrap: wrap;\n gap: 0.75rem;\n }\n \n .filter-checkbox {\n min-width: calc(50% - 0.375rem);\n }\n}"] }]
522
522
  }], null, { messages: [{
523
523
  type: Input
524
524
  }] }); })();