react-search-highlight - npm Package Compare versions

Comparing version 0.1.2 to 0.1.3

dist/const.d.ts

@@ -12,6 +12,2 @@ export declare const SET_INPUT = "SET_INPUT";
 export declare const POPOVER_EXPANDED = "POPOVER_EXPANDED";
-export declare const TEST_DATA: {
-    heading: string;
-    title: string;
-}[];
 export declare const __DEV__: boolean;

dist/container/SearchBar/index.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
     initialValue?: string;
-    PrefixIcon: React.FC;
+    PrefixIcon?: React.FC;
 }
 export declare const SearchBar: React.FC<Props>;

dist/index.d.ts

 import "./global.css";
+export * from "./const";
 export * from "./container/main";
@@ -3,0 +4,0 @@ export * from "./container/modal";

dist/react-search-highlight.cjs.development.js

@@ -7,6 +7,19 @@ 'use strict';
 
+require('process');
 var React = require('react');
 var React__default = _interopDefault(React);
-require('process');
 
+var SET_INPUT = 'SET_INPUT';
+var START_LOADING = 'START_LOADING';
+var END_LOADING = 'END_LOADING';
+var SEARCH_DATA = 'SEARCH_DATA';
+var DEBOUNCE = 'DEBOUNCE';
+var THROTTLE = 'THROTTLE';
+var RESET_STATE = 'RESET_STATE';
+var STRING_MATCHING = 'STRING_MATCHING';
+var CHARACTER_MATCHING = 'CHARACTER_MATCHING';
+var DEFAULT = 'DEFAULT';
+var POPOVER_EXPANDED = 'POPOVER_EXPANDED';
+var __DEV__ =  "development" === 'development';
+
 function _extends() {
@@ -44,10 +57,2 @@ _extends = Object.assign ? Object.assign.bind() : function (target) {
 
-var SET_INPUT = 'SET_INPUT';
-var START_LOADING = 'START_LOADING';
-var END_LOADING = 'END_LOADING';
-var SEARCH_DATA = 'SEARCH_DATA';
-var DEBOUNCE = 'DEBOUNCE';
-var RESET_STATE = 'RESET_STATE';
-var CHARACTER_MATCHING = 'CHARACTER_MATCHING';
-
 var reducer = function reducer(state, action) {
@@ -83,5 +88,24 @@ switch (action.type) {
 
+var isMatch = function isMatch(obj, _char, keys) {
+  return keys.some(function (match) {
+    return obj[match].toLowerCase().includes(_char);
+  });
+};
+var replaceAll = function replaceAll(obj, regex, keys) {
+  var newObj = _extends({}, obj);
+
+  keys.forEach(function (key) {
+    return newObj[key] = obj[key].replaceAll(regex, function (match) {
+      return "(<mark>" + match + "</mark>)";
+    });
+  });
+  return newObj;
+};
+var isResultsNotFound = function isResultsNotFound(searchData, searchInput) {
+  return searchData.length === 0 && searchInput.length > 0;
+};
+
 var initialState = {
   isLoading: false,
-  searchData: undefined,
+  searchData: [],
   input: ''
@@ -122,9 +146,13 @@ };
 
+  var isResultsEmpty = isResultsNotFound(state.searchData, state.input);
   var value = React.useMemo(function () {
     return {
-      state: state,
+      suggestions: state.searchData,
+      isLoading: state.isLoading,
+      input: state.input,
       dispatch: dispatch,
       startLoading: startLoading,
       endLoading: endLoading,
-      resetState: resetState
+      resetState: resetState,
+      isResultsEmpty: isResultsEmpty
     };
@@ -137,16 +165,13 @@ }, [state]);
 
-var isMatch = function isMatch(obj, _char, keys) {
-  return keys.some(function (match) {
-    return obj[match].toLowerCase().includes(_char);
-  });
-};
-var replaceAll = function replaceAll(obj, regex, keys) {
-  var newObj = _extends({}, obj);
+var _excluded = ["as", "children", "classNames"];
 
-  keys.forEach(function (key) {
-    return newObj[key] = obj[key].replaceAll(regex, function (match) {
-      return "(<mark>" + match + "</mark>)";
-    });
-  });
-  return newObj;
+var Text = function Text(_ref) {
+  var as = _ref.as,
+      children = _ref.children,
+      classNames = _ref.classNames,
+      any = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return React.createElement(as, _extends({
+    className: classNames
+  }, any), children);
 };
@@ -388,15 +413,2 @@
 
-var _excluded = ["as", "children", "classNames"];
-
-var Text = function Text(_ref) {
-  var as = _ref.as,
-      children = _ref.children,
-      classNames = _ref.classNames,
-      any = _objectWithoutPropertiesLoose(_ref, _excluded);
-
-  return React.createElement(as, _extends({
-    className: classNames
-  }, any), children);
-};
-
 var _excluded$1 = ["children"],
@@ -707,10 +719,22 @@ _excluded2 = ["children", "optionIndex"],
 
+exports.CHARACTER_MATCHING = CHARACTER_MATCHING;
+exports.DEBOUNCE = DEBOUNCE;
+exports.DEFAULT = DEFAULT;
+exports.END_LOADING = END_LOADING;
 exports.InternalContext = InternalContext;
 exports.Modal = Modal;
+exports.POPOVER_EXPANDED = POPOVER_EXPANDED;
 exports.PopOverList = PopOverList;
 exports.PopOverOption = PopOverOption;
 exports.PopOverOptionText = PopOverOptionText;
+exports.RESET_STATE = RESET_STATE;
 exports.ReactSearchHighlightProvider = ReactSearchHighlightProvider;
+exports.SEARCH_DATA = SEARCH_DATA;
+exports.SET_INPUT = SET_INPUT;
+exports.START_LOADING = START_LOADING;
+exports.STRING_MATCHING = STRING_MATCHING;
 exports.SearchBar = SearchBar;
+exports.THROTTLE = THROTTLE;
 exports.Wrapper = Wrapper;
+exports.__DEV__ = __DEV__;
 exports.context = context;
@@ -717,0 +741,0 @@ exports.initialState = initialState;

dist/react-search-highlight.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;function r(){return(r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function i(e,t){if(null==e)return{};var n,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t.indexOf(n=a[r])>=0||(i[n]=e[n]);return i}require("process"),function(e,t){void 0===t&&(t={});var n=t.insertAt;if("undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&r.firstChild?r.insertBefore(i,r.firstChild):r.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}(".rsh-input:focus{outline:none}.rsh-search-wrapper{position:relative}.rsh-input-box{background-color:#fff;border:1px solid transparent;border-radius:5px;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);min-width:200px}.rsh-input-box-logo{align-items:center;display:flex;height:100%;justify-content:center;margin:0;width:40px}.rsh-input{border:none;border-radius:inherit;font-size:15px;height:100%;margin:0;padding:0;width:100%}.rsh-search-list{background-color:#fff;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);box-sizing:border-box;max-height:500px;min-width:200px;overflow-x:scroll;overflow:scroll;padding:0 8px;position:absolute;top:40px;width:100%;z-index:12}.rsh-search-list-item{border-radius:13px;list-style:none;margin:10px 0;padding:3px 8px}.rsh-search-list-item__active{background-color:hsla(0,0%,47%,.05)}.rsh-search-list-item-text{margin:0}");var a=function(e,t){switch(t.type){case"SET_INPUT":return r({},e,{input:t.payload});case"SEARCH_DATA":return r({},e,{searchData:t.payload});case"START_LOADING":return r({},e,{isLoading:!0});case"END_LOADING":return r({},e,{isLoading:!1});case"RESET_STATE":return r({},o);default:return e}},o={isLoading:!1,searchData:void 0,input:""},u=t.createContext(null),c=function(){return t.useContext(u)},s=function(e){var r=e.children,i=t.useReducer(a,o),c=i[0],s=i[1],l=function(){s({type:"START_LOADING"})},d=function(){s({type:"END_LOADING"})},p=function(){s({type:"RESET_STATE"})},f=t.useMemo((function(){return{state:c,dispatch:s,startLoading:l,endLoading:d,resetState:p}}),[c]);return n.createElement(u.Provider,{value:f},r)},l=function(e,t,n){return n.some((function(n){return e[n].toLowerCase().includes(t)}))},d=function(e,t,n){var i=r({},e);return n.forEach((function(n){return i[n]=e[n].replaceAll(t,(function(e){return"(<mark>"+e+"</mark>)"}))})),i},p=function(e,n,r,i){void 0===r&&(r="k"),void 0===i&&(i=[]),t.useEffect((function(){var t=function(t){(!n||t.metaKey)&&t.key.toLowerCase()===r&&(null==e||e())};return document.addEventListener("keydown",t),function(){document.removeEventListener("keydown",t)}}),i)},f=["as","children","classNames"],h=function(e){var n=e.as,a=e.children,o=e.classNames,u=i(e,f);return t.createElement(n,r({className:o},u),a)},m=["children"],x=["children","optionIndex"],g=["className","value","as"],v={isPopoverExpanded:!1,listItemActiveIndex:0,updateInternalContext:function(e,t){},dataLength:0},E=t.createContext(v),y=function(e){var i,a,o,u=e.children,s=e.isFunction,l=t.useState(v),d=l[0],p=l[1],f=c(),h=function(e,t){p((function(n){var i;return r({},n,((i={})[e]=t,i))}))},m=t.useRef(null),x=function(e){var n=t.useState(!1),r=n[0],i=n[1];return t.useEffect((function(){function t(t){e.current&&!e.current.contains(t.target)&&i(!1)}return document.addEventListener("mousedown",t),function(){document.removeEventListener("mousedown",t)}}),[e]),[r,i]}(m),g=x[0],y=x[1];return i=function(){h("isPopoverExpanded",g)},a=[g],o=t.useRef(!1),t.useEffect((function(){o.current?i():o.current=!0}),a),n.createElement(E.Provider,{value:r({},d,{updateInternalContext:h})},n.createElement("section",{ref:m,className:"rsh-search-wrapper",onFocusCapture:function(){return y(!0)}},s?u(f):u))},A=["as","children","className","onClick","onMouseDown","onFocusCapture"],C=function(e){var t=e.as,a=e.children,o=e.className,u=e.onClick,c=e.onFocusCapture,s=i(e,A);return n.createElement("div",{style:r({display:"flex",flexDirection:"HStack"===t?"row":"column",alignItems:"center"},s),className:o,onClick:u,onFocusCapture:c},a)},T=["keysToSearch","inputAlgorithm","matchingAlgorithm","data","value","onChange","initialValue","PrefixIcon"],b=function(e){var r=e.keysToSearch,a=e.inputAlgorithm,o=e.matchingAlgorithm,u=e.data,s=e.value,l=e.onChange,d=e.initialValue,f=e.PrefixIcon,h=i(e,T),m=t.useState(null!=d?d:""),x=m[0],g=m[1],v=c().dispatch,y=n.useContext(E),A=t.useRef(null),b=null!=s?s:x,w=a(b,500),S=o(r);t.useEffect((function(){u&&S(b,u),null==v||v({type:"SET_INPUT",payload:b})}),[w,u]),t.useEffect((function(){y&&y.updateInternalContext("dataLength",u.length)}),[u]);var I=function(){var e;return null==A||null==(e=A.current)?void 0:e.focus()};return p(I,!0),n.createElement(C,{as:"HStack",onClick:I,justifyContent:"center",className:"rsh-input-box",padding:0,height:40,cursor:"text"},n.createElement("figure",{className:"rsh-input-box-logo"},f?n.createElement(f,null):n.createElement("img",{src:'<?xml version="1.0" encoding="utf-8"?>\n\x3c!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  --\x3e\n<svg version="1.1" id="icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\n\t width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve">\n<style type="text/css">\n\t.st0{fill:none;}\n</style>\n<title>search</title>\n<path d="M15,14.3L10.7,10c1.9-2.3,1.6-5.8-0.7-7.7S4.2,0.7,2.3,3S0.7,8.8,3,10.7c2,1.7,5,1.7,7,0l4.3,4.3L15,14.3z M2,6.5\n\tC2,4,4,2,6.5,2S11,4,11,6.5S9,11,6.5,11S2,9,2,6.5z"/>\n<rect id="_Transparent_Rectangle_" class="st0" width="16" height="16"/>\n</svg>',width:"18px"})),n.createElement("input",Object.assign({value:null!=s?s:x,onChange:null!=l?l:function(e){return g(e.target.value.toLowerCase())},placeholder:"search here",className:"rsh-input",autoFocus:!0,ref:A},h)))},w=["data","keysToSearch","inputAlgorithmTimeout","inputAlgorithm","matchingAlgorithm"],S={DEBOUNCE:function(e,n){var r=t.useState(e),i=r[0],a=r[1];return t.useEffect((function(){var t=setTimeout((function(){a(e)}),n);return function(){clearTimeout(t)}}),[e,n]),i},THROTTLE:function(e,n){void 0===n&&(n=200);var r=t.useState(e),i=r[0],a=r[1],o=t.useRef(),u=t.useRef(null),c=t.useRef(0),s=t.useRef(null);return t.useEffect((function(){o.current?(u.current=e,c.current=!0):(a(e),o.current=setTimeout((function e(){c.current?(c.current=!1,a(u.current),o.current=setTimeout(e,n)):o.current=void 0}),n))}),[e]),s.current=function(){o.current&&clearTimeout(o.current)},t.useEffect((function(){return function(){return s.current()}}),[]),i},DEFAULT:function(e){return e}},I={CHARACTER_MATCHING:function(e){var t=c().dispatch;return function(n,i){var a=n.toLowerCase().split("");if(0!==a.length){var o=new RegExp(a.join("|"),"gi");if(Array.isArray(i)&&Array.isArray(e)&&(!(i.length>0)||Object.keys(i[0]).some((function(t){return e.includes(t)})))){var u=null==i?void 0:i.filter((function(t){return a.every((function(n){return l(t,n,e)}))})).map((function(t){return r({},t,d(t,o,e))}));null==t||t({type:"SEARCH_DATA",payload:u})}}else null==t||t({type:"SEARCH_DATA",payload:[]})}},STRING_MATCHING:function(e){var t=c().dispatch;return function(n,i){if(0!==n.length){var a=new RegExp(n,"gi");if(Array.isArray(i)&&Array.isArray(e)&&(!(i.length>0)||Object.keys(i[0]).some((function(t){return e.includes(t)})))){var o=null==i?void 0:i.filter((function(t){return l(t,n,e)})).map((function(t){return r({},t,d(t,a,e))}));null==t||t({type:"SEARCH_DATA",payload:o})}}else null==t||t({type:"SEARCH_DATA",payload:[]})}}};exports.InternalContext=E,exports.Modal=function(e){var t=e.isOpen,r=e.onClose;return n.createElement(n.Fragment,null,(null==t||t)&&n.createElement("div",{onClick:null!=r?r:void 0,className:"rsh-modal-dialog",style:{backgroundColor:"rgba(220,220,220,0.5)",position:"fixed",top:0,right:0,bottom:0,left:0,zIndex:1e3}},n.createElement("div",{className:"rsh-modal-dialog-box-wrapper",style:{maxWidth:400,margin:"auto",padding:5}},e.children)))},exports.PopOverList=function(e){var r=e.children,a=i(e,m),o=t.useRef(null),u=n.useContext(E),c=u.isPopoverExpanded,s=u.listItemActiveIndex,l=u.updateInternalContext,d=u.dataLength;return p((function(){s<d-1&&l("listItemActiveIndex",s+1)}),!1,"arrowdown",[s,d]),p((function(){s>0&&l("listItemActiveIndex",s-1)}),!1,"arrowup",[s]),n.createElement(n.Fragment,null,c&&n.createElement("ul",Object.assign({ref:o,className:"rsh-search-list"},a),r))},exports.PopOverOption=function(e){var t=e.children,r=e.optionIndex,a=i(e,x),o=n.useContext(E),u=o.updateInternalContext;return n.createElement("li",Object.assign({onMouseEnter:function(){u("listItemActiveIndex",r)},className:"rsh-search-list-item "+(o.listItemActiveIndex===r&&"rsh-search-list-item__active")},a),t)},exports.PopOverOptionText=function(e){var t,r=e.className,a=e.value,o=e.as,u=i(e,g),c=null==a?void 0:a.split(/\(([^)]+)\)/);return o=null!=(t=o)?t:"h3",n.createElement(h,Object.assign({as:o,classNames:r+" rsh-search-list-item-text"},u),null==c?void 0:c.map((function(e,t){return"<"===e[0]?n.createElement("span",{key:t,dangerouslySetInnerHTML:{__html:e}}):n.createElement("span",{key:t},e)})))},exports.ReactSearchHighlightProvider=s,exports.SearchBar=function(e){var t,r,a,o,u=e.data,c=e.keysToSearch,s=e.inputAlgorithmTimeout,l=e.inputAlgorithm,d=void 0===l?"DEBOUNCE":l,p=e.matchingAlgorithm,f=i(e,w);return c=null!=(t=c)?t:Object.keys(null==u?void 0:u[0]),d=null!=(r=d)?r:"DEBOUNCE",s=null!=(a=s)?a:500,p=null!=(o=p)?o:"CHARACTER_MATCHING",n.createElement(b,Object.assign({keysToSearch:c,duration:s,inputAlgorithm:S[d],matchingAlgorithm:I[p],data:u},f))},exports.Wrapper=function(e){var t=e.children,r="function"==typeof t;return n.createElement(n.Fragment,null,r?n.createElement(s,null,n.createElement(y,{isFunction:r,children:t})):n.createElement(y,{isFunction:r,children:t}))},exports.context=u,exports.initialState=o,exports.useReactSearchHighlight=c;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("process");var e,t=require("react"),n=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;function r(){return(r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function i(e,t){if(null==e)return{};var n,r,i={},a=Object.keys(e);for(r=0;r<a.length;r++)t.indexOf(n=a[r])>=0||(i[n]=e[n]);return i}!function(e,t){void 0===t&&(t={});var n=t.insertAt;if("undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],i=document.createElement("style");i.type="text/css","top"===n&&r.firstChild?r.insertBefore(i,r.firstChild):r.appendChild(i),i.styleSheet?i.styleSheet.cssText=e:i.appendChild(document.createTextNode(e))}}(".rsh-input:focus{outline:none}.rsh-search-wrapper{position:relative}.rsh-input-box{background-color:#fff;border:1px solid transparent;border-radius:5px;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);min-width:200px}.rsh-input-box-logo{align-items:center;display:flex;height:100%;justify-content:center;margin:0;width:40px}.rsh-input{border:none;border-radius:inherit;font-size:15px;height:100%;margin:0;padding:0;width:100%}.rsh-search-list{background-color:#fff;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);box-sizing:border-box;max-height:500px;min-width:200px;overflow-x:scroll;overflow:scroll;padding:0 8px;position:absolute;top:40px;width:100%;z-index:12}.rsh-search-list-item{border-radius:13px;list-style:none;margin:10px 0;padding:3px 8px}.rsh-search-list-item__active{background-color:hsla(0,0%,47%,.05)}.rsh-search-list-item-text{margin:0}");var a=function(e,t){switch(t.type){case"SET_INPUT":return r({},e,{input:t.payload});case"SEARCH_DATA":return r({},e,{searchData:t.payload});case"START_LOADING":return r({},e,{isLoading:!0});case"END_LOADING":return r({},e,{isLoading:!1});case"RESET_STATE":return r({},s);default:return e}},o=function(e,t,n){return n.some((function(n){return e[n].toLowerCase().includes(t)}))},u=function(e,t,n){var i=r({},e);return n.forEach((function(n){return i[n]=e[n].replaceAll(t,(function(e){return"(<mark>"+e+"</mark>)"}))})),i},s={isLoading:!1,searchData:[],input:""},c=t.createContext(null),l=function(){return t.useContext(c)},d=function(e){var r=e.children,i=t.useReducer(a,s),o=i[0],u=i[1],l=function(){u({type:"START_LOADING"})},d=function(){u({type:"END_LOADING"})},p=function(){u({type:"RESET_STATE"})},f=0===o.searchData.length&&o.input.length>0,h=t.useMemo((function(){return{suggestions:o.searchData,isLoading:o.isLoading,input:o.input,dispatch:u,startLoading:l,endLoading:d,resetState:p,isResultsEmpty:f}}),[o]);return n.createElement(c.Provider,{value:h},r)},p=["as","children","classNames"],f=function(e){var n=e.as,a=e.children,o=e.classNames,u=i(e,p);return t.createElement(n,r({className:o},u),a)},h=function(e,n,r,i){void 0===r&&(r="k"),void 0===i&&(i=[]),t.useEffect((function(){var t=function(t){(!n||t.metaKey)&&t.key.toLowerCase()===r&&(null==e||e())};return document.addEventListener("keydown",t),function(){document.removeEventListener("keydown",t)}}),i)},m=["children"],x=["children","optionIndex"],g=["className","value","as"],E={isPopoverExpanded:!1,listItemActiveIndex:0,updateInternalContext:function(e,t){},dataLength:0},v=t.createContext(E),A=function(e){var i,a,o,u=e.children,s=e.isFunction,c=t.useState(E),d=c[0],p=c[1],f=l(),h=function(e,t){p((function(n){var i;return r({},n,((i={})[e]=t,i))}))},m=t.useRef(null),x=function(e){var n=t.useState(!1),r=n[0],i=n[1];return t.useEffect((function(){function t(t){e.current&&!e.current.contains(t.target)&&i(!1)}return document.addEventListener("mousedown",t),function(){document.removeEventListener("mousedown",t)}}),[e]),[r,i]}(m),g=x[0],A=x[1];return i=function(){h("isPopoverExpanded",g)},a=[g],o=t.useRef(!1),t.useEffect((function(){o.current?i():o.current=!0}),a),n.createElement(v.Provider,{value:r({},d,{updateInternalContext:h})},n.createElement("section",{ref:m,className:"rsh-search-wrapper",onFocusCapture:function(){return A(!0)}},s?u(f):u))},T=["as","children","className","onClick","onMouseDown","onFocusCapture"],y=function(e){var t=e.as,a=e.children,o=e.className,u=e.onClick,s=e.onFocusCapture,c=i(e,T);return n.createElement("div",{style:r({display:"flex",flexDirection:"HStack"===t?"row":"column",alignItems:"center"},c),className:o,onClick:u,onFocusCapture:s},a)},C=["keysToSearch","inputAlgorithm","matchingAlgorithm","data","value","onChange","initialValue","PrefixIcon"],S=function(e){var r=e.keysToSearch,a=e.inputAlgorithm,o=e.matchingAlgorithm,u=e.data,s=e.value,c=e.onChange,d=e.initialValue,p=e.PrefixIcon,f=i(e,C),m=t.useState(null!=d?d:""),x=m[0],g=m[1],E=l().dispatch,A=n.useContext(v),T=t.useRef(null),S=null!=s?s:x,N=a(S,500),I=o(r);t.useEffect((function(){u&&I(S,u),null==E||E({type:"SET_INPUT",payload:S})}),[N,u]),t.useEffect((function(){A&&A.updateInternalContext("dataLength",u.length)}),[u]);var _=function(){var e;return null==T||null==(e=T.current)?void 0:e.focus()};return h(_,!0),n.createElement(y,{as:"HStack",onClick:_,justifyContent:"center",className:"rsh-input-box",padding:0,height:40,cursor:"text"},n.createElement("figure",{className:"rsh-input-box-logo"},p?n.createElement(p,null):n.createElement("img",{src:'<?xml version="1.0" encoding="utf-8"?>\n\x3c!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  --\x3e\n<svg version="1.1" id="icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"\n\t width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve">\n<style type="text/css">\n\t.st0{fill:none;}\n</style>\n<title>search</title>\n<path d="M15,14.3L10.7,10c1.9-2.3,1.6-5.8-0.7-7.7S4.2,0.7,2.3,3S0.7,8.8,3,10.7c2,1.7,5,1.7,7,0l4.3,4.3L15,14.3z M2,6.5\n\tC2,4,4,2,6.5,2S11,4,11,6.5S9,11,6.5,11S2,9,2,6.5z"/>\n<rect id="_Transparent_Rectangle_" class="st0" width="16" height="16"/>\n</svg>',width:"18px"})),n.createElement("input",Object.assign({value:null!=s?s:x,onChange:null!=c?c:function(e){return g(e.target.value.toLowerCase())},placeholder:"search here",className:"rsh-input",autoFocus:!0,ref:T},f)))},N=["data","keysToSearch","inputAlgorithmTimeout","inputAlgorithm","matchingAlgorithm"],I={DEBOUNCE:function(e,n){var r=t.useState(e),i=r[0],a=r[1];return t.useEffect((function(){var t=setTimeout((function(){a(e)}),n);return function(){clearTimeout(t)}}),[e,n]),i},THROTTLE:function(e,n){void 0===n&&(n=200);var r=t.useState(e),i=r[0],a=r[1],o=t.useRef(),u=t.useRef(null),s=t.useRef(0),c=t.useRef(null);return t.useEffect((function(){o.current?(u.current=e,s.current=!0):(a(e),o.current=setTimeout((function e(){s.current?(s.current=!1,a(u.current),o.current=setTimeout(e,n)):o.current=void 0}),n))}),[e]),c.current=function(){o.current&&clearTimeout(o.current)},t.useEffect((function(){return function(){return c.current()}}),[]),i},DEFAULT:function(e){return e}},_={CHARACTER_MATCHING:function(e){var t=l().dispatch;return function(n,i){var a=n.toLowerCase().split("");if(0!==a.length){var s=new RegExp(a.join("|"),"gi");if(Array.isArray(i)&&Array.isArray(e)&&(!(i.length>0)||Object.keys(i[0]).some((function(t){return e.includes(t)})))){var c=null==i?void 0:i.filter((function(t){return a.every((function(n){return o(t,n,e)}))})).map((function(t){return r({},t,u(t,s,e))}));null==t||t({type:"SEARCH_DATA",payload:c})}}else null==t||t({type:"SEARCH_DATA",payload:[]})}},STRING_MATCHING:function(e){var t=l().dispatch;return function(n,i){if(0!==n.length){var a=new RegExp(n,"gi");if(Array.isArray(i)&&Array.isArray(e)&&(!(i.length>0)||Object.keys(i[0]).some((function(t){return e.includes(t)})))){var s=null==i?void 0:i.filter((function(t){return o(t,n,e)})).map((function(t){return r({},t,u(t,a,e))}));null==t||t({type:"SEARCH_DATA",payload:s})}}else null==t||t({type:"SEARCH_DATA",payload:[]})}}};exports.CHARACTER_MATCHING="CHARACTER_MATCHING",exports.DEBOUNCE="DEBOUNCE",exports.DEFAULT="DEFAULT",exports.END_LOADING="END_LOADING",exports.InternalContext=v,exports.Modal=function(e){var t=e.isOpen,r=e.onClose;return n.createElement(n.Fragment,null,(null==t||t)&&n.createElement("div",{onClick:null!=r?r:void 0,className:"rsh-modal-dialog",style:{backgroundColor:"rgba(220,220,220,0.5)",position:"fixed",top:0,right:0,bottom:0,left:0,zIndex:1e3}},n.createElement("div",{className:"rsh-modal-dialog-box-wrapper",style:{maxWidth:400,margin:"auto",padding:5}},e.children)))},exports.POPOVER_EXPANDED="POPOVER_EXPANDED",exports.PopOverList=function(e){var r=e.children,a=i(e,m),o=t.useRef(null),u=n.useContext(v),s=u.isPopoverExpanded,c=u.listItemActiveIndex,l=u.updateInternalContext,d=u.dataLength;return h((function(){c<d-1&&l("listItemActiveIndex",c+1)}),!1,"arrowdown",[c,d]),h((function(){c>0&&l("listItemActiveIndex",c-1)}),!1,"arrowup",[c]),n.createElement(n.Fragment,null,s&&n.createElement("ul",Object.assign({ref:o,className:"rsh-search-list"},a),r))},exports.PopOverOption=function(e){var t=e.children,r=e.optionIndex,a=i(e,x),o=n.useContext(v),u=o.updateInternalContext;return n.createElement("li",Object.assign({onMouseEnter:function(){u("listItemActiveIndex",r)},className:"rsh-search-list-item "+(o.listItemActiveIndex===r&&"rsh-search-list-item__active")},a),t)},exports.PopOverOptionText=function(e){var t,r=e.className,a=e.value,o=e.as,u=i(e,g),s=null==a?void 0:a.split(/\(([^)]+)\)/);return o=null!=(t=o)?t:"h3",n.createElement(f,Object.assign({as:o,classNames:r+" rsh-search-list-item-text"},u),null==s?void 0:s.map((function(e,t){return"<"===e[0]?n.createElement("span",{key:t,dangerouslySetInnerHTML:{__html:e}}):n.createElement("span",{key:t},e)})))},exports.RESET_STATE="RESET_STATE",exports.ReactSearchHighlightProvider=d,exports.SEARCH_DATA="SEARCH_DATA",exports.SET_INPUT="SET_INPUT",exports.START_LOADING="START_LOADING",exports.STRING_MATCHING="STRING_MATCHING",exports.SearchBar=function(e){var t,r,a,o,u=e.data,s=e.keysToSearch,c=e.inputAlgorithmTimeout,l=e.inputAlgorithm,d=void 0===l?"DEBOUNCE":l,p=e.matchingAlgorithm,f=i(e,N);return s=null!=(t=s)?t:Object.keys(null==u?void 0:u[0]),d=null!=(r=d)?r:"DEBOUNCE",c=null!=(a=c)?a:500,p=null!=(o=p)?o:"CHARACTER_MATCHING",n.createElement(S,Object.assign({keysToSearch:s,duration:c,inputAlgorithm:I[d],matchingAlgorithm:_[p],data:u},f))},exports.THROTTLE="THROTTLE",exports.Wrapper=function(e){var t=e.children,r="function"==typeof t;return n.createElement(n.Fragment,null,r?n.createElement(d,null,n.createElement(A,{isFunction:r,children:t})):n.createElement(A,{isFunction:r,children:t}))},exports.__DEV__=!1,exports.context=c,exports.initialState=s,exports.useReactSearchHighlight=l;
 //# sourceMappingURL=react-search-highlight.cjs.production.min.js.map

dist/react-search-highlight.esm.js

@@ -1,3 +0,3 @@
-import React, { createContext, useContext, useReducer, useMemo, useState, useEffect, useRef, createElement } from 'react';
 import process from 'process';
+import React, { createContext, useContext, useReducer, useMemo, createElement, useState, useEffect, useRef } from 'react';
 
@@ -34,2 +34,15 @@ function styleInject(css, ref) {
 
+var SET_INPUT = 'SET_INPUT';
+var START_LOADING = 'START_LOADING';
+var END_LOADING = 'END_LOADING';
+var SEARCH_DATA = 'SEARCH_DATA';
+var DEBOUNCE = 'DEBOUNCE';
+var THROTTLE = 'THROTTLE';
+var RESET_STATE = 'RESET_STATE';
+var STRING_MATCHING = 'STRING_MATCHING';
+var CHARACTER_MATCHING = 'CHARACTER_MATCHING';
+var DEFAULT = 'DEFAULT';
+var POPOVER_EXPANDED = 'POPOVER_EXPANDED';
+var __DEV__ = !process.env.NODE_ENV || process.env.NODE_ENV === 'development';
+
 function _extends() {
@@ -67,11 +80,2 @@ _extends = Object.assign ? Object.assign.bind() : function (target) {
 
-var SET_INPUT = 'SET_INPUT';
-var START_LOADING = 'START_LOADING';
-var END_LOADING = 'END_LOADING';
-var SEARCH_DATA = 'SEARCH_DATA';
-var DEBOUNCE = 'DEBOUNCE';
-var RESET_STATE = 'RESET_STATE';
-var CHARACTER_MATCHING = 'CHARACTER_MATCHING';
-var __DEV__ = !process.env.NODE_ENV || process.env.NODE_ENV === 'development';
-
 var reducer = function reducer(state, action) {
@@ -107,5 +111,24 @@ switch (action.type) {
 
+var isMatch = function isMatch(obj, _char, keys) {
+  return keys.some(function (match) {
+    return obj[match].toLowerCase().includes(_char);
+  });
+};
+var replaceAll = function replaceAll(obj, regex, keys) {
+  var newObj = _extends({}, obj);
+
+  keys.forEach(function (key) {
+    return newObj[key] = obj[key].replaceAll(regex, function (match) {
+      return "(<mark>" + match + "</mark>)";
+    });
+  });
+  return newObj;
+};
+var isResultsNotFound = function isResultsNotFound(searchData, searchInput) {
+  return searchData.length === 0 && searchInput.length > 0;
+};
+
 var initialState = {
   isLoading: false,
-  searchData: undefined,
+  searchData: [],
   input: ''
@@ -146,9 +169,13 @@ };
 
+  var isResultsEmpty = isResultsNotFound(state.searchData, state.input);
   var value = useMemo(function () {
     return {
-      state: state,
+      suggestions: state.searchData,
+      isLoading: state.isLoading,
+      input: state.input,
       dispatch: dispatch,
       startLoading: startLoading,
       endLoading: endLoading,
-      resetState: resetState
+      resetState: resetState,
+      isResultsEmpty: isResultsEmpty
     };
@@ -161,16 +188,13 @@ }, [state]);
 
-var isMatch = function isMatch(obj, _char, keys) {
-  return keys.some(function (match) {
-    return obj[match].toLowerCase().includes(_char);
-  });
-};
-var replaceAll = function replaceAll(obj, regex, keys) {
-  var newObj = _extends({}, obj);
+var _excluded = ["as", "children", "classNames"];
 
-  keys.forEach(function (key) {
-    return newObj[key] = obj[key].replaceAll(regex, function (match) {
-      return "(<mark>" + match + "</mark>)";
-    });
-  });
-  return newObj;
+var Text = function Text(_ref) {
+  var as = _ref.as,
+      children = _ref.children,
+      classNames = _ref.classNames,
+      any = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return createElement(as, _extends({
+    className: classNames
+  }, any), children);
 };
@@ -412,15 +436,2 @@
 
-var _excluded = ["as", "children", "classNames"];
-
-var Text = function Text(_ref) {
-  var as = _ref.as,
-      children = _ref.children,
-      classNames = _ref.classNames,
-      any = _objectWithoutPropertiesLoose(_ref, _excluded);
-
-  return createElement(as, _extends({
-    className: classNames
-  }, any), children);
-};
-
 var _excluded$1 = ["children"],
@@ -731,3 +742,3 @@ _excluded2 = ["children", "optionIndex"],
 
-export { InternalContext, Modal, PopOverList, PopOverOption, PopOverOptionText, ReactSearchHighlightProvider, SearchBar, Wrapper, context, initialState, useReactSearchHighlight };
+export { CHARACTER_MATCHING, DEBOUNCE, DEFAULT, END_LOADING, InternalContext, Modal, POPOVER_EXPANDED, PopOverList, PopOverOption, PopOverOptionText, RESET_STATE, ReactSearchHighlightProvider, SEARCH_DATA, SET_INPUT, START_LOADING, STRING_MATCHING, SearchBar, THROTTLE, Wrapper, __DEV__, context, initialState, useReactSearchHighlight };
 //# sourceMappingURL=react-search-highlight.esm.js.map

dist/types.d.ts

@@ -9,10 +9,14 @@ import { Dispatch } from 'react';
     isLoading: boolean;
-    searchData: any[] | undefined;
+    searchData: any[];
     input: string;
 }
 export declare type ContextType = {
-    state: State;
+    suggestions: any[];
+    isLoading: boolean;
+    input: string;
     dispatch: Dispatch<Action> | undefined;
     startLoading: VoidFunction;
     endLoading: VoidFunction;
+    isResultsEmpty: boolean;
+    resetState: VoidFunction;
 };

dist/utils.d.ts

 export declare const isMatch: (obj: any, char: any, keys: string[]) => boolean;
 export declare const replaceAll: (obj: any, regex: RegExp, keys: string[]) => any;
+export declare const isResultsNotFound: (searchData: any[], searchInput: string) => boolean;

package.json

 {
-  "version": "0.1.2",
+  "version": "0.1.3",
   "license": "MIT",
@@ -4,0 +4,0 @@ "main": "dist/index.js",

src/const.ts

@@ -16,13 +16,2 @@ import process from "process";
 
-export const TEST_DATA =  [
-    {
-      heading: 'Rhan is good',
-      title: 'I am eeatomg food'
-    },
-    {
-      heading: 'AI is th futur',
-      title: 'I lov ai and machin'
-    }
-  ];
-
 export const __DEV__: boolean = !process.env.NODE_ENV || process.env.NODE_ENV === 'development';

src/types.ts

@@ -16,3 +16,3 @@ import { Dispatch } from 'react';
   isLoading: boolean;
-  searchData: any[] | undefined;
+  searchData: any[];
   input: string;
@@ -22,6 +22,10 @@ }
 export type ContextType = {
-  state: State;
+  suggestions: any[];
+  isLoading: boolean;
+  input: string;
   dispatch: Dispatch<Action> | undefined;
   startLoading: VoidFunction;
   endLoading: VoidFunction;
+  isResultsEmpty: boolean
+  resetState: VoidFunction
 };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

217225

increased by2.07%

Lines of code

2287

increased by2.01%

No dependency changes