sccoreui
Version:
ui-sccore
56 lines (55 loc) • 4.55 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const inputtext_1 = require("primereact/inputtext");
const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg-component"));
const react_1 = require("react");
const context_provider_1 = require("../context-provider");
const hooks_1 = require("primereact/hooks");
const constants_1 = require("../constants");
const helper_1 = require("../helper");
const utilComponents_1 = require("../utilComponents");
const skeleton_1 = require("primereact/skeleton");
function Search({ searchPlaceHolder }) {
const { featureDetails, setFeatureDetails, rowModelType, gridApi, quickSearch, conditionsToDisplay, setGridViewData, gridView, } = (0, react_1.useContext)(context_provider_1.FeatureContext);
const [inputValue, deboucedValue, setInputValue] = (0, hooks_1.useDebounce)("", 500);
const isDisabled = (0, helper_1.isComponentDisable)(conditionsToDisplay.displaySearch);
(0, react_1.useEffect)(() => {
var _a, _b, _c;
if (rowModelType === constants_1.ROWMODELTYPE.CLIENT_SIDE && quickSearch) {
if (gridView) {
setGridViewData((state) => (Object.assign(Object.assign({}, state), { searchText: deboucedValue })));
}
if (gridApi === null || gridApi === void 0 ? void 0 : gridApi.current) {
(_a = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api) === null || _a === void 0 ? void 0 : _a.setGridOption("quickFilterText", deboucedValue);
const displayedRowCount = (_b = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api) === null || _b === void 0 ? void 0 : _b.getDisplayedRowCount();
if (displayedRowCount === 0 && Boolean(deboucedValue)) {
gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api.showNoRowsOverlay();
}
else if (displayedRowCount > 0) {
(_c = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api) === null || _c === void 0 ? void 0 : _c.hideOverlay();
}
}
}
else {
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: deboucedValue }));
}
}, [deboucedValue]);
return (0, utilComponents_1.skeletonLoding)() ? ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "40px", width: "336px" })) : ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `p-input-icon-left ${inputValue.length > 0 ? "p-input-icon-right" : ""}` }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix zoom_animate" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { color: "#667085", icon: "search-lg", size: 18, disabled: isDisabled }) })), inputValue.length > 0 && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix cursor-pointer zoom_animate", onClick: () => {
var _a, _b;
if (rowModelType === constants_1.ROWMODELTYPE.CLIENT_SIDE && quickSearch) {
(_a = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api) === null || _a === void 0 ? void 0 : _a.setGridOption("quickFilterText", "");
(_b = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api) === null || _b === void 0 ? void 0 : _b.hideOverlay();
}
else {
setFeatureDetails(Object.assign(Object.assign({}, featureDetails), { searchedText: "" }));
}
setInputValue("");
}, title: "Clear" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18 }) }))), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { id: "ag-grid-main-search", value: inputValue, onChange: (e) => {
var _a;
(gridApi === null || gridApi === void 0 ? void 0 : gridApi.current) && ((_a = gridApi === null || gridApi === void 0 ? void 0 : gridApi.current.api) === null || _a === void 0 ? void 0 : _a.hideOverlay());
!isDisabled && setInputValue(e.target.value);
}, className: "w-21rem", placeholder: searchPlaceHolder || "Search by name or code", disabled: isDisabled })] })));
}
exports.default = Search;