@memberjunction/ng-core-entity-forms 5.39.0 → 5.40.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 (122) hide show
  1. package/dist/lib/custom/AIAgents/ai-agent-form.component.d.ts.map +1 -1
  2. package/dist/lib/custom/AIAgents/ai-agent-form.component.js +14 -7
  3. package/dist/lib/custom/AIAgents/ai-agent-form.component.js.map +1 -1
  4. package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.d.ts +7 -0
  5. package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.d.ts.map +1 -1
  6. package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.js +583 -559
  7. package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.js.map +1 -1
  8. package/dist/lib/custom/Actions/action-execution-log-form.component.js +2 -2
  9. package/dist/lib/custom/Actions/action-form.component.js +2 -2
  10. package/dist/lib/custom/Entities/entity-form.component.js +4 -4
  11. package/dist/lib/custom/Entities/entity-form.component.js.map +1 -1
  12. package/dist/lib/custom/ai-agent-run/ai-agent-run-analytics.component.js +117 -97
  13. package/dist/lib/custom/ai-agent-run/ai-agent-run-analytics.component.js.map +1 -1
  14. package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.js +2 -2
  15. package/dist/lib/custom/ai-agent-run/ai-agent-run-visualization.component.js.map +1 -1
  16. package/dist/lib/generated/Entities/MJAIAgentRun/mjaiagentrun.form.component.d.ts.map +1 -1
  17. package/dist/lib/generated/Entities/MJAIAgentRun/mjaiagentrun.form.component.js +59 -51
  18. package/dist/lib/generated/Entities/MJAIAgentRun/mjaiagentrun.form.component.js.map +1 -1
  19. package/dist/lib/generated/Entities/MJAIPromptRun/mjaipromptrun.form.component.d.ts.map +1 -1
  20. package/dist/lib/generated/Entities/MJAIPromptRun/mjaipromptrun.form.component.js +28 -10
  21. package/dist/lib/generated/Entities/MJAIPromptRun/mjaipromptrun.form.component.js.map +1 -1
  22. package/dist/lib/generated/Entities/MJAPIKey/mjapikey.form.component.d.ts.map +1 -1
  23. package/dist/lib/generated/Entities/MJAPIKey/mjapikey.form.component.js +29 -21
  24. package/dist/lib/generated/Entities/MJAPIKey/mjapikey.form.component.js.map +1 -1
  25. package/dist/lib/generated/Entities/MJApplication/mjapplication.form.component.d.ts.map +1 -1
  26. package/dist/lib/generated/Entities/MJApplication/mjapplication.form.component.js +47 -11
  27. package/dist/lib/generated/Entities/MJApplication/mjapplication.form.component.js.map +1 -1
  28. package/dist/lib/generated/Entities/MJArtifact/mjartifact.form.component.d.ts.map +1 -1
  29. package/dist/lib/generated/Entities/MJArtifact/mjartifact.form.component.js +24 -6
  30. package/dist/lib/generated/Entities/MJArtifact/mjartifact.form.component.js.map +1 -1
  31. package/dist/lib/generated/Entities/MJArtifactVersion/mjartifactversion.form.component.d.ts.map +1 -1
  32. package/dist/lib/generated/Entities/MJArtifactVersion/mjartifactversion.form.component.js +27 -9
  33. package/dist/lib/generated/Entities/MJArtifactVersion/mjartifactversion.form.component.js.map +1 -1
  34. package/dist/lib/generated/Entities/MJClusterAnalysis/mjclusteranalysis.form.component.d.ts +10 -0
  35. package/dist/lib/generated/Entities/MJClusterAnalysis/mjclusteranalysis.form.component.d.ts.map +1 -0
  36. package/dist/lib/generated/Entities/MJClusterAnalysis/mjclusteranalysis.form.component.js +93 -0
  37. package/dist/lib/generated/Entities/MJClusterAnalysis/mjclusteranalysis.form.component.js.map +1 -0
  38. package/dist/lib/generated/Entities/MJClusterAnalysisCluster/mjclusteranalysiscluster.form.component.d.ts +10 -0
  39. package/dist/lib/generated/Entities/MJClusterAnalysisCluster/mjclusteranalysiscluster.form.component.d.ts.map +1 -0
  40. package/dist/lib/generated/Entities/MJClusterAnalysisCluster/mjclusteranalysiscluster.form.component.js +66 -0
  41. package/dist/lib/generated/Entities/MJClusterAnalysisCluster/mjclusteranalysiscluster.form.component.js.map +1 -0
  42. package/dist/lib/generated/Entities/MJCompany/mjcompany.form.component.d.ts.map +1 -1
  43. package/dist/lib/generated/Entities/MJCompany/mjcompany.form.component.js +27 -9
  44. package/dist/lib/generated/Entities/MJCompany/mjcompany.form.component.js.map +1 -1
  45. package/dist/lib/generated/Entities/MJContentItemTag/mjcontentitemtag.form.component.d.ts.map +1 -1
  46. package/dist/lib/generated/Entities/MJContentItemTag/mjcontentitemtag.form.component.js +13 -3
  47. package/dist/lib/generated/Entities/MJContentItemTag/mjcontentitemtag.form.component.js.map +1 -1
  48. package/dist/lib/generated/Entities/MJCredential/mjcredential.form.component.d.ts.map +1 -1
  49. package/dist/lib/generated/Entities/MJCredential/mjcredential.form.component.js +29 -11
  50. package/dist/lib/generated/Entities/MJCredential/mjcredential.form.component.js.map +1 -1
  51. package/dist/lib/generated/Entities/MJEntity/mjentity.form.component.d.ts.map +1 -1
  52. package/dist/lib/generated/Entities/MJEntity/mjentity.form.component.js +100 -64
  53. package/dist/lib/generated/Entities/MJEntity/mjentity.form.component.js.map +1 -1
  54. package/dist/lib/generated/Entities/MJMagicLinkInvite/mjmagiclinkinvite.form.component.d.ts +10 -0
  55. package/dist/lib/generated/Entities/MJMagicLinkInvite/mjmagiclinkinvite.form.component.d.ts.map +1 -0
  56. package/dist/lib/generated/Entities/MJMagicLinkInvite/mjmagiclinkinvite.form.component.js +173 -0
  57. package/dist/lib/generated/Entities/MJMagicLinkInvite/mjmagiclinkinvite.form.component.js.map +1 -0
  58. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedDomain/mjmagiclinkinvitealloweddomain.form.component.d.ts +10 -0
  59. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedDomain/mjmagiclinkinvitealloweddomain.form.component.d.ts.map +1 -0
  60. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedDomain/mjmagiclinkinvitealloweddomain.form.component.js +58 -0
  61. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedDomain/mjmagiclinkinvitealloweddomain.form.component.js.map +1 -0
  62. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedPath/mjmagiclinkinviteallowedpath.form.component.d.ts +10 -0
  63. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedPath/mjmagiclinkinviteallowedpath.form.component.d.ts.map +1 -0
  64. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedPath/mjmagiclinkinviteallowedpath.form.component.js +58 -0
  65. package/dist/lib/generated/Entities/MJMagicLinkInviteAllowedPath/mjmagiclinkinviteallowedpath.form.component.js.map +1 -0
  66. package/dist/lib/generated/Entities/MJMagicLinkInviteApplication/mjmagiclinkinviteapplication.form.component.d.ts +10 -0
  67. package/dist/lib/generated/Entities/MJMagicLinkInviteApplication/mjmagiclinkinviteapplication.form.component.d.ts.map +1 -0
  68. package/dist/lib/generated/Entities/MJMagicLinkInviteApplication/mjmagiclinkinviteapplication.form.component.js +58 -0
  69. package/dist/lib/generated/Entities/MJMagicLinkInviteApplication/mjmagiclinkinviteapplication.form.component.js.map +1 -0
  70. package/dist/lib/generated/Entities/MJMagicLinkInviteRole/mjmagiclinkinviterole.form.component.d.ts +10 -0
  71. package/dist/lib/generated/Entities/MJMagicLinkInviteRole/mjmagiclinkinviterole.form.component.d.ts.map +1 -0
  72. package/dist/lib/generated/Entities/MJMagicLinkInviteRole/mjmagiclinkinviterole.form.component.js +58 -0
  73. package/dist/lib/generated/Entities/MJMagicLinkInviteRole/mjmagiclinkinviterole.form.component.js.map +1 -0
  74. package/dist/lib/generated/Entities/MJMagicLinkRedemption/mjmagiclinkredemption.form.component.d.ts +10 -0
  75. package/dist/lib/generated/Entities/MJMagicLinkRedemption/mjmagiclinkredemption.form.component.d.ts.map +1 -0
  76. package/dist/lib/generated/Entities/MJMagicLinkRedemption/mjmagiclinkredemption.form.component.js +68 -0
  77. package/dist/lib/generated/Entities/MJMagicLinkRedemption/mjmagiclinkredemption.form.component.js.map +1 -0
  78. package/dist/lib/generated/Entities/MJResourceType/mjresourcetype.form.component.d.ts.map +1 -1
  79. package/dist/lib/generated/Entities/MJResourceType/mjresourcetype.form.component.js +26 -8
  80. package/dist/lib/generated/Entities/MJResourceType/mjresourcetype.form.component.js.map +1 -1
  81. package/dist/lib/generated/Entities/MJRole/mjrole.form.component.d.ts.map +1 -1
  82. package/dist/lib/generated/Entities/MJRole/mjrole.form.component.js +52 -16
  83. package/dist/lib/generated/Entities/MJRole/mjrole.form.component.js.map +1 -1
  84. package/dist/lib/generated/Entities/MJSignatureAccount/mjsignatureaccount.form.component.d.ts +10 -0
  85. package/dist/lib/generated/Entities/MJSignatureAccount/mjsignatureaccount.form.component.d.ts.map +1 -0
  86. package/dist/lib/generated/Entities/MJSignatureAccount/mjsignatureaccount.form.component.js +115 -0
  87. package/dist/lib/generated/Entities/MJSignatureAccount/mjsignatureaccount.form.component.js.map +1 -0
  88. package/dist/lib/generated/Entities/MJSignatureProvider/mjsignatureprovider.form.component.d.ts +10 -0
  89. package/dist/lib/generated/Entities/MJSignatureProvider/mjsignatureprovider.form.component.d.ts.map +1 -0
  90. package/dist/lib/generated/Entities/MJSignatureProvider/mjsignatureprovider.form.component.js +101 -0
  91. package/dist/lib/generated/Entities/MJSignatureProvider/mjsignatureprovider.form.component.js.map +1 -0
  92. package/dist/lib/generated/Entities/MJSignatureRequest/mjsignaturerequest.form.component.d.ts +10 -0
  93. package/dist/lib/generated/Entities/MJSignatureRequest/mjsignaturerequest.form.component.d.ts.map +1 -0
  94. package/dist/lib/generated/Entities/MJSignatureRequest/mjsignaturerequest.form.component.js +153 -0
  95. package/dist/lib/generated/Entities/MJSignatureRequest/mjsignaturerequest.form.component.js.map +1 -0
  96. package/dist/lib/generated/Entities/MJSignatureRequestDocument/mjsignaturerequestdocument.form.component.d.ts +10 -0
  97. package/dist/lib/generated/Entities/MJSignatureRequestDocument/mjsignaturerequestdocument.form.component.d.ts.map +1 -0
  98. package/dist/lib/generated/Entities/MJSignatureRequestDocument/mjsignaturerequestdocument.form.component.js +78 -0
  99. package/dist/lib/generated/Entities/MJSignatureRequestDocument/mjsignaturerequestdocument.form.component.js.map +1 -0
  100. package/dist/lib/generated/Entities/MJSignatureRequestLog/mjsignaturerequestlog.form.component.d.ts +10 -0
  101. package/dist/lib/generated/Entities/MJSignatureRequestLog/mjsignaturerequestlog.form.component.d.ts.map +1 -0
  102. package/dist/lib/generated/Entities/MJSignatureRequestLog/mjsignaturerequestlog.form.component.js +84 -0
  103. package/dist/lib/generated/Entities/MJSignatureRequestLog/mjsignaturerequestlog.form.component.js.map +1 -0
  104. package/dist/lib/generated/Entities/MJSignatureRequestRecipient/mjsignaturerequestrecipient.form.component.d.ts +10 -0
  105. package/dist/lib/generated/Entities/MJSignatureRequestRecipient/mjsignaturerequestrecipient.form.component.d.ts.map +1 -0
  106. package/dist/lib/generated/Entities/MJSignatureRequestRecipient/mjsignaturerequestrecipient.form.component.js +88 -0
  107. package/dist/lib/generated/Entities/MJSignatureRequestRecipient/mjsignaturerequestrecipient.form.component.js.map +1 -0
  108. package/dist/lib/generated/Entities/MJUser/mjuser.form.component.d.ts.map +1 -1
  109. package/dist/lib/generated/Entities/MJUser/mjuser.form.component.js +156 -102
  110. package/dist/lib/generated/Entities/MJUser/mjuser.form.component.js.map +1 -1
  111. package/dist/lib/generated/Entities/MJUserView/mjuserview.form.component.d.ts.map +1 -1
  112. package/dist/lib/generated/Entities/MJUserView/mjuserview.form.component.js +34 -26
  113. package/dist/lib/generated/Entities/MJUserView/mjuserview.form.component.js.map +1 -1
  114. package/dist/lib/generated/Entities/MJViewType/mjviewtype.form.component.d.ts +10 -0
  115. package/dist/lib/generated/Entities/MJViewType/mjviewtype.form.component.d.ts.map +1 -0
  116. package/dist/lib/generated/Entities/MJViewType/mjviewtype.form.component.js +91 -0
  117. package/dist/lib/generated/Entities/MJViewType/mjviewtype.form.component.js.map +1 -0
  118. package/dist/lib/generated/generated-forms.module.d.ts +265 -250
  119. package/dist/lib/generated/generated-forms.module.d.ts.map +1 -1
  120. package/dist/lib/generated/generated-forms.module.js +224 -179
  121. package/dist/lib/generated/generated-forms.module.js.map +1 -1
  122. package/package.json +36 -36
