@perses-dev/alert-manager-plugin 0.1.0 → 0.2.0-beta.1

package/lib/cjs/plugins/alert-table/AlertTableColumnsEditor.js

@@ -1,110 +0,0 @@
-// Copyright The Perses Authors
-// Licensed under the Apache License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License.
-// You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "AlertTableColumnsEditor", {
-    enumerable: true,
-    get: function() {
-        return AlertTableColumnsEditor;
-    }
-});
-const _jsxruntime = require("react/jsx-runtime");
-const _material = require("@mui/material");
-const _immer = require("immer");
-const _react = require("react");
-const _ColumnsEditor = require("../../components/ColumnsEditor");
-const SORT_MODE_LABELS = {
-    alphabetical: 'Alphabetical',
-    numeric: 'Numeric',
-    severity: 'Severity (critical → other)',
-    status: 'Status (firing → resolved)'
-};
-function AlertTableColumnsEditor(props) {
-    const { value, onChange } = props;
-    const columns = value.columns ?? [];
-    const handleAddColumn = (0, _react.useCallback)(()=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            if (!draft.columns) draft.columns = [];
-            draft.columns.push({
-                name: ''
-            });
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleRemoveColumn = (0, _react.useCallback)((index)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            draft.columns?.splice(index, 1);
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleUpdateColumn = (0, _react.useCallback)((index, updater)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            const column = draft.columns?.[index];
-            if (column) {
-                updater(column);
-            }
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleMoveUp = (0, _react.useCallback)((index)=>{
-        if (index <= 0) return;
-        onChange((0, _immer.produce)(value, (draft)=>{
-            if (!draft.columns) return;
-            const item = draft.columns.splice(index, 1)[0];
-            draft.columns.splice(index - 1, 0, item);
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleMoveDown = (0, _react.useCallback)((index)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            if (!draft.columns || index >= draft.columns.length - 1) return;
-            const item = draft.columns.splice(index, 1)[0];
-            draft.columns.splice(index + 1, 0, item);
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_ColumnsEditor.ColumnsEditor, {
-        columns: columns,
-        description: "Status and Alert Name are always shown. Add extra columns below.",
-        sortModeLabels: SORT_MODE_LABELS,
-        defaultSortMode: "alphabetical",
-        getDisplayName: (col)=>col.header || col.name || 'New column',
-        getHeaderPlaceholder: (col)=>col.name || 'Column header',
-        onAdd: handleAddColumn,
-        onRemove: handleRemoveColumn,
-        onUpdate: handleUpdateColumn,
-        onMoveUp: handleMoveUp,
-        onMoveDown: handleMoveDown,
-        renderNameField: (col, index, onUpdate)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
-                label: "Label key",
-                value: col.name,
-                onChange: (e)=>onUpdate(index, (draft)=>{
-                        draft.name = e.target.value;
-                    }),
-                size: "small",
-                fullWidth: true
-            })
-    });
-}

package/lib/cjs/plugins/alert-table/AlertTableDeduplicationEditor.js

@@ -1,138 +0,0 @@
-// Copyright The Perses Authors
-// Licensed under the Apache License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License.
-// You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "AlertTableDeduplicationEditor", {
-    enumerable: true,
-    get: function() {
-        return AlertTableDeduplicationEditor;
-    }
-});
-const _jsxruntime = require("react/jsx-runtime");
-const _material = require("@mui/material");
-const _components = require("@perses-dev/components");
-const _immer = require("immer");
-const _react = require("react");
-const MODE_DESCRIPTIONS = {
-    none: 'No deduplication. All alerts from all datasources are shown as-is.',
-    fingerprint: 'Alerts with the same fingerprint from different datasources are merged. This is the default.',
-    labels: 'Alerts are considered duplicates when all specified label values match.'
-};
-function AlertTableDeduplicationEditor(props) {
-    const { value, onChange } = props;
-    const dedup = value.deduplication ?? {
-        mode: 'fingerprint'
-    };
-    const handleModeChange = (0, _react.useCallback)((mode)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            draft.deduplication = {
-                mode
-            };
-            if (mode === 'labels') {
-                draft.deduplication.labels = draft.deduplication.labels ?? [];
-            }
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleLabelsChange = (0, _react.useCallback)((_event, newLabels)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            if (!draft.deduplication) {
-                draft.deduplication = {
-                    mode: 'labels'
-                };
-            }
-            draft.deduplication.labels = newLabels.length > 0 ? newLabels : undefined;
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-        children: [
-            /*#__PURE__*/ (0, _jsxruntime.jsxs)(_components.OptionsEditorGroup, {
-                title: "Mode",
-                children: [
-                    /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.FormControl, {
-                        size: "small",
-                        fullWidth: true,
-                        children: [
-                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.InputLabel, {
-                                id: "dedup-mode-label",
-                                children: "Deduplication Mode"
-                            }),
-                            /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Select, {
-                                labelId: "dedup-mode-label",
-                                value: dedup.mode,
-                                label: "Deduplication Mode",
-                                onChange: (e)=>handleModeChange(e.target.value),
-                                children: [
-                                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
-                                        value: "none",
-                                        children: "None"
-                                    }),
-                                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
-                                        value: "fingerprint",
-                                        children: "Fingerprint"
-                                    }),
-                                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
-                                        value: "labels",
-                                        children: "Labels"
-                                    })
-                                ]
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Typography, {
-                        variant: "body2",
-                        color: "text.secondary",
-                        sx: {
-                            mt: 1
-                        },
-                        children: MODE_DESCRIPTIONS[dedup.mode]
-                    })
-                ]
-            }),
-            dedup.mode === 'labels' && /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorGroup, {
-                title: "Deduplication Labels",
-                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Autocomplete, {
-                    multiple: true,
-                    freeSolo: true,
-                    options: [],
-                    value: dedup.labels ?? [],
-                    onChange: handleLabelsChange,
-                    renderTags: (tagValues, getTagProps)=>tagValues.map((option, index)=>{
-                            const { key, ...rest } = getTagProps({
-                                index
-                            });
-                            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Chip, {
-                                label: option,
-                                size: "small",
-                                variant: "outlined",
-                                ...rest
-                            }, key);
-                        }),
-                    renderInput: (params)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
-                            ...params,
-                            size: "small",
-                            placeholder: "Type a label key and press Enter",
-                            helperText: "Alerts with identical values for all listed labels are considered duplicates."
-                        })
-                })
-            })
-        ]
-    });
-}

