ag-common 0.0.535 → 0.0.537

package/dist/ui/components/Search/AutoHideSearchBox.js

@@ -91,7 +91,7 @@ const AutoHideSearchBox = (p) => {
             } },
             open && react_1.default.createElement(icons_1.CrossIcon, null),
             !open && react_1.default.createElement(icons_1.Magnify, { style: { fill: 'white' } })),
-        react_1.default.createElement(SearchBoxStyled, Object.assign({ ref: textEditRef }, p, { className: "", "data-open": open, defaultValue: p.searchText, setSearchText: (val, enter) => {
+        react_1.default.createElement(SearchBoxStyled, Object.assign({ textBoxRef: textEditRef }, p, { className: "", "data-open": open, defaultValue: p.searchText, setSearchText: (val, enter) => {
                 //we dont want empty enters to do anything
                 if (val === '' && enter) {
                     p.setSearchText(val, false);

package/dist/ui/components/Search/Base.d.ts

@@ -1,8 +1,10 @@
 import React from 'react';
+import type { IRefTextEdit } from '../TextEdit/types';
 import type { ISearchDialog, TSearchModalRes } from './types';
 type ISearchBase<T> = ISearchDialog<T> & {
     onSearchTextChange?: (v: string) => void;
     onSelectItem?: (v: TSearchModalRes<T>) => void;
+    textBoxRef?: React.RefObject<IRefTextEdit>;
 };
 export declare const SearchBase: <T>(p: ISearchBase<T>) => React.JSX.Element;
 export {};

package/dist/ui/components/Search/Base.js

@@ -67,6 +67,20 @@ const SearchBase = (p) => {
     var _a, _b, _c, _d;
     const { maxDisplayItems = 1000 } = p;
     const [searchText, setSearchText] = (0, react_1.useState)((_a = p.defaultValue) !== null && _a !== void 0 ? _a : '');
+    (0, react_1.useImperativeHandle)(p.textBoxRef, () => ({
+        setValue: (v) => {
+            var _a, _b;
+            const value = (_a = divRef === null || divRef === void 0 ? void 0 : divRef.current) === null || _a === void 0 ? void 0 : _a.getValue();
+            if (v === value) {
+                return;
+            }
+            (_b = divRef === null || divRef === void 0 ? void 0 : divRef.current) === null || _b === void 0 ? void 0 : _b.setValue(v);
+            setSearchText(v);
+        },
+        focus: () => { var _a; return (_a = divRef === null || divRef === void 0 ? void 0 : divRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
+        getValue: () => { var _a; return (_a = divRef === null || divRef === void 0 ? void 0 : divRef.current) === null || _a === void 0 ? void 0 : _a.getValue(); },
+    }));
+    const divRef = (0, react_1.useRef)(null);
     const resWrap = (foundItem, target) => {
         var _a, _b;
         if (!foundItem) {
@@ -86,7 +100,7 @@ const SearchBase = (p) => {
                 var _a;
                 setSearchText(t);
                 (_a = p.onSearchTextChange) === null || _a === void 0 ? void 0 : _a.call(p, t);
-            } })),
+            }, textBoxRef: divRef })),
         react_1.default.createElement(Content, { "data-hasitems": !!filteredItems.length, "data-type": "content" },
             filteredItems.map((item, index) => (0, react_1.cloneElement)(p.renderItem({ searchText, item, index }), {
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any

package/dist/ui/components/Search/Inline.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
+import type { IRefTextEdit } from '../TextEdit/types';
 import type { ISearchInline, TSearchModalRes } from './types';
 export declare const SearchInline: <T>(p: ISearchInline<T> & {
     onSelectItem?: ((v: TSearchModalRes<T>) => void) | undefined;
     onSearchTextChange?: ((v: string) => void) | undefined;
+    textBoxRef?: React.RefObject<IRefTextEdit> | undefined;
 }) => React.JSX.Element;

package/dist/ui/components/Search/SearchBox.d.ts

@@ -6,5 +6,6 @@ export interface ISearchBox {
     setSearchText: (val: string, enterPressed: boolean) => void;
     defaultValue?: string;
     className?: string;
+    textBoxRef?: React.RefObject<IRefTextEdit>;
 }
-export declare const SearchBox: React.ForwardRefExoticComponent<ISearchBox & React.RefAttributes<IRefTextEdit>>;
+export declare const SearchBox: (p: ISearchBox) => React.JSX.Element;

package/dist/ui/components/Search/SearchBox.js

@@ -70,32 +70,23 @@ const TextEditStyled = (0, styled_1.default)(TextEdit_1.TextEdit) `
   padding: 0;
   height: 2.5rem;
 `;
-exports.SearchBox = (0, react_1.forwardRef)((p, ref) => {
-    const textEditRef = (0, react_1.createRef)();
-    (0, react_1.useImperativeHandle)(ref, () => ({
-        setValue: (v) => {
-            var _a, _b;
-            const value = (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.getValue();
-            if (v === value) {
-                return;
-            }
-            (_b = textEditRef.current) === null || _b === void 0 ? void 0 : _b.setValue(v);
-        },
-        focus: () => { var _a; return (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
-        getValue: () => { var _a; return (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.getValue(); },
-    }));
+const SearchBox = (p) => {
+    var _a, _b;
+    const ref = (0, react_1.useRef)((_b = (_a = p.textBoxRef) === null || _a === void 0 ? void 0 : _a.current) !== null && _b !== void 0 ? _b : null);
     (0, react_1.useEffect)(() => {
         var _a;
-        (_a = textEditRef === null || textEditRef === void 0 ? void 0 : textEditRef.current) === null || _a === void 0 ? void 0 : _a.setValue(p.searchText);
-    }, [p.searchText, textEditRef]);
+        (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.setValue(p.searchText);
+        p.setSearchText(p.searchText, true);
+    }, [p]);
     return (react_1.default.createElement(Base, Object.assign({ "data-type": "search", className: p.className }, (0, dom_1.filterDataProps)(p)),
-        react_1.default.createElement(TextEditStyled, { ref: textEditRef, placeholder: p.placeholderText, defaultEditing: { focus: true }, singleLine: true, leftContent: react_1.default.createElement(MagnifyIcon, { onClick: () => { var _a; return p.setSearchText(((_a = textEditRef === null || textEditRef === void 0 ? void 0 : textEditRef.current) === null || _a === void 0 ? void 0 : _a.getValue()) || '', true); } },
+        react_1.default.createElement(TextEditStyled, { ref: ref, placeholder: p.placeholderText, defaultEditing: { focus: true }, singleLine: true, leftContent: react_1.default.createElement(MagnifyIcon, { onClick: () => { var _a; return p.setSearchText(((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.getValue()) || '', true); } },
                 react_1.default.createElement(icons_1.Magnify, null)), noGrow: true, allowUndo: false, onClickOutsideWithNoValue: null, onSubmit: (v, enterPressed) => (0, debounce_1.debounce)(() => {
                 p.setSearchText(v, enterPressed);
             }, { key: 'pagesearch', time: 200 }), defaultValue: p.defaultValue }),
         p.searchText && (react_1.default.createElement(CrossIconStyled, { onClick: () => {
                 var _a;
-                (_a = textEditRef.current) === null || _a === void 0 ? void 0 : _a.setValue('');
+                (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.setValue('');
                 p.setSearchText('', true);
             } }))));
-});
+};
+exports.SearchBox = SearchBox;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.535",
+  "version": "0.0.537",
   "name": "ag-common",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",