React, React Native and Vue UI components for building data-driven apps with Elasticsearch

Overview

reactivesearch
Reactive Search

UI components library for Elasticsearch: Available for React, Vue and React Native

Read how to build an e-commerce search UI

a.) with React, b.) with Vue or c.) with React Native.


web vue native


Gitter npm PRs Welcome Mentioned in Awesome React Mentioned in Awesome Elasticsearch


Check out the ReactiveSearch marketplace at reactiveapps.io.


Banner Image showing all the web UI components we offer

Web designer templates for sketch.

Banner Image showing all the mobile UI components we offer

iOS and Android designer templates for sketch.


TOC

  1. ReactiveSearch: Intro
  2. Features
  3. Component Playground
  4. Live Examples
  5. Comparison with Other Projects
  6. Installation
  7. Docs Manual
  8. Contributing
  9. Other Projects You Might Like

1. ReactiveSearch: Intro

ReactiveSearch is an Elasticsearch UI components library for React and React Native. It has 25+ components consisting of Lists, Ranges, Search UIs, Result displays and a way to bring any existing UI component into the library.

The library is conceptually divided into two parts:

  1. Sensor components and
  2. Actuator components.

Each sensor component is built for applying a specific filter on the data. For example:

  • A SingleList sensor component applies an exact match filter based on the selected item.
  • A RangeSlider component applies a numeric range query based on the values selected from the UI.
  • A DataSearch component applies a suggestions and search query based on the search term typed by the user.

Sensor components can be configured to create a combined query context and render the matching results via an actuator component.

ReactiveSearch primarily comes with two actuators: ResultCard and ResultList. ResultCard displays the results in a card interface whereas ResultList displays them in a list. Both provide built-in support for pagination and infinite scroll views. Besides these, the library also provides low level actuators (ReactiveComponent and ReactiveList) to render in a more customized fashion.


2. Features

Design

  • The sensor / actuator design pattern allows creating complex UIs where any number of sensors can be chained together to reactively update an actuator (or even multiple actuators).
  • The library handles the transformation of the UI interactions into database queries. You only need to include the components and associate each with a DB field.
  • Built in live updates - Actuators can be set to update results even when the underlying data changes in the DB.
  • Comes with scoped and styled components. Doesn't require any external CSS library import, comes with className and innerClass support.
  • Is themable via ThemeProvider.

Ease of Use

🆕 ReactiveSearch API: Secure your ElasticSearch Queries

Based on a popular request, we have implemented support for a declarative API based on ReactiveSearch. The API is called ReactiveSearch API. It moves the query DSL generation logic to a backend system (an appbase.io service) instead of exposing it directly on the client-side. By strictly enabling only ReactiveSearch API use, you can also prevent script injections.

The main advantages of using it over the ElasticSearch Query DSL are:

  • Query generation happens on the server-side - addressing the primary security concern around query injection.
  • Easy recording of analytics events for search and clicks. Read more
  • Application of query rules and functions for search queries. Read more

Using ReactiveSearch API instead of ElasticSearch's query DSL is an opt-in feature. You need to set the enableAppbase prop as true in your ReactiveBase component. This assumes that you are using appbase.io for your backend.

We recommend checking out this KitchenSink App that demonstrates the use of the ReactiveSearch API for all the ReactiveSearch components.

⬆ Back to Top


3. Component Playground

Try the live component playground at playground. Look out for the knobs section in the playground part of the stories to tweak each prop and see the effects.


4. Live Demos

A set of live demos inspired by real world apps, built with ReactiveSearch.

Web

You can check all of them on the examples section of website.

Mobile

  • Booksearch on Play Store: A booksearch app showing a searchable collection of over 10k books built with ReactiveSearch. Also available as a snack.
  • Gitxplore on Play Store: A Github repository explorer app to search over the 25k+ most popular github repos.
  • ReactiveTodos on App Store: A shared collaborative to-do list app to showcase the capability of Reactivesearch.

⬆ Back to Top


5. Comparison with Other Projects

Here, we share how ReactiveSearch compares with other projects that have similar aims.

# ReactiveSearch SearchKit InstantSearch
Backend Any Elasticsearch index hosted on any Elasticsearch cluster. Any Elasticsearch index hosted on any Elasticsearch cluster. Custom-built for Algolia, a proprietary search engine.
Development Actively developed and maintained. Active issue responses, some development and maintenance. Actively developed and maintained.
Onboarding Experience Starter apps, Live interactive tutorial, getting started guide, component playground, every component has a live working demo with codesandbox. Getting started tutorial, no live component demos, sparse reference spec for many components. Starter apps, getting started guide, component playground.
Styling Support Styled and scoped components. No external CSS import required. Rich theming supported as React props. CSS based styles with BEM, not scoped to components. Theming supported with SCSS. CSS based styles, requires external style import. Theming supported by manipulating CSS.
Types of Components Lists, Ranges, Search, Dates, Maps, Result Displays. Can use your own UI components. Lists, Ranges, Search*, Result*. Can't use your own UI components. (Only one component for Search and Result, resulting in more code to be written for customizability) Lists, Range, Search, Result. Can use your own UI components.
Supported Distribution Platforms React, Vue for Web, React Native for mobile. React for Web. React, Vue, Angular, vanilla JS for Web, React Native for mobile but latter has no UI components.

We welcome contributions to this section. If you are building a project or you know of another project that is in the similar space, let us know and we will update the comparisons.

⬆ Back to Top


6. Installation

Installing ReactiveSearch is just one command.

  • If you're using reactivesearch for web
npm install @appbaseio/reactivesearch