package/lib/cjs/plugins/alert-table/AlertTableLabelsEditor.js

@@ -1,277 +0,0 @@
-// Copyright The Perses Authors
-// Licensed under the Apache License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License.
-// You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "AlertTableLabelsEditor", {
-    enumerable: true,
-    get: function() {
-        return AlertTableLabelsEditor;
-    }
-});
-const _jsxruntime = require("react/jsx-runtime");
-const _material = require("@mui/material");
-const _components = require("@perses-dev/components");
-const _immer = require("immer");
-const _Delete = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/Delete"));
-const _Plus = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/Plus"));
-const _react = require("react");
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
-const MODE_LABELS = {
-    auto: 'Auto (hash-derived colors)',
-    severity: 'Severity (built-in defaults)',
-    manual: 'Manual (overrides only)'
-};
-function LabelMappingEntry({ mapping, index, onUpdate, onRemove }) {
-    const handleAddOverride = (0, _react.useCallback)(()=>{
-        onUpdate(index, (draft)=>{
-            if (!draft.overrides) draft.overrides = [];
-            draft.overrides.push({
-                value: '',
-                isRegex: false,
-                color: '#1976d2'
-            });
-        });
-    }, [
-        index,
-        onUpdate
-    ]);
-    const handleRemoveOverride = (0, _react.useCallback)((overrideIndex)=>{
-        onUpdate(index, (draft)=>{
-            draft.overrides?.splice(overrideIndex, 1);
-        });
-    }, [
-        index,
-        onUpdate
-    ]);
-    const handleUpdateOverride = (0, _react.useCallback)((overrideIndex, field, fieldValue)=>{
-        onUpdate(index, (draft)=>{
-            const override = draft.overrides?.[overrideIndex];
-            if (override) {
-                if (field === 'isRegex') {
-                    override.isRegex = fieldValue;
-                } else {
-                    override[field] = fieldValue;
-                }
-            }
-        });
-    }, [
-        index,
-        onUpdate
-    ]);
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
-        sx: {
-            border: 1,
-            borderColor: 'divider',
-            borderRadius: 1,
-            p: 2
-        },
-        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
-            spacing: 2,
-            children: [
-                /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
-                    direction: "row",
-                    spacing: 1,
-                    alignItems: "center",
-                    justifyContent: "space-between",
-                    children: [
-                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Typography, {
-                            variant: "subtitle2",
-                            children: mapping.labelKey || 'New label'
-                        }),
-                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.IconButton, {
-                            size: "small",
-                            onClick: ()=>onRemove(index),
-                            "aria-label": "Remove label mapping",
-                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Delete.default, {
-                                fontSize: "small"
-                            })
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
-                    label: "Label key",
-                    value: mapping.labelKey,
-                    onChange: (e)=>onUpdate(index, (draft)=>{
-                            draft.labelKey = e.target.value;
-                        }),
-                    size: "small",
-                    fullWidth: true
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.FormControl, {
-                    size: "small",
-                    fullWidth: true,
-                    children: [
-                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.InputLabel, {
-                            id: `color-mode-label-${index}`,
-                            children: "Mode"
-                        }),
-                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Select, {
-                            labelId: `color-mode-label-${index}`,
-                            value: mapping.mode,
-                            onChange: (e)=>onUpdate(index, (draft)=>{
-                                    draft.mode = e.target.value;
-                                }),
-                            label: "Mode",
-                            children: Object.keys(MODE_LABELS).map((mode)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
-                                    value: mode,
-                                    children: MODE_LABELS[mode]
-                                }, mode))
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
-                    children: [
-                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Typography, {
-                            variant: "body2",
-                            color: "text.secondary",
-                            sx: {
-                                mb: 1
-                            },
-                            children: "Overrides"
-                        }),
-                        /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
-                            spacing: 1,
-                            children: [
-                                (mapping.overrides ?? []).map((override, overrideIndex)=>/*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
-                                        direction: "row",
-                                        spacing: 1,
-                                        alignItems: "center",
-                                        children: [
-                                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
-                                                label: "Value / Pattern",
-                                                value: override.value,
-                                                onChange: (e)=>handleUpdateOverride(overrideIndex, 'value', e.target.value),
-                                                size: "small",
-                                                sx: {
-                                                    flex: 1
-                                                }
-                                            }),
-                                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.FormControlLabel, {
-                                                control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Checkbox, {
-                                                    checked: override.isRegex,
-                                                    onChange: (e)=>handleUpdateOverride(overrideIndex, 'isRegex', e.target.checked),
-                                                    size: "small"
-                                                }),
-                                                label: "Regex"
-                                            }),
-                                            /*#__PURE__*/ (0, _jsxruntime.jsx)("input", {
-                                                type: "color",
-                                                value: override.color,
-                                                onChange: (e)=>handleUpdateOverride(overrideIndex, 'color', e.target.value),
-                                                style: {
-                                                    width: 36,
-                                                    height: 28,
-                                                    border: 'none',
-                                                    cursor: 'pointer'
-                                                }
-                                            }),
-                                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.IconButton, {
-                                                size: "small",
-                                                onClick: ()=>handleRemoveOverride(overrideIndex),
-                                                "aria-label": "Remove override",
-                                                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Delete.default, {
-                                                    fontSize: "small"
-                                                })
-                                            })
-                                        ]
-                                    }, overrideIndex)),
-                                /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
-                                    size: "small",
-                                    startIcon: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Plus.default, {}),
-                                    onClick: handleAddOverride,
-                                    children: "Add override"
-                                })
-                            ]
-                        })
-                    ]
-                })
-            ]
-        })
-    });
-}
-function AlertTableLabelsEditor(props) {
-    const { value, onChange } = props;
-    const mappings = value.labelColorMappings ?? [];
-    const handleAddMapping = (0, _react.useCallback)(()=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            if (!draft.labelColorMappings) draft.labelColorMappings = [];
-            draft.labelColorMappings.push({
-                labelKey: '',
-                mode: 'auto'
-            });
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleRemoveMapping = (0, _react.useCallback)((index)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            draft.labelColorMappings?.splice(index, 1);
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleUpdateMapping = (0, _react.useCallback)((index, updater)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            const mapping = draft.labelColorMappings?.[index];
-            if (mapping) {
-                updater(mapping);
-            }
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorGroup, {
-        title: "Label Color Mappings",
-        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
-            spacing: 2,
-            children: [
-                mappings.length === 0 && /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Typography, {
-                    variant: "body2",
-                    color: "text.secondary",
-                    children: "No label color mappings configured. Add one to color label values in the table."
-                }),
-                mappings.map((mapping, index)=>/*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
-                        children: [
-                            index > 0 && /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Divider, {
-                                sx: {
-                                    mb: 2
-                                }
-                            }),
-                            /*#__PURE__*/ (0, _jsxruntime.jsx)(LabelMappingEntry, {
-                                mapping: mapping,
-                                index: index,
-                                onUpdate: handleUpdateMapping,
-                                onRemove: handleRemoveMapping
-                            })
-                        ]
-                    }, index)),
-                /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
-                    variant: "outlined",
-                    size: "small",
-                    startIcon: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Plus.default, {}),
-                    onClick: handleAddMapping,
-                    children: "Add label mapping"
-                })
-            ]
-        })
-    });
-}

