v3.0.3

What's Changed

Exposed changes:

• Add types in exports by @Ayc0 in #60
• [react 18] mark as available by @Ayc0 in #44
• [react][types] update to v18 by @Ayc0 in #49

Internal changes:

• Bump hosted-git-info from 2.8.4 to 2.8.9 by @dependabot in #41
• Bump url-parse from 1.4.7 to 1.5.1 by @dependabot in #40
• Bump dns-packet from 1.3.1 to 1.3.4 by @dependabot in #42
• Bump ws from 6.2.1 to 6.2.2 by @dependabot in #43
• Upgrade to Yarn 3 by @Ayc0 in #47
• update mock match media by @Ayc0 in #48
• [gh action] run on node 14 16 18 by @Ayc0 in #50
• [gh action] drop node 14 and use new JSON import syntax by @Ayc0 in #51
• [parcel] use parcel instead of CRA by @Ayc0 in #52
• update actions/checkout & actions/setup-node by @Ayc0 in #53
• [packages] update all by @Ayc0 in #54
• update more packages by @Ayc0 in #55
• Bump json5 from 1.0.1 to 1.0.2 by @dependabot in #57

Full Changelog: v3.0.2...v3.0.3

v3.0.2

• Better fix only and matchMedia props on DOM elements for the Match component
  • With the implementation of the v3.0.0, we were polluting the global scope, injecting the variable React everywhere. This version ships a better fix for both of them.
• Add support for node 15 and 16

v3.0.1

3.0.1

• Fix exports field in package.json
  • use correct lib/ folder instead of dist/
  • Use proper .mjs for node
• Drop support for node 13

v3.0.0

• The package was renamed @blocz/react-responsive instead of react-only
• rename useOnly to useBreakpoint and useQuery to useMediaQuery BREAKING CHANGE
  • Those were renamed for 2 reasons:
    1. useOnly isn’t really explicit
    2. useQuery can be confused with react-query’s or apollo’s useQuery hooks
• useBreakpoint and useMediaQuery stop returning undefined during the initialization and if the media query is invalid. Instead it will directly use the correct value, and if the media query is invalid, it’ll return false. BREAKING CHANGE
• Bump peerDependencies to allow for react 17
• Drop support for node 10
• Remove prop strict BREAKING CHANGE:
  • This feature was initially introduced to avoid collision between mdUp and smDown for instance. But since we avoid the overlapping of breakpoints in the v1.0.1 and as this is customizable, this prop doesn't make sense anymore.
  • This prop relied on calc(% + 1px) and calc(% - 1px) which has 2 issues:
    • difficult to be compatible with SSR as for instance css-mediaquery crashes when we use calc() (see issue),
    • 1px is really arbitrary and not customizable so anyway if someone wanted to change that, they had to use custom breakpoints.
• Fix only and matchMedia props on DOM elements for the Match component
  • Inject MatchChildProps in HTMLAttributes from the global namespace React

v2.3.3

• remove wrong dependency on emotion

v2.3.2

• add toJSON and toCSS for CSS-in-JS support

v2.3.1

• Use Node 13 conditional exports: https://nodejs.org/api/esm.html#esm_conditional_exports

v2.3.0

• remove polyfill for matchMedia (it should be define by the users) minor breaking change
• add new hook useQuery and use it internally in Only for the prop matchMedia
• drop query in useOnly BREAKING CHANGE
  • as there is a new hook useQuery that deals with media queries, the 2nd argument of useOnly was redundant
  • new signature:
    • before: useOnly = (on?: string, media?: string, strict?: boolean) => boolean | undefined
    • after: useOnly = (on?: string, strict?: boolean) => boolean | undefined
  • as on and media were join with a or, you can still mimic the previous behavior by doing:
    • before:

      const isVisible = useOnly(on, media, strict);

    • after:

      const a = useOnly(on, strict);
      const b = useQuery(media);
      const isVisible = a || b;

v2.2.0

• the 3rd option of every breakpoint is instead of a unit string, a string representing the unit or an object with two keys:
  • unit as before ("px", "em", ...)
  • direction "width" or "height"

v2.1.4

• expose MatchChildProps