@adiba-banking-cloud/backoffice 0.2.4 → 0.2.5

package/build/index.cjs.js/{heatmap-BqY-ayOh.js → heatmap-Bha3If2E.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Clg3JrJr.js');
+var index = require('./index-BiOmZHuM.js');
 
 function _mergeNamespaces(n, m) {
 	m.forEach(function (e) {

package/build/index.cjs.js/{index-Clg3JrJr.js → index-BiOmZHuM.js}

@@ -12172,7 +12172,7 @@ const initChart$1 = props => {
   }
 
   // Fallback: use dynamic import (async, but will work in Vite/Storybook)
-  Promise.resolve().then(function () { return require('./heatmap-BqY-ayOh.js'); }).then(function (n) { return n.heatmap; }).then(heatmapModule => {
+  Promise.resolve().then(function () { return require('./heatmap-Bha3If2E.js'); }).then(function (n) { return n.heatmap; }).then(heatmapModule => {
     const moduleFn = typeof heatmapModule === "function" ? heatmapModule : heatmapModule?.default || heatmapModule;
     if (typeof moduleFn === "function") {
       moduleFn(Highcharts);
@@ -12971,49 +12971,50 @@ const SearchPanel = _ref3 => {
     },
     searchText = "Search",
     searchState,
+    searchInputValue,
     filterFn,
     searchFn,
     onPillRemove,
     children,
     ...rest
   } = _ref3;
-  const [searchPills, setSearchPills] = searchState || React.useState([]);
-  const [inputValue, setInputValue] = React.useState("");
+  const [searchPills] = searchState || React.useState([]);
+  const [inputValue, setInputValue] = React.useState(searchInputValue || "");
   const form$1 = form.useForm({
     initialValues: {
-      search: ""
+      search: searchInputValue || ""
     }
   });
-  const handleAddPill = value => {
-    const trimmedValue = value.trim();
-    if (trimmedValue && !searchPills.includes(trimmedValue)) {
-      const newPills = [...searchPills, trimmedValue];
-      setSearchPills(newPills);
-      setInputValue("");
-      form$1.setFieldValue("search", "");
+
+  // Sync input value with searchInputValue prop
+  React.useEffect(() => {
+    if (searchInputValue !== undefined) {
+      setInputValue(searchInputValue);
+      form$1.setFieldValue("search", searchInputValue);
     }
-  };
+  }, [searchInputValue]);
   const handleRemovePill = value => {
-    const newPills = searchPills.filter(pill => pill !== value);
-    setSearchPills(newPills);
     if (onPillRemove) {
       onPillRemove(value);
     }
   };
   const handleSubmit = values => {
-    if (inputValue.trim()) {
-      handleAddPill(inputValue);
-    }
+    // On submit, call searchFn with the input value (search term)
+    // Don't add it as a pill - pills are for filters only
+    const searchValue = inputValue.trim();
     if (searchFn) {
       searchFn({
-        search: searchPills
+        search: searchValue ? [searchValue] : []
       });
     }
+    setInputValue("");
+    form$1.setFieldValue("search", "");
   };
   const handleKeyDown = event => {
     if (event.key === "Enter" && inputValue.trim()) {
       event.preventDefault();
-      handleAddPill(inputValue);
+      // Trigger form submit which calls searchFn
+      handleSubmit();
     } else if (event.key === "Backspace" && inputValue.length === 0 && searchPills.length > 0) {
       event.preventDefault();
       handleRemovePill(searchPills[searchPills.length - 1]);

package/build/index.cjs.js/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-Clg3JrJr.js');
+var index = require('./index-BiOmZHuM.js');
 require('@mantine/modals');
 require('react');
 require('@mantine/core');

package/build/index.esm.js/{heatmap-D3ePhBTg.js → heatmap-Dva-F8qJ.js}

@@ -1,4 +1,4 @@
-import { g as getDefaultExportFromCjs } from './index-rnjdI3M1.js';
+import { g as getDefaultExportFromCjs } from './index-BmuCIg-s.js';
 
 function _mergeNamespaces(n, m) {
 	m.forEach(function (e) {

package/build/index.esm.js/{index-rnjdI3M1.js → index-BmuCIg-s.js}

@@ -12151,7 +12151,7 @@ const initChart$1 = props => {
   }
 
   // Fallback: use dynamic import (async, but will work in Vite/Storybook)
-  import('./heatmap-D3ePhBTg.js').then(function (n) { return n.h; }).then(heatmapModule => {
+  import('./heatmap-Dva-F8qJ.js').then(function (n) { return n.h; }).then(heatmapModule => {
     const moduleFn = typeof heatmapModule === "function" ? heatmapModule : heatmapModule?.default || heatmapModule;
     if (typeof moduleFn === "function") {
       moduleFn(Highcharts);
@@ -12950,49 +12950,50 @@ const SearchPanel = _ref3 => {
     },
     searchText = "Search",
     searchState,
+    searchInputValue,
     filterFn,
     searchFn,
     onPillRemove,
     children,
     ...rest
   } = _ref3;
-  const [searchPills, setSearchPills] = searchState || useState([]);
-  const [inputValue, setInputValue] = useState("");
+  const [searchPills] = searchState || useState([]);
+  const [inputValue, setInputValue] = useState(searchInputValue || "");
   const form = useForm({
     initialValues: {
-      search: ""
+      search: searchInputValue || ""
     }
   });
-  const handleAddPill = value => {
-    const trimmedValue = value.trim();
-    if (trimmedValue && !searchPills.includes(trimmedValue)) {
-      const newPills = [...searchPills, trimmedValue];
-      setSearchPills(newPills);
-      setInputValue("");
-      form.setFieldValue("search", "");
+
+  // Sync input value with searchInputValue prop
+  React__default.useEffect(() => {
+    if (searchInputValue !== undefined) {
+      setInputValue(searchInputValue);
+      form.setFieldValue("search", searchInputValue);
     }
-  };
+  }, [searchInputValue]);
   const handleRemovePill = value => {
-    const newPills = searchPills.filter(pill => pill !== value);
-    setSearchPills(newPills);
     if (onPillRemove) {
       onPillRemove(value);
     }
   };
   const handleSubmit = values => {
-    if (inputValue.trim()) {
-      handleAddPill(inputValue);
-    }
+    // On submit, call searchFn with the input value (search term)
+    // Don't add it as a pill - pills are for filters only
+    const searchValue = inputValue.trim();
     if (searchFn) {
       searchFn({
-        search: searchPills
+        search: searchValue ? [searchValue] : []
       });
     }
+    setInputValue("");
+    form.setFieldValue("search", "");
   };
   const handleKeyDown = event => {
     if (event.key === "Enter" && inputValue.trim()) {
       event.preventDefault();
-      handleAddPill(inputValue);
+      // Trigger form submit which calls searchFn
+      handleSubmit();
     } else if (event.key === "Backspace" && inputValue.length === 0 && searchPills.length > 0) {
       event.preventDefault();
       handleRemovePill(searchPills[searchPills.length - 1]);

package/build/index.esm.js/index.js

@@ -1,4 +1,4 @@
-export { A as ApplicationMenu, o as ApplicationPanel, k as AvatarLabelPanel, B as BasicHeatmap, C as CalendarHeatmap, n as ConnectionPanel, V as DEFAULT_API_TIMEOUT, Q as DEFAULT_PAGE_SIZE, D as DonutChart, z as Drawer, e as DynamicLogo, f as DynamicShigaLogo, E as EqualizerColumn, u as ErrorModal, F as File, d as Icons, v as InfoModal, I as InterpolatedHeatmap, L as LabelPanel, R as MAX_PAGE_SIZE, H as MaskedTilePanel, Y as ModalContentWrapper, M as MultiAxisArea, P as PageTitle, q as PaymentMethod, r as PaymentMethodAdd, j as SearchPanel, h as SideMenu, b as SimpleArea, S as SimpleColumn, G as SimpleForm, w as SimpleModal, i as SimplePanel, s as SimpleTable, l as SimpleText, c as StackedArea, a as StackedColumn, p as SubscriptionPlans, x as SuccessModal, J as TilePanel, m as TitleWithIndex, T as TitledPanel, y as TwoFactorModal, U as UserMenu, X as apiClient, W as createApiClient, _ as extractBetweenBraces, $ as extractOutsideBraces, t as theme, N as useManagedModals, K as useModal, O as useUrlFilters, Z as withProviders } from './index-rnjdI3M1.js';
+export { A as ApplicationMenu, o as ApplicationPanel, k as AvatarLabelPanel, B as BasicHeatmap, C as CalendarHeatmap, n as ConnectionPanel, V as DEFAULT_API_TIMEOUT, Q as DEFAULT_PAGE_SIZE, D as DonutChart, z as Drawer, e as DynamicLogo, f as DynamicShigaLogo, E as EqualizerColumn, u as ErrorModal, F as File, d as Icons, v as InfoModal, I as InterpolatedHeatmap, L as LabelPanel, R as MAX_PAGE_SIZE, H as MaskedTilePanel, Y as ModalContentWrapper, M as MultiAxisArea, P as PageTitle, q as PaymentMethod, r as PaymentMethodAdd, j as SearchPanel, h as SideMenu, b as SimpleArea, S as SimpleColumn, G as SimpleForm, w as SimpleModal, i as SimplePanel, s as SimpleTable, l as SimpleText, c as StackedArea, a as StackedColumn, p as SubscriptionPlans, x as SuccessModal, J as TilePanel, m as TitleWithIndex, T as TitledPanel, y as TwoFactorModal, U as UserMenu, X as apiClient, W as createApiClient, _ as extractBetweenBraces, $ as extractOutsideBraces, t as theme, N as useManagedModals, K as useModal, O as useUrlFilters, Z as withProviders } from './index-BmuCIg-s.js';
 import '@mantine/modals';
 import 'react';
 import '@mantine/core';

package/build/typings/components/panels/simple/Simple.types.d.ts

@@ -21,6 +21,7 @@ export interface SearchPanelProps extends PanelProps {
     filterIcon?: IconsProps;
     searchText?: string;
     searchState?: [string[], (value: string[]) => void];
+    searchInputValue?: string;
     searchFn?: (value: Record<string, any>) => void;
     filterFn?: () => void;
     onPillRemove?: (value: string) => void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@adiba-banking-cloud/backoffice",
   "author": "TUROG Technologies",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "description": "An ADIBA component library for backoffice and dashboard applications",
   "license": "ISC",
   "main": "build/index.cjs.js",