package/lib/cjs/plugins/alert-table/AlertTableOptionsEditor.js

@@ -1,128 +0,0 @@
-// Copyright The Perses Authors
-// Licensed under the Apache License, Version 2.0 (the "License");
-// you may not use this file except in compliance with the License.
-// You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing, software
-// distributed under the License is distributed on an "AS IS" BASIS,
-// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-// See the License for the specific language governing permissions and
-// limitations under the License.
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "AlertTableOptionsEditor", {
-    enumerable: true,
-    get: function() {
-        return AlertTableOptionsEditor;
-    }
-});
-const _jsxruntime = require("react/jsx-runtime");
-const _material = require("@mui/material");
-const _components = require("@perses-dev/components");
-const _immer = require("immer");
-const _react = require("react");
-const _alerttablemodel = require("./alert-table-model");
-const ACTION_LABELS = {
-    silence: 'Silence alert',
-    runbook: 'View runbook'
-};
-function AlertTableOptionsEditor(props) {
-    const { value, onChange } = props;
-    const effectiveActions = value.allowedActions ?? _alerttablemodel.ALL_ALERT_ACTIONS;
-    const groupBy = value.defaultGroupBy ?? [
-        'alertname'
-    ];
-    const handleGroupByChange = (0, _react.useCallback)((_event, newValue)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            draft.defaultGroupBy = newValue.length > 0 ? newValue : undefined;
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleRunbookKeyChange = (0, _react.useCallback)((e)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            const trimmed = e.target.value.trim();
-            draft.runbookAnnotationKey = trimmed || undefined;
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    const handleToggle = (0, _react.useCallback)((action, checked)=>{
-        onChange((0, _immer.produce)(value, (draft)=>{
-            const current = draft.allowedActions ?? [
-                ..._alerttablemodel.ALL_ALERT_ACTIONS
-            ];
-            if (checked) {
-                if (!current.includes(action)) current.push(action);
-            } else {
-                const idx = current.indexOf(action);
-                if (idx >= 0) current.splice(idx, 1);
-            }
-            draft.allowedActions = current;
-        }));
-    }, [
-        value,
-        onChange
-    ]);
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-        children: [
-            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorGroup, {
-                title: "Group By",
-                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Autocomplete, {
-                    multiple: true,
-                    freeSolo: true,
-                    options: [],
-                    value: groupBy,
-                    onChange: handleGroupByChange,
-                    renderTags: (tagValues, getTagProps)=>tagValues.map((option, index)=>{
-                            const { key, ...rest } = getTagProps({
-                                index
-                            });
-                            const isVariable = option.includes('$');
-                            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Chip, {
-                                label: option,
-                                size: "small",
-                                variant: isVariable ? 'filled' : 'outlined',
-                                color: isVariable ? 'primary' : 'default',
-                                ...rest
-                            }, key);
-                        }),
-                    renderInput: (params)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
-                            ...params,
-                            size: "small",
-                            placeholder: "Type a label key or $variable and press Enter",
-                            helperText: "Label keys to group alerts by. Supports $variable interpolation."
-                        })
-                })
-            }),
-            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorGroup, {
-                title: "Actions",
-                children: _alerttablemodel.ALL_ALERT_ACTIONS.map((action)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.FormControlLabel, {
-                        control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Checkbox, {
-                            checked: effectiveActions.includes(action),
-                            onChange: (e)=>handleToggle(action, e.target.checked),
-                            size: "small"
-                        }),
-                        label: ACTION_LABELS[action]
-                    }, action))
-            }),
-            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorGroup, {
-                title: "Runbook",
-                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
-                    size: "small",
-                    fullWidth: true,
-                    value: value.runbookAnnotationKey ?? '',
-                    onChange: handleRunbookKeyChange,
-                    placeholder: "runbook_url",
-                    helperText: "Annotation key used to extract the runbook URL. Defaults to runbook_url."
-                })
-            })
-        ]
-    });
-}