You can check out the quickstart guide with React here.

  • If you're using reactivesearch for mobile (native)
npm install @appbaseio/reactivesearch-native

You can check out the quickstart guide with React Native here.


7. Docs Manual

The official docs for the Web library are at docs.appbase.io/docs/reactivesearch/v3.

The components are divided into four sections:

Docs for React Native version of the library are available at docs.appbase.io/docs/reactivesearch/native.

⬆ Back to Top


8. Contributing

Please check the contribution guide.


9. Other Projects You Might Like

  • arc API Gateway for ElasticSearch (Out of the box Security, Rate Limit Features, Record Analytics and Request Logs).

  • searchbox A lightweight and performance focused searchbox UI libraries to query and display results from your ElasticSearch app (aka index).

    • Vanilla - (~16kB Minified + Gzipped)
    • React - (~30kB Minified + Gzipped)
    • Vue - (~22kB Minified + Gzipped)
  • dejavu allows viewing raw data within an appbase.io (or Elasticsearch) app. Soon to be released feature: An ability to import custom data from CSV and JSON files, along with a guided walkthrough on applying data mappings.

  • mirage ReactiveSearch components can be extended using custom Elasticsearch queries. For those new to Elasticsearch, Mirage provides an intuitive GUI for composing queries.

  • ReactiveMaps is a similar project to Reactive Search that allows building realtime maps easily.

  • appbase-js While building search UIs is dandy with Reactive Search, you might also need to add some input forms. appbase-js comes in handy there.

⬆ Back to Top

