Skip to content

Instantly share code, notes, and snippets.

@vvo
Last active December 7, 2016 00:17
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save vvo/380ba0e1a8c544768782085fbad18f0a to your computer and use it in GitHub Desktop.

Previous changelogs:

react-instantsearch 2.0.0-beta.19 release notes

This is the last release with important breaking changes inside it. react-instantsearch is going out Thursday 8th December 2016 morning CET.

We focused this release on:

  • providing a default consistent style, and beautiful style for our widgets (that you have to load)
  • making our documentation better, especially the guide parts. We hope you like it.

As always, feel free to open a new GitHub issue to talk about your use cases.

Have a look at our roadmap for future changes.

Breaking changes

Styling

The CSS is no more injected by default, you will have to load it. We removed any react-themeable semantics. You cannot anymore customize the CSS class names. If you were relying on non public API (like internal files) it will break. (cc @kikobeats)

There's no silver bullet for CSS in JavaScript apps so we keep it simple and only provide a regular CSS or sass file to load.

Read the styling widgets guide

<InstantSearch>

  • state is now searchState
  • onStateChange is now onSearchStateChange

Everytime we speak about "search state" or "searchState" we reference the whole <InstantSearch> state as you were used to use.

Read the <InstantSearch> guide

Search state

The search state was previously something like this:

{
  p: 1,
  q: 'hello',
  hPP: 5,
  brands: 'Sony'
}

It's now:

{
  page: 1,
  query: 'hello',
  hitsPerPage: 5,
  menu: {
    brands: 'Sony'
  }
}

To avoid collisions of attribute names (brands) and search parameters. Also minifying search parameters is a search state synchronisation job.

Read the search state guide

Various

  • createConnector getProps is now getProvidedProps
  • connectHierarchicalMenu now sends items.items and not items.children
  • ais-HierarchicalMenu__itemChildren is now now ais-HierarchicalMenu__itemItems
  • RangeRatings is now StarRating
  • hitsPerPage as a prop of Hits, connectHits, InfiniteHits or connectInfinitehits is no more available, please use searchParameters, HitsPerPage or connectHitsPerPage for that.
  • HitsPerPage and connectHitsPerPage are no more allowing passing only arrays like items={[10,20,30]}. You need to pass items={[{value: 10}, {value: 20}]}
  • connectSearchBox now sends currentRefinement and not query as provided prop

Notable new features

We have a new <Highlight> widget and connectHighlight that should dramatically reduce the struggle to implement highlighting in your applications. Read the guide.

We are now compatible with react-native, via connectors. Read the guide.

All our widgets are now beautiful by default.

Full changelog

click here # [2.0.0-beta.19](https://github.com/algolia/instantsearch.js/compare/v2.0.0-beta.18...v2.0.0-beta.19) (2016-12-06)

Bug Fixes

  • connectHierarchicalMenu: use item.items instead of item.children (#1633) (f712242), closes #1605
  • connectSearchBox: provide currentRefinement instead of query (#1654) (f8bc432)
  • createConnector: rename getProps into getProvidedProps (#1655) (e605348)
  • default translations: fix default translations (#1656) (d3a8e03), closes #1656
  • example: add default style for widget (#1661) (76a0a3d)
  • id: remmove id props (#1564) (a563894), closes #1556
  • menu: selecting the currentRefinement should remove it. (#1637) (0f67940)
  • Pagination: when page === 1, first should not be selected (#1615) (1cf042b)
  • search: don't update widgets if props hasn't changed (#1612) (6e121ef)
  • url sync: back/forward button were not working (#1579) (54533e5)

Features

  • api: add namespace when storing widgets state (#1627) (fbd4cd8)
  • api: make hitsPerPage and SortBy connector consistent (#1659) (2a9c18d)
  • api: renaming state/onStateChange to searchState/onSearchStateChange for InstantSearch component (#1667) (f009c95)
  • Highlight: provide Highlight widget and connectHighlight connector (7e79db6)
  • hitsPerPage: hitsPerPage is now only configured by HitsPerPage (#1653) (6ada577)
  • react-native: make react-instantsearch compatible for native dev (#1573) (91df45a)
  • theme: move to CSS file and CSS class names only theming (#1632) (8851e3e), closes #1575
  • unmount: clean state if a widget is unmounted except if it is persistent (#1588) (61d68a0)
  • widget: rename rangeRatings to starRatings + design improvements (#1646) (7446194)

BREAKING CHANGES

  • api: - InstantSearch props state and onStateChange are now called searchState and onSearchStateChange
  • connectSearchBox: - connectSearchBox now forward the query as props.currentRefinement like any other connector
  • api: - HitsPerPage doesn't accept items with the form: array of number. Only object are allowed (label and value).
  • hitsPerPage: - You cannot configure hitsPerPage anymore on: Hits, connectHits, InfiniteHits, connectInfiniteHits. Please use HitsPage, connectHitsPerPage or searchParameters option of <InstantSearch>
  • createConnector: When creating custom connectors, getProps is now named getProvidedProps
  • widget: RangeRatings is now StarRating
  • connectHierarchicalMenu: - HierarchicalMenu ais-HierarchicalMenu__itemChildren css class name is now ais-HierarchicalMenu__itemItems
  • connectHierarchicalMenu item.children forwarded prop is now item.items
  • theme: - CSS is no more injected by default, read our styling guide to know how to load it
  • react-themeable, theme={} prop have been removed from the codebase, the only way to style widgets is now to use CSS class names
  • api: - our internal state shape now includes namespacing to avoid id collision. Also some existing keys were renamed:
  • searchbox was using 'q' now it uses 'query'
  • hitsPerPage was using 'hPP' now it uses 'hitsPerPage'
  • pagination and infiniteHits were using 'p' now it uses 'page'
  • toggle internal state change from 'on/off' to 'true/false' For more information about the state shape, please read our documentation.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment