@odigos/ui-kit 0.0.79 → 0.0.80

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # Changelog
 
+## [0.0.80](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.79...ui-kit-v0.0.80) (2025-08-10)
+
+
+### Features
+
+* align no-data to center ([#315](https://github.com/odigos-io/ui-kit/issues/315)) ([158e3f8](https://github.com/odigos-io/ui-kit/commit/158e3f831a1edc1d8ca6547c1901cf639db0314c))
+* enhance tooltip rendering to support strong text formatting ([#305](https://github.com/odigos-io/ui-kit/issues/305)) ([f6e0e20](https://github.com/odigos-io/ui-kit/commit/f6e0e20120dbdaef3ce98d1471e0c18d2a8fe273))
+* **search:** integrate search results into action, destination, instrumentation rule, and source tables ([#314](https://github.com/odigos-io/ui-kit/issues/314)) ([c3d6f8c](https://github.com/odigos-io/ui-kit/commit/c3d6f8c93afcc74dd87aef31ca533799325de9e7))
+
+
+### Bug Fixes
+
+* **search:** state management for search input and results display ([#308](https://github.com/odigos-io/ui-kit/issues/308)) ([68a9006](https://github.com/odigos-io/ui-kit/commit/68a9006a9c9346904f071bff9f54167f22176d0a))
+* **source-drawer:** prevent fetching source if already fetched and reset state on delete/update ([#307](https://github.com/odigos-io/ui-kit/issues/307)) ([094d791](https://github.com/odigos-io/ui-kit/commit/094d79170a8a6b717e7837ab20fb306655c8e921))
+
 ## [0.0.79](https://github.com/odigos-io/ui-kit/compare/ui-kit-v0.0.78...ui-kit-v0.0.79) (2025-08-06)
 
 

package/lib/components/styled.d.ts

@@ -11,12 +11,14 @@ export declare const FlexColumn: import("styled-components/dist/types").IStyledC
     $justifyContent?: CSSProperties["justifyContent"];
     $wrap?: CSSProperties["flexWrap"];
 }>> & string;
-export declare const CenterThis: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$gap" | "$alignItems" | "$justifyContent" | "$wrap"> & {
+export declare const CenterThis: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$gap" | "$alignItems" | "$justifyContent" | "$wrap"> & {
     $gap?: number;
     $alignItems?: CSSProperties["alignItems"];
     $justifyContent?: CSSProperties["justifyContent"];
     $wrap?: CSSProperties["flexWrap"];
-}, never>> & string;
+}, {
+    $height?: CSSProperties["height"];
+}>> & string;
 export declare const VerticalScroll: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const Overlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const ModalBody: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {

package/lib/components/text/index.d.ts

@@ -1,4 +1,5 @@
 import { type DetailedHTMLProps, type FC, type HTMLAttributes, type ReactNode } from 'react';
+import { DefaultTheme } from 'styled-components';
 interface TextProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> {
     children?: ReactNode;
     color?: string;
@@ -9,5 +10,15 @@ interface TextProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HT
     opacity?: number;
     decoration?: string;
 }
+declare const getLinksFromText: (text: string) => {
+    original: string;
+    href: string;
+    label: string;
+}[] | undefined;
+declare const getStrongsFromText: (text: string) => {
+    original: string;
+    label: string;
+}[] | undefined;
+declare const renderText: (text: string, theme: DefaultTheme) => ReactNode;
 declare const Text: FC<TextProps>;
-export { Text, type TextProps };
+export { Text, type TextProps, getLinksFromText, getStrongsFromText, renderText };

package/lib/components.js

@@ -1,6 +1,6 @@
-import { B as Button } from './index-b674f184.js';
-export { A as AutocompleteInput, a as Badge, a6 as CenterThis, C as Checkbox, b as Code, c as ConditionDetails, D as DataCard, e as DataCardFieldTypes, d as DataCardFields, f as DataFinger, g as DataTab, h as DescribeRow, i as Divider, j as DocsButton, k as Drawer, m as DrawerFooter, l as DrawerHeader, n as Dropdown, E as ExtendArrow, F as FadeLoader, o as FieldError, p as FieldLabel, a5 as FlexColumn, a4 as FlexRow, H as Header, I as IconButton, q as IconGroup, r as IconTitleBadge, s as IconWrapped, t as IconsNav, u as ImageControlled, v as Input, w as InputList, x as InputTable, y as InteractiveTable, K as KeyValueInputsList, M as Modal, a9 as ModalBody, z as MonitorsCheckboxes, G as MonitorsIcons, N as NavigationButtons, J as NoDataFound, L as NotificationNote, a8 as Overlay, P as Popup, O as PopupForm, S as ScrollX, Q as SectionTitle, R as Segment, U as SelectionButton, V as SkeletonLoader, W as Status, X as Stepper, Y as TabList, aa as TableContainer, ab as TableTitleWrap, ac as TableWrap, Z as Tag, _ as Text, $ as TextArea, a0 as Toggle, T as ToggleCodeComponent, a1 as Tooltip, a2 as TraceLoader, a7 as VerticalScroll, a3 as WarningModal } from './index-b674f184.js';
-export { C as CancelWarning, D as DeleteWarning } from './index-845f2100.js';
+import { B as Button } from './index-192794e8.js';
+export { A as AutocompleteInput, a as Badge, a9 as CenterThis, C as Checkbox, b as Code, c as ConditionDetails, D as DataCard, e as DataCardFieldTypes, d as DataCardFields, f as DataFinger, g as DataTab, h as DescribeRow, i as Divider, j as DocsButton, k as Drawer, m as DrawerFooter, l as DrawerHeader, n as Dropdown, E as ExtendArrow, F as FadeLoader, o as FieldError, p as FieldLabel, a8 as FlexColumn, a7 as FlexRow, H as Header, I as IconButton, q as IconGroup, r as IconTitleBadge, s as IconWrapped, t as IconsNav, u as ImageControlled, v as Input, w as InputList, x as InputTable, y as InteractiveTable, K as KeyValueInputsList, M as Modal, ac as ModalBody, z as MonitorsCheckboxes, G as MonitorsIcons, N as NavigationButtons, J as NoDataFound, L as NotificationNote, ab as Overlay, P as Popup, O as PopupForm, S as ScrollX, Q as SectionTitle, R as Segment, U as SelectionButton, V as SkeletonLoader, W as Status, X as Stepper, Y as TabList, ad as TableContainer, ae as TableTitleWrap, af as TableWrap, Z as Tag, _ as Text, a2 as TextArea, a3 as Toggle, T as ToggleCodeComponent, a4 as Tooltip, a5 as TraceLoader, aa as VerticalScroll, a6 as WarningModal, $ as getLinksFromText, a0 as getStrongsFromText, a1 as renderText } from './index-192794e8.js';
+export { C as CancelWarning, D as DeleteWarning } from './index-e4e75973.js';
 import React, { createContext, Component, createElement } from 'react';
 import { T as Theme } from './index-90ccd949.js';
 import 'styled-components';

package/lib/containers/data-flow-actions-menu/index.d.ts

@@ -3,6 +3,7 @@ import { EntityTypes } from '@/types';
 import { DataStreamSelectProps } from './data-stream-select';
 interface DataFlowActionsMenuProps extends DataStreamSelectProps {
     addEntity?: EntityTypes;
+    preventSearchPopup?: boolean;
 }
 declare const DataFlowActionsMenu: React.FC<DataFlowActionsMenuProps>;
 export { DataFlowActionsMenu, type DataFlowActionsMenuProps };

package/lib/containers/data-flow-actions-menu/search/index.d.ts

@@ -1,4 +1,6 @@
 import React from 'react';
-type SearchProps = object;
+interface SearchProps {
+    preventPopup?: boolean;
+}
 export declare const Search: React.FC<SearchProps>;
 export {};

package/lib/containers/data-flow-actions-menu/search/search-results/builder.d.ts

@@ -16,7 +16,7 @@ export declare const buildSearchResults: ({ instrumentationRules, sources, actio
         entities: InstrumentationRule[] | Source[] | Action[] | Destination[];
     }[];
     searchResults: {
-        entities: Source[] | Destination[] | Action[] | InstrumentationRule[];
+        entities: Action[] | Destination[] | Source[] | InstrumentationRule[];
         category: Category;
         label: string;
         count: number;

package/lib/containers/data-flow-actions-menu/search/search-results/index.d.ts

@@ -1,6 +1,5 @@
 import { type FC } from 'react';
 interface Props {
-    searchText: string;
     onClose: () => void;
 }
 export declare const SearchResults: FC<Props>;

package/lib/containers.js

@@ -2,14 +2,14 @@ import React, { useState, useEffect, forwardRef, useRef, useImperativeHandle, us
 import styled, { css } from 'styled-components';
 import { b as DISPLAY_TITLES, T as Theme, U as usePendingStore, V as useNotificationStore, O as useDrawerStore, B as BUTTON_TEXTS, W as useEntityStore, A as ACTION_OPTIONS, g as getActionIcon, z as useModalStore, F as FORM_ALERTS, X as useFilterStore, D as DISPLAY_LANGUAGES, M as MONITORS_OPTIONS, d as getInstrumentationRuleIcon, Y as useDataStreamStore, Z as useInstrumentStore, c as getEntityId, S as STORAGE_KEYS, a as DEFAULT_DATA_STREAM_NAME, _ as useSetupStore, e as getProgrammingLanguageIcon, I as INSTRUMENTATION_RULE_OPTIONS, $ as useSelectedStore, j as ImageErrorIcon, a0 as useDarkMode } from './index-90ccd949.js';
 import { ActionType, ActionKeyTypes, InputTypes, FieldTypes, EntityTypes, StatusType, Crud, OtherStatus, NodeTypes, EdgeTypes, AddNodeTypes, SignalType, HeadersCollectionKeyTypes, CustomInstrumentationsKeyTypes, CodeAttributesKeyTypes, PayloadCollectionKeyTypes, InstrumentationRuleType, K8sResourceKind, ProgrammingLanguages, MountMethod, AgentEnvVarsInjectionMethod, Profile, InstallationMethod } from './types.js';
-import { e as DataCardFieldTypes, p as FieldLabel, C as Checkbox, o as FieldError, v as Input, x as InputTable, K as KeyValueInputsList, w as InputList, _ as Text, R as Segment, Q as SectionTitle, j as DocsButton, z as MonitorsCheckboxes, $ as TextArea, k as Drawer, c as ConditionDetails, D as DataCard, a5 as FlexColumn, M as Modal, N as NavigationButtons, a9 as ModalBody, L as NotificationNote, A as AutocompleteInput, i as Divider, W as Status, a4 as FlexRow, a1 as Tooltip, s as IconWrapped, G as MonitorsIcons, aa as TableContainer, ab as TableTitleWrap, r as IconTitleBadge, ac as TableWrap, y as InteractiveTable, a6 as CenterThis, J as NoDataFound, a2 as TraceLoader, a as Badge, E as ExtendArrow, a7 as VerticalScroll, U as SelectionButton, B as Button, n as Dropdown, ad as nodeConfig, ae as useNodesState, af as useEdgesState, ag as Flow, ah as applyNodeChanges, P as Popup, a0 as Toggle, I as IconButton, ai as AddButton, F as FadeLoader, g as DataTab, X as Stepper, d as DataCardFields, Z as Tag, aj as MarkerType, t as IconsNav, ak as CopyText, h as DescribeRow, al as PodContainer, am as SourceContainer, q as IconGroup, O as PopupForm } from './index-b674f184.js';
+import { e as DataCardFieldTypes, p as FieldLabel, C as Checkbox, o as FieldError, v as Input, x as InputTable, K as KeyValueInputsList, w as InputList, _ as Text, R as Segment, Q as SectionTitle, j as DocsButton, z as MonitorsCheckboxes, a2 as TextArea, k as Drawer, c as ConditionDetails, D as DataCard, a8 as FlexColumn, M as Modal, N as NavigationButtons, ac as ModalBody, L as NotificationNote, A as AutocompleteInput, i as Divider, W as Status, a7 as FlexRow, a4 as Tooltip, s as IconWrapped, G as MonitorsIcons, ad as TableContainer, ae as TableTitleWrap, r as IconTitleBadge, af as TableWrap, y as InteractiveTable, a9 as CenterThis, J as NoDataFound, a5 as TraceLoader, a as Badge, E as ExtendArrow, aa as VerticalScroll, U as SelectionButton, B as Button, n as Dropdown, ag as nodeConfig, ah as useNodesState, ai as useEdgesState, aj as Flow, ak as applyNodeChanges, P as Popup, a3 as Toggle, I as IconButton, al as AddButton, F as FadeLoader, g as DataTab, X as Stepper, d as DataCardFields, Z as Tag, am as MarkerType, t as IconsNav, an as CopyText, h as DescribeRow, ao as PodContainer, ap as SourceContainer, q as IconGroup, O as PopupForm } from './index-192794e8.js';
 import { i as isEmpty, s as safeJsonParse, d as deepClone } from './index-5e5f7bda.js';
 import { C as CheckCircledIcon, O as OdigosLogo } from './index-6034549d.js';
 import { C as CrossCircledIcon, O as OdigosLogoText, a as OverviewIcon, F as FilterIcon, D as DataStreamsIcon, A as ArrowIcon, R as RefreshLeftArrowIcon, N as NotificationIcon, U as UserIcon, S as SlackLogo, K as KeyIcon, T as TerminalIcon, G as GearIcon } from './index-c8aab9c4.js';
 import { useActionFormData, useSessionStorage, useDataStreamFormData, useDestinationFormData, useClickNotification, useSourceFormData, useSourceSelectionFormData } from './hooks.js';
 import { u as useKeyDown, a as useOnClickOutside, b as useContainerSize, c as useClickNode, d as usePopup, e as useInstrumentationRuleFormData, f as useTransition, g as useTimeAgo, h as useCopy, i as useGenericForm } from './useTransition-807be8bc.js';
 import { E as EditIcon, T as TrashIcon, S as SearchIcon, h as CheckIcon, P as PlusIcon, a as CopyIcon } from './index-19b8f8bc.js';
-import { D as DeleteWarning, C as CancelWarning } from './index-845f2100.js';
+import { D as DeleteWarning, C as CancelWarning } from './index-e4e75973.js';
 import { g as getConditionsBooleans, m as mapConditions, b as getStatusIcon, h as splitCamelString, c as capitalizeFirstLetter, i as isStringABoolean, p as parseBooleanFromString } from './index-a067d6e9.js';
 import { f as filterActions, l as getEntityLabel, k as getEntityIcon, v as sleep, n as getPlatformIcon, o as getPlatformLabel, g as formatBytes, i as getContainersIcons, p as getValueForRange, j as getDestinationIcon, e as filterSourcesByStream, d as filterSources, b as filterDestinationsByStream, a as filterDestinations, u as mapDestinationFieldsForDisplay, c as compareCondition, r as getYamlFieldsForDestination, m as getMetricForEntity, q as getWorkloadId, s as hasUnhealthyInstances, h as getContainersInstrumentedCount, t as isOverTime } from './index-ba4f9a19.js';
 import { m as mapExportedSignals } from './index-6a6bea6e.js';
@@ -875,6 +875,64 @@ const ConditionsStatuses = ({ conditions, id }) => {
     })));
 };
 
+const buildSearchResults = ({ instrumentationRules, sources, actions, destinations, searchText, selectedCategory }) => {
+    const filteredRules = !searchText ? instrumentationRules : instrumentationRules.filter((rule) => rule.type?.toLowerCase().includes(searchText) || rule.ruleName?.toLowerCase().includes(searchText));
+    const filteredSources = !searchText
+        ? sources
+        : sources.filter((source) => source.name?.toLowerCase().includes(searchText) || source.otelServiceName?.toLowerCase().includes(searchText) || source.namespace?.toLowerCase().includes(searchText));
+    const filteredActions = !searchText ? actions : actions.filter((action) => action.type?.toLowerCase().includes(searchText) || action.spec.actionName?.toLowerCase().includes(searchText));
+    const filteredDestinations = !searchText
+        ? destinations
+        : destinations.filter((destination) => destination.destinationType.displayName?.toLowerCase().includes(searchText) || destination.name?.toLowerCase().includes(searchText));
+    const categories = [
+        {
+            category: EntityTypes.Source,
+            label: 'Sources',
+            count: filteredSources.length,
+            entities: [],
+        },
+        {
+            category: EntityTypes.Action,
+            label: 'Actions',
+            count: filteredActions.length,
+            entities: [],
+        },
+        {
+            category: EntityTypes.Destination,
+            label: 'Destinations',
+            count: filteredDestinations.length,
+            entities: [],
+        },
+        {
+            category: EntityTypes.InstrumentationRule,
+            label: 'Instrumentation Rules',
+            count: filteredRules.length,
+            entities: [],
+        },
+    ];
+    categories.unshift({
+        category: 'all',
+        label: 'All',
+        count: filteredRules.length + filteredSources.length + filteredActions.length + filteredDestinations.length,
+        entities: [],
+    });
+    const searchResults = categories
+        .filter(({ count, category }) => !!count && category !== 'all' && ['all', category].includes(selectedCategory))
+        .map((item) => ({
+        ...item,
+        entities: item.category === EntityTypes.InstrumentationRule
+            ? filteredRules
+            : item.category === EntityTypes.Source
+                ? filteredSources
+                : item.category === EntityTypes.Action
+                    ? filteredActions
+                    : item.category === EntityTypes.Destination
+                        ? filteredDestinations
+                        : [],
+    }));
+    return { categories, searchResults };
+};
+
 const columns$3 = [
     { key: 'icon', title: '' },
     { key: 'name', title: DISPLAY_TITLES.NAME, sortable: true },
@@ -890,7 +948,14 @@ const ActionTable = ({ maxHeight, maxWidth }) => {
     const filters = useFilterStore();
     const { actions, actionsLoading } = useEntityStore();
     const { setDrawerType, setDrawerEntityId } = useDrawerStore();
-    const filtered = useMemo(() => filterActions(actions, filters), [actions, filters]);
+    const filtered = useMemo(() => (buildSearchResults({
+        instrumentationRules: [],
+        sources: [],
+        actions: filterActions(actions, filters),
+        destinations: [],
+        searchText: filters.searchText,
+        selectedCategory: EntityTypes.Action,
+    }).searchResults.find(({ category }) => category === EntityTypes.Action)?.entities || []), [actions, filters]);
     const rows = useMemo(() => filtered.map((act) => {
         const { hasErrors, hasWarnings, hasDisableds } = getConditionsBooleans(act.conditions || []);
         return {
@@ -942,8 +1007,18 @@ const ActionTable = ({ maxHeight, maxWidth }) => {
             ],
         };
     }), [filtered]);
-    const badge = useMemo(() => (filtered.length !== actions.length ? `${filtered.length}/${actions.length}` : actions.length), [filtered, actions]);
-    const badgeTooltip = useMemo(() => (filtered.length !== actions.length ? DISPLAY_TITLES.FILTERED_COUNT_TOOLTIP : undefined), [filtered, actions]);
+    const { badge, badgeTooltip } = useMemo(() => {
+        if (filtered.length !== actions.length) {
+            return {
+                badge: `${filtered.length}/${actions.length}`,
+                badgeTooltip: DISPLAY_TITLES.FILTERED_COUNT_TOOLTIP,
+            };
+        }
+        return {
+            badge: actions.length,
+            badgeTooltip: undefined,
+        };
+    }, [filtered, actions]);
     return (React.createElement(TableContainer, { "$maxWidth": maxWidth },
         React.createElement(TableTitleWrap, null,
             React.createElement(IconTitleBadge, { icon: getEntityIcon(EntityTypes.Action), title: DISPLAY_TITLES.ACTIONS, badge: badge, badgeTooltip: badgeTooltip, loading: actionsLoading })),
@@ -1902,72 +1977,15 @@ styled.div `
   border-radius: 24px;
 `;
 
-const buildSearchResults = ({ instrumentationRules, sources, actions, destinations, searchText, selectedCategory }) => {
-    const filteredRules = !searchText ? instrumentationRules : instrumentationRules.filter((rule) => rule.type?.toLowerCase().includes(searchText) || rule.ruleName?.toLowerCase().includes(searchText));
-    const filteredSources = !searchText
-        ? sources
-        : sources.filter((source) => source.name?.toLowerCase().includes(searchText) || source.otelServiceName?.toLowerCase().includes(searchText) || source.namespace?.toLowerCase().includes(searchText));
-    const filteredActions = !searchText ? actions : actions.filter((action) => action.type?.toLowerCase().includes(searchText) || action.spec.actionName?.toLowerCase().includes(searchText));
-    const filteredDestinations = !searchText
-        ? destinations
-        : destinations.filter((destination) => destination.destinationType.displayName?.toLowerCase().includes(searchText) || destination.name?.toLowerCase().includes(searchText));
-    const categories = [
-        {
-            category: EntityTypes.Source,
-            label: 'Sources',
-            count: filteredSources.length,
-            entities: [],
-        },
-        {
-            category: EntityTypes.Action,
-            label: 'Actions',
-            count: filteredActions.length,
-            entities: [],
-        },
-        {
-            category: EntityTypes.Destination,
-            label: 'Destinations',
-            count: filteredDestinations.length,
-            entities: [],
-        },
-        {
-            category: EntityTypes.InstrumentationRule,
-            label: 'Instrumentation Rules',
-            count: filteredRules.length,
-            entities: [],
-        },
-    ];
-    categories.unshift({
-        category: 'all',
-        label: 'All',
-        count: filteredRules.length + filteredSources.length + filteredActions.length + filteredDestinations.length,
-        entities: [],
-    });
-    const searchResults = categories
-        .filter(({ count, category }) => !!count && category !== 'all' && ['all', category].includes(selectedCategory))
-        .map((item) => ({
-        ...item,
-        entities: item.category === EntityTypes.InstrumentationRule
-            ? filteredRules
-            : item.category === EntityTypes.Source
-                ? filteredSources
-                : item.category === EntityTypes.Action
-                    ? filteredActions
-                    : item.category === EntityTypes.Destination
-                        ? filteredDestinations
-                        : [],
-    }));
-    return { categories, searchResults };
-};
-
 const HorizontalScroll = styled.div `
   display: flex;
   align-items: center;
   overflow-x: scroll;
 `;
-const SearchResults = ({ searchText, onClose }) => {
+const SearchResults = ({ onClose }) => {
     const theme = Theme.useTheme();
     const { onClickNode } = useClickNode();
+    const { searchText } = useFilterStore();
     const { selectedStreamName } = useDataStreamStore();
     const { sources, destinations, actions, instrumentationRules } = useEntityStore();
     const { popupRef, popupOpen, setPopupOpen, popupPosition, handlePosition } = usePopup();
@@ -2002,19 +2020,20 @@ const SearchResults = ({ searchText, onClose }) => {
         React.createElement(Divider, { thickness: catIdx === searchResults.length - 1 ? 0 : 1, length: '90%', margin: '8px auto' }))))));
 };
 
-const Search = () => {
-    const [input, setInput] = useState('');
+const Search = ({ preventPopup = false }) => {
+    const { searchText, setSearchText } = useFilterStore();
     const [focused, setFocused] = useState(false);
+    const isOpen = !!searchText || focused;
     const onClose = () => {
-        setInput('');
+        setSearchText('');
         setFocused(false);
     };
     const containerRef = useRef(null);
-    useOnClickOutside(containerRef, () => setFocused(false));
-    useKeyDown({ key: 'Escape', active: !!input || focused }, onClose);
+    useOnClickOutside(containerRef, onClose);
+    useKeyDown({ key: 'Escape', active: isOpen }, onClose);
     return (React.createElement(RelativeContainer$2, { ref: containerRef },
-        React.createElement(Input, { placeholder: 'Search', icon: SearchIcon, value: input, onChange: (e) => setInput(e.target.value.toLowerCase()), onFocus: () => setFocused(true) }),
-        !!input || focused ? React.createElement(SearchResults, { searchText: input, onClose: onClose }) : null));
+        React.createElement(Input, { placeholder: 'Search', icon: SearchIcon, value: searchText, onChange: (e) => setSearchText(e.target.value.toLowerCase()), onFocus: () => setFocused(true) }),
+        isOpen && !preventPopup ? React.createElement(SearchResults, { onClose: onClose }) : null));
 };
 
 const FormWrapper = styled.div `
@@ -2248,11 +2267,11 @@ const Container$c = styled.div `
 const PushToEnd = styled.div `
   margin-left: auto;
 `;
-const DataFlowActionsMenu = ({ addEntity, onClickNewDataStream, updateDataStream, deleteDataStream }) => {
+const DataFlowActionsMenu = ({ addEntity, preventSearchPopup, onClickNewDataStream, updateDataStream, deleteDataStream }) => {
     const { setCurrentModal } = useModalStore();
     return (React.createElement(Container$c, null,
         React.createElement(DataStreamSelect, { onClickNewDataStream: onClickNewDataStream, updateDataStream: updateDataStream, deleteDataStream: deleteDataStream }),
-        React.createElement(Search, null),
+        React.createElement(Search, { preventPopup: preventSearchPopup }),
         React.createElement(Filters$1, null),
         addEntity && (React.createElement(PushToEnd, null,
             React.createElement(AddButton, { "data-id": `add-${addEntity}`, onClick: () => setCurrentModal(addEntity), label: `${BUTTON_TEXTS.ADD} ${addEntity}`, variant: 'primary' })))));
@@ -2972,8 +2991,15 @@ const DestinationTable = ({ metrics, maxHeight, maxWidth }) => {
     const { setDrawerType, setDrawerEntityId } = useDrawerStore();
     const { destinations, destinationsLoading } = useEntityStore();
     const destinationsByStream = useMemo(() => filterDestinationsByStream(destinations, selectedStreamName), [destinations, selectedStreamName]);
-    const filteredDestinations = useMemo(() => filterDestinations(destinationsByStream, filters), [destinationsByStream, filters]);
-    const rows = useMemo(() => filteredDestinations.map((dest) => {
+    const filtered = useMemo(() => (buildSearchResults({
+        instrumentationRules: [],
+        sources: [],
+        actions: [],
+        destinations: filterDestinations(destinationsByStream, filters),
+        searchText: filters.searchText,
+        selectedCategory: EntityTypes.Destination,
+    }).searchResults.find(({ category }) => category === EntityTypes.Destination)?.entities || []), [destinationsByStream, filters]);
+    const rows = useMemo(() => filtered.map((dest) => {
         const { hasErrors, hasWarnings, hasDisableds } = getConditionsBooleans(dest.conditions || []);
         const { icon, iconSrc } = getDestinationIcon(dest.destinationType.type);
         return {
@@ -3017,11 +3043,11 @@ const DestinationTable = ({ metrics, maxHeight, maxWidth }) => {
                 },
             ],
         };
-    }), [filteredDestinations, metrics]);
+    }), [filtered, metrics]);
     const { badge, badgeTooltip } = useMemo(() => {
-        if (filteredDestinations.length !== destinationsByStream.length) {
+        if (filtered.length !== destinationsByStream.length) {
             return {
-                badge: `${filteredDestinations.length}/${destinationsByStream.length}`,
+                badge: `${filtered.length}/${destinationsByStream.length}`,
                 badgeTooltip: DISPLAY_TITLES.FILTERED_COUNT_TOOLTIP,
             };
         }
@@ -3029,13 +3055,13 @@ const DestinationTable = ({ metrics, maxHeight, maxWidth }) => {
             badge: destinationsByStream.length,
             badgeTooltip: undefined,
         };
-    }, [filteredDestinations, destinationsByStream]);
+    }, [filtered, destinationsByStream]);
     return (React.createElement(TableContainer, { "$maxWidth": maxWidth },
         React.createElement(TableTitleWrap, null,
             React.createElement(IconTitleBadge, { icon: getEntityIcon(EntityTypes.Destination), title: DISPLAY_TITLES.DESTINATIONS, badge: badge, badgeTooltip: badgeTooltip, loading: destinationsLoading })),
         React.createElement(TableWrap, { "$maxHeight": maxHeight },
             React.createElement(InteractiveTable, { columns: columns$2, rows: rows })),
-        !filteredDestinations.length && (React.createElement(CenterThis, { style: { marginTop: '2rem' } },
+        !filtered.length && (React.createElement(CenterThis, { style: { marginTop: '2rem' } },
             React.createElement(NoDataFound, null)))));
 };
 
@@ -3496,11 +3522,20 @@ const columns$1 = [
 ];
 const InstrumentationRuleTable = ({ maxHeight, maxWidth }) => {
     const theme = Theme.useTheme();
+    const filters = useFilterStore();
     const { setDrawerType, setDrawerEntityId } = useDrawerStore();
     const { instrumentationRules, instrumentationRulesLoading } = useEntityStore();
+    const filtered = useMemo(() => (buildSearchResults({
+        instrumentationRules,
+        sources: [],
+        actions: [],
+        destinations: [],
+        searchText: filters.searchText,
+        selectedCategory: EntityTypes.InstrumentationRule,
+    }).searchResults.find(({ category }) => category === EntityTypes.InstrumentationRule)?.entities || []), [instrumentationRules, filters]);
     const rows = useMemo(() => 
     // note: rules do not have filters yet
-    instrumentationRules.map((rule) => {
+    filtered.map((rule) => {
         return {
             onClick: () => {
                 setDrawerType(EntityTypes.InstrumentationRule);
@@ -3549,13 +3584,25 @@ const InstrumentationRuleTable = ({ maxHeight, maxWidth }) => {
                 },
             ],
         };
-    }), [instrumentationRules]);
+    }), [filtered]);
+    const { badge, badgeTooltip } = useMemo(() => {
+        if (filtered.length !== instrumentationRules.length) {
+            return {
+                badge: `${filtered.length}/${instrumentationRules.length}`,
+                badgeTooltip: DISPLAY_TITLES.FILTERED_COUNT_TOOLTIP,
+            };
+        }
+        return {
+            badge: instrumentationRules.length,
+            badgeTooltip: undefined,
+        };
+    }, [filtered, instrumentationRules]);
     return (React.createElement(TableContainer, { "$maxWidth": maxWidth },
         React.createElement(TableTitleWrap, null,
-            React.createElement(IconTitleBadge, { icon: getEntityIcon(EntityTypes.Action), title: DISPLAY_TITLES.INSTRUMENTATION_RULES, badge: instrumentationRules.length, loading: instrumentationRulesLoading })),
+            React.createElement(IconTitleBadge, { icon: getEntityIcon(EntityTypes.Action), title: DISPLAY_TITLES.INSTRUMENTATION_RULES, badge: badge, badgeTooltip: badgeTooltip, loading: instrumentationRulesLoading })),
         React.createElement(TableWrap, { "$maxHeight": maxHeight },
             React.createElement(InteractiveTable, { columns: columns$1, rows: rows })),
-        !instrumentationRules.length && (React.createElement(CenterThis, { style: { marginTop: '2rem' } },
+        !filtered.length && (React.createElement(CenterThis, { style: { marginTop: '2rem' } },
             React.createElement(NoDataFound, null)))));
 };
 
@@ -4262,11 +4309,11 @@ const Describe$1 = ({ source, fetchSourceDescribe }) => {
         });
     }, [fetchSourceDescribe, source]);
     if (!describe && !failed) {
-        return (React.createElement(CenterThis, null,
+        return (React.createElement(CenterThis, { "$height": '70vh' },
             React.createElement(FadeLoader, null)));
     }
-    return (React.createElement(FlexColumn, { "$gap": 12 }, failed ? (React.createElement(CenterThis, null,
-        React.createElement(NoDataFound, { subTitle: 'Could not fetch describe for this source' }))) : !describe?.pods?.length ? (React.createElement(CenterThis, null,
+    return (React.createElement(FlexColumn, { "$gap": 12 }, failed ? (React.createElement(CenterThis, { "$height": '70vh' },
+        React.createElement(NoDataFound, { subTitle: 'Could not fetch describe for this source' }))) : !describe?.pods?.length ? (React.createElement(CenterThis, { "$height": '70vh' },
         React.createElement(NoDataFound, { subTitle: 'Check if you have any running pods and try again' }))) : (describe.pods.map(({ podName, nodeName, phase, agentInjected, runningLatestWorkloadRevision, containers }) => {
         const podHasErrors = phase.status !== StatusType.Success || hasUnhealthyInstances(containers);
         const podStatus = podHasErrors ? StatusType.Error : StatusType.Success;
@@ -4330,11 +4377,11 @@ const Libraries = ({ source, fetchSourceLibraries }) => {
         });
     }, [fetchSourceLibraries, source]);
     if (!libraries && !failed) {
-        return (React.createElement(CenterThis, null,
+        return (React.createElement(CenterThis, { "$height": '70vh' },
             React.createElement(FadeLoader, null)));
     }
-    return (React.createElement(FlexColumn, { "$gap": 12 }, failed ? (React.createElement(CenterThis, null,
-        React.createElement(NoDataFound, { subTitle: 'Could not fetch libraries for this source' }))) : !libraries?.length ? (React.createElement(CenterThis, { "$gap": 12 },
+    return (React.createElement(FlexColumn, { "$gap": 12 }, failed ? (React.createElement(CenterThis, { "$height": '70vh' },
+        React.createElement(NoDataFound, { subTitle: 'Could not fetch libraries for this source' }))) : !libraries?.length ? (React.createElement(CenterThis, { "$height": '70vh', "$gap": 12 },
         React.createElement(NoDataFound, { title: 'No libraries found', subTitle: '' }),
         React.createElement(NotificationNote, { type: StatusType.Warning, message: 'This feature is in early development, and has very limited support' }))) : (React.createElement(DataCard, { title: 'Instrumented Libraries' }, libraries.map(({ name, nonIdentifyingAttributes }, i) => (React.createElement(Fragment, { key: `library-${name}` },
         React.createElement(Row, null,
@@ -4387,10 +4434,10 @@ const SourceDrawer = ({ persistSources, updateSource, restartWorkloads, fetchSou
     const [fetchedSource, setFetchedSource] = useState(null);
     // this is used to fetch the source on drawer open, so we ensure we have the latest data
     useEffect(() => {
-        if (!isOpen || !drawerEntityId)
+        if (!isOpen || !drawerEntityId || !!fetchedSource)
             return;
         fetchSourceById(drawerEntityId).then((source) => setFetchedSource(source || null));
-    }, [isOpen, drawerEntityId]);
+    }, [isOpen, drawerEntityId, fetchedSource]);
     const { formData, handleFormChange, resetFormData, loadFormWithDrawerItem } = useSourceFormData();
     const thisItem = useMemo(() => {
         if (!isOpen)
@@ -4446,6 +4493,7 @@ const SourceDrawer = ({ persistSources, updateSource, restartWorkloads, fetchSou
     const handleDelete = async () => {
         const { namespace } = thisItem;
         persistSources({ [namespace]: [{ ...thisItem, selected: false, currentStreamName: selectedStreamName }] }, {});
+        setFetchedSource(null);
         setIsFormDirty(false);
         setIsEditing(false);
         resetFormData();
@@ -4456,6 +4504,7 @@ const SourceDrawer = ({ persistSources, updateSource, restartWorkloads, fetchSou
         const title = formData.otelServiceName !== thisItem.name ? formData.otelServiceName : '';
         handleFormChange('otelServiceName', title);
         await updateSource(drawerEntityId, { ...formData, otelServiceName: title });
+        setFetchedSource(null);
         setIsFormDirty(false);
         setIsEditing(false);
     };
@@ -4567,7 +4616,14 @@ const SourceTable = ({ metrics, maxHeight, maxWidth }) => {
         return 1;
     }, [sourcesToCreate, sourcesCreated, sourcesToDelete, sourcesDeleted]);
     const sourcesByStream = useMemo(() => filterSourcesByStream(sources, selectedStreamName), [sources, selectedStreamName]);
-    const filteredSources = useMemo(() => filterSources(sourcesByStream, filters), [sourcesByStream, filters]);
+    const filtered = useMemo(() => (buildSearchResults({
+        instrumentationRules: [],
+        sources: filterSources(sourcesByStream, filters),
+        actions: [],
+        destinations: [],
+        searchText: filters.searchText,
+        selectedCategory: EntityTypes.Source,
+    }).searchResults.find(({ category }) => category === EntityTypes.Source)?.entities || []), [sourcesByStream, filters]);
     const [hasSelected, totalSelectedSources] = useMemo(() => {
         let num = 0;
         Object.values(selectedSources).forEach((selectedSources) => {
@@ -4578,7 +4634,7 @@ const SourceTable = ({ metrics, maxHeight, maxWidth }) => {
     const onSelectAll = useCallback((bool) => {
         if (bool) {
             const payload = {};
-            filteredSources.forEach((source) => {
+            filtered.forEach((source) => {
                 const id = { namespace: source.namespace, name: source.name, kind: source.kind };
                 const isPending = isThisPending({ entityType: EntityTypes.Source, entityId: id });
                 if (!isPending) {
@@ -4595,7 +4651,7 @@ const SourceTable = ({ metrics, maxHeight, maxWidth }) => {
         else {
             setSelectedSources({});
         }
-    }, [filteredSources]);
+    }, [filtered]);
     const onSelectOne = useCallback((source) => {
         const { namespace, name, kind } = source;
         const payload = { ...selectedSources };
@@ -4610,7 +4666,7 @@ const SourceTable = ({ metrics, maxHeight, maxWidth }) => {
         }
         setSelectedSources(payload);
     }, [selectedSources]);
-    const rows = useMemo(() => filteredSources.map((source) => {
+    const rows = useMemo(() => filtered.map((source) => {
         const id = getWorkloadId(source);
         const idString = JSON.stringify(id);
         const { hasErrors, hasWarnings, hasDisableds } = getConditionsBooleans(source.conditions || []);
@@ -4660,11 +4716,11 @@ const SourceTable = ({ metrics, maxHeight, maxWidth }) => {
                 },
             ],
         };
-    }), [filteredSources, selectedSources, metrics, onSelectOne]);
+    }), [filtered, selectedSources, metrics, onSelectOne]);
     const { badge, badgeTooltip } = useMemo(() => {
-        if (filteredSources.length !== sourcesByStream.length) {
+        if (filtered.length !== sourcesByStream.length) {
             return {
-                badge: `${filteredSources.length}/${sourcesByStream.length}`,
+                badge: `${filtered.length}/${sourcesByStream.length}`,
                 badgeTooltip: DISPLAY_TITLES.FILTERED_COUNT_TOOLTIP,
             };
         }
@@ -4672,10 +4728,10 @@ const SourceTable = ({ metrics, maxHeight, maxWidth }) => {
             badge: sourcesByStream.length,
             badgeTooltip: undefined,
         };
-    }, [filteredSources, sourcesByStream]);
+    }, [filtered, sourcesByStream]);
     return (React.createElement(TableContainer, { "$maxWidth": maxWidth },
         React.createElement(TableTitleWrap, null,
-            React.createElement(Checkbox, { partiallyChecked: hasSelected && filteredSources?.length !== totalSelectedSources, value: hasSelected && filteredSources?.length === totalSelectedSources, onChange: onSelectAll, disabled: !filteredSources?.length }),
+            React.createElement(Checkbox, { partiallyChecked: hasSelected && filtered?.length !== totalSelectedSources, value: hasSelected && filtered?.length === totalSelectedSources, onChange: onSelectAll, disabled: !filtered?.length }),
             React.createElement(IconTitleBadge, { icon: getEntityIcon(EntityTypes.Source), title: DISPLAY_TITLES.SOURCES, badge: badge, badgeTooltip: badgeTooltip, loading: sourcesLoading && !isAwaitingInstrumentation })),
         React.createElement(TableWrap, { "$maxHeight": maxHeight },
             React.createElement(InteractiveTable, { columns: columns, rows: isAwaitingInstrumentation ? [] : rows })),
@@ -4685,7 +4741,7 @@ const SourceTable = ({ metrics, maxHeight, maxWidth }) => {
                 React.createElement(Text, { color: theme.text.info },
                     !!sourcesToCreate ? 'Instrumenting' : 'Uninstrumenting',
                     " workloads..."),
-                React.createElement(Badge, { label: `${instrumentingPercent}%` })))) : !filteredSources.length ? (React.createElement(CenterThis, { style: { marginTop: '2rem' } },
+                React.createElement(Badge, { label: `${instrumentingPercent}%` })))) : !filtered.length ? (React.createElement(CenterThis, { style: { marginTop: '2rem' } },
             React.createElement(NoDataFound, null))) : null));
 };
 

package/lib/{index-b674f184.js → index-192794e8.js}

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef, forwardRef, useMemo, Fragment, createElement, useCallback, createContext, memo, useContext, useLayoutEffect } from 'react';
+import React, { Fragment, useMemo, useState, useEffect, useRef, forwardRef, createElement, useCallback, 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-90ccd949.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-19b8f8bc.js';
@@ -19,8 +19,73 @@ const TextWrapper$2 = styled.div `
   text-transform: ${({ $family }) => ($family === 'secondary' ? 'uppercase' : 'none')};
   font-family: ${({ theme, $family = 'primary' }) => theme.font_family[$family]};
 `;
+const getLinksFromText = (text) => {
+    const links = text.match(/<a[^>]*href="([^"]*)"[^>]*>(.*?)<\/a>/g);
+    return links?.map((link) => {
+        const [_, href, label] = link.split('"');
+        const labelWithoutTags = label.replace('</a>', '').replace('>', '');
+        return {
+            original: link,
+            href,
+            label: labelWithoutTags,
+        };
+    });
+};
+const getStrongsFromText = (text) => {
+    const strongs = text.match(/<strong[^>]*>(.*?)<\/strong>/g);
+    return strongs?.map((strong) => {
+        const label = strong.replace(/<strong[^>]*>/, '').replace(/<\/strong>/, '');
+        return {
+            original: strong,
+            label,
+        };
+    });
+};
+const renderText = (text, theme) => {
+    const links = getLinksFromText(text);
+    links?.forEach((link, i) => {
+        text = text.replace(link.original, `LINK-${i}###`);
+    });
+    const strongs = getStrongsFromText(text);
+    strongs?.forEach((strong, i) => {
+        text = text.replace(strong.original, `STRONG-${i}###`);
+    });
+    const mappedText = text.split(' ').map((word) => {
+        if (word.includes('LINK-')) {
+            const [linkId, postLabel] = word.split('###');
+            const entry = links?.[parseInt(linkId.replace('LINK-', ''))];
+            return (React.createElement(Fragment, { key: word },
+                React.createElement("a", { href: entry?.href, target: '_blank', style: { color: theme.colors.majestic_blue_soft } }, entry?.label),
+                postLabel ? `${postLabel} ` : ' '));
+        }
+        if (word.includes('STRONG-')) {
+            const [strongId, postLabel] = word.split('###');
+            const entry = strongs?.[parseInt(strongId.replace('STRONG-', ''))];
+            return (React.createElement(Fragment, { key: word },
+                React.createElement("strong", { style: { fontWeight: 600 } }, entry?.label),
+                postLabel ? `${postLabel} ` : ' '));
+        }
+        return word + ' ';
+    });
+    return mappedText;
+};
 const Text = ({ children, color, size, weight, align, family, opacity, decoration, ...props }) => {
-    return (React.createElement(TextWrapper$2, { "$color": color, "$size": size, "$weight": weight, "$align": align, "$family": family, "$opacity": opacity, "$decoration": decoration, ...props }, children));
+    const theme = Theme.useTheme();
+    const textArray = useMemo(() => {
+        const str = typeof children === 'string'
+            ? children
+            : Array.isArray(children)
+                ? // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    children
+                        .map((x) => (typeof x === 'object' && Object.hasOwn(x, 'props') ? x.props.children : x))
+                        .filter((x) => x && typeof x === 'string')
+                        .join(' ')
+                : '';
+        return str.split('\n');
+    }, [children]);
+    return (React.createElement(TextWrapper$2, { "$color": color, "$size": size, "$weight": weight, "$align": align, "$family": family, "$opacity": opacity, "$decoration": decoration, ...props }, textArray.map((str, i) => (React.createElement(Fragment, { key: `text-${i}-${str}` },
+        renderText(str, theme),
+        i !== textArray.length - 1 ? React.createElement("br", null) : null)))));
 };
 
 const ErrorWrapper = styled.div `
@@ -409,6 +474,7 @@ const FlexColumn = styled.div `
 `;
 const CenterThis = styled(FlexColumn) `
   width: 100%;
+  height: ${({ $height }) => $height || 'unset'};
   align-items: center;
   justify-content: center;
 `;
@@ -463,42 +529,13 @@ const TextBreakWord = styled(Text) `
   word-break: break-word;
   white-space: pre-wrap;
 `;
-const getLinksFromText = (text) => {
-    const links = text.match(/<a[^>]*href="([^"]*)"[^>]*>(.*?)<\/a>/g);
-    return links?.map((link) => {
-        const [_, href, label] = link.split('"');
-        const labelWithoutTags = label.replace('</a>', '').replace('>', '');
-        return {
-            original: link,
-            href,
-            label: labelWithoutTags,
-        };
-    });
-};
-const renderText = (text, theme) => {
-    const links = getLinksFromText(text);
-    links?.forEach((link, i) => {
-        text = text.replace(link.original, `LINK-${i}###`);
-    });
-    const mappedText = text.split(' ').map((word) => {
-        if (word.includes('LINK-')) {
-            const [linkId, postLabel] = word.split('###');
-            const entry = links?.[parseInt(linkId.replace('LINK-', ''))];
-            return (React.createElement(Fragment, { key: word },
-                React.createElement("a", { href: entry?.href, target: '_blank', style: { color: theme.colors.majestic_blue_soft } }, entry?.label),
-                postLabel ? `${postLabel} ` : ''));
-        }
-        return word + ' ';
-    });
-    return { mappedText, hasLinks: !!links?.length };
-};
 const Tooltip = ({ withIcon, titleIcon: TitleIcon, title, text, timestamp, children }) => {
     const theme = Theme.useTheme();
     const { popupRef, popupOpen, setPopupOpen, popupPosition, handlePosition } = usePopup({
         defaultClientHeight: 40,
         defaultClientwidth: Math.min((text?.length || 0) * 7.5, 300),
     });
-    const { mappedText, hasLinks } = useMemo(() => renderText(text || '', theme), [text, theme]);
+    const hasLinks = useMemo(() => !!getLinksFromText(text || '')?.length, [text]);
     const handleMouseEvent = (e) => {
         const { type, clientX, clientY } = e;
         if (hasLinks) {
@@ -521,7 +558,7 @@ const Tooltip = ({ withIcon, titleIcon: TitleIcon, title, text, timestamp, child
                     title && React.createElement(React.Fragment, null,
                         title,
                         "\u00A0-\u00A0"))),
-                React.createElement(TextBreakWord, { size: 12, color: theme.text.info }, mappedText),
+                React.createElement(TextBreakWord, { size: 12, color: theme.text.info }, text),
                 !!timestamp && (React.createElement(Text, { size: 10, color: theme.text.darker_grey, family: 'secondary', style: { marginTop: '8px' } }, new Date(timestamp).toLocaleString()))))));
 };
 
@@ -38449,4 +38486,4 @@ const WarningModal = ({ isOpen, noOverlay, title = '', description = '', note, a
                 React.createElement(FooterButton, { "data-id": 'deny', variant: denyButton.variant || 'secondary', onClick: onDeny }, denyButton.text)))));
 };
 
-export { TextArea as $, AutocompleteInput as A, Button$4 as B, Checkbox as C, DataCard as D, ExtendArrow as E, FadeLoader as F, MonitorsIcons as G, Header as H, IconButton as I, NoDataFound as J, KeyValueInputsList as K, NotificationNote as L, Modal as M, NavigationButtons as N, PopupForm as O, Popup as P, SectionTitle as Q, Segment as R, ScrollX as S, ToggleCodeComponent as T, SelectionButton as U, SkeletonLoader as V, Status as W, Stepper as X, TabList as Y, Tag as Z, Text as _, Badge as a, Toggle as a0, Tooltip as a1, TraceLoader as a2, WarningModal as a3, FlexRow as a4, FlexColumn as a5, CenterThis as a6, VerticalScroll as a7, Overlay as a8, ModalBody as a9, TableContainer as aa, TableTitleWrap as ab, TableWrap as ac, nodeConfig as ad, useNodesState as ae, useEdgesState as af, Flow as ag, applyNodeChanges as ah, AddButton$1 as ai, MarkerType as aj, CopyText as ak, PodContainer as al, SourceContainer as am, AddNode as an, BaseNode as ao, EdgedNode as ap, FrameNode as aq, HeaderNode as ar, MapItemNode as as, NoDataNode as at, ScrollNode as au, SkeletonNode as av, LabeledEdge as aw, Code as b, ConditionDetails as c, DataCardFields as d, DataCardFieldTypes as e, DataFinger as f, DataTab as g, DescribeRow as h, Divider as i, DocsButton as j, Drawer as k, DrawerHeader as l, DrawerFooter as m, Dropdown as n, FieldError as o, FieldLabel as p, IconGroup as q, IconTitleBadge as r, IconWrapped as s, IconsNav as t, ImageControlled as u, Input as v, InputList as w, InputTable as x, InteractiveTable as y, MonitorsCheckboxes as z };
+export { getLinksFromText as $, AutocompleteInput as A, Button$4 as B, Checkbox as C, DataCard as D, ExtendArrow as E, FadeLoader as F, MonitorsIcons as G, Header as H, IconButton as I, NoDataFound as J, KeyValueInputsList as K, NotificationNote as L, Modal as M, NavigationButtons as N, PopupForm as O, Popup as P, SectionTitle as Q, Segment as R, ScrollX as S, ToggleCodeComponent as T, SelectionButton as U, SkeletonLoader as V, Status as W, Stepper as X, TabList as Y, Tag as Z, Text as _, Badge as a, getStrongsFromText as a0, renderText as a1, TextArea as a2, Toggle as a3, Tooltip as a4, TraceLoader as a5, WarningModal as a6, FlexRow as a7, FlexColumn as a8, CenterThis as a9, VerticalScroll as aa, Overlay as ab, ModalBody as ac, TableContainer as ad, TableTitleWrap as ae, TableWrap as af, nodeConfig as ag, useNodesState as ah, useEdgesState as ai, Flow as aj, applyNodeChanges as ak, AddButton$1 as al, MarkerType as am, CopyText as an, PodContainer as ao, SourceContainer as ap, AddNode as aq, BaseNode as ar, EdgedNode as as, FrameNode as at, HeaderNode as au, MapItemNode as av, NoDataNode as aw, ScrollNode as ax, SkeletonNode as ay, LabeledEdge as az, Code as b, ConditionDetails as c, DataCardFields as d, DataCardFieldTypes as e, DataFinger as f, DataTab as g, DescribeRow as h, Divider as i, DocsButton as j, Drawer as k, DrawerHeader as l, DrawerFooter as m, Dropdown as n, FieldError as o, FieldLabel as p, IconGroup as q, IconTitleBadge as r, IconWrapped as s, IconsNav as t, ImageControlled as u, Input as v, InputList as w, InputTable as x, InteractiveTable as y, MonitorsCheckboxes as z };

package/lib/{index-845f2100.js → index-e4e75973.js}

@@ -1,5 +1,5 @@
 import React from 'react';
-import { a3 as WarningModal } from './index-b674f184.js';
+import { a6 as WarningModal } from './index-192794e8.js';
 import { StatusType, EntityTypes } from './types.js';
 import './index-90ccd949.js';
 import 'styled-components';

package/lib/snippets.js

@@ -1,5 +1,5 @@
-import { B as Button, _ as Text, L as NotificationNote } from './index-b674f184.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-b674f184.js';
+import { B as Button, _ as Text, L as NotificationNote } from './index-192794e8.js';
+export { al as AddButton, aq as AddNode, ar as BaseNode, an as CopyText, as as EdgedNode, aj as Flow, at as FrameNode, au as HeaderNode, az as LabeledEdge, av as MapItemNode, aw as NoDataNode, ao as PodContainer, ax as ScrollNode, ay as SkeletonNode, ap as SourceContainer, ag as nodeConfig } from './index-192794e8.js';
 import React from 'react';
 import { T as Theme, B as BUTTON_TEXTS, b as DISPLAY_TITLES } from './index-90ccd949.js';
 import { E as EditIcon } from './index-19b8f8bc.js';

package/lib/store/useFilterStore.d.ts

@@ -1,6 +1,6 @@
 import type { DropdownProps } from '@/components';
 export interface FiltersState {
-    searchText?: string;
+    searchText: string;
     statuses?: DropdownProps['options'];
     platformTypes?: DropdownProps['options'];
     namespaces?: DropdownProps['options'];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@odigos/ui-kit",
-  "version": "0.0.79",
+  "version": "0.0.80",
   "author": "Odigos",
   "repository": {
     "type": "git",
@@ -108,7 +108,7 @@
     "@storybook/addon-docs": "^9.1.1",
     "@storybook/addon-webpack5-compiler-babel": "^3.0.6",
     "@storybook/react-webpack5": "9.1.1",
-    "@types/node": "^24.2.0",
+    "@types/node": "^24.2.1",
     "@types/react": "^19.1.9",
     "@types/react-dom": "^19.1.7",
     "babel-loader": "^10.0.0",