@odigos/ui-kit 0.0.63 → 0.0.65

package/lib/{index-1fcb0269.js → index-391844c6.js}

@@ -1,13 +1,6 @@
 import React from 'react';
 import { T as Theme } from './index-bd48e6e2.js';
 
-const ArrowIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
-    const theme = Theme.useTheme();
-    const fill = f || theme.text.secondary;
-    return (React.createElement("svg", { width: size * (9 / 13.5), height: size, viewBox: '0 0 9 13.5', xmlns: 'http://www.w3.org/2000/svg', fill: fill, style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
-        React.createElement("path", { d: 'M0.616717 8.03169L0.616717 5.70699L16.1519 5.70699L16.1519 8.03169L0.616717 8.03169ZM8.11144 -2.81613L9.7262 -1.10502L1.45534 6.87054L9.7262 14.9097L8.17631 16.6208L-1.19268 7.5802L-1.19268 6.1921L8.11144 -2.81613Z' })));
-};
-
 const CodeIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 }) => {
     const theme = Theme.useTheme();
     const fill = f || theme.text.secondary;
@@ -142,4 +135,4 @@ const CrossIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 })
         React.createElement("path", { stroke: fill, strokeWidth: strokeWidth, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M4 12L8 8M8 8L12 4M8 8L4 4M8 8L12 12' })));
 };
 
-export { ArrowIcon as A, CodeIcon as C, EditIcon as E, ListIcon as L, MinusIcon as M, NoDataIcon as N, PlusIcon as P, SearchIcon as S, TrashIcon as T, XIcon as X, CopyIcon as a, EditedIcon as b, ExtendArrowIcon as c, NotebookIcon as d, SortArrowsIcon as e, EyeClosedIcon as f, EyeOpenIcon as g, CheckIcon as h, CrossIcon as i };
+export { CodeIcon as C, EditIcon as E, ListIcon as L, MinusIcon as M, NoDataIcon as N, PlusIcon as P, SearchIcon as S, TrashIcon as T, XIcon as X, CopyIcon as a, EditedIcon as b, ExtendArrowIcon as c, NotebookIcon as d, SortArrowsIcon as e, EyeClosedIcon as f, EyeOpenIcon as g, CheckIcon as h, CrossIcon as i };

package/lib/{index-9e56485b.js → index-42f40e7c.js}

@@ -4,7 +4,7 @@ import 'react';
 import 'styled-components';
 import { A as AlaudaLogo, a as AlibabaCloudLogo, b as AppDynamicsLogo, f as AxiomLogo, g as BlobStorageLogo, B as BetterStackLogo, h as BonreeLogo, C as CauselyLogo, i as ChecklyLogo, j as ChronosphereLogo, k as ClickhouseLogo, c as AwsCloudwatchLogo, l as CoralogixLogo, D as Dash0Logo, m as DatadogLogo, F as OpenTelemetryLogo, n as DynatraceLogo, E as ElasticApmLogo, o as ElasticSearchLogo, p as GoogleCloudPlatformLogo, q as GrafanaLogo, r as GreptimeLogo, s as GroundcoverLogo, H as HoneycombLogo, t as HyperDxLogo, I as InstanaLogo, J as JaegerLogo, K as KloudmateLogo, L as Last9Logo, u as LightstepLogo, v as LogzioLogo, w as LokiLogo, x as LumigoLogo, M as MiddlewareLogo, N as NewRelicLogo, O as ObserveLogo, y as OneUptimeLogo, z as OpenObserveLogo, P as OpsVerseLogo, Q as OracleLogo, R as PrometheusLogo, S as QrynLogo, G as GigapipeLogo, T as QuickwitLogo, d as AwsS3Logo, U as SeqLogo, W as SignozLogo, X as SplunkLogo, Y as SumoLogicLogo, Z as TelemetryHubLogo, _ as TempoLogo, $ as TingyunLogo, a0 as TraceloopLogo, a1 as UptraceLogo, a2 as VictoriaMetricsLogo, e as AwsXrayLogo, a5 as NamespacesIcon, a7 as SourcesIcon, a4 as DestinationsIcon, a3 as ActionsIcon, a6 as RulesIcon, V as VmLogo } from './index-acc7c7dd.js';
 import { O as OdigosLogo } from './index-50101bec.js';
-import { s as safeJsonParse } from './index-ec555530.js';
+import { s as safeJsonParse } from './index-5e5f7bda.js';
 
 const compareCondition = (renderCondition, fields) => {
     if (!renderCondition || !renderCondition.length)
@@ -38,11 +38,6 @@ const compareCondition = (renderCondition, fields) => {
     }
 };
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const deepClone = (item) => {
-    return JSON.parse(JSON.stringify(item));
-};
-
 const filterActions = (actions, filters) => {
     let filtered = [...actions];
     if (!!filters.monitors?.length)
@@ -327,4 +322,4 @@ const mapDestinationFieldsForDisplay = (destination, yamlFields) => {
 
 const sleep = async (ms = 1000) => new Promise((resolve) => setTimeout(resolve, ms));
 
-export { filterDestinations as a, filterDestinationsByStream as b, compareCondition as c, deepClone as d, filterSources as e, filterActions as f, filterSourcesByStream as g, formatBytes as h, getContainersInstrumentedCount as i, getContainersIcons as j, getDestinationIcon as k, getEntityIcon as l, getEntityLabel as m, getMetricForEntity as n, getPlatformIcon as o, getPlatformLabel as p, getValueForRange as q, getWorkloadId as r, getYamlFieldsForDestination as s, hasUnhealthyInstances as t, isOverTime as u, mapDestinationFieldsForDisplay as v, sleep as w };
+export { filterDestinations as a, filterDestinationsByStream as b, compareCondition as c, filterSources as d, filterSourcesByStream as e, filterActions as f, formatBytes as g, getContainersInstrumentedCount as h, getContainersIcons as i, getDestinationIcon as j, getEntityIcon as k, getEntityLabel as l, getMetricForEntity as m, getPlatformIcon as n, getPlatformLabel as o, getValueForRange as p, getWorkloadId as q, getYamlFieldsForDestination as r, hasUnhealthyInstances as s, isOverTime as t, mapDestinationFieldsForDisplay as u, sleep as v };

package/lib/{index-ec555530.js → index-5e5f7bda.js}

@@ -1,3 +1,8 @@
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const deepClone = (item) => {
+    return JSON.parse(JSON.stringify(item));
+};
+
 function safeJsonParse(val, fallback) {
     if (!val)
         return fallback;
@@ -31,4 +36,4 @@ const isEmpty = (val) => {
     }
 };
 
-export { isEmpty as i, safeJsonParse as s };
+export { deepClone as d, isEmpty as i, safeJsonParse as s };

package/lib/{index-eb03f43f.js → index-7074fb24.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { a3 as WarningModal } from './index-61caa474.js';
+import { a3 as WarningModal } from './index-f2da9ad4.js';
 import { StatusType, EntityTypes } from './types.js';
 import './index-bd48e6e2.js';
 import 'styled-components';

package/lib/{index-56ab40b8.js → index-c1df4281.js}

@@ -21,6 +21,13 @@ const OdigosLogoText = ({ size = 16, fill: f, rotate = 0, onClick }) => {
             React.createElement("path", { d: 'M36.6756 64.0307C43.4071 64.0307 48.8641 58.5737 48.8641 51.8422C48.8641 45.1108 43.4071 39.6538 36.6756 39.6538C29.9441 39.6538 24.4872 45.1108 24.4872 51.8422C24.4872 58.5737 29.9441 64.0307 36.6756 64.0307Z' }))));
 };
 
+const ArrowIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size * (9 / 13.5), height: size, viewBox: '0 0 9 13.5', xmlns: 'http://www.w3.org/2000/svg', fill: fill, style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { d: 'M0.616717 8.03169L0.616717 5.70699L16.1519 5.70699L16.1519 8.03169L0.616717 8.03169ZM8.11144 -2.81613L9.7262 -1.10502L1.45534 6.87054L9.7262 14.9097L8.17631 16.6208L-1.19268 7.5802L-1.19268 6.1921L8.11144 -2.81613Z' })));
+};
+
 const FilterIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 }) => {
     const theme = Theme.useTheme();
     const fill = f || theme.text.secondary;
@@ -28,6 +35,14 @@ const FilterIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 }
         React.createElement("path", { stroke: fill, strokeWidth: strokeWidth, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M5.33341 8H10.6667M7.33341 12H8.66675M2.66675 4H13.3334' })));
 };
 
+const GearIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 }) => {
+    const theme = Theme.useTheme();
+    const fill = f || theme.text.secondary;
+    return (React.createElement("svg", { width: size, height: size, viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg', fill: 'none', style: { transform: `rotate(${rotate}deg)` }, onClick: onClick },
+        React.createElement("path", { stroke: fill, strokeWidth: strokeWidth, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M10.3982 4.27916C10.7851 2.57361 13.2149 2.57361 13.6018 4.27916L13.6531 4.50528C13.9038 5.61045 15.1719 6.13573 16.1306 5.53151L16.3268 5.40789C17.8064 4.47545 19.5246 6.19363 18.5921 7.6732L18.4685 7.86935C17.8643 8.82809 18.3895 10.0962 19.4947 10.3469L19.7208 10.3982C21.4264 10.7851 21.4264 13.2149 19.7208 13.6018L19.4947 13.6531C18.3895 13.9038 17.8643 15.1719 18.4685 16.1306L18.5921 16.3268C19.5246 17.8064 17.8064 19.5246 16.3268 18.5921L16.1306 18.4685C15.1719 17.8643 13.9038 18.3895 13.6531 19.4947L13.6018 19.7208C13.2149 21.4264 10.7851 21.4264 10.3982 19.7208L10.3469 19.4947C10.0962 18.3895 8.82809 17.8643 7.86935 18.4685L7.6732 18.5921C6.19363 19.5246 4.47545 17.8064 5.40789 16.3268L5.53151 16.1306C6.13573 15.1719 5.61045 13.9038 4.50528 13.6531L4.27916 13.6018C2.57361 13.2149 2.57361 10.7851 4.27916 10.3982L4.50528 10.3469C5.61045 10.0962 6.13573 8.82809 5.53151 7.86935L5.40789 7.6732C4.47544 6.19363 6.19363 4.47545 7.6732 5.40789L7.86935 5.53151C8.82809 6.13573 10.0962 5.61045 10.3469 4.50528L10.3982 4.27916Z' }),
+        React.createElement("path", { stroke: fill, strokeWidth: strokeWidth, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M10.9909 12C10.9909 11.4477 11.4478 11 12 11C12.5523 11 13.0092 11.4477 13.0092 12C13.0092 12.5523 12.5523 13 12 13C11.4478 13 10.9909 12.5523 10.9909 12Z' })));
+};
+
 const KeyIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth = 1 }) => {
     const theme = Theme.useTheme();
     const fill = f || theme.text.secondary;
@@ -97,4 +112,4 @@ const CrossCircledIcon = ({ size = 16, fill: f, rotate = 0, onClick, strokeWidth
         React.createElement("path", { stroke: fill, strokeWidth: strokeWidth, strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M6.75049 10.0005L8.75049 8.00049M8.75049 8.00049L10.7505 6.00049M8.75049 8.00049L6.75049 6.00049M8.75049 8.00049L10.7505 10.0005M8.75039 14.1004C5.38145 14.1004 2.65039 11.3693 2.65039 8.00039C2.65039 4.63145 5.38145 1.90039 8.75039 1.90039C12.1193 1.90039 14.8504 4.63145 14.8504 8.00039C14.8504 11.3693 12.1193 14.1004 8.75039 14.1004Z' })));
 };
 
-export { CrossCircledIcon as C, DataStreamsIcon as D, FilterIcon as F, KeyIcon as K, NotificationIcon as N, OdigosLogoText as O, RefreshLeftArrowIcon as R, SlackLogo as S, TerminalIcon as T, UserIcon as U, OverviewIcon as a };
+export { ArrowIcon as A, CrossCircledIcon as C, DataStreamsIcon as D, FilterIcon as F, GearIcon as G, KeyIcon as K, NotificationIcon as N, OdigosLogoText as O, RefreshLeftArrowIcon as R, SlackLogo as S, TerminalIcon as T, UserIcon as U, OverviewIcon as a };

package/lib/{index-61caa474.js → index-f2da9ad4.js}

@@ -1,12 +1,12 @@
 import React, { useState, useEffect, useRef, forwardRef, useMemo, createElement, useCallback, Fragment, createContext, memo, useContext, useLayoutEffect } from 'react';
 import { T as Theme, B as BUTTON_TEXTS, j as ImageErrorIcon, M as MONITORS_OPTIONS, a1 as styleInject, U as usePendingStore, $ as useSelectedStore, Z as useInstrumentStore, Q as useActiveNodeStore, V as useNotificationStore, b as DISPLAY_TITLES, L as LANGUAGE_OPTIONS, F as FORM_ALERTS, D as DISPLAY_LANGUAGES, e as getProgrammingLanguageIcon } from './index-bd48e6e2.js';
+import styled, { css } from 'styled-components';
+import { M as MinusIcon$1, h as CheckIcon, L as ListIcon, C as CodeIcon, c as ExtendArrowIcon, P as PlusIcon$1, a as CopyIcon, E as EditIcon, b as EditedIcon, e as SortArrowsIcon, d as NotebookIcon, X as XIcon, f as EyeClosedIcon, g as EyeOpenIcon, N as NoDataIcon, i as CrossIcon, S as SearchIcon, T as TrashIcon } from './index-391844c6.js';
 import { StatusType, OtherStatus, EntityTypes, NodeTypes, AddNodeTypes, EdgeTypes, ProgrammingLanguages, IntrumentationStatus, SortDirection, InputTypes, FieldTypes } from './types.js';
-import { M as MinusIcon$1, h as CheckIcon, L as ListIcon, C as CodeIcon, c as ExtendArrowIcon, P as PlusIcon$1, a as CopyIcon, E as EditIcon, b as EditedIcon, e as SortArrowsIcon, d as NotebookIcon, X as XIcon, f as EyeClosedIcon, g as EyeOpenIcon, N as NoDataIcon, i as CrossIcon, S as SearchIcon, T as TrashIcon, A as ArrowIcon } from './index-1fcb0269.js';
+import { s as safeJsonParse, i as isEmpty } from './index-5e5f7bda.js';
 import { b as getStatusIcon, r as removeEmptyValuesFromObject, s as safeJsonStringify, f as flattenObjectKeys, m as mapConditions, g as getConditionsBooleans, c as capitalizeFirstLetter, a as getMonitorIcon, i as isStringABoolean, p as parseBooleanFromString, d as isValidVersion, h as splitCamelString, e as parseJsonStringToPrettyString, n as numbersOnly } from './index-58440c5c.js';
-import styled, { css } from 'styled-components';
-import { s as safeJsonParse, i as isEmpty } from './index-ec555530.js';
 import ReactDOM, { createPortal } from 'react-dom';
-import { d as usePopup, h as useCopy, c as useClickNode, i as useGenericForm, b as useContainerSize, f as useTransition, u as useKeyDown, a as useOnClickOutside } from './useTransition-750816e0.js';
+import { d as usePopup, h as useCopy, c as useClickNode, i as useGenericForm, b as useContainerSize, f as useTransition, u as useKeyDown, a as useOnClickOutside } from './useTransition-c2aef0e4.js';
 import { I as InfoIcon } from './index-50101bec.js';
 
 const TextWrapper$2 = styled.div `
@@ -39,7 +39,7 @@ const AutocompleteContainer = styled.div `
   position: relative;
   width: 100%;
 `;
-const InputWrapper$2 = styled.div `
+const InputWrapper$3 = styled.div `
   width: calc(100% - 16px);
   display: flex;
   align-items: center;
@@ -187,7 +187,7 @@ const AutocompleteInput = ({ placeholder = 'Type to search...', options, selecte
         return;
     };
     return (React.createElement(AutocompleteContainer, { style: style },
-        React.createElement(InputWrapper$2, { "$hasError": !!errorMessage },
+        React.createElement(InputWrapper$3, { "$hasError": !!errorMessage },
             Icon && React.createElement(Icon, null),
             React.createElement(StyledInput$1, { type: 'text', value: query, placeholder: placeholder, onChange: handleChange, onKeyDown: handleKeyDown, disabled: disabled, onBlur: () => !disabled && setShowOptions(false), onFocus: () => !disabled && setShowOptions(true), ...props })),
         showOptions && filteredOptions.length ? (React.createElement(OptionsList, null, filteredOptions.map((option) => (React.createElement(OptionItem, { key: option.type || option.label, option: option, onClick: handleOptionClick }))))) : null,
@@ -17391,7 +17391,7 @@ const Title$6 = styled(Text) `
   white-space: nowrap;
   text-overflow: ellipsis;
 `;
-const ActionButton$1 = styled(Button$4) `
+const ActionButton$3 = styled(Button$4) `
   gap: 8px;
 `;
 const CloseButton = styled(Button$4) ``;
@@ -17412,7 +17412,7 @@ const DrawerHeader = ({ onClose, icons, iconSrcs, title, titleTooltip, replaceTi
                 renderReplaceTitleWith() || (React.createElement(Tooltip, { text: titleTooltip, withIcon: true }, title && React.createElement(Title$6, null, title)))),
             React.createElement(SectionItemsWrapper, { "$gap": 2 },
                 actions,
-                actionButtons.map((btn, i) => (React.createElement(ActionButton$1, { key: `header-action-button-${i}`, ...btn }))),
+                actionButtons.map((btn, i) => (React.createElement(ActionButton$3, { key: `header-action-button-${i}`, ...btn }))),
                 React.createElement(CloseButton, { "data-id": 'drawer-close', variant: 'secondary', onClick: onClose },
                     React.createElement(XIcon, { size: 12 })))),
         React.createElement(TabList, { tabs: tabs, hideBorder: true })));
@@ -17529,7 +17529,7 @@ const Container$g = styled.div `
   position: relative;
   width: 100%;
 `;
-const InputWrapper$1 = styled.div `
+const InputWrapper$2 = styled.div `
   width: 100%;
   display: flex;
   align-items: center;
@@ -17540,7 +17540,6 @@ const InputWrapper$1 = styled.div `
   border: 1px solid ${({ theme }) => theme.colors.border};
   ${({ $disabled }) => $disabled &&
     css `
-      background-color: ${({ theme }) => theme.colors.border};
       cursor: not-allowed;
       opacity: 0.6;
     `}
@@ -17562,6 +17561,8 @@ const InputWrapper$1 = styled.div `
 const StyledInput = styled.input `
   padding-left: ${({ $hasIcon }) => ($hasIcon ? '0' : '16px')};
   flex: 1;
+  min-width: 150px;
+  width: 100%;
   border: none;
   outline: none;
   background: none;
@@ -17578,8 +17579,8 @@ const StyledInput = styled.input `
     line-height: 22px; /* 157.143% */
   }
   &:disabled {
-    background-color: ${({ theme }) => theme.colors.border};
     cursor: not-allowed;
+    opacity: 0.6;
   }
   &::-webkit-inner-spin-button,
   &::-webkit-outer-spin-button {
@@ -17628,7 +17629,7 @@ const Input = ({ icon: Icon, buttonLabel, onButtonClick, hasError, errorMessage,
     };
     return (React.createElement(Container$g, null,
         React.createElement(FieldLabel, { title: title, required: required, tooltip: tooltip }),
-        React.createElement(InputWrapper$1, { "$disabled": props.disabled, "$hasError": hasError || !!errorMessage, "$isActive": !!props.autoFocus },
+        React.createElement(InputWrapper$2, { "$disabled": props.disabled, "$hasError": hasError || !!errorMessage, "$isActive": !!props.autoFocus },
             isSecret ? (React.createElement(IconWrapperClickable, { onClick: () => setRevealSecret((prev) => !prev) }, revealSecret ? React.createElement(EyeClosedIcon, { size: 14, fill: theme.text.grey }) : React.createElement(EyeOpenIcon, { size: 14, fill: theme.text.grey }))) : Icon ? (React.createElement(IconWrapper$2, null,
                 React.createElement(Icon, { size: 14, fill: theme.text.grey }))) : null,
             React.createElement(StyledInput, { "data-id": name, type: revealSecret ? InputTypes.Text : type === InputTypes.Number ? InputTypes.Text : type, "$hasIcon": !!Icon || isSecret, name: name, value: value, onChange: handleInputChange, onKeyDown: handleKeyDown, ...props }),
@@ -17918,11 +17919,9 @@ const RowWrapper$1 = styled.div `
   align-items: center;
   gap: 16px;
 `;
-const DeleteButton$2 = styled.button `
-  background: none;
-  border: none;
-  cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
-  opacity: ${({ disabled }) => (disabled ? 0.5 : 1)};
+const ActionButton$2 = styled(IconButton) `
+  cursor: ${({ $disabled }) => ($disabled ? 'not-allowed' : 'pointer')};
+  opacity: ${({ $disabled }) => ($disabled ? 0.5 : 1)};
 `;
 const INITIAL_ROW$1 = '';
 const InputList = ({ initialValues = [], value, onChange, title, tooltip, required, errorMessage }) => {
@@ -17943,23 +17942,28 @@ const InputList = ({ initialValues = [], value, onChange, title, tooltip, requir
                 onChange(validRows);
         }
     }, [validRows, onChange]);
-    const handleAddInput = () => {
+    const handleChange = (val, idx) => {
         setRows((prev) => {
             const payload = [...prev];
-            payload.push(INITIAL_ROW$1);
+            payload[idx] = val;
             return payload;
         });
     };
-    const handleDeleteInput = (idx) => {
-        setRows((prev) => prev.filter((_, i) => i !== idx));
-    };
-    const handleInputChange = (val, idx) => {
+    const handleAdd = () => {
         setRows((prev) => {
             const payload = [...prev];
-            payload[idx] = val;
+            payload.push(INITIAL_ROW$1);
             return payload;
         });
     };
+    const handleDelete = (idx) => {
+        if (isMinRows) {
+            handleChange('', idx);
+        }
+        else {
+            setRows((prev) => prev.filter((_, i) => i !== idx));
+        }
+    };
     // Check if any input field is empty
     const isMinRows = rows.length <= 1;
     const isAddButtonDisabled = rows.some((input) => input.trim() === '');
@@ -17969,19 +17973,13 @@ const InputList = ({ initialValues = [], value, onChange, title, tooltip, requir
         React.createElement(ListContainer$2, null, rows.map((val, idx) => {
             const isLast = idx === rows.length - 1;
             return (React.createElement(RowWrapper$1, { key: `input-list-${idx}` },
-                React.createElement(Input, { value: val, onChange: (e) => handleInputChange(e.target.value, idx), hasError: !!errorMessage, autoFocus: isEmpty(val) && !isMinRows && isLast }),
-                React.createElement(DeleteButton$2, { disabled: isDelButtonDisabled, onClick: () => {
-                        if (isMinRows) {
-                            handleInputChange('', idx);
-                        }
-                        else {
-                            handleDeleteInput(idx);
-                        }
-                    } },
+                React.createElement(Input, { value: val, onChange: (e) => handleChange(e.target.value, idx), hasError: !!errorMessage, autoFocus: isEmpty(val) && !isMinRows && isLast }),
+                idx === rows.length - 1 && (React.createElement(ActionButton$2, { withBorder: true, size: 30, "$disabled": isAddButtonDisabled, onClick: isAddButtonDisabled ? undefined : () => handleAdd() },
+                    React.createElement(PlusIcon$1, null))),
+                React.createElement(ActionButton$2, { size: 30, "$disabled": isDelButtonDisabled, onClick: isDelButtonDisabled ? undefined : () => handleDelete(idx) },
                     React.createElement(TrashIcon, null))));
         })),
-        !!errorMessage && React.createElement(FieldError, null, errorMessage),
-        React.createElement(AddButton$1, { onClick: handleAddInput, disabled: isAddButtonDisabled })));
+        !!errorMessage && React.createElement(FieldError, null, errorMessage)));
 };
 
 const ColumnsToFields = ({ col, colIdx, row, rowIdx, rowsLength, maxWidth, handleChange, errorMessage, limitFieldsPerRow }) => {
@@ -18010,7 +18008,7 @@ const Container$b = styled.div `
   flex-direction: column;
   width: 100%;
 `;
-const DeleteButton$1 = styled.button `
+const DeleteButton = styled.button `
   margin-top: ${({ $marginTop }) => $marginTop};
   background: none;
   border: none;
@@ -18110,7 +18108,7 @@ const InputTable = ({ columns, initialValues = [], value, onChange, errorMessage
                 matrixColumns.map((cols, colIdx) => (React.createElement("tr", { key: `input-table-matrix-${rowIdx}-${colIdx}` },
                     cols.map((obj, colIdx) => (React.createElement(ColumnsToFields, { key: `input-table-row-${rowIdx}-col-${colIdx}`, col: obj, colIdx: colIdx, row: row, rowIdx: rowIdx, rowsLength: rows.length, maxWidth: maxWidth, limitFieldsPerRow: limitFieldsPerRow, errorMessage: errorMessage, handleChange: handleChange }))),
                     colIdx === 0 && (React.createElement("td", null,
-                        React.createElement(DeleteButton$1, { "$marginTop": limitFieldsPerRow ? '24px' : '0', onClick: () => handleDeleteRow(rowIdx) },
+                        React.createElement(DeleteButton, { "$marginTop": limitFieldsPerRow ? '24px' : '0', onClick: () => handleDeleteRow(rowIdx) },
                             React.createElement(TrashIcon, null)))))))))))),
         !!errorMessage && React.createElement(FieldError, null, errorMessage),
         React.createElement(AddButton$1, { onClick: handleAddRow, disabled: isAddButtonDisabled })));
@@ -18129,21 +18127,21 @@ const ListContainer$1 = styled.div `
 const RowWrapper = styled.div `
   display: flex;
   align-items: center;
-  gap: 16px;
+  gap: 8px;
 `;
-const DeleteButton = styled.button `
-  background: none;
-  border: none;
-  cursor: pointer;
-  cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
-  opacity: ${({ disabled }) => (disabled ? 0.5 : 1)};
+const InputWrapper$1 = styled.div `
+  width: 100%;
+  max-width: ${({ $maxWidth }) => ($maxWidth ? `${$maxWidth}px` : 'unset')};
+`;
+const ActionButton$1 = styled(IconButton) `
+  cursor: ${({ $disabled }) => ($disabled ? 'not-allowed' : 'pointer')};
+  opacity: ${({ $disabled }) => ($disabled ? 0.5 : 1)};
 `;
 const INITIAL_ROW = {
     key: '',
     value: '',
 };
-const KeyValueInputsList = ({ initialKeyValuePairs = [], value, onChange, title, tooltip, required, errorMessage, keyPlaceholder = 'Attribute name', valuePlaceholder = 'Attribute value' }) => {
-    const theme = Theme.useTheme();
+const KeyValueInputsList = ({ initialKeyValuePairs = [], value, onChange, title, tooltip, disabled, required, errorMessage, keyPlaceholder = 'Key', valuePlaceholder = 'Value', inputMaxWidth = 300, }) => {
     const [rows, setRows] = useState(value || initialKeyValuePairs);
     useEffect(() => {
         if (!rows.length)
@@ -18161,46 +18159,45 @@ const KeyValueInputsList = ({ initialKeyValuePairs = [], value, onChange, title,
                 onChange(validRows);
         }
     }, [validRows, onChange]);
-    const handleAddRow = () => {
+    const handleChange = (key, val, idx) => {
         setRows((prev) => {
             const payload = [...prev];
-            payload.push({ ...INITIAL_ROW });
+            payload[idx][key] = val;
             return payload;
         });
     };
-    const handleDeleteRow = (idx) => {
-        setRows((prev) => prev.filter((_, i) => i !== idx));
-    };
-    const handleChange = (key, val, idx) => {
+    const handleAddRow = () => {
         setRows((prev) => {
             const payload = [...prev];
-            payload[idx][key] = val;
+            payload.push({ ...INITIAL_ROW });
             return payload;
         });
     };
+    const handleDeleteRow = (idx) => {
+        if (isMinRows) {
+            handleChange('key', '', idx);
+            handleChange('value', '', idx);
+        }
+        else {
+            setRows((prev) => prev.filter((_, i) => i !== idx));
+        }
+    };
     // Check if any key or value field is empty
     const isMinRows = rows.length <= 1;
-    const isAddButtonDisabled = rows.some(({ key, value }) => key.trim() === '' || value.trim() === '');
-    const isDelButtonDisabled = isMinRows && isAddButtonDisabled;
+    const isAddButtonDisabled = disabled || rows.some(({ key, value }) => key.trim() === '' || value.trim() === '');
+    const isDelButtonDisabled = disabled || (isMinRows && isAddButtonDisabled);
     return (React.createElement(Container$a, null,
         React.createElement(FieldLabel, { title: title, required: required, tooltip: tooltip }),
         React.createElement(ListContainer$1, null, rows.map(({ key, value }, idx) => (React.createElement(RowWrapper, { key: `key-value-input-list-${idx}` },
-            React.createElement(Input, { placeholder: keyPlaceholder, value: key, onChange: (e) => handleChange('key', e.target.value, idx), hasError: !!errorMessage && (!required || (required && !key)), autoFocus: isEmpty(value) && !isMinRows && idx === rows.length - 1 }),
-            React.createElement("div", null,
-                React.createElement(ArrowIcon, { rotate: 180, fill: theme.text.darker_grey })),
-            React.createElement(Input, { placeholder: valuePlaceholder, value: value, onChange: (e) => handleChange('value', e.target.value, idx), hasError: !!errorMessage && (!required || (required && isEmpty(value))), autoFocus: false }),
-            React.createElement(DeleteButton, { disabled: isDelButtonDisabled, onClick: () => {
-                    if (isMinRows) {
-                        handleChange('key', '', idx);
-                        handleChange('value', '', idx);
-                    }
-                    else {
-                        handleDeleteRow(idx);
-                    }
-                } },
+            React.createElement(InputWrapper$1, { "$maxWidth": inputMaxWidth },
+                React.createElement(Input, { placeholder: keyPlaceholder, disabled: disabled, value: key, onChange: (e) => handleChange('key', e.target.value, idx), hasError: !!errorMessage && (!required || (required && !key)), autoFocus: isEmpty(value) && !isMinRows && idx === rows.length - 1 })),
+            React.createElement(InputWrapper$1, { "$maxWidth": idx === rows.length - 1 ? inputMaxWidth - 38 : inputMaxWidth },
+                React.createElement(Input, { placeholder: valuePlaceholder, disabled: disabled, value: value, onChange: (e) => handleChange('value', e.target.value, idx), hasError: !!errorMessage && (!required || (required && isEmpty(value))), autoFocus: false })),
+            idx === rows.length - 1 && (React.createElement(ActionButton$1, { withBorder: true, size: 30, "$disabled": isAddButtonDisabled, onClick: isAddButtonDisabled ? undefined : () => handleAddRow() },
+                React.createElement(PlusIcon$1, null))),
+            React.createElement(ActionButton$1, { size: 30, "$disabled": isDelButtonDisabled, onClick: isDelButtonDisabled ? undefined : () => handleDeleteRow(idx) },
                 React.createElement(TrashIcon, null)))))),
-        !!errorMessage && React.createElement(FieldError, null, errorMessage),
-        React.createElement(AddButton$1, { onClick: handleAddRow, disabled: isAddButtonDisabled })));
+        !!errorMessage && React.createElement(FieldError, null, errorMessage)));
 };
 
 const Container$9 = styled.div `
@@ -18849,8 +18846,7 @@ const Toggle = ({ title, tooltip, initialValue = false, onChange, disabled, allo
     };
     return (React.createElement(Container$2, { "$disabled": disabled, onClick: handleToggle },
         !flipHorizontally && React.createElement(ToggleSwitch, { "$disabled": disabled, "$isActive": isActive }),
-        React.createElement(Tooltip, { text: tooltip, withIcon: true },
-            React.createElement(Text, { size: 14 }, title)),
+        (title || tooltip) && (React.createElement(Tooltip, { text: tooltip, withIcon: true }, title && React.createElement(Text, { size: 14 }, title))),
         flipHorizontally && React.createElement(ToggleSwitch, { "$disabled": disabled, "$isActive": isActive })));
 };
 

package/lib/mock-data/config/index.d.ts

@@ -0,0 +1,2 @@
+import { type OdigosConfig } from '@/types';
+export declare const MOCK_ODIGOS_CONFIG: OdigosConfig;

package/lib/mock-data/index.d.ts

@@ -1,4 +1,5 @@
 export * from './actions';
+export * from './config';
 export * from './describe';
 export * from './destinations';
 export * from './instrumentation-rules';

package/lib/snippets.js

@@ -1,15 +1,15 @@
-import { B as Button, _ as Text, L as NotificationNote } from './index-61caa474.js';
-export { ai as AddButton, an as AddNode, ao as BaseNode, ak as CopyText, ap as EdgedNode, ag as Flow, aq as FrameNode, ar as HeaderNode, aw as LabeledEdge, as as MapItemNode, at as NoDataNode, al as PodContainer, au as ScrollNode, av as SkeletonNode, am as SourceContainer, ad as nodeConfig } from './index-61caa474.js';
+import { B as Button, _ as Text, L as NotificationNote } from './index-f2da9ad4.js';
+export { ai as AddButton, an as AddNode, ao as BaseNode, ak as CopyText, ap as EdgedNode, ag as Flow, aq as FrameNode, ar as HeaderNode, aw as LabeledEdge, as as MapItemNode, at as NoDataNode, al as PodContainer, au as ScrollNode, av as SkeletonNode, am as SourceContainer, ad as nodeConfig } from './index-f2da9ad4.js';
 import React from 'react';
 import { T as Theme, B as BUTTON_TEXTS, b as DISPLAY_TITLES } from './index-bd48e6e2.js';
-import { E as EditIcon } from './index-1fcb0269.js';
+import { E as EditIcon } from './index-391844c6.js';
 import { StatusType } from './types.js';
 import 'styled-components';
 import { I as InfoIcon } from './index-50101bec.js';
+import './index-5e5f7bda.js';
 import './index-58440c5c.js';
-import './index-ec555530.js';
 import 'react-dom';
-import './useTransition-750816e0.js';
+import './useTransition-c2aef0e4.js';
 
 const EditButton = ({ label, onClick, variant = 'tertiary', ...props }) => {
     const theme = Theme.useTheme();

package/lib/types/config/index.d.ts

@@ -0,0 +1,89 @@
+import { ProgrammingLanguages } from '..';
+export declare enum UiMode {
+    Default = "default",
+    ReadOnly = "readonly"
+}
+export declare enum Profile {
+    CodeAttributes = "code-attributes",
+    FullPayloadCollection = "full-payload-collection",
+    DbPayloadCollection = "db-payload-collection",
+    QueryOperationDetector = "query-operation-detector",
+    AllowConcurrentAgents = "allow_concurrent_agents",
+    JavaEbpfInstrumentations = "java-ebpf-instrumentations",
+    JavaNativeInstrumentations = "java-native-instrumentations",
+    SizeS = "size_s",
+    SizeM = "size_m",
+    SizeL = "size_l"
+}
+export declare enum MountMethod {
+    VirtualDevice = "VirtualDevice",
+    HostPath = "HostPath"
+}
+export declare enum AgentEnvVarsInjectionMethod {
+    Loader = "loader",
+    PodManifest = "pod-manifest",
+    LoaderFallbackToPodManifest = "loader-fallback-to-pod-manifest"
+}
+export interface CollectorNode {
+    collectorOwnMetricsPort: number;
+    requestMemoryMiB: number;
+    limitMemoryMiB: number;
+    requestCPUm: number;
+    limitCPUm: number;
+    memoryLimiterLimitMiB: number;
+    memoryLimiterSpikeLimitMiB: number;
+    goMemLimitMiB: number;
+    k8sNodeLogsDirectory: string;
+}
+export interface CollectorGateway extends Omit<CollectorNode, 'collectorOwnMetricsPort' | 'k8sNodeLogsDirectory'> {
+    minReplicas: number;
+    maxReplicas: number;
+}
+export interface UserInstrumentationEnvsLanguage {
+    enabled: boolean;
+    env: {
+        [key: string]: string;
+    };
+}
+export interface UserInstrumentationEnvs {
+    languages: {
+        [key in ProgrammingLanguages]?: UserInstrumentationEnvsLanguage;
+    };
+}
+export interface RolloutConfiguration {
+    automaticRolloutDisabled: boolean;
+}
+export interface OidcConfiguration {
+    tenantUrl: string;
+    clientId: string;
+    clientSecret: string;
+}
+export interface OdigosConfig {
+    telemetryEnabled: boolean;
+    openshiftEnabled: boolean;
+    karpenterEnabled: boolean;
+    psp: boolean;
+    allowConcurrentAgents: boolean;
+    skipWebhookIssuerCreation: boolean;
+    uiMode: UiMode;
+    uiPaginationLimit: number;
+    centralBackendURL: string;
+    oidc?: OidcConfiguration;
+    clusterName: string;
+    imagePrefix: string;
+    ignoredNamespaces: string[];
+    ignoredContainers: string[];
+    profiles: Profile[];
+    mountMethod: MountMethod;
+    agentEnvVarsInjectionMethod: AgentEnvVarsInjectionMethod;
+    customContainerRuntimeSocketPath: string;
+    odigletHealthProbeBindPort: number;
+    rollbackDisabled: boolean;
+    rollbackGraceTime: string;
+    rollbackStabilityWindow: string;
+    nodeSelector?: Record<string, string>;
+    rollout?: RolloutConfiguration;
+    collectorNode?: CollectorNode;
+    collectorGateway?: CollectorGateway;
+    userInstrumentationEnvs?: UserInstrumentationEnvs;
+}

package/lib/types/index.d.ts

@@ -1,5 +1,6 @@
 export * from './actions';
 export * from './common';
+export * from './config';
 export * from './connection';
 export * from './data-flow';
 export * from './data-streams';

package/lib/types.js

@@ -178,6 +178,48 @@ var SortDirection;
     SortDirection["Descending"] = "desc";
 })(SortDirection || (SortDirection = {}));
 
+var UiMode;
+(function (UiMode) {
+    UiMode["Default"] = "default";
+    UiMode["ReadOnly"] = "readonly";
+})(UiMode || (UiMode = {}));
+var Profile;
+(function (Profile) {
+    // CategoryAttributes = 'category-attributes',
+    Profile["CodeAttributes"] = "code-attributes";
+    // CopyScope = 'copy-scope',
+    // HostnameAsPodname = 'hostname-as-podname',
+    Profile["FullPayloadCollection"] = "full-payload-collection";
+    Profile["DbPayloadCollection"] = "db-payload-collection";
+    Profile["QueryOperationDetector"] = "query-operation-detector";
+    // Semconv = 'semconv',
+    // ReduceSpanNameCardinality = 'reduce-span-name-cardinality',
+    Profile["AllowConcurrentAgents"] = "allow_concurrent_agents";
+    Profile["JavaEbpfInstrumentations"] = "java-ebpf-instrumentations";
+    Profile["JavaNativeInstrumentations"] = "java-native-instrumentations";
+    // LegacyDotnetInstrumentation = 'legacy-dotnet-instrumentation',
+    // MountMethodK8sHostPath = 'mount-method-k8s-host-path',
+    // MountMethodK8sVirtualDevice = 'mount-method-k8s-virtual-device',
+    // PodManifestEnvVarInjection = 'pod-manifest-env-var-injection',
+    // DisableGin = 'disable-gin',
+    // SmallBatches = 'small-batches',
+    Profile["SizeS"] = "size_s";
+    Profile["SizeM"] = "size_m";
+    Profile["SizeL"] = "size_l";
+})(Profile || (Profile = {}));
+var MountMethod;
+(function (MountMethod) {
+    MountMethod["VirtualDevice"] = "VirtualDevice";
+    MountMethod["HostPath"] = "HostPath";
+    // InitContainer = 'InitContainer',
+})(MountMethod || (MountMethod = {}));
+var AgentEnvVarsInjectionMethod;
+(function (AgentEnvVarsInjectionMethod) {
+    AgentEnvVarsInjectionMethod["Loader"] = "loader";
+    AgentEnvVarsInjectionMethod["PodManifest"] = "pod-manifest";
+    AgentEnvVarsInjectionMethod["LoaderFallbackToPodManifest"] = "loader-fallback-to-pod-manifest";
+})(AgentEnvVarsInjectionMethod || (AgentEnvVarsInjectionMethod = {}));
+
 var NodeTypes;
 (function (NodeTypes) {
     NodeTypes["Header"] = "header";
@@ -321,4 +363,4 @@ var K8sResourceKind;
     K8sResourceKind["CronJob"] = "CronJob";
 })(K8sResourceKind || (K8sResourceKind = {}));
 
-export { ActionCategory, ActionKeyTypes, ActionType, AddNodeTypes, BooleanOperation, CodeAttributesKeyTypes, Crud, CustomInstrumentationsKeyTypes, DestinationTypes, EdgeTypes, EntityTypes, FieldTypes, HeadersCollectionKeyTypes, InputTypes, InstrumentationRuleType, IntrumentationStatus, JsonOperation, K8sResourceKind, NodeTypes, NumberOperation, OtherEntityTypes, OtherStatus, PayloadCollectionKeyTypes, PlatformType, ProgrammingLanguages, SignalType, SortDirection, StatusType, StringOperation, Tier };
+export { ActionCategory, ActionKeyTypes, ActionType, AddNodeTypes, AgentEnvVarsInjectionMethod, BooleanOperation, CodeAttributesKeyTypes, Crud, CustomInstrumentationsKeyTypes, DestinationTypes, EdgeTypes, EntityTypes, FieldTypes, HeadersCollectionKeyTypes, InputTypes, InstrumentationRuleType, IntrumentationStatus, JsonOperation, K8sResourceKind, MountMethod, NodeTypes, NumberOperation, OtherEntityTypes, OtherStatus, PayloadCollectionKeyTypes, PlatformType, Profile, ProgrammingLanguages, SignalType, SortDirection, StatusType, StringOperation, Tier, UiMode };