package/dist/lib/custom/Actions/action-execution-log-form.component.js CHANGED
@@ -831,7 +831,7 @@ let MJActionExecutionLogFormComponentExtended = class MJActionExecutionLogFormCo
831
831
  i0.ɵɵconditional(ctx.record.Message ? 69 : -1);
832
832
  i0.ɵɵadvance();
833
833
  i0.ɵɵconditional(!ctx.record.Params && !ctx.record.Message && !ctx.hasAnyParameters ? 70 : -1);
834
- } }, dependencies: [i1.NgClass, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MJAccordionPanelComponent, i3.MJAccordionTitleDirective, i4.CodeEditorComponent, i1.DatePipe], styles: ["\n\n[_nghost-%COMP%] {\n display: block;\n height: 100%;\n}\n\n.action-execution-log-form[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n}\n\n\n\n.header[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-card);\n border-bottom: 1px solid var(--mj-border-default);\n padding: 20px;\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.icon-wrapper[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n background: var(--mj-status-info);\n border-radius: var(--mj-radius-lg);\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mj-text-inverse);\n font-size: var(--mj-text-xl);\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info[_ngcontent-%COMP%] h2[_ngcontent-%COMP%] {\n margin: 0;\n font-size: var(--mj-text-2xl);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n}\n\n.meta-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n margin-top: 4px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.action-name[_ngcontent-%COMP%] {\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.log-id[_ngcontent-%COMP%] {\n font-family: monospace;\n font-size: var(--mj-text-xs);\n opacity: 0.7;\n}\n\n.header-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n padding: 6px 16px;\n border-radius: var(--mj-radius-full);\n font-size: var(--mj-text-xs);\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-text-inverse);\n}\n\n.execution-time[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.header-stats[_ngcontent-%COMP%] {\n display: flex;\n gap: 24px;\n padding-top: 12px;\n border-top: 1px solid var(--mj-border-default);\n}\n\n.stat[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat[_ngcontent-%COMP%] .value[_ngcontent-%COMP%] {\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.record-form[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n}\n\n\n\n.content-area[_ngcontent-%COMP%] {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding: 20px;\n}\n\n\n\n.details-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n padding: 20px;\n}\n\n.detail-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.detail-item[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n font-weight: var(--mj-font-semibold);\n}\n\n.detail-value[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--mj-text-primary);\n}\n\n.btn-link[_ngcontent-%COMP%] {\n background: none;\n border: none;\n color: var(--mj-brand-primary);\n cursor: pointer;\n font-size: var(--mj-text-sm);\n padding: 4px;\n}\n\n.btn-link[_ngcontent-%COMP%]:hover {\n color: var(--mj-brand-primary-hover);\n}\n\n.loading[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: var(--mj-text-xs);\n}\n\n\n\n.json-viewer[_ngcontent-%COMP%] {\n padding: 20px;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-md);\n margin-bottom: 20px;\n}\n\n.json-toolbar[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 12px;\n}\n\n.json-label[_ngcontent-%COMP%] {\n background: var(--mj-status-info);\n color: var(--mj-text-inverse);\n padding: 4px 12px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.btn-icon[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-sm);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all var(--mj-transition-base);\n color: var(--mj-text-muted);\n}\n\n.btn-icon[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-secondary);\n}\n\n\n\n.status-badge[data-status=\"success\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"ok\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"completed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"200\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-success);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failure\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-error);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"pending\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-warning);\n color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"running\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-info);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[_ngcontent-%COMP%] {\n background-color: var(--mj-text-muted);\n color: var(--mj-text-inverse);\n}\n\n\n\n .k-panelbar {\n background: var(--mj-bg-surface-card) !important;\n border-color: var(--mj-border-default) !important;\n color: var(--mj-text-primary) !important;\n}\n\n .k-panelbar > .k-panelbar-header > .k-link {\n background: var(--mj-bg-surface-elevated) !important;\n color: var(--mj-text-primary) !important;\n border-color: var(--mj-border-default) !important;\n padding: 12px 16px;\n font-weight: var(--mj-font-semibold);\n}\n\n .k-panelbar > .k-panelbar-header > .k-link:hover {\n background: var(--mj-bg-surface-hover) !important;\n}\n\n .k-panelbar > .k-panelbar-header > .k-link .k-icon, \n .k-panelbar > .k-panelbar-header > .k-link .k-svg-icon {\n color: var(--mj-text-muted) !important;\n}\n\n .k-panelbar-item-content, \n .k-panelbar > .k-item > .k-animation-container .k-panelbar-item-content {\n padding: 0;\n background: var(--mj-bg-surface-card) !important;\n color: var(--mj-text-primary) !important;\n border-color: var(--mj-border-default) !important;\n}\n\n.k-panelbar[_ngcontent-%COMP%] > .k-item[_ngcontent-%COMP%] > .k-link[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n margin-right: 8px;\n color: var(--mj-text-muted);\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 40px;\n color: var(--mj-text-muted);\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: var(--mj-text-5xl);\n opacity: 0.3;\n margin-bottom: 16px;\n}\n\n.monospace[_ngcontent-%COMP%] {\n font-family: 'Courier New', Courier, monospace;\n font-size: var(--mj-text-xs);\n}\n\n\n\n\n\n\n.param-count-pill[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 22px;\n height: 22px;\n padding: 0 7px;\n margin-left: 8px;\n border-radius: var(--mj-radius-full);\n background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n letter-spacing: 0.3px;\n}\n\n.params-panel[_ngcontent-%COMP%] {\n padding: 18px 20px 22px;\n}\n\n\n\n.params-toolbar[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 14px;\n align-items: center;\n justify-content: space-between;\n padding: 12px 14px;\n margin-bottom: 14px;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips[_ngcontent-%COMP%] {\n display: flex;\n gap: 6px;\n flex-wrap: wrap;\n}\n\n.chip[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 6px 13px;\n border-radius: var(--mj-radius-full);\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.chip[_ngcontent-%COMP%]:hover:not(:disabled) {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-primary);\n}\n.chip[_ngcontent-%COMP%]:disabled {\n opacity: 0.45;\n cursor: not-allowed;\n}\n.chip[_ngcontent-%COMP%] .chip-count[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 20px;\n height: 18px;\n padding: 0 6px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n}\n.chip[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 11px;\n}\n\n.chip.active[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active[_ngcontent-%COMP%] .chip-count[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n color: var(--mj-text-inverse);\n}\n\n\n\n.chip.chip-input.active[_ngcontent-%COMP%] {\n background: var(--mj-status-info);\n border-color: var(--mj-status-info);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active[_ngcontent-%COMP%] {\n background: var(--mj-status-success);\n border-color: var(--mj-status-success);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.search-wrapper[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n align-items: center;\n}\n.search-icon[_ngcontent-%COMP%] {\n position: absolute;\n left: 10px;\n color: var(--mj-text-muted);\n font-size: 12px;\n pointer-events: none;\n}\n.params-search[_ngcontent-%COMP%] {\n min-width: 220px;\n padding: 7px 30px 7px 30px;\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n}\n.search-clear[_ngcontent-%COMP%] {\n position: absolute;\n right: 6px;\n width: 22px;\n height: 22px;\n border: none;\n background: transparent;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.search-clear[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface-hover);\n}\n\n.sort-group[_ngcontent-%COMP%] {\n display: inline-flex;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface);\n}\n.sort-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: background var(--mj-transition-base);\n}\n.sort-btn[_ngcontent-%COMP%] + .sort-btn[_ngcontent-%COMP%] {\n border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n.sort-btn.active[_ngcontent-%COMP%] i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n.raw-toggle[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.raw-toggle[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n\n\n.params-list[_ngcontent-%COMP%] {\n list-style: none;\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.param-row[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-left: 3px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n padding: 12px 14px;\n transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row[_ngcontent-%COMP%]:hover {\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"][_ngcontent-%COMP%] { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"][_ngcontent-%COMP%] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"][_ngcontent-%COMP%] { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 3px 10px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.4px;\n flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"][_ngcontent-%COMP%] {\n background: var(--mj-status-info-bg);\n color: var(--mj-status-info-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"][_ngcontent-%COMP%] {\n background: var(--mj-status-success-bg);\n color: var(--mj-status-success-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"][_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n gap: 10px;\n min-width: 0;\n}\n.param-name[_ngcontent-%COMP%] {\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.value-kind-chip[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 2px 8px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 10px;\n font-weight: var(--mj-font-medium);\n text-transform: lowercase;\n letter-spacing: 0.3px;\n flex-shrink: 0;\n}\n.value-kind-chip[_ngcontent-%COMP%] i[_ngcontent-%COMP%] { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"][_ngcontent-%COMP%] { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"][_ngcontent-%COMP%] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"][_ngcontent-%COMP%] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"][_ngcontent-%COMP%] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"][_ngcontent-%COMP%], \n.value-kind-chip[data-kind=\"undefined\"][_ngcontent-%COMP%] {\n color: var(--mj-text-disabled);\n background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 4px;\n flex-shrink: 0;\n}\n.param-actions[_ngcontent-%COMP%] .btn-icon[_ngcontent-%COMP%] {\n width: 28px;\n height: 28px;\n}\n.param-expand.is-expanded[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview[_ngcontent-%COMP%] {\n margin-top: 8px;\n padding-left: calc(64px + 12px); \n\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-secondary);\n word-break: break-word;\n line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"][_ngcontent-%COMP%] { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"][_ngcontent-%COMP%] { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"][_ngcontent-%COMP%] { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"undefined\"][_ngcontent-%COMP%] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"object\"][_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n.param-expanded[_ngcontent-%COMP%] {\n margin-top: 10px;\n margin-left: calc(64px + 12px);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer[_ngcontent-%COMP%] { margin-top: 4px; }\n\n.empty-filter[_ngcontent-%COMP%] {\n text-align: center;\n padding: 36px 20px;\n color: var(--mj-text-muted);\n background: var(--mj-bg-surface-sunken);\n border: 1px dashed var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n}\n.empty-filter[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: var(--mj-text-3xl);\n margin-bottom: 12px;\n opacity: 0.5;\n}\n.empty-filter[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0 0 12px;\n font-size: var(--mj-text-sm);\n}\n\n\n\n@media (max-width: 768px) {\n .header-content[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n }\n\n .header-stats[_ngcontent-%COMP%] {\n flex-wrap: wrap;\n }\n\n .details-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n\n .params-toolbar[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: stretch;\n }\n .toolbar-right[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n .params-search[_ngcontent-%COMP%] { min-width: 0; width: 100%; }\n .search-wrapper[_ngcontent-%COMP%] { flex: 1; }\n\n .param-preview[_ngcontent-%COMP%], \n .param-expanded[_ngcontent-%COMP%] {\n padding-left: 0;\n margin-left: 0;\n }\n}"] }); }
834
+ } }, dependencies: [i1.NgClass, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MJAccordionPanelComponent, i3.MJAccordionTitleDirective, i4.CodeEditorComponent, i1.DatePipe], styles: ["\n\n[_nghost-%COMP%] {\n display: block;\n height: 100%;\n}\n\n.action-execution-log-form[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n}\n\n\n\n.header[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-card);\n border-bottom: 1px solid var(--mj-border-default);\n padding: 20px;\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.icon-wrapper[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n background: var(--mj-status-info);\n border-radius: var(--mj-radius-lg);\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mj-text-inverse);\n font-size: var(--mj-text-xl);\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info[_ngcontent-%COMP%] h2[_ngcontent-%COMP%] {\n margin: 0;\n font-size: var(--mj-text-2xl);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n}\n\n.meta-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n margin-top: 4px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.action-name[_ngcontent-%COMP%] {\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.log-id[_ngcontent-%COMP%] {\n font-family: monospace;\n font-size: var(--mj-text-xs);\n opacity: 0.7;\n}\n\n.header-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n padding: 6px 16px;\n border-radius: var(--mj-radius-full);\n font-size: var(--mj-text-xs);\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-text-inverse);\n}\n\n.execution-time[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.header-stats[_ngcontent-%COMP%] {\n display: flex;\n gap: 24px;\n padding-top: 12px;\n border-top: 1px solid var(--mj-border-default);\n}\n\n.stat[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat[_ngcontent-%COMP%] .label[_ngcontent-%COMP%] {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat[_ngcontent-%COMP%] .value[_ngcontent-%COMP%] {\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.record-form[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n}\n\n\n\n.content-area[_ngcontent-%COMP%] {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding: 20px;\n}\n\n\n\n.details-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n padding: 20px;\n}\n\n.detail-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.detail-item[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n font-weight: var(--mj-font-semibold);\n}\n\n.detail-value[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--mj-text-primary);\n}\n\n.btn-link[_ngcontent-%COMP%] {\n background: none;\n border: none;\n color: var(--mj-brand-primary);\n cursor: pointer;\n font-size: var(--mj-text-sm);\n padding: 4px;\n}\n\n.btn-link[_ngcontent-%COMP%]:hover {\n color: var(--mj-brand-primary-hover);\n}\n\n.loading[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: var(--mj-text-xs);\n}\n\n\n\n.json-viewer[_ngcontent-%COMP%] {\n padding: 20px;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-md);\n margin-bottom: 20px;\n}\n\n.json-toolbar[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 12px;\n}\n\n.json-label[_ngcontent-%COMP%] {\n background: var(--mj-status-info);\n color: var(--mj-text-inverse);\n padding: 4px 12px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.btn-icon[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-sm);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all var(--mj-transition-base);\n color: var(--mj-text-muted);\n}\n\n.btn-icon[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-secondary);\n}\n\n\n\n.status-badge[data-status=\"success\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"ok\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"completed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"200\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-success);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failure\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-error);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"pending\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-warning);\n color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"running\"][_ngcontent-%COMP%] {\n background-color: var(--mj-status-info);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[_ngcontent-%COMP%] {\n background-color: var(--mj-text-muted);\n color: var(--mj-text-inverse);\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 40px;\n color: var(--mj-text-muted);\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: var(--mj-text-5xl);\n opacity: 0.3;\n margin-bottom: 16px;\n}\n\n.monospace[_ngcontent-%COMP%] {\n font-family: 'Courier New', Courier, monospace;\n font-size: var(--mj-text-xs);\n}\n\n\n\n\n\n\n.param-count-pill[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 22px;\n height: 22px;\n padding: 0 7px;\n margin-left: 8px;\n border-radius: var(--mj-radius-full);\n background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n letter-spacing: 0.3px;\n}\n\n.params-panel[_ngcontent-%COMP%] {\n padding: 18px 20px 22px;\n}\n\n\n\n.params-toolbar[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 14px;\n align-items: center;\n justify-content: space-between;\n padding: 12px 14px;\n margin-bottom: 14px;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips[_ngcontent-%COMP%] {\n display: flex;\n gap: 6px;\n flex-wrap: wrap;\n}\n\n.chip[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 6px 13px;\n border-radius: var(--mj-radius-full);\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.chip[_ngcontent-%COMP%]:hover:not(:disabled) {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-primary);\n}\n.chip[_ngcontent-%COMP%]:disabled {\n opacity: 0.45;\n cursor: not-allowed;\n}\n.chip[_ngcontent-%COMP%] .chip-count[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 20px;\n height: 18px;\n padding: 0 6px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n}\n.chip[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 11px;\n}\n\n.chip.active[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active[_ngcontent-%COMP%] .chip-count[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n color: var(--mj-text-inverse);\n}\n\n\n\n.chip.chip-input.active[_ngcontent-%COMP%] {\n background: var(--mj-status-info);\n border-color: var(--mj-status-info);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active[_ngcontent-%COMP%] {\n background: var(--mj-status-success);\n border-color: var(--mj-status-success);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.search-wrapper[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n align-items: center;\n}\n.search-icon[_ngcontent-%COMP%] {\n position: absolute;\n left: 10px;\n color: var(--mj-text-muted);\n font-size: 12px;\n pointer-events: none;\n}\n.params-search[_ngcontent-%COMP%] {\n min-width: 220px;\n padding: 7px 30px 7px 30px;\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n}\n.search-clear[_ngcontent-%COMP%] {\n position: absolute;\n right: 6px;\n width: 22px;\n height: 22px;\n border: none;\n background: transparent;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.search-clear[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface-hover);\n}\n\n.sort-group[_ngcontent-%COMP%] {\n display: inline-flex;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface);\n}\n.sort-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: background var(--mj-transition-base);\n}\n.sort-btn[_ngcontent-%COMP%] + .sort-btn[_ngcontent-%COMP%] {\n border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n.sort-btn.active[_ngcontent-%COMP%] i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n.raw-toggle[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.raw-toggle[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n\n\n.params-list[_ngcontent-%COMP%] {\n list-style: none;\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.param-row[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-left: 3px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n padding: 12px 14px;\n transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row[_ngcontent-%COMP%]:hover {\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"][_ngcontent-%COMP%] { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"][_ngcontent-%COMP%] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"][_ngcontent-%COMP%] { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 3px 10px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.4px;\n flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"][_ngcontent-%COMP%] {\n background: var(--mj-status-info-bg);\n color: var(--mj-status-info-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"][_ngcontent-%COMP%] {\n background: var(--mj-status-success-bg);\n color: var(--mj-status-success-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"][_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n gap: 10px;\n min-width: 0;\n}\n.param-name[_ngcontent-%COMP%] {\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.value-kind-chip[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 2px 8px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 10px;\n font-weight: var(--mj-font-medium);\n text-transform: lowercase;\n letter-spacing: 0.3px;\n flex-shrink: 0;\n}\n.value-kind-chip[_ngcontent-%COMP%] i[_ngcontent-%COMP%] { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"][_ngcontent-%COMP%] { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"][_ngcontent-%COMP%] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"][_ngcontent-%COMP%] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"][_ngcontent-%COMP%] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"][_ngcontent-%COMP%], \n.value-kind-chip[data-kind=\"undefined\"][_ngcontent-%COMP%] {\n color: var(--mj-text-disabled);\n background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 4px;\n flex-shrink: 0;\n}\n.param-actions[_ngcontent-%COMP%] .btn-icon[_ngcontent-%COMP%] {\n width: 28px;\n height: 28px;\n}\n.param-expand.is-expanded[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview[_ngcontent-%COMP%] {\n margin-top: 8px;\n padding-left: calc(64px + 12px); \n\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-secondary);\n word-break: break-word;\n line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"][_ngcontent-%COMP%] { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"][_ngcontent-%COMP%] { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"][_ngcontent-%COMP%] { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"undefined\"][_ngcontent-%COMP%] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"object\"][_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n.param-expanded[_ngcontent-%COMP%] {\n margin-top: 10px;\n margin-left: calc(64px + 12px);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer[_ngcontent-%COMP%] { margin-top: 4px; }\n\n.empty-filter[_ngcontent-%COMP%] {\n text-align: center;\n padding: 36px 20px;\n color: var(--mj-text-muted);\n background: var(--mj-bg-surface-sunken);\n border: 1px dashed var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n}\n.empty-filter[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: var(--mj-text-3xl);\n margin-bottom: 12px;\n opacity: 0.5;\n}\n.empty-filter[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0 0 12px;\n font-size: var(--mj-text-sm);\n}\n\n\n\n@media (max-width: 768px) {\n .header-content[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n }\n\n .header-stats[_ngcontent-%COMP%] {\n flex-wrap: wrap;\n }\n\n .details-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n\n .params-toolbar[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: stretch;\n }\n .toolbar-right[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n .params-search[_ngcontent-%COMP%] { min-width: 0; width: 100%; }\n .search-wrapper[_ngcontent-%COMP%] { flex: 1; }\n\n .param-preview[_ngcontent-%COMP%], \n .param-expanded[_ngcontent-%COMP%] {\n padding-left: 0;\n margin-left: 0;\n }\n}"] }); }
835
835
  };