Comments
  • Support for Signed Requests / AWS Elasticsearch

    Support for Signed Requests / AWS Elasticsearch

    For services like AWS Elasticsearch, all requests needed to be signed and the signature added to the headers (at least for some configurations in AWS).

    Is there any way to specify custom headers on a per request base? While I still have a proxy for my requests, I am depending on AWS to verify security, which works fine if I can sign the request.

    Thanks

    opened by csepulv 29
  • Add SSR support for reactivesearch

    Add SSR support for reactivesearch

    Issue Type:

    Reactive Base component have server side rendering issues, it tries to uses the window which will not be available on the server. Description:

    I have been giving it a try and found that the Reactive Base component does have a server side rendering issues, it tries to uses the window which will not be available on the server. Not sure if other components have similar issues, but it would be great if all of the components have SSR support. I got it working by rendering it only on the client side but that's a bad practice and is not recommended.

    Screenshots:

    Minimal reproduction of the problem with instructions:

    Reactivesearch version: 2.2.0

    Browser: [all | Chrome XX | Firefox XX | Edge XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

    Anything else:

    bug enhancement 
    opened by mrtinkz 24
  • Load data on initial load

    Load data on initial load

    I have implemented the same code which you have given in Snack, but in my app it is showing blank screen with search bar

    Using on React Native

    I want to load some data on the screen when I load it for the first time, before user start searching for the tutors. screenshot at oct 06 16-08-21 screenshot at oct 06 16-09-00

    Dependancies: "dependencies": { "@appbaseio/reactivesearch-native": "^0.9.0", "@expo/videoplayer": "^0.4.0", "axios": "^0.18.0", "dateformat": "^3.0.3", "expo": "^30.0.0", "firebase": "^5.5.1-0", "native-base": "^2.8.0", "prop-types": "^15.6.2", "react": "^16.3.1", "react-bootstrap-sweetalert": "^4.4.1", "react-data-fetching": "^0.2.3", "react-dom": "^16.5.2", "react-native": "https://github.com/expo/react-native/archive/sdk-30.0.0.tar.gz", "react-native-animatable": "^1.3.0", "react-native-atoz-listview": "0.0.7", "react-native-awesome-alerts": "^1.1.1", "react-native-calendars": "^1.20.0", "react-native-keyboard-aware-scroll-view": "^0.7.2", "react-native-modal": "^6.5.0", "react-native-modal-datetime-picker": "^6.0.0", "react-native-read-more-text": "^1.1.0", "react-native-render-html": "^3.10.0", "react-native-search-box": "0.0.19", "react-native-search-filter": "^0.1.4", "react-native-star-rating": "^1.1.0", "react-native-sweet-alert": "^1.1.0", "react-native-view-more-text": "^2.0.1", "react-navigation": "2.0.1", "sweetalert-react": "^0.4.11", "video-react": "^0.13.0"

    bug native :iphone: good first issue :wave: 
    opened by vishalnathani17 20
  • DynamicRangeSlider is not working properly.

    DynamicRangeSlider is not working properly.

    In DynamicRangeSlider "RangeLabel" props is working, but I want to it shows me only 2 or 3 decimal digits. It Shows me all the decimal digit after decimal point that's why I can not show the $ sign in my Label. And also issue in RangeSelection my product's maximum range is 39.45 but the slider is set 39 that's why I can not show the my last product. And another thing in DynamicRangeSlider is if my product range is 0-10 $ then slider is set to 0-9 $ and I can not show my products which price is grater than 9 $ and less than 10 $.

    enhancement 
    opened by ashwini987 20
  • FeatureRequest: The ability to have multiple sorts per sortOption

    FeatureRequest: The ability to have multiple sorts per sortOption

    Issue Type: Enhancement

    Description: My apologies if this already exists in some way; if it does I could not find it.

    I'm looking for a way to have more advanced sort options. Specifically, the ability for a sortOption to support multiple sorts, executed in the order declared.

    For example, suppose we wanted two search options, Best Match which sorts by the relevance score, and Rating which sorts by the rating field and secondarily sorts by the relevance score.

    Here's a crude mockup:

    <ResultCard
        react={{
            "and": ["PriceFilter", "SearchFilter"]
        }}
        onData={this.onData}
        sortOptions={[
            {
                label: "Best Match",
                dataField: "_score",
                sortBy: "desc"
            },
            {
                label: "Rating",
                and: {[
                    {
                        dataField: "rating",
                        sortBy: "desc"
                    },
                    {
                        dataField: "_score",
                        sortBy: "desc"
                    }
                ]}
        }]
    />
    

    This feature request applies to all the result components: ResultList, ResultCard, and ReactiveList.

    ElasticSearch sort docs

    wontfix 
    opened by davidklebanoff 19
  • Autocomplete dropdown shows inconsistent results in `DataSearch` component

    Autocomplete dropdown shows inconsistent results in `DataSearch` component

    Affected Projects React Web

    Library Version: 3.0.0-alpha.3

    Describe the bug I use customQuery in a DataSearch component. When I type a query in the search box I see 2 issues,

    1. The query generated by autocomplete (the one that shows instance results as a drop down list form the search box) is the stock query that is fired as if there was no customQuery being specified. This results in a disparity in results shown in the connected ReactiveList because I want cross_fields while searching, which is not present in stock query for data search component.
    2. Even though there are results for a query in the autocomplete they are not being rendered. I found this out when I was wanted to customize what info was shown in the autocomplete using parseSuggestion. Here I printed the suggestion on console & I also monitor the query & response from server. I do not see the results as I would expect. Note that this does not happen all the time.

    To Reproduce Steps to reproduce the behavior:

    1. Basically specify a customQuery on DataSearch & see the query fired when you are typing in the search box versus when you finally hit the enter which then renders the ReactiveList
    2. Again you need to monitor the parseSuggestions method & see what suggestions are being printed on the consiole versus what are actually shown in the autocomplete section.

    Expected behavior

    1. Use the same query as customQuery specified
    2. Render all the suggestions/results form the query.

    Screenshots

    Desktop (please complete the following information):

    • OS: MacOS
    • Browser: Brave/Chrome

    Additional context

    My DataSearch component invocation,

    <DataSearch
      componentId="nameReactor"
      placeholder="Search for Name, Address, Phone, Email"
      dataField={['full_name', 'address', 'primary_email', 'primary_cell_phone']}
      fieldWeights={[10, 8, 6, 4]}
      searchInputId="universal-search"
      filterLabel="Search"
      iconPosition="right"
      autosuggest={true}
      fuzziness="AUTO"
      showClear={true}
      customQuery={
        function(value, props) {
          if (!value || !props) {
            return;
          }
    
          let fields = [];
          let currentDataField = props.dataField || [];
          let currentFieldWeights = props.fieldWeights || [];
          currentDataField.forEach(function(currentField, index) {
            let currentFieldWeight = currentField;
            if (index < currentFieldWeights.length) {
              currentFieldWeight += "^" + currentFieldWeights[index];
            }
            fields.push(currentFieldWeight);
          });
    
          const multiMatchTypes = ["best_fields", "cross_fields", "phrase_prefix"];
          const fuzzinessCapableTypes = ["best_fields"];
    
          let multiMatchDefinitions = [];
          multiMatchTypes.forEach(function(currentMultiMatchType) {
    
          let currentDefinition = {
                "query": value,
                "fields": fields,
                "type": currentMultiMatchType,
                "operator": "or"
          };
    
          if (props.fuzziness) {
    
            if (fuzzinessCapableTypes.includes(currentMultiMatchType)) {
                currentDefinition["fuzziness"] = props.fuzziness;
            }
          }
    
          multiMatchDefinitions.push({
                      "multi_match": currentDefinition
                    })});
    
          return {
            "query": {
              "bool": {
                  "should": multiMatchDefinitions,
                  "minimum_should_match": "1"
              }          
            }
          }
        }
      }
    parseSuggestion={
      function(suggestion) {
    
        if (!suggestion || suggestion === undefined) {
          return;
        }
    
        console.log("suggestion:", suggestion)
    
        return {
          label: (
              <div>
                  {suggestion.source.first_name} {suggestion.source.middle_name} {suggestion.source.last_name}
                   &nbsp;| {suggestion.source.address_line_1}
                  <span style={{ color: 'dodgerblue', marginLeft: 5 }}>
                      {suggestion.source.zone}
                  </span>
              </div>
          ),
          value: suggestion.value,
          source: suggestion.source  // for onValueSelected to work with parseSuggestion
        }
      }
    }
    renderError={error => (
        <div>
          Something went wrong with DataSearch
          <br />
          Error details
          <br />
          {error}
        </div>
      )}
      renderNoSuggestion={() => (
              <div>
                  No suggestions found
              </div>
          )
      }
    />
    

    I also keep on seeing the below error when I load the page,

    index.js:1375 Warning: Failed prop type: Invalid prop `show` of type `boolean` supplied to `PoweredBy`, expected `number`.
        in PoweredBy (created by ReactiveList)
        in ReactiveList
        in Unknown (created by Context.Consumer)
        in Connect(Component) (created by ForwardRef)
        in ForwardRef (at App.js:348)
        in div (at App.js:346)
        in div (at App.js:227)
        in div
        in Unknown (created by Styled(Component))
        in Styled(Component) (created by URLParamsProvider)
        in URLParamsProvider
        in Unknown (created by Context.Consumer)
        in Connect(Component) (created by ForwardRef)
        in ForwardRef (created by ReactiveBase)
        in Provider (created by ReactiveBase)
        in ThemeProvider (created by ReactiveBase)
        in ReactiveBase (at App.js:78)
        in div (at App.js:77)
        in App (at src/index.js:7)
    
    opened by tankchintan 18
  • Cannot read property '0' of undefined Error with a transformed URL Query

    Cannot read property '0' of undefined Error with a transformed URL Query

    Affected Projects React

    Library Version: 3.4.3

    Describe the bug If you want to change _msearch to _search as seen in the documentation (https://docs.appbase.io/docs/reactivesearch/v3/overview/reactivebase/#props in transformRequest) it has an Problem with the Structure of the Body, because of the {"preference":"queryResult"}. If you remove that part from the Body it throws the following error TypeError: Cannot read property '0' of undefined at query.js:1 at Array.forEach () at handleResponse (query.js:1) at query.js:1

    To Reproduce You can Reproduce the Error in the Following Sandbox in App.js Line 40: https://codesandbox.io/s/gitxplore-app-qmjdn

    Expected behavior In My Expactation i Should atleast become an Answer from the Server, which i would log with the help of the transformResponse function, but before the Request is send or at the moment the Result is incoming the Error happens.

    bug 
    opened by PascalStehling 17
  • Custom sorting component with ReactiveList

    Custom sorting component with ReactiveList

    Issue Type: Question

    Platform: Web

    Description: I am currently trying to build complex sorting component and since there is not enough documentation on it I have to ask here. I will split the question in two parts.

    1. Using the default sortOptions of the ReactiveList result component, there is a problem with result relevance. To be more precise, if I set default value to the sort and then try typing something in the search component, the results will still be sorted by default sort value instead by relevance. Is there a way to avoid this with the default sortOptions provided by Reactive Search? So to have ie. SingleDropdownList component to change the current sorting of the elements in the ReactiveList?

    2. I tried to create and put CustomSort inside ReactiveComponent. The code for it is

    <ReactiveComponent
      key="componentSort"
      componentId="ComponentSort"
    >
      <CustomSort sortData={sortOptions} />
    </ReactiveComponent>
    

    CustomSort component has setQuery which gets triggered on button click (there are multiple sortOptions).

    setValue(value) {
      this.props.setQuery({
        "query": {
          "match_all": {}
        },
        "sort": {
          value: {"order": "desc"}
        }
      });
    }
    

    Query is completely the same as the one being sent by default sortOptions (when checked in dev tools). However query does not update Reactive List component (ReactiveList has custom sort component in react). Should I have defaultQuery even if I do not want to set default sort? Is this the proper way to set up the custom sort?

    Great project btw. Much more customizations available compared to SearchKit.

    Screenshots: N/A

    Reactivesearch version: 2.6.12

    Browser: All

    wontfix 
    opened by NemanjaTck 17
  • Cursor jumps to end of input when inputValue is changed when using DataSearch

    Cursor jumps to end of input when inputValue is changed when using DataSearch

    Hi , I am using Datasearch Component . Whenever I try to modify the search value (lets say change the middle character) , the cursor position is going to the end of the input . I guess its rerendering every time .

    Pls suggest a fix .

    I tried the demo sandbox example for datasearch and I face the same issue there .

    <DataSearch componentId="searchbox" dataField={["title"]} fieldWeights={[3]} placeholder="Search" autosuggest={false} highlight={true} />

    bug web :spider_web: 
    opened by Arvind6353 17
  • enable pagination during SSR

    enable pagination during SSR

    Issue Type: enhancement

    Platform: Web

    Description:

    For me, the main idea behind SSR is to make web app crawlable (including dummy crawlers, which do not execute javascript).

    So, for testing purposes I fired your demo packages/web/examples/ssr, disabled javascript in the browser and navigated to localhost:3000.

    First page renders just fine, but pagination buttons do not function at all until I enable js back. It would be nice, if pagination buttons work without js and with URLParams enabled in ResultCard

    Reactivesearch version: dev branch

    Browser: all

    opened by aol-nnov 15
  • Add onFilterCleared prop to SelectedFilters

    Add onFilterCleared prop to SelectedFilters

    Issue Type: Enhancement

    Platform: Web

    Description: Add a new prop onFilterCleared to SelectedFilters that will be invoked with the value of the selected filter being cleared or it will indicate that all filters have been cleared.

    Reactivesearch version: 2.6.2

    enhancement native :iphone: good first issue :wave: web :spider_web: 
    opened by calebdel 15
  • fix(web-native): change xdate to dayjs

    fix(web-native): change xdate to dayjs

    Closes #2127

    • Fixes a security vulnerability by replacing xdate with dayjs
    • Affects web and native

    Reactivecore PR

    📔 Notion

    Test Scenarios


    Web

    • [x] Test with DatePicker component [Loom preview](https://www.loom.com/share/bac7429f300d4c98a6a4d652c811b551)
    • [x] Test with DateRange component [Loom preview](https://www.loom.com/share/bac7429f300d4c98a6a4d652c811b551)
    • [x] Test with RangeInput (Test with/without queryFormat) [(Loom preview)](https://www.loom.com/share/4729b4e215064680abed33e44df99380)
    • [x] Test with RangeSlider (Test with/without queryFormat) ([Loom preview](https://www.loom.com/share/f131b36d106441a3bd376c4431365172))
    • [x] SavedSearch example ([Loom preview](https://www.loom.com/share/a80618631ec74da8b0245c62fd7420a2))

    Native:

    • [x] DatePicker and DateRange [Loom preview](https://www.loom.com/share/09ce0967494b4d3385bdd9059a19afa1)
    opened by SavvyShah 0
  • feat(web): add setPage prop in render props

    feat(web): add setPage prop in render props

    PR Type feat

    Description The PR adds the setPage method in the render prop of the ReactiveList component to allow custom pagination. Addresses https://github.com/appbaseio/reactivesearch/issues/2121.

    https://github.com/appbaseio/Docs/pull/364

    web 
    opened by mohdashraf010897 0
  • Hydration error after reloading search results or link to page with urlparams

    Hydration error after reloading search results or link to page with urlparams

    Affected Projects React "^18.2.0" / Next "^13.0.6"

    Library Version: x.y.z "^3.43.6"

    Describe the bug Refreshing search results gives hydration error. Following a link to results with urlparams also leads to hydration error. DataSearch and ToggleButton filters all have urlparams set to true.

    To Reproduce Refresh search result page or follow a link to results (e.g.: "http://localhost:3000/search?searchbox="testing")

    Expected behavior

    The results page shows as normal without error, following the urlparams

    Screenshots

    Desktop (please complete the following information):

    • OS: [e.g. iOS]
    • Browser [e.g. chrome, safari]
    • Version [e.g. 22]

    Smartphone (please complete the following information):

    • Device: [e.g. iPhone6]
    • OS: [e.g. iOS8.1]
    • Browser [e.g. stock browser, safari]
    • Version [e.g. 22]

    Additional context

    bug 
    opened by scottroot 1
  • build(deps): bump qs from 6.7.0 to 6.11.0 in /packages/native/example

    build(deps): bump qs from 6.7.0 to 6.11.0 in /packages/native/example

    Bumps qs from 6.7.0 to 6.11.0.

    Changelog

    Sourced from qs's changelog.

    6.11.0

    • [New] [Fix] stringify: revert 0e903c0; add commaRoundTrip option (#442)
    • [readme] fix version badge

    6.10.5

    • [Fix] stringify: with arrayFormat: comma, properly include an explicit [] on a single-item array (#434)

    6.10.4

    • [Fix] stringify: with arrayFormat: comma, include an explicit [] on a single-item array (#441)
    • [meta] use npmignore to autogenerate an npmignore file
    • [Dev Deps] update eslint, @ljharb/eslint-config, aud, has-symbol, object-inspect, tape

    6.10.3

    • [Fix] parse: ignore __proto__ keys (#428)
    • [Robustness] stringify: avoid relying on a global undefined (#427)
    • [actions] reuse common workflows
    • [Dev Deps] update eslint, @ljharb/eslint-config, object-inspect, tape

    6.10.2

    • [Fix] stringify: actually fix cyclic references (#426)
    • [Fix] stringify: avoid encoding arrayformat comma when encodeValuesOnly = true (#424)
    • [readme] remove travis badge; add github actions/codecov badges; update URLs
    • [Docs] add note and links for coercing primitive values (#408)
    • [actions] update codecov uploader
    • [actions] update workflows
    • [Tests] clean up stringify tests slightly
    • [Dev Deps] update eslint, @ljharb/eslint-config, aud, object-inspect, safe-publish-latest, tape

    6.10.1

    • [Fix] stringify: avoid exception on repeated object values (#402)

    6.10.0

    • [New] stringify: throw on cycles, instead of an infinite loop (#395, #394, #393)
    • [New] parse: add allowSparse option for collapsing arrays with missing indices (#312)
    • [meta] fix README.md (#399)
    • [meta] only run npm run dist in publish, not install
    • [Dev Deps] update eslint, @ljharb/eslint-config, aud, has-symbols, tape
    • [Tests] fix tests on node v0.6
    • [Tests] use ljharb/actions/node/install instead of ljharb/actions/node/run
    • [Tests] Revert "[meta] ignore eclint transitive audit warning"

    6.9.7

    • [Fix] parse: ignore __proto__ keys (#428)
    • [Fix] stringify: avoid encoding arrayformat comma when encodeValuesOnly = true (#424)
    • [Robustness] stringify: avoid relying on a global undefined (#427)
    • [readme] remove travis badge; add github actions/codecov badges; update URLs
    • [Docs] add note and links for coercing primitive values (#408)
    • [Tests] clean up stringify tests slightly
    • [meta] fix README.md (#399)
    • Revert "[meta] ignore eclint transitive audit warning"

    ... (truncated)

    Commits
    • 56763c1 v6.11.0
    • ddd3e29 [readme] fix version badge
    • c313472 [New] [Fix] stringify: revert 0e903c0; add commaRoundTrip option
    • 95bc018 v6.10.5
    • 0e903c0 [Fix] stringify: with arrayFormat: comma, properly include an explicit `[...
    • ba9703c v6.10.4
    • 4e44019 [Fix] stringify: with arrayFormat: comma, include an explicit [] on a s...
    • 113b990 [Dev Deps] update object-inspect
    • c77f38f [Dev Deps] update eslint, @ljharb/eslint-config, aud, has-symbol, tape
    • 2cf45b2 [meta] use npmignore to autogenerate an npmignore file
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies native 
    opened by dependabot[bot] 0
Releases(v1.33.5-vue)
  • v1.33.5-vue(Dec 26, 2022)

    Bug Fixes

    • DataSearch: Add support for strictSelection prop to disable the search on enter @mohdashraf010897 https://github.com/appbaseio/reactivesearch/pull/2149
    • Fix tree-shaking for components when installed locally @mohdashraf010897 https://github.com/appbaseio/reactivesearch/pull/2147
    Source code(tar.gz)
    Source code(zip)
  • v1.33.4-vue(Dec 16, 2022)

    Bug Fixes

    • Remove component from component tree on destroy @bietkul https://github.com/appbaseio/reactivesearch/commit/fb18f0d61649b43de47cc7696b17a32cd2e6d009 https://github.com/appbaseio/reactivecore/commit/20106a1cb3e0c1caedecb83c395af535fd8e3bea
    Source code(tar.gz)
    Source code(zip)
  • v3.43.6(Dec 2, 2022)

  • v3.43.5(Nov 30, 2022)

    Features

    • Use analytics-js library and provide easy access to analytics methods using useAnalytics method @SavvyShah (#2123)

    Bug Fixes

    • TreeList UI issues @mohdashraf010897 (#2133)
    Source code(tar.gz)
    Source code(zip)
  • v1.33.3-vue(Nov 30, 2022)

    Bug Fixes

    • DataSearch: Debounce issues when tags mode is enabled @bietkul https://github.com/appbaseio/reactivesearch/commit/57c215836a7361d6e4e515676eb01d807a441439

    Features

    • Use analytics-js lib to maintain analytics and provide analytics instance to record analytics @SavvyShah (#2123)
    Source code(tar.gz)
    Source code(zip)
  • v3.43.1(Nov 18, 2022)

    Features

    • Add support for React v18.x @mohdashraf010897 (https://github.com/appbaseio/reactivesearch/pull/2087)

    Bug Fixes

    • DataPicker: Query format not passed in query @SavvyShah (#2122)
    • TreeList: Handle dataField array queries for TreeList @samkio (#2094)
    Source code(tar.gz)
    Source code(zip)
  • v1.33.1-vue(Nov 7, 2022)

    Bug Fixes

    • Handle kebab-case props in PreferenceConsumer @bietkul https://github.com/appbaseio/reactivesearch/commit/6c043709fc1114304b7d674bd6bf2ade9d0a0fcd
    Source code(tar.gz)
    Source code(zip)
  • v1.33.0-vue(Nov 7, 2022)

    Features

    • List Components: select all label with count @SavvyShah (#2090)
    • Add support for preferences to ReactiveBase @bietkul https://github.com/appbaseio/reactivesearch/commit/aede5b128234a58ecfcf49204bde08d29fd9be81

    Bug Fixes

    • DataSearch: Fix initial hydration of query options in component @mohdashraf010897 (https://github.com/appbaseio/reactivesearch/pull/2118)
    Source code(tar.gz)
    Source code(zip)
  • v1.32.4-vue(Nov 3, 2022)

    Bug Fixes

    • StateProvider: setSearchState method was broken @bietkul https://github.com/appbaseio/reactivesearch/commit/0360c3a0aeb9ade7bebb6188d6a7cef0d9af3e51
    • ReactiveMap: removeMarkers method was not working in production build @bietkul https://github.com/appbaseio/reactivesearch/commit/d8e4d6b0d465ef05ddbb550ec9843dc0438c630e
    Source code(tar.gz)
    Source code(zip)
  • v1.32.3-vue(Oct 21, 2022)

    Bug Fixes

    • ReactiveGoogleMap: Add support for setIcon in popover events @bietkul
    • StateProvider: Fix null value comparison for list components @bietkul
    Source code(tar.gz)
    Source code(zip)
  • v3.41.1(Oct 13, 2022)

    Bug Fixes

    • TreeList: Fix typescript issues @samkio https://github.com/appbaseio/reactivesearch/pull/2089
    • ReactiveChart: Provide more options to setOption method @bietkul https://github.com/appbaseio/reactivesearch/commit/0df578fff0cfe993c3e2d1ab2e1c6983e73fe8a1
    Source code(tar.gz)
    Source code(zip)
  • v1.32.1-vue(Oct 10, 2022)

    Bug Fixes

    • DataSearch: Controlled behavior with multi-keyword search @bietkul https://github.com/appbaseio/reactivesearch/commit/8dd3753bf08d8150740849a129cd60a8a438f181
    Source code(tar.gz)
    Source code(zip)
  • v1.32.0-vue(Oct 3, 2022)

    Features

    • Introducing ReactiveGoogleMap component to create a data-driven map UI component using Google Maps.

    Bug Fixes

    • Button instead of anchor @royduin (#1646)
    • Fix controlled usage in DataSearch @mohdashraf010897 https://github.com/appbaseio/reactivesearch/commit/9bd95cc66ed6af42c8d0fa46504cf159c8228581
    Source code(tar.gz)
    Source code(zip)
  • v3.40.2(Sep 27, 2022)

    Bug Fixes

    • Show count for selectAllLabel in list components @SavvyShah (#2073)
    • Chart Fixes @bietkul https://github.com/appbaseio/reactivesearch/commit/145303e9c091019657c9bdf0e361b391ffb739f4
    Source code(tar.gz)
    Source code(zip)
  • v3.40.1(Sep 21, 2022)

    Features

    • Add selectedAllLabel prop in tabdatalist @SavvyShah (#2070)
    • Render element as tag in ResultList @SavvyShah (#2067)

    Bug Fixes

    • Type definitions @bietkul
    Source code(tar.gz)
    Source code(zip)
  • v3.39.2(Sep 15, 2022)

    Bug Fixes

    • Fix debounce issue with controlled usage in DataSearch @mohdashraf010897 (#2064)
    • Fix trigger query on enter key press @mohdashraf010897 (#2066)
    • Fix initialQuerySyncTime prop in react SPA @mohdashraf010897
    Source code(tar.gz)
    Source code(zip)
  • v3.39.1(Sep 5, 2022)

    Bug Fixes

    • ReactiveChart: Apply size for charts @bietkul https://github.com/appbaseio/reactivesearch/commit/92ec42c584c3c583e516e76ef0be6b6e063ec4ac
    Source code(tar.gz)
    Source code(zip)
  • v3.39.0(Sep 5, 2022)

    Features

    • ReactiveChart: Add support for custom chart type @SavvyShah (#2052)

    Bug Fixes

    • SearchBox: Debounce issues @mohdashraf010897 (#2063)
    • TreeList: Search issues @mohdashraf010897 (#2048)
    • Theme: Icon colors to adopt theme primary color @mohdashraf010897 (#2050)
    Source code(tar.gz)
    Source code(zip)
  • v1.31.0-vue(Sep 5, 2022)

    Features

    • Add support for endpoint @mohdashraf010897 https://github.com/appbaseio/reactivesearch/pull/2056

    Bug Fixes

    • SSR: Apply transformRequest and transformResponse @bietkul https://github.com/appbaseio/reactivesearch/commit/aba1a40d88bde440846c937d16ce6cb2a523a5c5
    Source code(tar.gz)
    Source code(zip)
  • v3.38.3(Aug 26, 2022)

    What's Changed

    • Feat/stacked bar chart example by @SavvyShah in https://github.com/appbaseio/reactivesearch/pull/2022
    • feat(web): add data export support to the ReactiveList component by @mohdashraf010897 in https://github.com/appbaseio/reactivesearch/pull/2002
    • Vue - ToggleButton - Added missing customQuery prop by @royduin in https://github.com/appbaseio/reactivesearch/pull/1975
    • fix(web): remove searchbox extra section header margins by @mohdashraf010897 in https://github.com/appbaseio/reactivesearch/pull/1996
    • feat: saved search support by @mohdashraf010897 in https://github.com/appbaseio/reactivesearch/pull/2039
    • feat(web-vue): add support for searchboxId prop by @mohdashraf010897 in https://github.com/appbaseio/reactivesearch/pull/2044
    • build(deps): bump moment from 2.29.2 to 2.29.4 by @dependabot in https://github.com/appbaseio/reactivesearch/pull/2040
    • build(deps): bump lodash from 4.17.11 to 4.17.21 in /packages/vue/examples/saved-search by @dependabot in https://github.com/appbaseio/reactivesearch/pull/2042
    • build(deps): bump shell-quote from 1.6.1 to 1.7.3 in /packages/vue/examples/saved-search by @dependabot in https://github.com/appbaseio/reactivesearch/pull/2041
    • fix(web): use label instead of value by @SavvyShah in https://github.com/appbaseio/reactivesearch/pull/2046
    • Feat: TreeList component by @mohdashraf010897 in https://github.com/appbaseio/reactivesearch/pull/2030
    • fix: encoded input value by @mohdashraf010897 in https://github.com/appbaseio/reactivesearch/pull/2045

    Full Changelog: https://github.com/appbaseio/reactivesearch/compare/v3.36.1...v3.38.3

    Source code(tar.gz)
    Source code(zip)
  • v3.36.1(Aug 1, 2022)

    Features

    • Add support for Error Boundary component @SavvyShah (#2021)
    • Tab data list enhancements @SavvyShah (#2028)

    Bug Fixes

    • ReactiveChart: Fix tooltip for pie char @bietkul https://github.com/appbaseio/reactivesearch/commit/577ac37af01e121eea0c63e248cb804759b92e8e
    Source code(tar.gz)
    Source code(zip)
  • v3.35.2(Jul 25, 2022)

    Featured

    • Add support for TabDataList component @SavvyShah (#2027)

    Bug Fixes

    • Fix re-rendering issues @SavvyShah (#2017)
    • Fix misc issues with ReactiveChart @bietkul https://github.com/appbaseio/reactivesearch/commit/b3e7a512ac259c0e71e8f8cd0911d20e5b12a796
    Source code(tar.gz)
    Source code(zip)
  • v3.34.3(Jul 5, 2022)

    Bug Fixes

    • ReactiveChart: Ignore empty key value in aggregation data @bietkul https://github.com/appbaseio/reactivesearch/commit/af55987ac78920bd522a4bbcea9baf91bfc1aefc
    Source code(tar.gz)
    Source code(zip)
  • v3.33.3(Jul 1, 2022)

    Features

    • Add support for generic chart component name ReactiveChart @bietkul https://github.com/appbaseio/reactivesearch/commit/d71132530657ccb14e292876b59ebcaf339724f1
    • Make ReactiveComponent generic using componentType prop @bietkul https://github.com/appbaseio/reactivesearch/commit/c7184905c3ef1e318809300b7ea62e3ef56bbc1b

    Bug Fixes

    • Fix re-rendering issues in ComponentWraper @bietkul https://github.com/appbaseio/reactivesearch/commit/eee742f0b390d799ab8199309753cc21d29fc508
    • Custom query options shouldn't execute query @SavvyShah (#2003)
    • Update types for histogram in RangeInput @SavvyShah (#1989)
    Source code(tar.gz)
    Source code(zip)
  • v3.33.2(Jun 17, 2022)

    Features

    • Add support for preferences object to configure the search settings for components @bietkul https://github.com/appbaseio/reactivesearch/commit/941d0738f6930d6b7bdcf91f3fce64d242430da2
    Source code(tar.gz)
    Source code(zip)
  • v3.32.0(May 27, 2022)

    Features

    • SearchBox: Add support for featured suggestions @mohdashraf010897 (#1959)

    Bug Fixes

    • RangeInput: Value resetting bug @mohdashraf010897 (#1972)
    • ReactiveList: Fix pagination state in URL Params @bietkul (https://github.com/appbaseio/reactivesearch/commit/292469b01060ded5d7aed024aa15bcd461c36329)
    Source code(tar.gz)
    Source code(zip)
  • v3.31.0(May 11, 2022)

    Features

    • DataSearch: Add support for enableDefaultSuggestions prop to control the default suggestions for empty query @mohdashraf010897 https://github.com/appbaseio/reactivesearch/pull/1967
    • SearchBox: Add support for enter button @mohdashraf010897 https://github.com/appbaseio/reactivesearch/pull/1936

    Bug Fixes

    • SelectedFilters: Display value of Number Box component @SavvyShah (#1927)
    Source code(tar.gz)
    Source code(zip)
  • v1.29.0-vue(May 11, 2022)

    Features

    • Add support for SearchBox component @mohdashraf010897 https://github.com/appbaseio/reactivesearch/pull/1936
    • DataSearch: Add support for enableDefaultSuggestions prop to control the default suggestions for empty query @mohdashraf010897 https://github.com/appbaseio/reactivesearch/pull/1967
    Source code(tar.gz)
    Source code(zip)
  • v3.30.2(Apr 28, 2022)

  • v3.0.0-maps(Apr 28, 2022)

    Features

    • Update Google Maps to v3 API
    • Better support for customization using render methods

    Migration Guide

    https://docs.appbase.io/docs/reactivesearch/v3/advanced/migration/#reactivemaps

    Source code(tar.gz)
    Source code(zip)
Owner
appbase.io
Open source dev tools for ElasticSearch
appbase.io
:alien: A search component with suggestions, customizable and extendable.

vue-search-panel English | 简体中文 vue-search-panel is a search component with suggestions Contents Features Example Install Usage API Reference Features

Zhi Xiong 34 Nov 24, 2022
Vitepress needs better offline search. Let's make it simple and quick.

Vitepress Simple Search Vitepress needs better offline search. Let's make it simple and quick. Thanks to everyone in this thread for offline search fo

null 9 Nov 25, 2022
vue-fuse - A lightweight plugin for fuzzy search library, Fuse.js

vue-fuse A Vue.js pluggin for fuzzy search library, Fuse.js. This plugin wraps Fuse.js in a convenient component with most of the boilerplate and prop

Shayne O'Sullivan 310 Nov 24, 2022
A Vue.js search select component

A Vue.js search select component

JungJoo Seo 348 Dec 26, 2022
A Vue.js search select component

A Vue.js search select component

Javier Lecuona 1 Feb 15, 2019
Simple vue 2 search component

Simple vue 2 search component

Chenling 2 Jul 27, 2022
Bryce Soghigian 1 May 18, 2021
A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.

Ionic Framework Ionic Framework is the open-source mobile app development framework that makes it easy to build top quality native and progressive web

Ionic 48.4k Jan 2, 2023
Vue Native is a framework to build cross platform native mobile apps using JavaScript

Vue Native Visit our website at vue-native.io or read the official documentation here. Build native mobile apps using Vue Vue Native is a framework to

GeekyAnts 8.4k Dec 28, 2022
:mag_right: UI components built with Vue.js for ElasticSearch

InnerSearch : Vue.js components for ElasticSearch What is InnerSearch ? An Open Source project created to help developers working with vue.js and Elas

InnerSearch 138 Nov 24, 2022
:vulcan_salute: :on: :card_index_dividers: A framework for building GraphQL-driven Vue.js applications.

vue-relay A framework for building GraphQL-driven Vue.js applications. Introduction Installation and Setup Installation Install Vue and Relay using ya

null 120 Dec 12, 2022
Elasticsearch gui for the browser

Elasticsearch gui for the browser

Carsten König 953 Jan 7, 2023
Zinc Search engine. A lightweight alternative to elasticsearch that requires minimal resources, written in Go.

Zinc Zinc is a search engine that does full text indexing. It is a lightweight alternative to elasticsearch and runs in less than 100 MB of RAM. It us

Prabhat Sharma 13.1k Jan 3, 2023
🙋🏽‍♂️ Domain-Driven Design & Nuxt - Using Nuxt Modules to structure large Nuxt Apps

????‍♂️ Domain-Driven Design & Nuxt - Using Nuxt Modules to structure large Nuxt Apps ⚡️ Talk at NUXT NATION 2021 by Anton Reindl In this talk I will

Anton Reindl 116 Dec 16, 2022
TMM is a Linux native game modding tool. it allows to install and depoly mods for Linux native and wine games.

TMM is a Linux native mod manager made with the Tauri toolkit, it can, install, load, remove, and deploy mods for both linux native and wine games.

Mathiew May 119 Jan 2, 2023
Mobile app development framework and SDK using HTML5 and JavaScript. Create beautiful and performant cross-platform mobile apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.

Onsen UI - Cross-Platform Hybrid App and PWA Framework Onsen UI is an open source framework that makes it easy to create native-feeling Progressive We

null 8.7k Jan 4, 2023
Data driven drag and drop for complex drag and drop logic

Drag and drop for Vue Data driven drag and drop for complex drag and drop logic: define draggable elements and drop zones with Vue directives. Let Vue

null 2 Oct 25, 2021
Cloud-native platform for building an NFT Marketplace on top of Algorand blockchain.

Built on OpenAlgoNFT OpenAlgoNFT is an open-source cloud-native platform for building an NFT Marketplace on top of Algorand blockchain. Learn more on

Ulam Labs 111 Dec 7, 2022
Periodicity is a dynamic, data-driven Periodic Table built with Vue.js that uses D3 animations and graphs to demonstrate the beauty of periodic trends.

Periodicity is a dynamic, data-driven Periodic Table built with Vue.js that uses D3 animations and graphs to demonstrate the beauty of periodic trends.

Kadin Zhang 154 Dec 17, 2022