@odigos/ui-kit 0.0.35 → 0.0.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # Changelog
2
2
 
3
+ ## [0.0.36](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.35...ui-kit-v0.0.36) (2025-06-05)
4
+
5
+
6
+ ### Features
7
+
8
+ * add docs button for destination modal ([#158](https://github.com/odigos-io/ui-kit/issues/158)) ([b410e83](https://github.com/odigos-io/ui-kit/commit/b410e8304b4900da48c26350544149ea3cbd7212))
9
+ * bump styled components & update theme type definition ([#160](https://github.com/odigos-io/ui-kit/issues/160)) ([645ed7b](https://github.com/odigos-io/ui-kit/commit/645ed7b2a569e50ee1d3c505b0efe64c6762ff2d))
10
+
11
+
12
+ ### Bug Fixes
13
+
14
+ * destination metrics ([#156](https://github.com/odigos-io/ui-kit/issues/156)) ([d98594d](https://github.com/odigos-io/ui-kit/commit/d98594df6cb077d140bee06af77d7f6323ea4aa6))
15
+ * test connection was disabled on initial load ([#157](https://github.com/odigos-io/ui-kit/issues/157)) ([9a529e6](https://github.com/odigos-io/ui-kit/commit/9a529e649a92540c8a5026316c8cfff980633666))
16
+
3
17
  ## [0.0.35](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.34...ui-kit-v0.0.35) (2025-06-04)
4
18
 
5
19
 
package/lib/components.js CHANGED
@@ -1,15 +1,15 @@
1
- import { B as Button } from './index-THrvNIPj.js';
2
- export { a as AutocompleteInput, b as Badge, a1 as CenterThis, C as Checkbox, c as Code, d as ConditionDetails, D as DataCard, f as DataCardFieldTypes, e as DataCardFields, g as DataTab, h as Divider, i as DocsButton, j as Drawer, l as DrawerFooter, k as DrawerHeader, m as Dropdown, E as ExtendArrow, F as FadeLoader, n as FieldError, o as FieldLabel, a0 as FlexColumn, $ as FlexRow, H as Header, I as IconButton, p as IconGroup, q as IconTitleBadge, r as IconWrapped, s as IconsNav, t as ImageControlled, u as Input, v as InputList, w as InputTable, x as InteractiveTable, K as KeyValueInputsList, M as Modal, a4 as ModalBody, y as MonitorsCheckboxes, z as MonitorsIcons, N as NavigationButtons, G as NoDataFound, J as NotificationNote, a3 as Overlay, S as ScrollX, L as SectionTitle, O as Segment, P as SelectionButton, Q as SkeletonLoader, R as Status, U as Stepper, a5 as TableContainer, a6 as TableTitleWrap, a7 as TableWrap, V as Text, W as TextArea, X as Toggle, T as ToggleCodeComponent, Y as Tooltip, Z as TraceLoader, a2 as VerticalScroll, _ as WarningModal } from './index-THrvNIPj.js';
3
- export { C as CancelWarning, D as DeleteWarning } from './index-CyG_tD3y.js';
1
+ import { B as Button } from './index-Be0m3TUg.js';
2
+ export { a as AutocompleteInput, b as Badge, a1 as CenterThis, C as Checkbox, c as Code, d as ConditionDetails, D as DataCard, f as DataCardFieldTypes, e as DataCardFields, g as DataTab, h as Divider, i as DocsButton, j as Drawer, l as DrawerFooter, k as DrawerHeader, m as Dropdown, E as ExtendArrow, F as FadeLoader, n as FieldError, o as FieldLabel, a0 as FlexColumn, $ as FlexRow, H as Header, I as IconButton, p as IconGroup, q as IconTitleBadge, r as IconWrapped, s as IconsNav, t as ImageControlled, u as Input, v as InputList, w as InputTable, x as InteractiveTable, K as KeyValueInputsList, M as Modal, a4 as ModalBody, y as MonitorsCheckboxes, z as MonitorsIcons, N as NavigationButtons, G as NoDataFound, J as NotificationNote, a3 as Overlay, S as ScrollX, L as SectionTitle, O as Segment, P as SelectionButton, Q as SkeletonLoader, R as Status, U as Stepper, a5 as TableContainer, a6 as TableTitleWrap, a7 as TableWrap, V as Text, W as TextArea, X as Toggle, T as ToggleCodeComponent, Y as Tooltip, Z as TraceLoader, a2 as VerticalScroll, _ as WarningModal } from './index-Be0m3TUg.js';
3
+ export { C as CancelWarning, D as DeleteWarning } from './index-CNbTSsNJ.js';
4
4
  import React, { Component, createElement, createContext } from 'react';
5
- import { T as Theme } from './index-CKOBXat_.js';
5
+ import { T as Theme } from './index-aRNtyuuU.js';
6
6
  import './types.js';
7
- import './index-CEWs8CTN.js';
8
- import './index-CCX1HLUr.js';
7
+ import './index-D8AnbGCE.js';
8
+ import './index-BbEmZ4Wj.js';
9
9
  import 'styled-components';
10
- import './index-BVj4fOL3.js';
10
+ import './index-7YZOplrB.js';
11
11
  import './index-BV85P9UP.js';
12
- import './useTransition-D9f1CP9n.js';
12
+ import './useTransition-0Rz0QKmh.js';
13
13
  import 'react-dom';
14
14
 
15
15
  const ErrorBoundaryContext = createContext(null);
package/lib/constants.js CHANGED
@@ -1,4 +1,4 @@
1
- export { A as ACTION_OPTIONS, B as BUTTON_TEXTS, D as DEFAULT_DATA_STREAM_NAME, k as DISPLAY_TITLES, F as FORM_ALERTS, I as INSTRUMENTATION_RULE_OPTIONS, M as MONITORS_OPTIONS, S as STORAGE_KEYS } from './index-CKOBXat_.js';
1
+ export { A as ACTION_OPTIONS, B as BUTTON_TEXTS, D as DEFAULT_DATA_STREAM_NAME, k as DISPLAY_TITLES, F as FORM_ALERTS, I as INSTRUMENTATION_RULE_OPTIONS, M as MONITORS_OPTIONS, S as STORAGE_KEYS } from './index-aRNtyuuU.js';
2
2
  export { D as DESTINATION_CATEGORIES } from './index-Dqief9td.js';
3
3
  import 'react';
4
4
  import './types.js';
@@ -1,8 +1,8 @@
1
- import type { ITheme } from '@/theme/palletes';
2
1
  import type { Edge, Node } from '@xyflow/react';
2
+ import { DefaultTheme } from 'styled-components';
3
3
  import { type Metrics } from '@/types';
4
4
  interface Params {
5
- theme: ITheme;
5
+ theme: DefaultTheme;
6
6
  nodes: Node[];
7
7
  metrics?: Metrics;
8
8
  containerHeight: number;
package/lib/containers.js CHANGED
@@ -1,23 +1,23 @@
1
1
  import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle, useMemo, memo, useContext, createContext, useCallback, useLayoutEffect, Fragment } from 'react';
2
2
  import styled, { css } from 'styled-components';
3
- import { k as DISPLAY_TITLES, T as Theme, h as usePendingStore, g as useNotificationStore, b as useDrawerStore, B as BUTTON_TEXTS, c as useEntityStore, A as ACTION_OPTIONS, l as getActionIcon, f as useModalStore, F as FORM_ALERTS, d as useFilterStore, M as MONITORS_OPTIONS, t as styleInject, i as useSelectedStore, e as useInstrumentStore, n as getInstrumentationRuleIcon, a as useDataStreamStore, m as getEntityId, S as STORAGE_KEYS, j as useSetupStore, I as INSTRUMENTATION_RULE_OPTIONS, u as useDarkMode } from './index-CKOBXat_.js';
3
+ import { k as DISPLAY_TITLES, T as Theme, h as usePendingStore, g as useNotificationStore, b as useDrawerStore, B as BUTTON_TEXTS, c as useEntityStore, A as ACTION_OPTIONS, l as getActionIcon, f as useModalStore, F as FORM_ALERTS, d as useFilterStore, M as MONITORS_OPTIONS, t as styleInject, i as useSelectedStore, e as useInstrumentStore, n as getInstrumentationRuleIcon, a as useDataStreamStore, m as getEntityId, S as STORAGE_KEYS, j as useSetupStore, I as INSTRUMENTATION_RULE_OPTIONS, u as useDarkMode } from './index-aRNtyuuU.js';
4
4
  import { ActionType, ActionKeyTypes, InputTypes, FieldTypes, EntityTypes, StatusType, Crud, OtherStatus, NodeTypes, AddNodeTypes, EdgeTypes, SignalType, HeadersCollectionKeyTypes, CodeAttributesKeyTypes, PayloadCollectionKeyTypes, InstrumentationRuleType } from './types.js';
5
- import { f as DataCardFieldTypes, o as FieldLabel, C as Checkbox, n as FieldError, u as Input, w as InputTable, K as KeyValueInputsList, v as InputList, V as Text, O as Segment, L as SectionTitle, i as DocsButton, y as MonitorsCheckboxes, W as TextArea, j as Drawer, d as ConditionDetails, D as DataCard, a0 as FlexColumn, M as Modal, N as NavigationButtons, a4 as ModalBody, J as NotificationNote, a as AutocompleteInput, h as Divider, R as Status, $ as FlexRow, Y as Tooltip, r as IconWrapped, z as MonitorsIcons, a5 as TableContainer, a6 as TableTitleWrap, q as IconTitleBadge, a7 as TableWrap, x as InteractiveTable, a1 as CenterThis, G as NoDataFound, Z as TraceLoader, b as Badge, E as ExtendArrow, a2 as VerticalScroll, P as SelectionButton, B as Button, m as Dropdown, a8 as getDefaultExportFromCjs, F as FadeLoader, g as DataTab, Q as SkeletonLoader, X as Toggle, A as AddButton$1, U as Stepper, I as IconButton, e as DataCardFields, s as IconsNav, p as IconGroup } from './index-THrvNIPj.js';
5
+ import { f as DataCardFieldTypes, o as FieldLabel, C as Checkbox, n as FieldError, u as Input, w as InputTable, K as KeyValueInputsList, v as InputList, V as Text, O as Segment, L as SectionTitle, i as DocsButton, y as MonitorsCheckboxes, W as TextArea, j as Drawer, d as ConditionDetails, D as DataCard, a0 as FlexColumn, M as Modal, N as NavigationButtons, a4 as ModalBody, J as NotificationNote, a as AutocompleteInput, h as Divider, R as Status, $ as FlexRow, Y as Tooltip, r as IconWrapped, z as MonitorsIcons, a5 as TableContainer, a6 as TableTitleWrap, q as IconTitleBadge, a7 as TableWrap, x as InteractiveTable, a1 as CenterThis, G as NoDataFound, Z as TraceLoader, b as Badge, E as ExtendArrow, a2 as VerticalScroll, P as SelectionButton, B as Button, m as Dropdown, a8 as getDefaultExportFromCjs, F as FadeLoader, g as DataTab, Q as SkeletonLoader, X as Toggle, A as AddButton$1, U as Stepper, I as IconButton, e as DataCardFields, s as IconsNav, p as IconGroup } from './index-Be0m3TUg.js';
6
6
  import { i as isEmpty, s as safeJsonParse } from './index-BV85P9UP.js';
7
- import { i as CheckCircledIcon, O as OdigosLogo } from './index-BVj4fOL3.js';
8
- import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, N as NotificationIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon } from './index-BDqd3uNm.js';
9
- import { u as useActionFormData, a as useClickNode, e as useSessionStorage, c as useDataStreamFormData, d as useDestinationFormData, b as useClickNotification, f as useSourceFormData, g as useSourceSelectionFormData } from './useSourceSelectionFormData-DqSNROtZ.js';
10
- import { d as useKeyDown, e as useOnClickOutside, u as useContainerSize, c as useInstrumentationRuleFormData, g as useTransition, f as useTimeAgo, a as useCopy } from './useTransition-D9f1CP9n.js';
11
- import { E as EditIcon } from './index-DqaI44fJ.js';
12
- import { T as TrashIcon, S as SearchIcon, P as PlusIcon$1, f as CheckIcon, A as ArrowIcon, a as CopyIcon, g as CrossIcon } from './index-CEWs8CTN.js';
13
- import { D as DeleteWarning, C as CancelWarning } from './index-CyG_tD3y.js';
14
- import { m as mapConditions, b as getStatusIcon, c as capitalizeFirstLetter } from './index-CCX1HLUr.js';
15
- import { f as filterActions, i as getConditionsBooleans, n as getEntityLabel, m as getEntityIcon, w as sleep$1, p as getPlatformIcon, q as getPlatformLabel, h as formatBytes, k as getContainersIcons, r as getValueForRange, l as getDestinationIcon, g as filterSourcesByStream, e as filterSources, b as filterDestinationsByStream, a as filterDestinations, v as mapDestinationFieldsForDisplay, c as compareCondition, t as getYamlFieldsForDestination, d as deepClone, o as getMetricForEntity, s as getWorkloadId, j as getContainersInstrumentedCount, u as isOverTime } from './index-dLZvpGw3.js';
7
+ import { i as CheckCircledIcon, O as OdigosLogo } from './index-7YZOplrB.js';
8
+ import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, N as NotificationIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon } from './index-DJpBLpwG.js';
9
+ import { u as useActionFormData, a as useClickNode, e as useSessionStorage, c as useDataStreamFormData, d as useDestinationFormData, b as useClickNotification, f as useSourceFormData, g as useSourceSelectionFormData } from './useSourceSelectionFormData-CH2xUOpu.js';
10
+ import { d as useKeyDown, e as useOnClickOutside, u as useContainerSize, c as useInstrumentationRuleFormData, g as useTransition, f as useTimeAgo, a as useCopy } from './useTransition-0Rz0QKmh.js';
11
+ import { E as EditIcon } from './index-t3OxxFsp.js';
12
+ import { T as TrashIcon, S as SearchIcon, P as PlusIcon$1, f as CheckIcon, A as ArrowIcon, a as CopyIcon, g as CrossIcon } from './index-D8AnbGCE.js';
13
+ import { D as DeleteWarning, C as CancelWarning } from './index-CNbTSsNJ.js';
14
+ import { m as mapConditions, b as getStatusIcon, c as capitalizeFirstLetter } from './index-BbEmZ4Wj.js';
15
+ import { f as filterActions, i as getConditionsBooleans, n as getEntityLabel, m as getEntityIcon, w as sleep$1, p as getPlatformIcon, q as getPlatformLabel, h as formatBytes, k as getContainersIcons, r as getValueForRange, l as getDestinationIcon, g as filterSourcesByStream, e as filterSources, b as filterDestinationsByStream, a as filterDestinations, v as mapDestinationFieldsForDisplay, c as compareCondition, t as getYamlFieldsForDestination, d as deepClone, o as getMetricForEntity, s as getWorkloadId, j as getContainersInstrumentedCount, u as isOverTime } from './index-CrethNg6.js';
16
16
  import { createPortal } from 'react-dom';
17
17
  import { m as mapExportedSignals } from './index-BlZKWuxe.js';
18
- import { N as NoteBackToSummary, E as EditButton } from './index-DmCjUtBQ.js';
18
+ import { N as NoteBackToSummary, E as EditButton } from './index-oEjS7cX3.js';
19
19
  import { D as DESTINATION_CATEGORIES } from './index-Dqief9td.js';
20
- import { a6 as RulesIcon, a7 as SourcesIcon, a3 as ActionsIcon, a4 as DestinationsIcon } from './index-9R2N835W.js';
20
+ import { a6 as RulesIcon, a7 as SourcesIcon, a3 as ActionsIcon, a4 as DestinationsIcon } from './index-BGzxan6E.js';
21
21
 
22
22
  const buildCard$3 = (action) => {
23
23
  const { type, spec: { actionName, notes, signals, disabled, collectContainerAttributes, collectReplicaSetAttributes, collectWorkloadId, collectClusterId, labelsAttributes, annotationsAttributes, clusterAttributes, attributeNamesToDelete, renames, piiCategories, fallbackSamplingRatio, samplingPercentage, endpointsFilters, servicesNameFilters, attributeFilters, }, } = action;
@@ -13406,13 +13406,14 @@ const createEdge = (edgeId, params) => {
13406
13406
  const buildEdges = ({ theme, nodes, metrics, containerHeight }) => {
13407
13407
  const edges = [];
13408
13408
  const actionNodeId = nodes.find(({ id: nodeId }) => [`${EntityTypes.Action}-${NodeTypes.Frame}`, `${EntityTypes.Action}-${NodeTypes.Add}`].includes(nodeId))?.id;
13409
+ const scrollTopLimit = -80 / 2 + framePadding$4;
13410
+ const scrollBottomLimit = Math.floor(containerHeight / nodeHeight$5) * nodeHeight$5 - (nodeHeight$5 / 2 + framePadding$4);
13411
+ const isBaseNode = (nodeType) => nodeType === NodeTypes.Base || nodeType === NodeTypes.Edged;
13409
13412
  nodes.forEach(({ type: nodeType, id: nodeId, data: { type: entityType, id: entityId, status }, position }) => {
13410
- if (nodeType === NodeTypes.Edged && entityType === EntityTypes.Source) {
13413
+ if (entityType === EntityTypes.Source && isBaseNode(nodeType)) {
13411
13414
  const { namespace, name, kind } = entityId;
13412
13415
  const metric = metrics?.sources.find((m) => m.kind === kind && m.name === name && m.namespace === namespace);
13413
- const topLimit = -80 / 2 + framePadding$4;
13414
- const bottomLimit = Math.floor(containerHeight / nodeHeight$5) * nodeHeight$5 - (nodeHeight$5 / 2 + framePadding$4);
13415
- if (position.y >= topLimit && position.y <= bottomLimit) {
13416
+ if (position.y >= scrollTopLimit && position.y <= scrollBottomLimit) {
13416
13417
  edges.push(createEdge(`${nodeId}-to-${actionNodeId}`, {
13417
13418
  theme,
13418
13419
  animated: false,
@@ -13422,15 +13423,17 @@ const buildEdges = ({ theme, nodes, metrics, containerHeight }) => {
13422
13423
  }));
13423
13424
  }
13424
13425
  }
13425
- if (nodeType === NodeTypes.Base && entityType === EntityTypes.Destination) {
13426
+ if (entityType === EntityTypes.Destination && isBaseNode(nodeType)) {
13426
13427
  const metric = metrics?.destinations.find((m) => m.id === entityId);
13427
- edges.push(createEdge(`${actionNodeId}-to-${nodeId}`, {
13428
- theme,
13429
- animated: false,
13430
- isMultiTarget: true,
13431
- label: formatBytes(metric?.throughput),
13432
- isError: status === StatusType.Error,
13433
- }));
13428
+ if (position.y >= scrollTopLimit && position.y <= scrollBottomLimit) {
13429
+ edges.push(createEdge(`${actionNodeId}-to-${nodeId}`, {
13430
+ theme,
13431
+ animated: false,
13432
+ isMultiTarget: true,
13433
+ label: formatBytes(metric?.throughput),
13434
+ isError: status === StatusType.Error,
13435
+ }));
13436
+ }
13434
13437
  }
13435
13438
  });
13436
13439
  return edges;
@@ -13440,6 +13443,7 @@ const { nodeWidth: nodeWidth$4, nodeHeight: nodeHeight$4, framePadding: framePad
13440
13443
  const mapToNodeData$3 = (entity) => {
13441
13444
  return {
13442
13445
  nodeWidth: nodeWidth$4,
13446
+ nodeHeight: nodeHeight$4, // for edged node
13443
13447
  id: entity.ruleId,
13444
13448
  type: EntityTypes.InstrumentationRule,
13445
13449
  status: undefined,
@@ -13543,6 +13547,7 @@ const mapToNodeData$2 = (entity) => {
13543
13547
  const { hasDisableds, priorotizedStatus } = getConditionsBooleans(entity.conditions || []);
13544
13548
  return {
13545
13549
  nodeWidth: nodeWidth$3,
13550
+ nodeHeight: nodeHeight$3, // for edged node
13546
13551
  id: entity.id,
13547
13552
  type: EntityTypes.Action,
13548
13553
  status: priorotizedStatus,
@@ -13808,6 +13813,7 @@ const mapToNodeData = (entity) => {
13808
13813
  const { icon, iconSrc } = getDestinationIcon(entity.destinationType.type);
13809
13814
  return {
13810
13815
  nodeWidth,
13816
+ nodeHeight, // for edged node
13811
13817
  id: entity.id,
13812
13818
  type: EntityTypes.Destination,
13813
13819
  status: priorotizedStatus,
@@ -14476,8 +14482,15 @@ const TestConnection = ({ destination, disabled, validateForm, status, testConne
14476
14482
  if (validateForm()) {
14477
14483
  setLoading(true);
14478
14484
  const testResult = await testConnection(destination);
14485
+ // 1st if - check if we got a response (if undefined, then Apollo Client caught an error)
14479
14486
  if (testResult) {
14480
- testResult.succeeded ? onSuccess(testResult) : onError(testResult);
14487
+ // 2nd if - check if the test was successful or not
14488
+ if (testResult.succeeded) {
14489
+ onSuccess(testResult);
14490
+ }
14491
+ else {
14492
+ onError(testResult);
14493
+ }
14481
14494
  }
14482
14495
  setLoading(false);
14483
14496
  }
@@ -14497,8 +14510,11 @@ const NotesWrapper = styled.div `
14497
14510
  flex-direction: column;
14498
14511
  gap: 12px;
14499
14512
  `;
14513
+ const SignalsAndDocsWrapper = styled(FlexRow) `
14514
+ justify-content: space-between;
14515
+ `;
14500
14516
  const DestinationForm = ({ isUpdate, categoryItem, formData, formErrors, validateForm, handleFormChange, dynamicFields, setDynamicFields, testConnection }) => {
14501
- const { supportedSignals, testConnectionSupported, displayName } = categoryItem || {};
14517
+ const { type, displayName, supportedSignals, testConnectionSupported } = categoryItem || {};
14502
14518
  const [autoFilled, setAutoFilled] = useState(false);
14503
14519
  const [isFormDirty, setIsFormDirty] = useState(false);
14504
14520
  const [connection, setConnection] = useState(undefined);
@@ -14545,6 +14561,7 @@ const DestinationForm = ({ isUpdate, categoryItem, formData, formErrors, validat
14545
14561
  return arr;
14546
14562
  }, [formData]);
14547
14563
  const dirtyForm = () => {
14564
+ setAutoFilled(false);
14548
14565
  setIsFormDirty(true);
14549
14566
  setConnection(undefined);
14550
14567
  };
@@ -14574,12 +14591,14 @@ const DestinationForm = ({ isUpdate, categoryItem, formData, formErrors, validat
14574
14591
  };
14575
14592
  return (React.createElement(Container$a, { "$gap": 24 },
14576
14593
  React.createElement(Container$a, { "$gap": 12 },
14577
- React.createElement(SectionTitle, { title: isUpdate ? 'Update destination' : 'Create destination', description: `Connect ${displayName} with Odigos.`, actionButton: testConnectionSupported && (React.createElement(TestConnection, { destination: formData, disabled: !isFormDirty, validateForm: validateForm, status: connection?.type, testConnection: testConnection, onError: onTestConnectionError, onSuccess: onTestConnectionSuccess })) }),
14594
+ React.createElement(SectionTitle, { title: isUpdate ? 'Update destination' : 'Create destination', description: `Connect ${displayName} with Odigos.`, actionButton: testConnectionSupported && (React.createElement(TestConnection, { destination: formData, disabled: !isFormDirty && !autoFilled, validateForm: validateForm, status: connection?.type, testConnection: testConnection, onError: onTestConnectionError, onSuccess: onTestConnectionSuccess })) }),
14578
14595
  React.createElement(NotesWrapper, null,
14579
14596
  testConnectionSupported && connection && React.createElement(NotificationNote, { type: connection.type, title: connection.title, message: connection.message }),
14580
14597
  autoFilled && !connection && !isUpdate && React.createElement(NotificationNote, { type: StatusType.Default, message: `Odigos autocompleted ${displayName} destination details.` })),
14581
14598
  React.createElement(Divider, null)),
14582
- React.createElement(MonitorsCheckboxes, { title: isUpdate ? '' : 'This connection will monitor:', required: true, allowedSignals: supportedMonitors, selectedSignals: selectedMonitors, setSelectedSignals: handleSelectedSignals, errorMessage: formErrors['exportedSignals'] }),
14599
+ React.createElement(SignalsAndDocsWrapper, null,
14600
+ React.createElement(MonitorsCheckboxes, { title: isUpdate ? '' : 'This connection will monitor:', required: true, allowedSignals: supportedMonitors, selectedSignals: selectedMonitors, setSelectedSignals: handleSelectedSignals, errorMessage: formErrors['exportedSignals'] }),
14601
+ !isUpdate && React.createElement(DocsButton, { endpoint: `/backends/${type}` })),
14583
14602
  !isUpdate && (React.createElement(Input, { title: 'Destination name', placeholder: 'Enter destination name', value: formData['name'], onChange: (e) => {
14584
14603
  dirtyForm();
14585
14604
  handleFormChange('name', e.target.value);
package/lib/functions.js CHANGED
@@ -1,13 +1,13 @@
1
- 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-CCX1HLUr.js';
2
- 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 sleep } from './index-dLZvpGw3.js';
3
- export { l as getActionIcon, m as getEntityId, n as getInstrumentationRuleIcon } from './index-CKOBXat_.js';
1
+ 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-BbEmZ4Wj.js';
2
+ 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 sleep } from './index-CrethNg6.js';
3
+ export { l as getActionIcon, m as getEntityId, n as getInstrumentationRuleIcon } from './index-aRNtyuuU.js';
4
4
  export { g as getIdFromSseTarget, i as isLegalK8sLabel, m as mapExportedSignals } from './index-BlZKWuxe.js';
5
5
  import { EntityTypes } from './types.js';
6
6
  export { i as isEmpty, s as safeJsonParse } from './index-BV85P9UP.js';
7
7
  import 'react';
8
8
  import 'styled-components';
9
- import './index-BVj4fOL3.js';
10
- import './index-9R2N835W.js';
9
+ import './index-7YZOplrB.js';
10
+ import './index-BGzxan6E.js';
11
11
 
12
12
  const cleanObjectEmptyStringsValues = (obj) => {
13
13
  const cleanArray = (arr) => arr.filter((item) => {
package/lib/hooks.js CHANGED
@@ -1,7 +1,7 @@
1
- export { u as useActionFormData, a as useClickNode, b as useClickNotification, c as useDataStreamFormData, d as useDestinationFormData, e as useSessionStorage, f as useSourceFormData, g as useSourceSelectionFormData } from './useSourceSelectionFormData-DqSNROtZ.js';
2
- 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-D9f1CP9n.js';
1
+ export { u as useActionFormData, a as useClickNode, b as useClickNotification, c as useDataStreamFormData, d as useDestinationFormData, e as useSessionStorage, f as useSourceFormData, g as useSourceSelectionFormData } from './useSourceSelectionFormData-CH2xUOpu.js';
2
+ 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-0Rz0QKmh.js';
3
3
  import './types.js';
4
- import './index-CKOBXat_.js';
4
+ import './index-aRNtyuuU.js';
5
5
  import 'react';
6
6
  import 'styled-components';
7
7
  import './index-BV85P9UP.js';
package/lib/icons.js CHANGED
@@ -1,11 +1,11 @@
1
- import { T as Theme } from './index-CKOBXat_.js';
2
- export { p as AddClusterInfoIcon, C as CodeAttributesIcon, q as DeleteAttributeIcon, H as HeadersCollectionIcon, o as ImageErrorIcon, K as K8sLogo, s as PayloadCollectionIcon, P as PiiMaskingIcon, R as RenameAttributeIcon, r as SamplerIcon } from './index-CKOBXat_.js';
3
- 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-BVj4fOL3.js';
4
- 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-BDqd3uNm.js';
5
- 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-CEWs8CTN.js';
1
+ import { T as Theme } from './index-aRNtyuuU.js';
2
+ export { p as AddClusterInfoIcon, C as CodeAttributesIcon, q as DeleteAttributeIcon, H as HeadersCollectionIcon, o as ImageErrorIcon, K as K8sLogo, s as PayloadCollectionIcon, P as PiiMaskingIcon, R as RenameAttributeIcon, r as SamplerIcon } from './index-aRNtyuuU.js';
3
+ 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-7YZOplrB.js';
4
+ 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-DJpBLpwG.js';
5
+ 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-D8AnbGCE.js';
6
6
  import React from 'react';
7
- export { E as EditIcon } from './index-DqaI44fJ.js';
8
- 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-9R2N835W.js';
7
+ export { E as EditIcon } from './index-t3OxxFsp.js';
8
+ 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-BGzxan6E.js';
9
9
  import './types.js';
10
10
  import 'styled-components';
11
11
 
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-CKOBXat_.js';
2
+ import { T as Theme } from './index-aRNtyuuU.js';
3
3
 
4
4
  const OdigosLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
5
5
  const theme = Theme.useTheme();
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-CKOBXat_.js';
2
+ import { T as Theme } from './index-aRNtyuuU.js';
3
3
 
4
4
  const VmLogo = ({ size = 16, fill: f, rotate = 0, onClick }) => {
5
5
  const theme = Theme.useTheme();
@@ -1,8 +1,8 @@
1
1
  import { ProgrammingLanguages, SignalType, StatusType } from './types.js';
2
2
  import 'react';
3
- import { o as ImageErrorIcon } from './index-CKOBXat_.js';
3
+ import { o as ImageErrorIcon } from './index-aRNtyuuU.js';
4
4
  import 'styled-components';
5
- 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-BVj4fOL3.js';
5
+ 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-7YZOplrB.js';
6
6
 
7
7
  const capitalizeFirstLetter = (string) => {
8
8
  return string.charAt(0).toUpperCase() + string.slice(1);
@@ -1,13 +1,13 @@
1
1
  import React, { useState, useEffect, useRef, forwardRef, createElement, useCallback, useMemo, Fragment } from 'react';
2
- import { T as Theme, o as ImageErrorIcon, M as MONITORS_OPTIONS, B as BUTTON_TEXTS } from './index-CKOBXat_.js';
2
+ import { T as Theme, o as ImageErrorIcon, M as MONITORS_OPTIONS, B as BUTTON_TEXTS } from './index-aRNtyuuU.js';
3
3
  import { StatusType, OtherStatus, SortDirection, ProgrammingLanguages, IntrumentationStatus, InputTypes, FieldTypes } from './types.js';
4
- 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-CEWs8CTN.js';
5
- 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-CCX1HLUr.js';
4
+ 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-D8AnbGCE.js';
5
+ 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-BbEmZ4Wj.js';
6
6
  import styled, { css } from 'styled-components';
7
7
  import { s as safeJsonParse, i as isEmpty } from './index-BV85P9UP.js';
8
- import { u as useContainerSize, a as useCopy, g as useTransition, d as useKeyDown, e as useOnClickOutside } from './useTransition-D9f1CP9n.js';
8
+ import { u as useContainerSize, a as useCopy, g as useTransition, d as useKeyDown, e as useOnClickOutside } from './useTransition-0Rz0QKmh.js';
9
9
  import ReactDOM from 'react-dom';
10
- import { I as InfoIcon } from './index-BVj4fOL3.js';
10
+ import { I as InfoIcon } from './index-7YZOplrB.js';
11
11
 
12
12
  const TextWrapper$2 = styled.div `
13
13
  color: ${({ $color, theme }) => $color || theme.text.secondary};
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
- import { _ as WarningModal } from './index-THrvNIPj.js';
2
+ import { _ as WarningModal } from './index-Be0m3TUg.js';
3
3
  import { StatusType, EntityTypes } from './types.js';
4
- import './index-CKOBXat_.js';
4
+ import './index-aRNtyuuU.js';
5
5
  import 'styled-components';
6
6
 
7
7
  const CancelWarning = ({ isOpen, noOverlay, name, onApprove, onDeny }) => {
@@ -1,10 +1,10 @@
1
1
  import { StatusType, OtherStatus, DestinationTypes, EntityTypes, PlatformType } from './types.js';
2
- import { D as DEFAULT_DATA_STREAM_NAME, K as K8sLogo } from './index-CKOBXat_.js';
3
- import { a as getProgrammingLanguageIcon } from './index-CCX1HLUr.js';
2
+ import { D as DEFAULT_DATA_STREAM_NAME, K as K8sLogo } from './index-aRNtyuuU.js';
3
+ import { a as getProgrammingLanguageIcon } from './index-BbEmZ4Wj.js';
4
4
  import 'react';
5
5
  import 'styled-components';
6
- 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-9R2N835W.js';
7
- import { K as KafkaLogo, O as OdigosLogo } from './index-BVj4fOL3.js';
6
+ 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-BGzxan6E.js';
7
+ import { K as KafkaLogo, O as OdigosLogo } from './index-7YZOplrB.js';
8
8
  import { s as safeJsonParse } from './index-BV85P9UP.js';
9
9
 
10
10
  const compareCondition = (renderCondition, fields) => {
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-CKOBXat_.js';
2
+ import { T as Theme } from './index-aRNtyuuU.js';
3
3
 
4
4
  const ArrowIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
5
5
  const theme = Theme.useTheme();
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-CKOBXat_.js';
2
+ import { T as Theme } from './index-aRNtyuuU.js';
3
3
 
4
4
  const OdigosLogoText = ({ size = 16, fill: f, rotate = 0, onClick }) => {
5
5
  const theme = Theme.useTheme();
@@ -1291,11 +1291,6 @@ var animations = /*#__PURE__*/Object.freeze({
1291
1291
  slide: slide
1292
1292
  });
1293
1293
 
1294
- const Theme = {
1295
- Provider,
1296
- useTheme: useTheme,
1297
- opacity,
1298
- animations,
1299
- };
1294
+ const Theme = { Provider, useTheme, opacity, animations };
1300
1295
 
1301
1296
  export { ACTION_OPTIONS as A, BUTTON_TEXTS as B, CodeAttributesIcon as C, DEFAULT_DATA_STREAM_NAME as D, FORM_ALERTS as F, HeadersCollectionIcon as H, INSTRUMENTATION_RULE_OPTIONS as I, K8sLogo as K, MONITORS_OPTIONS as M, PiiMaskingIcon as P, RenameAttributeIcon as R, STORAGE_KEYS as S, Theme as T, useDataStreamStore as a, useDrawerStore as b, useEntityStore as c, useFilterStore as d, useInstrumentStore as e, useModalStore as f, useNotificationStore as g, usePendingStore as h, useSelectedStore as i, useSetupStore as j, DISPLAY_TITLES as k, getActionIcon as l, getEntityId as m, getInstrumentationRuleIcon as n, ImageErrorIcon as o, AddClusterInfoIcon as p, DeleteAttributeIcon as q, SamplerIcon as r, PayloadCollectionIcon as s, styleInject as t, useDarkMode as u };
@@ -1,10 +1,10 @@
1
1
  import React from 'react';
2
- import { T as Theme, B as BUTTON_TEXTS, k as DISPLAY_TITLES } from './index-CKOBXat_.js';
3
- import { E as EditIcon } from './index-DqaI44fJ.js';
4
- import { B as Button, V as Text, J as NotificationNote } from './index-THrvNIPj.js';
2
+ import { T as Theme, B as BUTTON_TEXTS, k as DISPLAY_TITLES } from './index-aRNtyuuU.js';
3
+ import { E as EditIcon } from './index-t3OxxFsp.js';
4
+ import { B as Button, V as Text, J as NotificationNote } from './index-Be0m3TUg.js';
5
5
  import { StatusType } from './types.js';
6
6
  import 'styled-components';
7
- import { I as InfoIcon } from './index-BVj4fOL3.js';
7
+ import { I as InfoIcon } from './index-7YZOplrB.js';
8
8
 
9
9
  const EditButton = ({ label, onClick, variant = 'tertiary', ...props }) => {
10
10
  const theme = Theme.useTheme();
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { T as Theme } from './index-CKOBXat_.js';
2
+ import { T as Theme } from './index-aRNtyuuU.js';
3
3
 
4
4
  const EditIcon = ({ size = 16, fill: f, rotate = 0, onClick }) => {
5
5
  const theme = Theme.useTheme();
@@ -1,4 +1,5 @@
1
1
  import { K8sResourceKind, ProgrammingLanguages, type Source } from '@/types';
2
+ export declare const MOCK_SOURCES_OTHER: Source[];
2
3
  export declare const MOCK_SOURCES_SIMPLE_DEMO: Source[];
3
4
  export declare const MOCK_SOURCES_GOOGLE: Source[];
4
5
  export declare const MOCK_SOURCES: Source[];
package/lib/snippets.js CHANGED
@@ -1,13 +1,13 @@
1
- export { A as AddButton } from './index-THrvNIPj.js';
2
- export { E as EditButton, N as NoteBackToSummary } from './index-DmCjUtBQ.js';
1
+ export { A as AddButton } from './index-Be0m3TUg.js';
2
+ export { E as EditButton, N as NoteBackToSummary } from './index-oEjS7cX3.js';
3
3
  import 'react';
4
- import './index-CKOBXat_.js';
4
+ import './index-aRNtyuuU.js';
5
5
  import './types.js';
6
6
  import 'styled-components';
7
- import './index-CEWs8CTN.js';
8
- import './index-CCX1HLUr.js';
9
- import './index-BVj4fOL3.js';
7
+ import './index-D8AnbGCE.js';
8
+ import './index-BbEmZ4Wj.js';
9
+ import './index-7YZOplrB.js';
10
10
  import './index-BV85P9UP.js';
11
- import './useTransition-D9f1CP9n.js';
11
+ import './useTransition-0Rz0QKmh.js';
12
12
  import 'react-dom';
13
- import './index-DqaI44fJ.js';
13
+ import './index-t3OxxFsp.js';
package/lib/store.js CHANGED
@@ -1,4 +1,4 @@
1
- export { u as useDarkMode, a as useDataStreamStore, b as useDrawerStore, c as useEntityStore, d as useFilterStore, e as useInstrumentStore, f as useModalStore, g as useNotificationStore, h as usePendingStore, i as useSelectedStore, j as useSetupStore } from './index-CKOBXat_.js';
1
+ export { u as useDarkMode, a as useDataStreamStore, b as useDrawerStore, c as useEntityStore, d as useFilterStore, e as useInstrumentStore, f as useModalStore, g as useNotificationStore, h as usePendingStore, i as useSelectedStore, j as useSetupStore } from './index-aRNtyuuU.js';
2
2
  import 'react';
3
3
  import './types.js';
4
4
  import 'styled-components';
@@ -1,13 +1,12 @@
1
1
  import * as opacity from './opacity';
2
- import { type ITheme } from './palletes';
3
2
  import * as animations from './animations';
3
+ import { useTheme } from 'styled-components';
4
4
  declare const Theme: {
5
5
  Provider: import("react").FC<{
6
6
  children?: import("react").ReactNode | undefined;
7
7
  }>;
8
- useTheme: () => ITheme;
8
+ useTheme: typeof useTheme;
9
9
  opacity: typeof opacity;
10
10
  animations: typeof animations;
11
11
  };
12
12
  export default Theme;
13
- export { type ITheme };
@@ -1,105 +1,2 @@
1
- declare const darkModeTheme: {
2
- darkMode: boolean;
3
- colors: {
4
- primary: string;
5
- secondary: string;
6
- border: string;
7
- dark_grey: string;
8
- translucent_bg: string;
9
- dropdown_bg: string;
10
- dropdown_bg_2: string;
11
- warning: string;
12
- error: string;
13
- success: string;
14
- info: string;
15
- default: string;
16
- majestic_blue: string;
17
- majestic_blue_soft: string;
18
- orange_og: string;
19
- orange_soft: string;
20
- dark_red: string;
21
- darker_red: string;
22
- darkest_red: string;
23
- darkest_red_hover: string;
24
- dark_green: string;
25
- };
26
- text: {
27
- white: string;
28
- primary: string;
29
- secondary: string;
30
- grey: string;
31
- dark_grey: string;
32
- darker_grey: string;
33
- light_grey: string;
34
- dark_button: string;
35
- warning: string;
36
- warning_secondary: string;
37
- error: string;
38
- error_secondary: string;
39
- success: string;
40
- success_secondary: string;
41
- info: string;
42
- info_secondary: string;
43
- default: string;
44
- default_secondary: string;
45
- };
46
- font_family: {
47
- primary: string;
48
- secondary: string;
49
- code: string;
50
- };
51
- };
52
- declare const lightModeTheme: {
53
- darkMode: boolean;
54
- colors: {
55
- primary: string;
56
- secondary: string;
57
- border: string;
58
- dark_grey: string;
59
- translucent_bg: string;
60
- dropdown_bg: string;
61
- dropdown_bg_2: string;
62
- warning: string;
63
- error: string;
64
- success: string;
65
- info: string;
66
- default: string;
67
- majestic_blue: string;
68
- majestic_blue_soft: string;
69
- orange_og: string;
70
- orange_soft: string;
71
- dark_red: string;
72
- darker_red: string;
73
- darkest_red: string;
74
- darkest_red_hover: string;
75
- dark_green: string;
76
- };
77
- text: {
78
- white: string;
79
- primary: string;
80
- secondary: string;
81
- grey: string;
82
- dark_grey: string;
83
- darker_grey: string;
84
- light_grey: string;
85
- dark_button: string;
86
- warning: string;
87
- warning_secondary: string;
88
- error: string;
89
- error_secondary: string;
90
- success: string;
91
- success_secondary: string;
92
- info: string;
93
- info_secondary: string;
94
- default: string;
95
- default_secondary: string;
96
- };
97
- font_family: {
98
- primary: string;
99
- secondary: string;
100
- code: string;
101
- };
102
- };
103
- export type ITheme = typeof darkModeTheme & typeof lightModeTheme;
104
- export declare const getTheme: (darkMode: boolean) => ITheme;
105
- export {};
1
+ import { DefaultTheme } from 'styled-components';
2
+ export declare const getTheme: (darkMode: boolean) => DefaultTheme;
package/lib/theme.js CHANGED
@@ -1,4 +1,4 @@
1
- export { T as default } from './index-CKOBXat_.js';
1
+ export { T as default } from './index-aRNtyuuU.js';
2
2
  import 'styled-components';
3
3
  import 'react';
4
4
  import './types.js';
@@ -1,9 +1,9 @@
1
1
  import { ActionKeyTypes, ActionType, StatusType, AddNodeTypes, EntityTypes, FieldTypes } from './types.js';
2
- import { g as useNotificationStore, F as FORM_ALERTS, f as useModalStore, b as useDrawerStore, c as useEntityStore, a as useDataStreamStore, j as useSetupStore } from './index-CKOBXat_.js';
2
+ import { g as useNotificationStore, F as FORM_ALERTS, f as useModalStore, b as useDrawerStore, c as useEntityStore, a as useDataStreamStore, j as useSetupStore } from './index-aRNtyuuU.js';
3
3
  import { useState, useEffect, useMemo } from 'react';
4
4
  import 'styled-components';
5
5
  import { i as isEmpty, s as safeJsonParse } from './index-BV85P9UP.js';
6
- import { b as useGenericForm } from './useTransition-D9f1CP9n.js';
6
+ import { b as useGenericForm } from './useTransition-0Rz0QKmh.js';
7
7
  import { g as getIdFromSseTarget, i as isLegalK8sLabel, m as mapExportedSignals } from './index-BlZKWuxe.js';
8
8
 
9
9
  const INITIAL$2 = {
@@ -1,5 +1,5 @@
1
1
  import React, { useState, useRef, useEffect, useCallback } from 'react';
2
- import { g as useNotificationStore } from './index-CKOBXat_.js';
2
+ import { g as useNotificationStore } from './index-aRNtyuuU.js';
3
3
  import { CodeAttributesKeyTypes, PayloadCollectionKeyTypes } from './types.js';
4
4
  import styled from 'styled-components';
5
5
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@odigos/ui-kit",
3
- "version": "0.0.35",
3
+ "version": "0.0.36",
4
4
  "author": "Odigos",
5
5
  "repository": {
6
6
  "type": "git",
@@ -80,7 +80,7 @@
80
80
  "react": "^19.1.0",
81
81
  "react-dom": "^19.1.0",
82
82
  "react-error-boundary": "^6.0.0",
83
- "styled-components": "6.1.15",
83
+ "styled-components": "6.1.18",
84
84
  "zustand": "^5.0.5"
85
85
  },
86
86
  "dependencies": {
@@ -91,11 +91,11 @@
91
91
  "react": "^19.1.0",
92
92
  "react-dom": "^19.1.0",
93
93
  "react-error-boundary": "^6.0.0",
94
- "styled-components": "6.1.15",
94
+ "styled-components": "6.1.18",
95
95
  "zustand": "^5.0.5"
96
96
  },
97
97
  "devDependencies": {
98
- "@babel/core": "^7.27.3",
98
+ "@babel/core": "^7.27.4",
99
99
  "@babel/preset-env": "^7.27.2",
100
100
  "@babel/preset-react": "^7.27.1",
101
101
  "@babel/preset-typescript": "^7.27.1",
@@ -105,21 +105,21 @@
105
105
  "@rollup/plugin-node-resolve": "^16.0.1",
106
106
  "@storybook/addon-essentials": "^8.6.14",
107
107
  "@storybook/addon-webpack5-compiler-babel": "^3.0.6",
108
- "@storybook/react": "^8.6.14",
109
- "@storybook/react-webpack5": "^8.6.14",
110
- "@types/node": "^22.15.24",
108
+ "@storybook/react": "^9.0.4",
109
+ "@storybook/react-webpack5": "^9.0.4",
110
+ "@types/node": "^22.15.29",
111
111
  "@types/react": "^19.1.6",
112
- "@types/react-dom": "^19.1.5",
112
+ "@types/react-dom": "^19.1.6",
113
113
  "babel-loader": "^10.0.0",
114
114
  "babel-plugin-styled-components": "^2.1.4",
115
- "eslint": "^9.27.0",
116
- "eslint-config-next": "^15.3.2",
117
- "next": "^15.3.2",
115
+ "eslint": "^9.28.0",
116
+ "eslint-config-next": "^15.3.3",
117
+ "next": "^15.3.3",
118
118
  "postcss": "^8.5.4",
119
119
  "rollup": "^4.41.1",
120
120
  "rollup-plugin-postcss": "^4.0.2",
121
121
  "rollup-plugin-typescript2": "^0.36.0",
122
- "storybook": "^8.6.14",
122
+ "storybook": "^9.0.4",
123
123
  "typescript": "^5.8.3"
124
124
  }
125
125
  }