@odigos/ui-kit 0.0.32 → 0.0.34

package/lib/functions/get-action-icon/index.d.ts

@@ -1,2 +1,2 @@
-import { ActionType, type SVG } from '@/types';
-export declare const getActionIcon: (type: ActionType | "sampler" | "attributes") => SVG;
+import { ActionCategory, ActionType, type SVG } from '@/types';
+export declare const getActionIcon: (type: ActionType | ActionCategory) => SVG;

package/lib/functions/get-yaml-fields-for-destination/index.d.ts

@@ -0,0 +1,2 @@
+import { Destination, DestinationCategories, DestinationYamlProperties } from '@/types';
+export declare const getYamlFieldsForDestination: (categories: DestinationCategories, destination: Destination) => DestinationYamlProperties[];

package/lib/functions/index.d.ts

@@ -28,11 +28,15 @@ export * from './get-sse-target-from-id';
 export * from './get-status-icon';
 export * from './get-value-for-range';
 export * from './get-workload-id';
+export * from './get-yaml-fields-for-destination';
 export * from './is-emtpy';
+export * from './is-legal-k8s-label';
 export * from './is-over-time';
 export * from './is-time-elapsed';
 export * from './map-conditions';
+export * from './map-destination-fields-for-display';
 export * from './map-exported-signals';
+export * from './numbers-only';
 export * from './parse-json-string-to-pretty-string';
 export * from './remove-empty-values-from-object';
 export * from './safe-json-parse';

package/lib/functions/is-legal-k8s-label/index.d.ts

@@ -0,0 +1 @@
+export declare const isLegalK8sLabel: (name: string) => boolean;

package/lib/functions/map-destination-fields-for-display/index.d.ts

@@ -0,0 +1,6 @@
+import { Destination, DestinationYamlProperties } from '@/types';
+export declare const mapDestinationFieldsForDisplay: (destination: Destination, yamlFields: DestinationYamlProperties[]) => {
+    key: string;
+    name: string;
+    value: any;
+}[];

package/lib/functions/numbers-only/index.d.ts

@@ -0,0 +1 @@
+export declare const numbersOnly: (value: string) => string;

package/lib/functions.js

@@ -1,14 +1,14 @@
-export { c as capitalizeFirstLetter, f as flattenObjectKeys, g as getMonitorIcon, a as getProgrammingLanguageIcon, b as getStatusIcon, m as mapConditions, p as parseJsonStringToPrettyString, r as removeEmptyValuesFromObject, s as safeJsonStringify, d as splitCamelString } from './index-C7YDojNh.js';
-export { c as compareCondition, d as deepClone, f as filterActions, a as filterDestinations, b as filterDestinationsByStream, e as filterSources, g as filterSourcesByStream, h as formatBytes, i as getConditionsBooleans, k as getContainersIcons, j as getContainersInstrumentedCount, l as getDestinationIcon, m as getEntityIcon, n as getEntityLabel, o as getMetricForEntity, p as getPlatformIcon, q as getPlatformLabel, r as getValueForRange, s as getWorkloadId, t as isOverTime, u as mapExportedSignals, v as sleep } from './index-cG2lNgzz.js';
-export { k as getActionIcon, l as getEntityId, m as getInstrumentationRuleIcon } from './index-ivnS3eWW.js';
-export { g as getIdFromSseTarget } from './index-7-KCQK-x.js';
+export { c as capitalizeFirstLetter, f as flattenObjectKeys, g as getMonitorIcon, a as getProgrammingLanguageIcon, b as getStatusIcon, m as mapConditions, n as numbersOnly, p as parseJsonStringToPrettyString, r as removeEmptyValuesFromObject, s as safeJsonStringify, d as splitCamelString } from './index-ChYtqgBW.js';
+export { c as compareCondition, d as deepClone, f as filterActions, a as filterDestinations, b as filterDestinationsByStream, e as filterSources, g as filterSourcesByStream, h as formatBytes, i as getConditionsBooleans, k as getContainersIcons, j as getContainersInstrumentedCount, l as getDestinationIcon, m as getEntityIcon, n as getEntityLabel, o as getMetricForEntity, p as getPlatformIcon, q as getPlatformLabel, r as getValueForRange, s as getWorkloadId, t as getYamlFieldsForDestination, u as isOverTime, v as mapDestinationFieldsForDisplay, w as mapExportedSignals, x as sleep } from './index-BBjwRlta.js';
+export { k as getActionIcon, l as getEntityId, m as getInstrumentationRuleIcon } from './index-DJGe2YeC.js';
+export { g as getIdFromSseTarget, i as isLegalK8sLabel } from './index-CnZlllYu.js';
 import { EntityTypes } from './types.js';
-export { i as isEmpty, s as safeJsonParse } from './index-BZS1ijMm.js';
+export { i as isEmpty, s as safeJsonParse } from './index-BV85P9UP.js';
 import 'react';
 import 'styled-components';