836
836
  MJActionExecutionLogFormComponentExtended = __decorate([
837
837
  RegisterClass(BaseFormComponent, 'MJ: Action Execution Logs')
@@ -839,7 +839,7 @@ MJActionExecutionLogFormComponentExtended = __decorate([
839
839
  export { MJActionExecutionLogFormComponentExtended };
840
840
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJActionExecutionLogFormComponentExtended, [{
841
841
  type: Component,
842
- args: [{ standalone: false, selector: 'mj-action-execution-log-form', template: "<div class=\"record-form-container action-execution-log-form\" style=\"height: 100%; display: flex; flex-direction: column;\">\n <div class=\"record-form\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n <!-- Header -->\n <div class=\"header\">\n <div class=\"header-content\">\n <div class=\"header-left\">\n <div class=\"icon-wrapper\">\n <i class=\"fas fa-terminal\"></i>\n </div>\n <div class=\"header-info\">\n <h2>Action Execution Log</h2>\n <div class=\"meta-info\">\n @if (action) {\n <span class=\"action-name\">{{ action.Name }}</span>\n }\n <span class=\"log-id\">{{ record.ID }}</span>\n </div>\n </div>\n </div>\n <div class=\"header-right\">\n <div class=\"status-badge\" [attr.data-status]=\"record.ResultCode?.toLowerCase()\">\n <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\"></i>\n {{ record.ResultCode || 'UNKNOWN' }}\n </div>\n <div class=\"execution-time\">\n <i class=\"fas fa-clock\"></i>\n {{ formatDuration(getExecutionDuration()) }}\n </div>\n </div>\n </div>\n <div class=\"header-stats\">\n <div class=\"stat\">\n <span class=\"label\">Started</span>\n <span class=\"value\">{{ record.StartedAt | date:'short' }}</span>\n </div>\n @if (record.EndedAt) {\n <div class=\"stat\">\n <span class=\"label\">Ended</span>\n <span class=\"value\">{{ record.EndedAt | date:'short' }}</span>\n </div>\n }\n @if (action) {\n <div class=\"stat\">\n <span class=\"label\">Action</span>\n <span class=\"value\">\n <button class=\"btn-link\" (click)=\"navigateToAction()\">\n {{ action.Name }}\n <i class=\"fas fa-external-link-alt\"></i>\n </button>\n </span>\n </div>\n }\n @if (user) {\n <div class=\"stat\">\n <span class=\"label\">User</span>\n <span class=\"value\">\n <button class=\"btn-link\" (click)=\"navigateToUser()\">\n {{ user.Name }}\n <i class=\"fas fa-external-link-alt\"></i>\n </button>\n </span>\n </div>\n }\n </div>\n </div>\n\n <!-- Content Area -->\n <div class=\"content-area\">\n <div class=\"accordion-container\">\n <!-- Execution Details -->\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-info-circle\"></i> Execution Details\n </ng-template>\n <div class=\"details-grid\">\n <div class=\"detail-item\">\n <label>Execution ID</label>\n <span class=\"monospace\">{{ record.ID }}</span>\n </div>\n <div class=\"detail-item\">\n <label>Action ID</label>\n <span class=\"monospace\">{{ record.ActionID }}</span>\n </div>\n <div class=\"detail-item\">\n <label>User ID</label>\n <span class=\"monospace\">{{ record.UserID }}</span>\n </div>\n <div class=\"detail-item\">\n <label>Result Code</label>\n <span class=\"detail-value\">\n <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\" [style.color]=\"getResultCodeColor()\"></i>\n <span [style.color]=\"getResultCodeColor()\">{{ record.ResultCode || 'N/A' }}</span>\n </span>\n </div>\n <div class=\"detail-item\">\n <label>Duration</label>\n <span>{{ formatDuration(getExecutionDuration()) }}</span>\n </div>\n <div class=\"detail-item\">\n <label>Retention Period</label>\n <span>{{ record.RetentionPeriod ? record.RetentionPeriod + ' days' : 'Indefinite' }}</span>\n </div>\n </div>\n </mj-accordion-panel>\n\n <!-- Unified Parameters section -->\n @if (hasAnyParameters) {\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-sliders-h\"></i>\n Parameters\n <span class=\"param-count-pill\">{{ paramCounts.All }}</span>\n </ng-template>\n <div class=\"params-panel\">\n <!-- Toolbar: filter chips, search, sort, raw toggle -->\n <div class=\"params-toolbar\">\n <div class=\"filter-chips\">\n <button\n type=\"button\"\n class=\"chip\"\n [class.active]=\"typeFilter === 'All'\"\n (click)=\"setTypeFilter('All')\">\n All <span class=\"chip-count\">{{ paramCounts.All }}</span>\n </button>\n <button\n type=\"button\"\n class=\"chip chip-input\"\n [class.active]=\"typeFilter === 'Input'\"\n [disabled]=\"paramCounts.Input === 0\"\n (click)=\"setTypeFilter('Input')\">\n <i class=\"fas fa-sign-in-alt\"></i>\n Input <span class=\"chip-count\">{{ paramCounts.Input }}</span>\n </button>\n <button\n type=\"button\"\n class=\"chip chip-both\"\n [class.active]=\"typeFilter === 'Both'\"\n [disabled]=\"paramCounts.Both === 0\"\n (click)=\"setTypeFilter('Both')\">\n <i class=\"fas fa-exchange-alt\"></i>\n In/Out <span class=\"chip-count\">{{ paramCounts.Both }}</span>\n </button>\n <button\n type=\"button\"\n class=\"chip chip-output\"\n [class.active]=\"typeFilter === 'Output'\"\n [disabled]=\"paramCounts.Output === 0\"\n (click)=\"setTypeFilter('Output')\">\n <i class=\"fas fa-sign-out-alt\"></i>\n Output <span class=\"chip-count\">{{ paramCounts.Output }}</span>\n </button>\n </div>\n\n <div class=\"toolbar-right\">\n <div class=\"search-wrapper\">\n <i class=\"fas fa-search search-icon\"></i>\n <input\n type=\"text\"\n class=\"mj-input params-search\"\n placeholder=\"Search name or value\u2026\"\n [(ngModel)]=\"searchText\"\n name=\"paramSearch\" />\n @if (searchText) {\n <button type=\"button\" class=\"search-clear\" (click)=\"searchText = ''\" title=\"Clear search\">\n <i class=\"fas fa-times\"></i>\n </button>\n }\n </div>\n\n <div class=\"sort-group\" role=\"group\" aria-label=\"Sort parameters\">\n <button\n type=\"button\"\n class=\"sort-btn\"\n [class.active]=\"sortKey === 'type'\"\n (click)=\"toggleSort('type')\"\n title=\"Sort by type\">\n Type\n @if (sortKey === 'type') {\n <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-short-wide' : 'fa-arrow-up-wide-short'\"></i>\n }\n </button>\n <button\n type=\"button\"\n class=\"sort-btn\"\n [class.active]=\"sortKey === 'name'\"\n (click)=\"toggleSort('name')\"\n title=\"Sort by name\">\n Name\n @if (sortKey === 'name') {\n <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-a-z' : 'fa-arrow-up-z-a'\"></i>\n }\n </button>\n </div>\n\n <button\n type=\"button\"\n class=\"raw-toggle\"\n [class.active]=\"showRawJson\"\n (click)=\"toggleRawJson()\"\n title=\"Toggle raw JSON view\">\n <i class=\"fas fa-code\"></i>\n Raw\n </button>\n </div>\n </div>\n\n @if (showRawJson) {\n <div class=\"json-viewer raw-json-viewer\">\n <div class=\"json-toolbar\">\n <span class=\"json-label\">Raw JSON</span>\n <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedParams)\">\n <i class=\"fas fa-copy\"></i>\n </button>\n </div>\n <mj-code-editor\n [(ngModel)]=\"formattedParams\"\n name=\"formattedParamsRaw\"\n [readonly]=\"true\"\n [language]=\"'json'\"\n [lineWrapping]=\"true\"\n style=\"height: 360px; width: 100%;\">\n </mj-code-editor>\n </div>\n } @else {\n <!-- Rich param list -->\n @if (filteredParameters.length === 0) {\n <div class=\"empty-filter\">\n <i class=\"fas fa-filter-circle-xmark\"></i>\n <p>No parameters match the current filter.</p>\n <button type=\"button\" class=\"btn-link\" (click)=\"clearFilters()\">\n Clear filters\n </button>\n </div>\n } @else {\n <ul class=\"params-list\">\n @for (p of filteredParameters; track trackParam($index, p)) {\n <li class=\"param-row\" [attr.data-type]=\"p.Type\">\n <div class=\"param-header\">\n <span class=\"type-badge\" [attr.data-type]=\"p.Type\">\n @if (p.Type === 'Input') {\n <i class=\"fas fa-sign-in-alt\"></i>\n } @else if (p.Type === 'Output') {\n <i class=\"fas fa-sign-out-alt\"></i>\n } @else {\n <i class=\"fas fa-exchange-alt\"></i>\n }\n {{ getTypeLabel(p.Type) }}\n </span>\n <div class=\"param-name-wrap\">\n <span class=\"param-name\">{{ p.Name }}</span>\n <span class=\"value-kind-chip\" [attr.data-kind]=\"p.ValueKind\">\n <i class=\"fas\" [ngClass]=\"getValueKindIcon(p.ValueKind)\"></i>\n {{ p.ValueKind }}\n </span>\n </div>\n <div class=\"param-actions\">\n @if (p.IsExpandable) {\n <button type=\"button\" class=\"btn-icon param-expand\" [class.is-expanded]=\"p.Expanded\" (click)=\"toggleExpanded(p)\" [title]=\"p.Expanded ? 'Collapse' : 'Expand'\">\n <i class=\"fas\" [ngClass]=\"p.Expanded ? 'fa-chevron-up' : 'fa-chevron-down'\"></i>\n </button>\n }\n <button type=\"button\" class=\"btn-icon\" (click)=\"copyParamValue(p)\" title=\"Copy value\">\n <i class=\"fas fa-copy\"></i>\n </button>\n </div>\n </div>\n <div class=\"param-preview\" [attr.data-kind]=\"p.ValueKind\">{{ p.Preview }}</div>\n @if (p.IsExpandable && p.Expanded) {\n <div class=\"param-expanded\">\n <mj-code-editor\n [(ngModel)]=\"p.FormattedValue\"\n [name]=\"'param-' + p.Name\"\n [readonly]=\"true\"\n [language]=\"'json'\"\n [lineWrapping]=\"true\"\n style=\"height: 240px; width: 100%;\">\n </mj-code-editor>\n </div>\n }\n </li>\n }\n </ul>\n }\n }\n </div>\n </mj-accordion-panel>\n }\n\n <!-- Output Message -->\n @if (record.Message) {\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-comment-alt\"></i> Output Message\n </ng-template>\n <div class=\"json-viewer\">\n <div class=\"json-toolbar\">\n <span class=\"json-label\">JSON</span>\n <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedMessage)\">\n <i class=\"fas fa-copy\"></i>\n </button>\n </div>\n <mj-code-editor \n [(ngModel)]=\"formattedMessage\"\n name=\"formattedMessage\"\n [readonly]=\"true\"\n [language]=\"'json'\"\n [lineWrapping]=\"true\"\n style=\"height: 300px; width: 100%;\">\n </mj-code-editor>\n </div>\n </mj-accordion-panel>\n }\n\n <!-- Empty States for missing data -->\n @if (!record.Params && !record.Message && !hasAnyParameters) {\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-database\"></i> Execution Data\n </ng-template>\n <div class=\"empty-state\">\n <i class=\"fas fa-inbox\"></i>\n <p>No execution data recorded</p>\n </div>\n </mj-accordion-panel>\n }\n </div>\n </div>\n </div>\n</div>", styles: ["/* Action Execution Log Form Styles */\n:host {\n display: block;\n height: 100%;\n}\n\n.action-execution-log-form {\n height: 100%;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n}\n\n/* Header Styles */\n.header {\n background: var(--mj-bg-surface-card);\n border-bottom: 1px solid var(--mj-border-default);\n padding: 20px;\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 16px;\n}\n\n.header-left {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.icon-wrapper {\n width: 48px;\n height: 48px;\n background: var(--mj-status-info);\n border-radius: var(--mj-radius-lg);\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mj-text-inverse);\n font-size: var(--mj-text-xl);\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info h2 {\n margin: 0;\n font-size: var(--mj-text-2xl);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n}\n\n.meta-info {\n display: flex;\n gap: 12px;\n margin-top: 4px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.action-name {\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.log-id {\n font-family: monospace;\n font-size: var(--mj-text-xs);\n opacity: 0.7;\n}\n\n.header-right {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.status-badge {\n padding: 6px 16px;\n border-radius: var(--mj-radius-full);\n font-size: var(--mj-text-xs);\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-text-inverse);\n}\n\n.execution-time {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.header-stats {\n display: flex;\n gap: 24px;\n padding-top: 12px;\n border-top: 1px solid var(--mj-border-default);\n}\n\n.stat {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat .label {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat .value {\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.record-form {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n}\n\n/* Content Area */\n.content-area {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding: 20px;\n}\n\n/* Details Grid */\n.details-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n padding: 20px;\n}\n\n.detail-item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.detail-item label {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n font-weight: var(--mj-font-semibold);\n}\n\n.detail-value {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--mj-text-primary);\n}\n\n.btn-link {\n background: none;\n border: none;\n color: var(--mj-brand-primary);\n cursor: pointer;\n font-size: var(--mj-text-sm);\n padding: 4px;\n}\n\n.btn-link:hover {\n color: var(--mj-brand-primary-hover);\n}\n\n.loading {\n color: var(--mj-text-muted);\n font-size: var(--mj-text-xs);\n}\n\n/* JSON Viewer */\n.json-viewer {\n padding: 20px;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-md);\n margin-bottom: 20px;\n}\n\n.json-toolbar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 12px;\n}\n\n.json-label {\n background: var(--mj-status-info);\n color: var(--mj-text-inverse);\n padding: 4px 12px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.btn-icon {\n width: 32px;\n height: 32px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-sm);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all var(--mj-transition-base);\n color: var(--mj-text-muted);\n}\n\n.btn-icon:hover {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-secondary);\n}\n\n/* Status badge colors based on data-status attribute */\n.status-badge[data-status=\"success\"],\n.status-badge[data-status=\"ok\"],\n.status-badge[data-status=\"completed\"],\n.status-badge[data-status=\"200\"] {\n background-color: var(--mj-status-success);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"],\n.status-badge[data-status=\"failed\"],\n.status-badge[data-status=\"failure\"] {\n background-color: var(--mj-status-error);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"],\n.status-badge[data-status=\"pending\"] {\n background-color: var(--mj-status-warning);\n color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"],\n.status-badge[data-status=\"running\"] {\n background-color: var(--mj-status-info);\n color: var(--mj-text-inverse);\n}\n\n.status-badge {\n background-color: var(--mj-text-muted);\n color: var(--mj-text-inverse);\n}\n\n/* Panel Bar overrides */\n::ng-deep .k-panelbar {\n background: var(--mj-bg-surface-card) !important;\n border-color: var(--mj-border-default) !important;\n color: var(--mj-text-primary) !important;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-header > .k-link {\n background: var(--mj-bg-surface-elevated) !important;\n color: var(--mj-text-primary) !important;\n border-color: var(--mj-border-default) !important;\n padding: 12px 16px;\n font-weight: var(--mj-font-semibold);\n}\n\n::ng-deep .k-panelbar > .k-panelbar-header > .k-link:hover {\n background: var(--mj-bg-surface-hover) !important;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-header > .k-link .k-icon,\n::ng-deep .k-panelbar > .k-panelbar-header > .k-link .k-svg-icon {\n color: var(--mj-text-muted) !important;\n}\n\n::ng-deep .k-panelbar-item-content,\n::ng-deep .k-panelbar > .k-item > .k-animation-container .k-panelbar-item-content {\n padding: 0;\n background: var(--mj-bg-surface-card) !important;\n color: var(--mj-text-primary) !important;\n border-color: var(--mj-border-default) !important;\n}\n\n.k-panelbar > .k-item > .k-link i {\n margin-right: 8px;\n color: var(--mj-text-muted);\n}\n\n/* Empty state */\n.empty-state {\n text-align: center;\n padding: 40px;\n color: var(--mj-text-muted);\n}\n\n.empty-state i {\n font-size: var(--mj-text-5xl);\n opacity: 0.3;\n margin-bottom: 16px;\n}\n\n.monospace {\n font-family: 'Courier New', Courier, monospace;\n font-size: var(--mj-text-xs);\n}\n\n/* ============================================================\n Unified Parameters Panel\n ============================================================ */\n\n.param-count-pill {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 22px;\n height: 22px;\n padding: 0 7px;\n margin-left: 8px;\n border-radius: var(--mj-radius-full);\n background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n letter-spacing: 0.3px;\n}\n\n.params-panel {\n padding: 18px 20px 22px;\n}\n\n/* Toolbar --------------------------------------------------------------- */\n.params-toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: 14px;\n align-items: center;\n justify-content: space-between;\n padding: 12px 14px;\n margin-bottom: 14px;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips {\n display: flex;\n gap: 6px;\n flex-wrap: wrap;\n}\n\n.chip {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 6px 13px;\n border-radius: var(--mj-radius-full);\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.chip:hover:not(:disabled) {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-primary);\n}\n.chip:disabled {\n opacity: 0.45;\n cursor: not-allowed;\n}\n.chip .chip-count {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 20px;\n height: 18px;\n padding: 0 6px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n}\n.chip i {\n font-size: 11px;\n}\n\n.chip.active {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active .chip-count {\n background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n color: var(--mj-text-inverse);\n}\n\n/* Chip type flavors (active state tints per Input/Output/Both). */\n.chip.chip-input.active {\n background: var(--mj-status-info);\n border-color: var(--mj-status-info);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active {\n background: var(--mj-status-success);\n border-color: var(--mj-status-success);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active {\n background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.search-wrapper {\n position: relative;\n display: flex;\n align-items: center;\n}\n.search-icon {\n position: absolute;\n left: 10px;\n color: var(--mj-text-muted);\n font-size: 12px;\n pointer-events: none;\n}\n.params-search {\n min-width: 220px;\n padding: 7px 30px 7px 30px;\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n}\n.search-clear {\n position: absolute;\n right: 6px;\n width: 22px;\n height: 22px;\n border: none;\n background: transparent;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.search-clear:hover {\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface-hover);\n}\n\n.sort-group {\n display: inline-flex;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface);\n}\n.sort-btn {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: background var(--mj-transition-base);\n}\n.sort-btn + .sort-btn {\n border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n.sort-btn.active i { color: var(--mj-brand-primary); }\n\n.raw-toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.raw-toggle:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n/* Param list rows -------------------------------------------------------- */\n.params-list {\n list-style: none;\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.param-row {\n background: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-left: 3px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n padding: 12px 14px;\n transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row:hover {\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"] { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"] { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.type-badge {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 3px 10px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.4px;\n flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"] {\n background: var(--mj-status-info-bg);\n color: var(--mj-status-info-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"] {\n background: var(--mj-status-success-bg);\n color: var(--mj-status-success-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap {\n flex: 1;\n display: flex;\n align-items: center;\n gap: 10px;\n min-width: 0;\n}\n.param-name {\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.value-kind-chip {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 2px 8px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 10px;\n font-weight: var(--mj-font-medium);\n text-transform: lowercase;\n letter-spacing: 0.3px;\n flex-shrink: 0;\n}\n.value-kind-chip i { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"] { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"],\n.value-kind-chip[data-kind=\"undefined\"] {\n color: var(--mj-text-disabled);\n background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions {\n display: flex;\n gap: 4px;\n flex-shrink: 0;\n}\n.param-actions .btn-icon {\n width: 28px;\n height: 28px;\n}\n.param-expand.is-expanded {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview {\n margin-top: 8px;\n padding-left: calc(64px + 12px); /* align under param name (after type badge) */\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-secondary);\n word-break: break-word;\n line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"] { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"] { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"] { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"],\n.param-preview[data-kind=\"undefined\"] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"],\n.param-preview[data-kind=\"object\"] { color: var(--mj-brand-primary); }\n\n.param-expanded {\n margin-top: 10px;\n margin-left: calc(64px + 12px);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer { margin-top: 4px; }\n\n.empty-filter {\n text-align: center;\n padding: 36px 20px;\n color: var(--mj-text-muted);\n background: var(--mj-bg-surface-sunken);\n border: 1px dashed var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n}\n.empty-filter i {\n font-size: var(--mj-text-3xl);\n margin-bottom: 12px;\n opacity: 0.5;\n}\n.empty-filter p {\n margin: 0 0 12px;\n font-size: var(--mj-text-sm);\n}\n\n/* Responsive adjustments */\n@media (max-width: 768px) {\n .header-content {\n flex-direction: column;\n gap: 16px;\n }\n\n .header-stats {\n flex-wrap: wrap;\n }\n\n .details-grid {\n grid-template-columns: 1fr;\n }\n\n .params-toolbar {\n flex-direction: column;\n align-items: stretch;\n }\n .toolbar-right {\n justify-content: space-between;\n }\n .params-search { min-width: 0; width: 100%; }\n .search-wrapper { flex: 1; }\n\n .param-preview,\n .param-expanded {\n padding-left: 0;\n margin-left: 0;\n }\n}\n"] }]
842
+ args: [{ standalone: false, selector: 'mj-action-execution-log-form', template: "<div class=\"record-form-container action-execution-log-form\" style=\"height: 100%; display: flex; flex-direction: column;\">\n <div class=\"record-form\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n <!-- Header -->\n <div class=\"header\">\n <div class=\"header-content\">\n <div class=\"header-left\">\n <div class=\"icon-wrapper\">\n <i class=\"fas fa-terminal\"></i>\n </div>\n <div class=\"header-info\">\n <h2>Action Execution Log</h2>\n <div class=\"meta-info\">\n @if (action) {\n <span class=\"action-name\">{{ action.Name }}</span>\n }\n <span class=\"log-id\">{{ record.ID }}</span>\n </div>\n </div>\n </div>\n <div class=\"header-right\">\n <div class=\"status-badge\" [attr.data-status]=\"record.ResultCode?.toLowerCase()\">\n <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\"></i>\n {{ record.ResultCode || 'UNKNOWN' }}\n </div>\n <div class=\"execution-time\">\n <i class=\"fas fa-clock\"></i>\n {{ formatDuration(getExecutionDuration()) }}\n </div>\n </div>\n </div>\n <div class=\"header-stats\">\n <div class=\"stat\">\n <span class=\"label\">Started</span>\n <span class=\"value\">{{ record.StartedAt | date:'short' }}</span>\n </div>\n @if (record.EndedAt) {\n <div class=\"stat\">\n <span class=\"label\">Ended</span>\n <span class=\"value\">{{ record.EndedAt | date:'short' }}</span>\n </div>\n }\n @if (action) {\n <div class=\"stat\">\n <span class=\"label\">Action</span>\n <span class=\"value\">\n <button class=\"btn-link\" (click)=\"navigateToAction()\">\n {{ action.Name }}\n <i class=\"fas fa-external-link-alt\"></i>\n </button>\n </span>\n </div>\n }\n @if (user) {\n <div class=\"stat\">\n <span class=\"label\">User</span>\n <span class=\"value\">\n <button class=\"btn-link\" (click)=\"navigateToUser()\">\n {{ user.Name }}\n <i class=\"fas fa-external-link-alt\"></i>\n </button>\n </span>\n </div>\n }\n </div>\n </div>\n\n <!-- Content Area -->\n <div class=\"content-area\">\n <div class=\"accordion-container\">\n <!-- Execution Details -->\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-info-circle\"></i> Execution Details\n </ng-template>\n <div class=\"details-grid\">\n <div class=\"detail-item\">\n <label>Execution ID</label>\n <span class=\"monospace\">{{ record.ID }}</span>\n </div>\n <div class=\"detail-item\">\n <label>Action ID</label>\n <span class=\"monospace\">{{ record.ActionID }}</span>\n </div>\n <div class=\"detail-item\">\n <label>User ID</label>\n <span class=\"monospace\">{{ record.UserID }}</span>\n </div>\n <div class=\"detail-item\">\n <label>Result Code</label>\n <span class=\"detail-value\">\n <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\" [style.color]=\"getResultCodeColor()\"></i>\n <span [style.color]=\"getResultCodeColor()\">{{ record.ResultCode || 'N/A' }}</span>\n </span>\n </div>\n <div class=\"detail-item\">\n <label>Duration</label>\n <span>{{ formatDuration(getExecutionDuration()) }}</span>\n </div>\n <div class=\"detail-item\">\n <label>Retention Period</label>\n <span>{{ record.RetentionPeriod ? record.RetentionPeriod + ' days' : 'Indefinite' }}</span>\n </div>\n </div>\n </mj-accordion-panel>\n\n <!-- Unified Parameters section -->\n @if (hasAnyParameters) {\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-sliders-h\"></i>\n Parameters\n <span class=\"param-count-pill\">{{ paramCounts.All }}</span>\n </ng-template>\n <div class=\"params-panel\">\n <!-- Toolbar: filter chips, search, sort, raw toggle -->\n <div class=\"params-toolbar\">\n <div class=\"filter-chips\">\n <button\n type=\"button\"\n class=\"chip\"\n [class.active]=\"typeFilter === 'All'\"\n (click)=\"setTypeFilter('All')\">\n All <span class=\"chip-count\">{{ paramCounts.All }}</span>\n </button>\n <button\n type=\"button\"\n class=\"chip chip-input\"\n [class.active]=\"typeFilter === 'Input'\"\n [disabled]=\"paramCounts.Input === 0\"\n (click)=\"setTypeFilter('Input')\">\n <i class=\"fas fa-sign-in-alt\"></i>\n Input <span class=\"chip-count\">{{ paramCounts.Input }}</span>\n </button>\n <button\n type=\"button\"\n class=\"chip chip-both\"\n [class.active]=\"typeFilter === 'Both'\"\n [disabled]=\"paramCounts.Both === 0\"\n (click)=\"setTypeFilter('Both')\">\n <i class=\"fas fa-exchange-alt\"></i>\n In/Out <span class=\"chip-count\">{{ paramCounts.Both }}</span>\n </button>\n <button\n type=\"button\"\n class=\"chip chip-output\"\n [class.active]=\"typeFilter === 'Output'\"\n [disabled]=\"paramCounts.Output === 0\"\n (click)=\"setTypeFilter('Output')\">\n <i class=\"fas fa-sign-out-alt\"></i>\n Output <span class=\"chip-count\">{{ paramCounts.Output }}</span>\n </button>\n </div>\n\n <div class=\"toolbar-right\">\n <div class=\"search-wrapper\">\n <i class=\"fas fa-search search-icon\"></i>\n <input\n type=\"text\"\n class=\"mj-input params-search\"\n placeholder=\"Search name or value\u2026\"\n [(ngModel)]=\"searchText\"\n name=\"paramSearch\" />\n @if (searchText) {\n <button type=\"button\" class=\"search-clear\" (click)=\"searchText = ''\" title=\"Clear search\">\n <i class=\"fas fa-times\"></i>\n </button>\n }\n </div>\n\n <div class=\"sort-group\" role=\"group\" aria-label=\"Sort parameters\">\n <button\n type=\"button\"\n class=\"sort-btn\"\n [class.active]=\"sortKey === 'type'\"\n (click)=\"toggleSort('type')\"\n title=\"Sort by type\">\n Type\n @if (sortKey === 'type') {\n <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-short-wide' : 'fa-arrow-up-wide-short'\"></i>\n }\n </button>\n <button\n type=\"button\"\n class=\"sort-btn\"\n [class.active]=\"sortKey === 'name'\"\n (click)=\"toggleSort('name')\"\n title=\"Sort by name\">\n Name\n @if (sortKey === 'name') {\n <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-a-z' : 'fa-arrow-up-z-a'\"></i>\n }\n </button>\n </div>\n\n <button\n type=\"button\"\n class=\"raw-toggle\"\n [class.active]=\"showRawJson\"\n (click)=\"toggleRawJson()\"\n title=\"Toggle raw JSON view\">\n <i class=\"fas fa-code\"></i>\n Raw\n </button>\n </div>\n </div>\n\n @if (showRawJson) {\n <div class=\"json-viewer raw-json-viewer\">\n <div class=\"json-toolbar\">\n <span class=\"json-label\">Raw JSON</span>\n <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedParams)\">\n <i class=\"fas fa-copy\"></i>\n </button>\n </div>\n <mj-code-editor\n [(ngModel)]=\"formattedParams\"\n name=\"formattedParamsRaw\"\n [readonly]=\"true\"\n [language]=\"'json'\"\n [lineWrapping]=\"true\"\n style=\"height: 360px; width: 100%;\">\n </mj-code-editor>\n </div>\n } @else {\n <!-- Rich param list -->\n @if (filteredParameters.length === 0) {\n <div class=\"empty-filter\">\n <i class=\"fas fa-filter-circle-xmark\"></i>\n <p>No parameters match the current filter.</p>\n <button type=\"button\" class=\"btn-link\" (click)=\"clearFilters()\">\n Clear filters\n </button>\n </div>\n } @else {\n <ul class=\"params-list\">\n @for (p of filteredParameters; track trackParam($index, p)) {\n <li class=\"param-row\" [attr.data-type]=\"p.Type\">\n <div class=\"param-header\">\n <span class=\"type-badge\" [attr.data-type]=\"p.Type\">\n @if (p.Type === 'Input') {\n <i class=\"fas fa-sign-in-alt\"></i>\n } @else if (p.Type === 'Output') {\n <i class=\"fas fa-sign-out-alt\"></i>\n } @else {\n <i class=\"fas fa-exchange-alt\"></i>\n }\n {{ getTypeLabel(p.Type) }}\n </span>\n <div class=\"param-name-wrap\">\n <span class=\"param-name\">{{ p.Name }}</span>\n <span class=\"value-kind-chip\" [attr.data-kind]=\"p.ValueKind\">\n <i class=\"fas\" [ngClass]=\"getValueKindIcon(p.ValueKind)\"></i>\n {{ p.ValueKind }}\n </span>\n </div>\n <div class=\"param-actions\">\n @if (p.IsExpandable) {\n <button type=\"button\" class=\"btn-icon param-expand\" [class.is-expanded]=\"p.Expanded\" (click)=\"toggleExpanded(p)\" [title]=\"p.Expanded ? 'Collapse' : 'Expand'\">\n <i class=\"fas\" [ngClass]=\"p.Expanded ? 'fa-chevron-up' : 'fa-chevron-down'\"></i>\n </button>\n }\n <button type=\"button\" class=\"btn-icon\" (click)=\"copyParamValue(p)\" title=\"Copy value\">\n <i class=\"fas fa-copy\"></i>\n </button>\n </div>\n </div>\n <div class=\"param-preview\" [attr.data-kind]=\"p.ValueKind\">{{ p.Preview }}</div>\n @if (p.IsExpandable && p.Expanded) {\n <div class=\"param-expanded\">\n <mj-code-editor\n [(ngModel)]=\"p.FormattedValue\"\n [name]=\"'param-' + p.Name\"\n [readonly]=\"true\"\n [language]=\"'json'\"\n [lineWrapping]=\"true\"\n style=\"height: 240px; width: 100%;\">\n </mj-code-editor>\n </div>\n }\n </li>\n }\n </ul>\n }\n }\n </div>\n </mj-accordion-panel>\n }\n\n <!-- Output Message -->\n @if (record.Message) {\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-comment-alt\"></i> Output Message\n </ng-template>\n <div class=\"json-viewer\">\n <div class=\"json-toolbar\">\n <span class=\"json-label\">JSON</span>\n <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedMessage)\">\n <i class=\"fas fa-copy\"></i>\n </button>\n </div>\n <mj-code-editor \n [(ngModel)]=\"formattedMessage\"\n name=\"formattedMessage\"\n [readonly]=\"true\"\n [language]=\"'json'\"\n [lineWrapping]=\"true\"\n style=\"height: 300px; width: 100%;\">\n </mj-code-editor>\n </div>\n </mj-accordion-panel>\n }\n\n <!-- Empty States for missing data -->\n @if (!record.Params && !record.Message && !hasAnyParameters) {\n <mj-accordion-panel [Expanded]=\"true\">\n <ng-template mjAccordionTitle>\n <i class=\"fas fa-database\"></i> Execution Data\n </ng-template>\n <div class=\"empty-state\">\n <i class=\"fas fa-inbox\"></i>\n <p>No execution data recorded</p>\n </div>\n </mj-accordion-panel>\n }\n </div>\n </div>\n </div>\n</div>", styles: ["/* Action Execution Log Form Styles */\n:host {\n display: block;\n height: 100%;\n}\n\n.action-execution-log-form {\n height: 100%;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n}\n\n/* Header Styles */\n.header {\n background: var(--mj-bg-surface-card);\n border-bottom: 1px solid var(--mj-border-default);\n padding: 20px;\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 16px;\n}\n\n.header-left {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.icon-wrapper {\n width: 48px;\n height: 48px;\n background: var(--mj-status-info);\n border-radius: var(--mj-radius-lg);\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mj-text-inverse);\n font-size: var(--mj-text-xl);\n box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info h2 {\n margin: 0;\n font-size: var(--mj-text-2xl);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n}\n\n.meta-info {\n display: flex;\n gap: 12px;\n margin-top: 4px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.action-name {\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.log-id {\n font-family: monospace;\n font-size: var(--mj-text-xs);\n opacity: 0.7;\n}\n\n.header-right {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.status-badge {\n padding: 6px 16px;\n border-radius: var(--mj-radius-full);\n font-size: var(--mj-text-xs);\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-text-inverse);\n}\n\n.execution-time {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-muted);\n}\n\n.header-stats {\n display: flex;\n gap: 24px;\n padding-top: 12px;\n border-top: 1px solid var(--mj-border-default);\n}\n\n.stat {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat .label {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat .value {\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n color: var(--mj-text-secondary);\n}\n\n.record-form {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n}\n\n/* Content Area */\n.content-area {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding: 20px;\n}\n\n/* Details Grid */\n.details-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n padding: 20px;\n}\n\n.detail-item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.detail-item label {\n font-size: var(--mj-text-xs);\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n font-weight: var(--mj-font-semibold);\n}\n\n.detail-value {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--mj-text-primary);\n}\n\n.btn-link {\n background: none;\n border: none;\n color: var(--mj-brand-primary);\n cursor: pointer;\n font-size: var(--mj-text-sm);\n padding: 4px;\n}\n\n.btn-link:hover {\n color: var(--mj-brand-primary-hover);\n}\n\n.loading {\n color: var(--mj-text-muted);\n font-size: var(--mj-text-xs);\n}\n\n/* JSON Viewer */\n.json-viewer {\n padding: 20px;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-md);\n margin-bottom: 20px;\n}\n\n.json-toolbar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 12px;\n}\n\n.json-label {\n background: var(--mj-status-info);\n color: var(--mj-text-inverse);\n padding: 4px 12px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.btn-icon {\n width: 32px;\n height: 32px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n border-radius: var(--mj-radius-sm);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all var(--mj-transition-base);\n color: var(--mj-text-muted);\n}\n\n.btn-icon:hover {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-secondary);\n}\n\n/* Status badge colors based on data-status attribute */\n.status-badge[data-status=\"success\"],\n.status-badge[data-status=\"ok\"],\n.status-badge[data-status=\"completed\"],\n.status-badge[data-status=\"200\"] {\n background-color: var(--mj-status-success);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"],\n.status-badge[data-status=\"failed\"],\n.status-badge[data-status=\"failure\"] {\n background-color: var(--mj-status-error);\n color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"],\n.status-badge[data-status=\"pending\"] {\n background-color: var(--mj-status-warning);\n color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"],\n.status-badge[data-status=\"running\"] {\n background-color: var(--mj-status-info);\n color: var(--mj-text-inverse);\n}\n\n.status-badge {\n background-color: var(--mj-text-muted);\n color: var(--mj-text-inverse);\n}\n\n/* Empty state */\n.empty-state {\n text-align: center;\n padding: 40px;\n color: var(--mj-text-muted);\n}\n\n.empty-state i {\n font-size: var(--mj-text-5xl);\n opacity: 0.3;\n margin-bottom: 16px;\n}\n\n.monospace {\n font-family: 'Courier New', Courier, monospace;\n font-size: var(--mj-text-xs);\n}\n\n/* ============================================================\n Unified Parameters Panel\n ============================================================ */\n\n.param-count-pill {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 22px;\n height: 22px;\n padding: 0 7px;\n margin-left: 8px;\n border-radius: var(--mj-radius-full);\n background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n letter-spacing: 0.3px;\n}\n\n.params-panel {\n padding: 18px 20px 22px;\n}\n\n/* Toolbar --------------------------------------------------------------- */\n.params-toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: 14px;\n align-items: center;\n justify-content: space-between;\n padding: 12px 14px;\n margin-bottom: 14px;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips {\n display: flex;\n gap: 6px;\n flex-wrap: wrap;\n}\n\n.chip {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 6px 13px;\n border-radius: var(--mj-radius-full);\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.chip:hover:not(:disabled) {\n background: var(--mj-bg-surface-hover);\n border-color: var(--mj-border-strong);\n color: var(--mj-text-primary);\n}\n.chip:disabled {\n opacity: 0.45;\n cursor: not-allowed;\n}\n.chip .chip-count {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 20px;\n height: 18px;\n padding: 0 6px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n}\n.chip i {\n font-size: 11px;\n}\n\n.chip.active {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse);\n border-color: var(--mj-brand-primary);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active .chip-count {\n background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n color: var(--mj-text-inverse);\n}\n\n/* Chip type flavors (active state tints per Input/Output/Both). */\n.chip.chip-input.active {\n background: var(--mj-status-info);\n border-color: var(--mj-status-info);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active {\n background: var(--mj-status-success);\n border-color: var(--mj-status-success);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active {\n background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.search-wrapper {\n position: relative;\n display: flex;\n align-items: center;\n}\n.search-icon {\n position: absolute;\n left: 10px;\n color: var(--mj-text-muted);\n font-size: 12px;\n pointer-events: none;\n}\n.params-search {\n min-width: 220px;\n padding: 7px 30px 7px 30px;\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n}\n.search-clear {\n position: absolute;\n right: 6px;\n width: 22px;\n height: 22px;\n border: none;\n background: transparent;\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n}\n.search-clear:hover {\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface-hover);\n}\n\n.sort-group {\n display: inline-flex;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface);\n}\n.sort-btn {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: background var(--mj-transition-base);\n}\n.sort-btn + .sort-btn {\n border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n.sort-btn.active i { color: var(--mj-brand-primary); }\n\n.raw-toggle {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 7px 12px;\n border: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n border-radius: var(--mj-radius-md);\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-medium);\n cursor: pointer;\n transition: all var(--mj-transition-base);\n}\n.raw-toggle:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n/* Param list rows -------------------------------------------------------- */\n.params-list {\n list-style: none;\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.param-row {\n background: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-left: 3px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n padding: 12px 14px;\n transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row:hover {\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"] { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"] { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.type-badge {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 3px 10px;\n border-radius: var(--mj-radius-full);\n font-size: 11px;\n font-weight: var(--mj-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.4px;\n flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"] {\n background: var(--mj-status-info-bg);\n color: var(--mj-status-info-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"] {\n background: var(--mj-status-success-bg);\n color: var(--mj-status-success-text);\n border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap {\n flex: 1;\n display: flex;\n align-items: center;\n gap: 10px;\n min-width: 0;\n}\n.param-name {\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n font-weight: var(--mj-font-semibold);\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.value-kind-chip {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 2px 8px;\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-muted);\n border-radius: var(--mj-radius-full);\n font-size: 10px;\n font-weight: var(--mj-font-medium);\n text-transform: lowercase;\n letter-spacing: 0.3px;\n flex-shrink: 0;\n}\n.value-kind-chip i { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"] { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"] { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"],\n.value-kind-chip[data-kind=\"undefined\"] {\n color: var(--mj-text-disabled);\n background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions {\n display: flex;\n gap: 4px;\n flex-shrink: 0;\n}\n.param-actions .btn-icon {\n width: 28px;\n height: 28px;\n}\n.param-expand.is-expanded {\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview {\n margin-top: 8px;\n padding-left: calc(64px + 12px); /* align under param name (after type badge) */\n font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n font-size: var(--mj-text-sm);\n color: var(--mj-text-secondary);\n word-break: break-word;\n line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"] { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"] { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"] { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"],\n.param-preview[data-kind=\"undefined\"] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"],\n.param-preview[data-kind=\"object\"] { color: var(--mj-brand-primary); }\n\n.param-expanded {\n margin-top: 10px;\n margin-left: calc(64px + 12px);\n border: 1px solid var(--mj-border-subtle);\n border-radius: var(--mj-radius-md);\n overflow: hidden;\n background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer { margin-top: 4px; }\n\n.empty-filter {\n text-align: center;\n padding: 36px 20px;\n color: var(--mj-text-muted);\n background: var(--mj-bg-surface-sunken);\n border: 1px dashed var(--mj-border-default);\n border-radius: var(--mj-radius-md);\n}\n.empty-filter i {\n font-size: var(--mj-text-3xl);\n margin-bottom: 12px;\n opacity: 0.5;\n}\n.empty-filter p {\n margin: 0 0 12px;\n font-size: var(--mj-text-sm);\n}\n\n/* Responsive adjustments */\n@media (max-width: 768px) {\n .header-content {\n flex-direction: column;\n gap: 16px;\n }\n\n .header-stats {\n flex-wrap: wrap;\n }\n\n .details-grid {\n grid-template-columns: 1fr;\n }\n\n .params-toolbar {\n flex-direction: column;\n align-items: stretch;\n }\n .toolbar-right {\n justify-content: space-between;\n }\n .params-search { min-width: 0; width: 100%; }\n .search-wrapper { flex: 1; }\n\n .param-preview,\n .param-expanded {\n padding-left: 0;\n margin-left: 0;\n }\n}\n"] }]
843
843
  }], null, null); })();
844
844
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJActionExecutionLogFormComponentExtended, { className: "MJActionExecutionLogFormComponentExtended", filePath: "src/lib/custom/Actions/action-execution-log-form.component.ts", lineNumber: 35 }); })();
845
845
  //# sourceMappingURL=action-execution-log-form.component.js.map