-import './index-DuSmjoDs.js';
-import './index-B9cvsYnj.js';
-import './index-PfG5pvFK.js';
+import './index-Bd8ZAEvq.js';
+import './index-mOgS3e5E.js';
+import './index-Cq8NT9Hr.js';
 
 const cleanObjectEmptyStringsValues = (obj) => {
     const cleanArray = (arr) => arr.filter((item) => {

package/lib/hooks.js

@@ -1,9 +1,9 @@
-export { u as useActionFormData, a as useClickNode, b as useClickNotification, c as useDataStreamFormData, d as useDestinationFormData, e as useSourceFormData, f as useSourceSelectionFormData } from './useSourceSelectionFormData-A5_zhn1C.js';
-export { u as useContainerSize, a as useCopy, b as useGenericForm, c as useInstrumentationRuleFormData, d as useKeyDown, e as useOnClickOutside, f as useTimeAgo, g as useTransition } from './useTransition-9tDdAS9s.js';
+export { u as useActionFormData, a as useClickNode, b as useClickNotification, c as useDataStreamFormData, d as useDestinationFormData, e as useSourceFormData, f as useSourceSelectionFormData } from './useSourceSelectionFormData-DBNf1uEe.js';
+export { u as useContainerSize, a as useCopy, b as useGenericForm, c as useInstrumentationRuleFormData, d as useKeyDown, e as useOnClickOutside, f as useTimeAgo, g as useTransition } from './useTransition-dZ92VxT2.js';
 import './types.js';
-import './index-ivnS3eWW.js';
+import './index-DJGe2YeC.js';
 import 'react';
 import 'styled-components';
-import './index-B9cvsYnj.js';
-import './index-BZS1ijMm.js';
-import './index-7-KCQK-x.js';
+import './index-mOgS3e5E.js';
+import './index-BV85P9UP.js';
+import './index-CnZlllYu.js';

package/lib/icons.js

@@ -1,11 +1,11 @@
-import { T as Theme } from './index-ivnS3eWW.js';
-export { o as AddClusterInfoIcon, C as CodeAttributesIcon, D as DeleteAttributeIcon, H as HeadersCollectionIcon, n as ImageErrorIcon, K as K8sLogo, p as PayloadCollectionIcon, P as PiiMaskingIcon, R as RenameAttributeIcon, S as SamplerIcon } from './index-ivnS3eWW.js';
-export { C as CPlusPlusLogo, d as CSharpLogo, i as CheckCircledIcon, D as DotnetLogo, E as ElixirLogo, h as ErrorTriangleIcon, G as GoLogo, I as InfoIcon, J as JavaLogo, K as KafkaLogo, L as LogsIcon, g as MetricsIcon, M as MysqlLogo, N as NginxLogo, f as NodejsLogo, O as OdigosLogo, c as PhpLogo, P as PostgresLogo, e as PythonLogo, R as RedisLogo, b as RubyLogo, a as RustLogo, S as SwiftLogo, T as TracesIcon, W as WarningTriangleIcon } from './index-DuSmjoDs.js';
-export { C as CrossCircledIcon, D as DataStreamsIcon, F as FilterIcon, K as KeyIcon, N as NotificationIcon, O as OdigosLogoText, a as OverviewIcon, S as SlackLogo, T as TerminalIcon } from './index-DR5ryS5d.js';
-export { A as ArrowIcon, f as CheckIcon, C as CodeIcon, a as CopyIcon, g as CrossIcon, E as ExtendArrowIcon, d as EyeClosedIcon, e as EyeOpenIcon, L as ListIcon, M as MinusIcon, N as NoDataIcon, b as NotebookIcon, P as PlusIcon, S as SearchIcon, c as SortArrowsIcon, T as TrashIcon, X as XIcon } from './index-DAbcw-wM.js';
+import { T as Theme } from './index-DJGe2YeC.js';
+export { o as AddClusterInfoIcon, C as CodeAttributesIcon, D as DeleteAttributeIcon, H as HeadersCollectionIcon, n as ImageErrorIcon, K as K8sLogo, p as PayloadCollectionIcon, P as PiiMaskingIcon, R as RenameAttributeIcon, S as SamplerIcon } from './index-DJGe2YeC.js';
+export { C as CPlusPlusLogo, d as CSharpLogo, i as CheckCircledIcon, D as DotnetLogo, E as ElixirLogo, h as ErrorTriangleIcon, G as GoLogo, I as InfoIcon, J as JavaLogo, K as KafkaLogo, L as LogsIcon, g as MetricsIcon, M as MysqlLogo, N as NginxLogo, f as NodejsLogo, O as OdigosLogo, c as PhpLogo, P as PostgresLogo, e as PythonLogo, R as RedisLogo, b as RubyLogo, a as RustLogo, S as SwiftLogo, T as TracesIcon, W as WarningTriangleIcon } from './index-Bd8ZAEvq.js';
+export { C as CrossCircledIcon, D as DataStreamsIcon, F as FilterIcon, K as KeyIcon, N as NotificationIcon, O as OdigosLogoText, a as OverviewIcon, S as SlackLogo, T as TerminalIcon } from './index--RecCPGA.js';
+export { A as ArrowIcon, f as CheckIcon, C as CodeIcon, a as CopyIcon, g as CrossIcon, E as ExtendArrowIcon, d as EyeClosedIcon, e as EyeOpenIcon, L as ListIcon, M as MinusIcon, N as NoDataIcon, b as NotebookIcon, P as PlusIcon, S as SearchIcon, c as SortArrowsIcon, T as TrashIcon, X as XIcon } from './index-CIKkezVt.js';
 import React from 'react';
-export { E as EditIcon } from './index-B3j_QWzh.js';
-export { a3 as ActionsIcon, A as AlaudaLogo, a as AlibabaCloudLogo, b as AppDynamicsLogo, c as AwsCloudwatchLogo, d as AwsS3Logo, e as AwsXrayLogo, f as AxiomLogo, B as BetterStackLogo, g as BlobStorageLogo, h as BonreeLogo, C as CauselyLogo, i as ChecklyLogo, j as ChronosphereLogo, k as ClickhouseLogo, l as CoralogixLogo, D as Dash0Logo, m as DatadogLogo, a4 as DestinationsIcon, n as DynatraceLogo, E as ElasticApmLogo, o as ElasticSearchLogo, G as GigapipeLogo, 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, a5 as NamespacesIcon, N as NewRelicLogo, O as ObserveLogo, y as OneUptimeLogo, z as OpenObserveLogo, F as OpenTelemetryLogo, P as OpsVerseLogo, Q as OracleLogo, R as PrometheusLogo, S as QrynLogo, T as QuickwitLogo, a6 as RulesIcon, U as SeqLogo, W as SignozLogo, a7 as SourcesIcon, X as SplunkLogo, Y as SumoLogicLogo, Z as TelemetryHubLogo, _ as TempoLogo, $ as TingyunLogo, a0 as TraceloopLogo, a1 as UptraceLogo, a2 as VictoriaMetricsLogo, V as VmLogo } from './index-PfG5pvFK.js';
+export { E as EditIcon } from './index-BWZT-ipR.js';
+export { a3 as ActionsIcon, A as AlaudaLogo, a as AlibabaCloudLogo, b as AppDynamicsLogo, c as AwsCloudwatchLogo, d as AwsS3Logo, e as AwsXrayLogo, f as AxiomLogo, B as BetterStackLogo, g as BlobStorageLogo, h as BonreeLogo, C as CauselyLogo, i as ChecklyLogo, j as ChronosphereLogo, k as ClickhouseLogo, l as CoralogixLogo, D as Dash0Logo, m as DatadogLogo, a4 as DestinationsIcon, n as DynatraceLogo, E as ElasticApmLogo, o as ElasticSearchLogo, G as GigapipeLogo, 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, a5 as NamespacesIcon, N as NewRelicLogo, O as ObserveLogo, y as OneUptimeLogo, z as OpenObserveLogo, F as OpenTelemetryLogo, P as OpsVerseLogo, Q as OracleLogo, R as PrometheusLogo, S as QrynLogo, T as QuickwitLogo, a6 as RulesIcon, U as SeqLogo, W as SignozLogo, a7 as SourcesIcon, X as SplunkLogo, Y as SumoLogicLogo, Z as TelemetryHubLogo, _ as TempoLogo, $ as TingyunLogo, a0 as TraceloopLogo, a1 as UptraceLogo, a2 as VictoriaMetricsLogo, V as VmLogo } from './index-Cq8NT9Hr.js';
 import './types.js';
 import 'styled-components';
 

package/lib/{index-DR5ryS5d.js → index--RecCPGA.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-DJGe2YeC.js';
 
 const OdigosLogoText = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-cG2lNgzz.js → index-BBjwRlta.js}

@@ -1,11 +1,12 @@
 import { StatusType, OtherStatus, DestinationTypes, EntityTypes, PlatformType } from './types.js';
-import { K as K8sLogo } from './index-ivnS3eWW.js';
-import { D as DEFAULT_DATA_STREAM_NAME } from './index-B9cvsYnj.js';
-import { a as getProgrammingLanguageIcon } from './index-C7YDojNh.js';
+import { K as K8sLogo } from './index-DJGe2YeC.js';
+import { D as DEFAULT_DATA_STREAM_NAME } from './index-mOgS3e5E.js';
+import { a as getProgrammingLanguageIcon } from './index-ChYtqgBW.js';
 import 'react';
 import 'styled-components';
-import { e as AwsXrayLogo, a2 as VictoriaMetricsLogo, a1 as UptraceLogo, a0 as TraceloopLogo, $ as TingyunLogo, _ as TempoLogo, Z as TelemetryHubLogo, Y as SumoLogicLogo, X as SplunkLogo, W as SignozLogo, U as SeqLogo, d as AwsS3Logo, T as QuickwitLogo, G as GigapipeLogo, S as QrynLogo, R as PrometheusLogo, F as OpenTelemetryLogo, Q as OracleLogo, P as OpsVerseLogo, z as OpenObserveLogo, y as OneUptimeLogo, O as ObserveLogo, N as NewRelicLogo, M as MiddlewareLogo, x as LumigoLogo, w as LokiLogo, v as LogzioLogo, u as LightstepLogo, L as Last9Logo, K as KloudmateLogo, J as JaegerLogo, I as InstanaLogo, t as HyperDxLogo, H as HoneycombLogo, s as GroundcoverLogo, r as GreptimeLogo, q as GrafanaLogo, p as GoogleCloudPlatformLogo, o as ElasticSearchLogo, E as ElasticApmLogo, n as DynatraceLogo, m as DatadogLogo, D as Dash0Logo, l as CoralogixLogo, c as AwsCloudwatchLogo, k as ClickhouseLogo, j as ChronosphereLogo, i as ChecklyLogo, C as CauselyLogo, h as BonreeLogo, B as BetterStackLogo, g as BlobStorageLogo, f as AxiomLogo, b as AppDynamicsLogo, a as AlibabaCloudLogo, A as AlaudaLogo, a6 as RulesIcon, a3 as ActionsIcon, a4 as DestinationsIcon, a7 as SourcesIcon, a5 as NamespacesIcon, V as VmLogo } from './index-PfG5pvFK.js';
-import { K as KafkaLogo, O as OdigosLogo } from './index-DuSmjoDs.js';
+import { e as AwsXrayLogo, a2 as VictoriaMetricsLogo, a1 as UptraceLogo, a0 as TraceloopLogo, $ as TingyunLogo, _ as TempoLogo, Z as TelemetryHubLogo, Y as SumoLogicLogo, X as SplunkLogo, W as SignozLogo, U as SeqLogo, d as AwsS3Logo, T as QuickwitLogo, G as GigapipeLogo, S as QrynLogo, R as PrometheusLogo, F as OpenTelemetryLogo, Q as OracleLogo, P as OpsVerseLogo, z as OpenObserveLogo, y as OneUptimeLogo, O as ObserveLogo, N as NewRelicLogo, M as MiddlewareLogo, x as LumigoLogo, w as LokiLogo, v as LogzioLogo, u as LightstepLogo, L as Last9Logo, K as KloudmateLogo, J as JaegerLogo, I as InstanaLogo, t as HyperDxLogo, H as HoneycombLogo, s as GroundcoverLogo, r as GreptimeLogo, q as GrafanaLogo, p as GoogleCloudPlatformLogo, o as ElasticSearchLogo, E as ElasticApmLogo, n as DynatraceLogo, m as DatadogLogo, D as Dash0Logo, l as CoralogixLogo, c as AwsCloudwatchLogo, k as ClickhouseLogo, j as ChronosphereLogo, i as ChecklyLogo, C as CauselyLogo, h as BonreeLogo, B as BetterStackLogo, g as BlobStorageLogo, f as AxiomLogo, b as AppDynamicsLogo, a as AlibabaCloudLogo, A as AlaudaLogo, a6 as RulesIcon, a3 as ActionsIcon, a4 as DestinationsIcon, a7 as SourcesIcon, a5 as NamespacesIcon, V as VmLogo } from './index-Cq8NT9Hr.js';
+import { K as KafkaLogo, O as OdigosLogo } from './index-Bd8ZAEvq.js';
+import { s as safeJsonParse } from './index-BV85P9UP.js';
 
 const compareCondition = (renderCondition, fields) => {
     if (!renderCondition || !renderCondition.length)
@@ -287,12 +288,46 @@ const getWorkloadId = ({ namespace, name, kind }) => {
     return { namespace, name, kind };
 };
 
+const getYamlFieldsForDestination = (categories, destination) => {
+    const fields = [];
+    const parsedCategories = JSON.parse(JSON.stringify(categories));
+    for (const category of parsedCategories) {
+        const autoFilledFields = safeJsonParse(destination.fields, {});
+        const idx = category.items.findIndex((item) => item.type === destination.destinationType.type);
+        if (idx !== -1) {
+            fields.push(...category.items[idx].fields.map((field) => ({
+                ...field,
+                initialValue: autoFilledFields[field.name],
+            })));
+        }
+    }
+    return fields;
+};
+
 const isOverTime = (originDate, difference = 0) => {
     const now = new Date().getTime();
     const compareWith = new Date(originDate).getTime();
     return compareWith - now <= difference;
 };
 
+const mapDestinationFieldsForDisplay = (destination, yamlFields) => {
+    const parsedFields = safeJsonParse(destination.fields, {});
+    if (!yamlFields.length) {
+        return Object.entries(parsedFields).map(([key, value]) => ({
+            key,
+            name: key,
+            value,
+        }));
+    }
+    return yamlFields
+        .map((field) => ({
+        key: field.name,
+        name: field.displayName || field.name,
+        value: parsedFields[field.name] ?? null,
+    }))
+        .filter((item) => item.value !== null);
+};
+
 const mapExportedSignals = (exportedSignals) => {
     if (!exportedSignals)
         return [];
@@ -301,4 +336,4 @@ const mapExportedSignals = (exportedSignals) => {
 
 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, getConditionsBooleans as i, getContainersInstrumentedCount as j, getContainersIcons as k, getDestinationIcon as l, getEntityIcon as m, getEntityLabel as n, getMetricForEntity as o, getPlatformIcon as p, getPlatformLabel as q, getValueForRange as r, getWorkloadId as s, isOverTime as t, mapExportedSignals as u, sleep as v };
+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, getConditionsBooleans as i, getContainersInstrumentedCount as j, getContainersIcons as k, getDestinationIcon as l, getEntityIcon as m, getEntityLabel as n, getMetricForEntity as o, getPlatformIcon as p, getPlatformLabel as q, getValueForRange as r, getWorkloadId as s, getYamlFieldsForDestination as t, isOverTime as u, mapDestinationFieldsForDisplay as v, mapExportedSignals as w, sleep as x };

package/lib/{index-B3j_QWzh.js → index-BWZT-ipR.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-DJGe2YeC.js';
 
 const EditIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-BxckQJom.js → index-BZq0yNL-.js}

@@ -1,14 +1,14 @@
 import React, { useState, useEffect, useRef, forwardRef, createElement, useCallback, useMemo, Fragment } from 'react';
-import { T as Theme, n as ImageErrorIcon, M as MONITORS_OPTIONS } from './index-ivnS3eWW.js';
+import { T as Theme, n as ImageErrorIcon, M as MONITORS_OPTIONS } from './index-DJGe2YeC.js';
+import { StatusType, OtherStatus, SortDirection, ProgrammingLanguages, InputTypes, FieldTypes } from './types.js';
+import { M as MinusIcon, f as CheckIcon, L as ListIcon, C as CodeIcon, E as ExtendArrowIcon, c as SortArrowsIcon, a as CopyIcon, b as NotebookIcon, X as XIcon, d as EyeClosedIcon, e as EyeOpenIcon, N as NoDataIcon, g as CrossIcon, S as SearchIcon, P as PlusIcon, T as TrashIcon, A as ArrowIcon } from './index-CIKkezVt.js';
+import { b as getStatusIcon, r as removeEmptyValuesFromObject, s as safeJsonStringify, f as flattenObjectKeys, m as mapConditions, c as capitalizeFirstLetter, g as getMonitorIcon, p as parseJsonStringToPrettyString, a as getProgrammingLanguageIcon, d as splitCamelString, n as numbersOnly } from './index-ChYtqgBW.js';
 import styled, { css } from 'styled-components';
-import { M as MinusIcon, f as CheckIcon, L as ListIcon, C as CodeIcon, E as ExtendArrowIcon, c as SortArrowsIcon, a as CopyIcon, b as NotebookIcon, X as XIcon, d as EyeClosedIcon, e as EyeOpenIcon, N as NoDataIcon, g as CrossIcon, S as SearchIcon, P as PlusIcon, T as TrashIcon, A as ArrowIcon } from './index-DAbcw-wM.js';
-import { StatusType, OtherStatus, SortDirection, ProgrammingLanguages } from './types.js';
-import { s as safeJsonParse, i as isEmpty } from './index-BZS1ijMm.js';
-import { B as BUTTON_TEXTS } from './index-B9cvsYnj.js';
-import { b as getStatusIcon, r as removeEmptyValuesFromObject, s as safeJsonStringify, f as flattenObjectKeys, m as mapConditions, c as capitalizeFirstLetter, g as getMonitorIcon, p as parseJsonStringToPrettyString, a as getProgrammingLanguageIcon, d as splitCamelString } from './index-C7YDojNh.js';
-import { u as useContainerSize, a as useCopy, g as useTransition, d as useKeyDown, e as useOnClickOutside } from './useTransition-9tDdAS9s.js';
+import { s as safeJsonParse, i as isEmpty } from './index-BV85P9UP.js';
+import { B as BUTTON_TEXTS } from './index-mOgS3e5E.js';
+import { u as useContainerSize, a as useCopy, g as useTransition, d as useKeyDown, e as useOnClickOutside } from './useTransition-dZ92VxT2.js';
 import ReactDOM from 'react-dom';
-import { I as InfoIcon } from './index-DuSmjoDs.js';
+import { I as InfoIcon } from './index-Bd8ZAEvq.js';
 
 const TextWrapper$2 = styled.div `
   color: ${({ $color, theme }) => $color || theme.text.secondary};
@@ -5001,15 +5001,15 @@ const Button$1 = styled.button `
     cursor: not-allowed;
   }
 `;
-const Input = ({ icon: Icon, buttonLabel, onButtonClick, hasError, errorMessage, title, tooltip, required, onChange, type = 'text', name, ...props }) => {
+const Input = ({ icon: Icon, buttonLabel, onButtonClick, hasError, errorMessage, title, tooltip, required, value, onChange, type = InputTypes.Text, name, ...props }) => {
     const theme = Theme.useTheme();
-    const isSecret = type === 'password';
+    const isSecret = type === InputTypes.Password;
     const [revealSecret, setRevealSecret] = useState(false);
     const handleInputChange = (e) => {
         e.stopPropagation();
-        const v = e.target.value;
-        const actualValue = type === 'number' ? v.replace(/[^\d]/g, '') : v;
-        e.target.value = actualValue;
+        if (type === InputTypes.Number) {
+            e.target.value = numbersOnly(e.target.value);
+        }
         onChange?.(e);
     };
     const handleKeyDown = (e) => {
@@ -5021,7 +5021,7 @@ const Input = ({ icon: Icon, buttonLabel, onButtonClick, hasError, errorMessage,
         React.createElement(InputWrapper$1, { "$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 ? 'text' : type, "$hasIcon": !!Icon || isSecret, name: name, onChange: handleInputChange, onKeyDown: handleKeyDown, ...props }),
+            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 }),
             buttonLabel && onButtonClick && (React.createElement(Button$1, { onClick: onButtonClick, disabled: props.disabled }, buttonLabel))),
         !!errorMessage && React.createElement(FieldError, null, errorMessage)));
 };
@@ -5098,7 +5098,7 @@ const IconWrapper$1 = styled.div `
   align-items: center;
   gap: 4px;
 `;
-const Dropdown = ({ options, value, onSelect, onDeselect, title, tooltip, placeholder, disabled = false, isMulti = false, showSearch = false, required = false, errorMessage }) => {
+const Dropdown = ({ options, value, onSelect, onDeselect, title, tooltip, placeholder, disabled = false, isMulti = false, showSearch = false, required = false, errorMessage, hasError = false, }) => {
     const [isOpen, setIsOpen] = useState(false);
     const [openUpwards, setOpenUpwards] = useState(false);
     const containerRef = useRef(null);
@@ -5118,7 +5118,7 @@ const Dropdown = ({ options, value, onSelect, onDeselect, title, tooltip, placeh
     return (React.createElement(RootContainer, { "$disabled": disabled },
         React.createElement(FieldLabel, { title: title, required: required, tooltip: tooltip }),
         React.createElement(RelativeContainer, { ref: containerRef },
-            React.createElement(DropdownHeader, { "$isOpen": isOpen, "$isMulti": isMulti, "$hasSelections": Array.isArray(value) ? !!value.length : false, "$hasError": !!errorMessage, "$disabled": disabled, onClick: () => !disabled && toggleOpen() },
+            React.createElement(DropdownHeader, { "$isOpen": isOpen, "$isMulti": isMulti, "$hasSelections": Array.isArray(value) ? !!value.length : false, "$hasError": !!errorMessage || hasError, "$disabled": disabled, onClick: () => !disabled && toggleOpen() },
                 React.createElement(DropdownPlaceholder, { value: value, placeholder: placeholder, onDeselect: onDeselect }),
                 React.createElement(IconWrapper$1, null,
                     isMulti && React.createElement(Badge, { label: arrLen, filled: !!arrLen }),
@@ -5391,22 +5391,44 @@ const InputList = ({ initialValues = [], value, onChange, title, tooltip, requir
         React.createElement(AddButton, { onClick: handleAddInput, disabled: isAddButtonDisabled })));
 };
 
+const ColumnsToFields = ({ col, colIdx, row, rowIdx, rowsLength, maxWidth, handleChange, errorMessage, limitFieldsPerRow }) => {
+    const { keyName, title, tooltip, placeholder, required, type, componentType, options, renderCondition } = col;
+    const value = row[keyName];
+    if (renderCondition && !renderCondition(row))
+        return null;
+    const render = () => {
+        switch (componentType) {
+            case FieldTypes.Dropdown:
+                const selectedOption = options?.find((opt) => opt.id === value);
+                return (React.createElement(Dropdown, { title: limitFieldsPerRow ? title : undefined, tooltip: limitFieldsPerRow ? tooltip : undefined, placeholder: placeholder, required: required, options: options || [], value: selectedOption, onSelect: (opt) => handleChange(keyName, opt.id, rowIdx), onDeselect: (opt) => handleChange(keyName, '', rowIdx), hasError: !!errorMessage && (!required || (required && isEmpty(value))) }));
+            default:
+                const hasMoreThanOneRow = rowsLength > 1;
+                const isLastRow = rowIdx === rowsLength - 1;
+                const isFirstColumn = colIdx === 0;
+                const shouldAutoFocus = hasMoreThanOneRow && isLastRow && isFirstColumn && isEmpty(value);
+                return (React.createElement(Input, { title: limitFieldsPerRow ? title : undefined, tooltip: limitFieldsPerRow ? tooltip : undefined, placeholder: placeholder, type: type, required: required, autoFocus: shouldAutoFocus, value: value, onChange: ({ target: { value: val } }) => handleChange(keyName, val, rowIdx), style: { maxWidth, paddingLeft: 10 }, hasError: !!errorMessage && (!required || (required && isEmpty(value))) }));
+        }
+    };
+    return (React.createElement("td", { key: `input-table-${rowIdx}-${keyName}`, style: { maxWidth, padding: '4px 6px 4px 0' } }, render()));
+};
+
 const Container$b = styled.div `
   display: flex;
   flex-direction: column;
   width: 100%;
 `;
 const DeleteButton$1 = styled.button `
+  margin-top: ${({ $marginTop }) => $marginTop};
   background: none;
   border: none;
-  cursor: pointer;
   cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};
   opacity: ${({ disabled }) => (disabled ? 0.5 : 1)};
 `;
-const InputTable = ({ columns, initialValues = [], value, onChange, errorMessage }) => {
+const InputTable = ({ columns, initialValues = [], value, onChange, errorMessage, limitFieldsPerRow }) => {
     // INITIAL_ROW as state, because it's dynamic to the "columns" prop
     const [initialRow, setInitialRow] = useState({});
     const [rows, setRows] = useState(value || initialValues);
+    const columnMap = useMemo(() => new Map(columns.map((col) => [col.keyName, col])), [columns]);
     useEffect(() => {
         if (!rows.length) {
             const init = {};
@@ -5415,9 +5437,28 @@ const InputTable = ({ columns, initialValues = [], value, onChange, errorMessage
             setRows([{ ...init }]);
         }
     }, []);
+    const isRowValid = (row) => {
+        for (const [key, val] of Object.entries(row)) {
+            const col = columnMap.get(key);
+            if (col?.renderCondition && !col.renderCondition(row)) {
+                // If the column has a render condition and it shouldn't render, skip/pass this column as valid
+                continue;
+                // Else, keep checking it below
+            }
+            if (col?.required && isEmpty(val)) {
+                // If the column is required, and is empty, this row is invalid
+                return false;
+            }
+        }
+        return true;
+    };
     // Filter out rows where either key or value is empty
-    const validRows = rows.filter((row) => !Object.values(row).filter((val) => isEmpty(val)).length);
+    const validRows = rows.filter(isRowValid);
     const recordedRows = useRef(JSON.stringify(validRows));
+    const isAddButtonDisabled = validRows.length !== rows.length;
+    // adjust cell-width based on the amount of inputs on-screen,
+    // the "0.4" is to consider the delete button
+    const maxWidth = `${Math.floor(640 / ((limitFieldsPerRow || columns.length) + 0.4))}px`;
     useEffect(() => {
         const stringified = JSON.stringify(validRows);
         // Only trigger onChange if valid key-value pairs have changed
@@ -5435,7 +5476,12 @@ const InputTable = ({ columns, initialValues = [], value, onChange, errorMessage
         });
     };
     const handleDeleteRow = (idx) => {
-        setRows((prev) => prev.filter((_, i) => i !== idx));
+        if (rows.length > 1) {
+            setRows((prev) => prev.filter((_, i) => i !== idx));
+        }
+        else {
+            columns.forEach(({ keyName, type }) => handleChange(keyName, type === InputTypes.Number ? '0' : '', idx));
+        }
     };
     const handleChange = (key, val, idx) => {
         setRows((prev) => {
@@ -5444,36 +5490,35 @@ const InputTable = ({ columns, initialValues = [], value, onChange, errorMessage
             return payload;
         });
     };
-    // Check if any key or value field is empty
-    const isMinRows = rows.length <= 1;
-    const isAddButtonDisabled = rows.some((row) => !!Object.values(row).filter((val) => isEmpty(val)).length);
-    const isDelButtonDisabled = isMinRows && isAddButtonDisabled;
-    // adjust cell-width based on the amount of inputs on-screen,
-    // the "0.4" is to consider the delete button
-    const maxWidth = `${Math.floor(640 / (columns.length + 0.4))}px`;
+    const matrixColumns = useMemo(() => {
+        if (limitFieldsPerRow) {
+            const matrix = [];
+            for (let i = 0; true; i += limitFieldsPerRow) {
+                const arr = columns.slice(i, i + limitFieldsPerRow);
+                if (!arr.length)
+                    break;
+                matrix.push(arr);
+            }
+            return matrix;
+        }
+        return [columns];
+    }, [limitFieldsPerRow, columns]);
     return (React.createElement(Container$b, null,
         React.createElement("table", { style: { borderCollapse: 'collapse' } },
-            React.createElement("thead", null,
+            !limitFieldsPerRow && (React.createElement("thead", null,
                 React.createElement("tr", null,
                     columns.map(({ title, tooltip, required }) => (React.createElement("th", { key: `input-table-head-${title}`, style: { maxWidth } },
                         React.createElement(FieldLabel, { title: title, required: required, tooltip: tooltip })))),
-                    React.createElement("th", null))),
-            React.createElement("tbody", null, rows.map((row, idx) => (React.createElement("tr", { key: `input-table-row-${idx}` },
-                columns.map(({ type, keyName, placeholder, required }, innerIdx) => {
-                    const value = row[keyName];
-                    return (React.createElement("td", { key: `input-table-${idx}-${keyName}`, style: { maxWidth, padding: '4px 6px 4px 0' } },
-                        React.createElement(Input, { autoFocus: isEmpty(value) && !isMinRows && idx === rows.length - 1 && innerIdx === 0, type: type, placeholder: placeholder, value: value, onChange: ({ target: { value: val } }) => handleChange(keyName, type === 'number' ? Number(val) : val, idx), style: { maxWidth, paddingLeft: 10 }, hasError: !!errorMessage && (!required || (required && isEmpty(value))) })));
-                }),
-                React.createElement("td", null,
-                    React.createElement(DeleteButton$1, { disabled: isDelButtonDisabled, onClick: () => {
-                            if (isMinRows) {
-                                columns.forEach(({ keyName }) => handleChange(keyName, '', idx));
-                            }
-                            else {
-                                handleDeleteRow(idx);
-                            }
-                        } },
-                        React.createElement(TrashIcon, null)))))))),
+                    React.createElement("th", null)))),
+            React.createElement("tbody", null, rows.map((row, rowIdx) => (React.createElement(Fragment, { key: `input-table-row-${rowIdx}` },
+                limitFieldsPerRow && rowIdx > 0 ? (React.createElement("tr", null,
+                    React.createElement("td", { colSpan: matrixColumns.length },
+                        React.createElement(Divider, null)))) : null,
+                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(TrashIcon, null)))))))))))),
         !!errorMessage && React.createElement(FieldError, null, errorMessage),
         React.createElement(AddButton, { onClick: handleAddRow, disabled: isAddButtonDisabled })));
 };

package/lib/{index-DuSmjoDs.js → index-Bd8ZAEvq.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-DJGe2YeC.js';
 
 const OdigosLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-DAbcw-wM.js → index-CIKkezVt.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-DJGe2YeC.js';
 
 const ArrowIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();

package/lib/{index-C7YDojNh.js → index-ChYtqgBW.js}

@@ -1,8 +1,8 @@
 import { ProgrammingLanguages, SignalType, StatusType } from './types.js';
 import 'react';
-import { n as ImageErrorIcon } from './index-ivnS3eWW.js';
+import { n as ImageErrorIcon } from './index-DJGe2YeC.js';
 import 'styled-components';
-import { K as KafkaLogo, R as RedisLogo, P as PostgresLogo, N as NginxLogo, M as MysqlLogo, E as ElixirLogo, S as SwiftLogo, a as RustLogo, b as RubyLogo, c as PhpLogo, C as CPlusPlusLogo, d as CSharpLogo, D as DotnetLogo, e as PythonLogo, f as NodejsLogo, G as GoLogo, J as JavaLogo, T as TracesIcon, g as MetricsIcon, L as LogsIcon, O as OdigosLogo, I as InfoIcon, W as WarningTriangleIcon, h as ErrorTriangleIcon, i as CheckCircledIcon } from './index-DuSmjoDs.js';
+import { K as KafkaLogo, R as RedisLogo, P as PostgresLogo, N as NginxLogo, M as MysqlLogo, E as ElixirLogo, S as SwiftLogo, a as RustLogo, b as RubyLogo, c as PhpLogo, C as CPlusPlusLogo, d as CSharpLogo, D as DotnetLogo, e as PythonLogo, f as NodejsLogo, G as GoLogo, J as JavaLogo, T as TracesIcon, g as MetricsIcon, L as LogsIcon, O as OdigosLogo, I as InfoIcon, W as WarningTriangleIcon, h as ErrorTriangleIcon, i as CheckCircledIcon } from './index-Bd8ZAEvq.js';
 
 const capitalizeFirstLetter = (string) => {
     return string.charAt(0).toUpperCase() + string.slice(1);
@@ -136,6 +136,12 @@ const mapConditions = (conditions) => {
     })) || []);
 };
 
+const numbersOnly = (value) => {
+    // Use a regular expression to replace all non-digit characters with an empty string
+    const cleaned = value.replace(/[^\d]/g, '');
+    return cleaned;
+};
+
 const parseJsonStringToPrettyString = (value) => {
     let str = '';
     try {
@@ -198,4 +204,4 @@ const safeJsonStringify = (obj, indent = 2) => {
     return JSON.stringify(obj || {}, null, indent);
 };
 
-export { getProgrammingLanguageIcon as a, getStatusIcon as b, capitalizeFirstLetter as c, splitCamelString as d, flattenObjectKeys as f, getMonitorIcon as g, mapConditions as m, parseJsonStringToPrettyString as p, removeEmptyValuesFromObject as r, safeJsonStringify as s };
+export { getProgrammingLanguageIcon as a, getStatusIcon as b, capitalizeFirstLetter as c, splitCamelString as d, flattenObjectKeys as f, getMonitorIcon as g, mapConditions as m, numbersOnly as n, parseJsonStringToPrettyString as p, removeEmptyValuesFromObject as r, safeJsonStringify as s };

package/lib/{index-7-KCQK-x.js → index-CnZlllYu.js}

@@ -19,4 +19,13 @@ const getIdFromSseTarget = (target, type) => {
     }
 };
 
-export { getIdFromSseTarget as g };
+const isLegalK8sLabel = (name) => {
+    if (!name)
+        return false;
+    if (name.length > 63)
+        return false;
+    const regex = /^(([A-Za-z0-9][-A-Za-z0-9_.]*)?[A-Za-z0-9])?$/;
+    return regex.test(name);
+};
+
+export { getIdFromSseTarget as g, isLegalK8sLabel as i };

package/lib/{index-PfG5pvFK.js → index-Cq8NT9Hr.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { T as Theme } from './index-ivnS3eWW.js';
+import { T as Theme } from './index-DJGe2YeC.js';
 
 const VmLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
     const theme = Theme.useTheme();