@blocz/react-responsive 4.0.1 → 5.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -4
- package/lib/react-responsive.cjs +1 -1
- package/lib/react-responsive.cjs.map +1 -1
- package/lib/react-responsive.mjs +1 -1
- package/lib/react-responsive.mjs.map +1 -1
- package/lib/react-responsive.umd.js +1 -1
- package/lib/react-responsive.umd.js.map +1 -1
- package/package.json +2 -2
- package/tsconfig.tsbuildinfo +0 -1
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@ It allows you to display component only for particular screen sizes.
|
|
|
6
6
|
|
|
7
7
|
If you need a responsive layout and adaptive components, `@blocz/react-responsive` is here for you!
|
|
8
8
|
|
|
9
|
-
[See changelog](https://github.com/bloczjs/react-responsive/blob/
|
|
9
|
+
[See changelog](https://github.com/bloczjs/react-responsive/blob/main/CHANGELOG.md)
|
|
10
10
|
|
|
11
11
|
## Table of contents <!-- omit in toc -->
|
|
12
12
|
|
|
@@ -28,7 +28,8 @@ If you need a responsive layout and adaptive components, `@blocz/react-responsiv
|
|
|
28
28
|
5. [`matchMedia` polyfill](#matchmedia-polyfill)
|
|
29
29
|
1. [Browser](#browser)
|
|
30
30
|
2. [Node](#node)
|
|
31
|
-
6. [
|
|
31
|
+
6. [React 16 / 17 support](#react-16--17-support)
|
|
32
|
+
7. [FAQ](#faq)
|
|
32
33
|
|
|
33
34
|
## How to use
|
|
34
35
|
|
|
@@ -317,8 +318,13 @@ If you are on want to use matchMedia on browser that don’t support it, I’d r
|
|
|
317
318
|
|
|
318
319
|
If you want to mock `matchMedia` on Node to execute tests for instance, you can use [`mock-match-media`](https://github.com/Ayc0/mock-match-media/).
|
|
319
320
|
|
|
320
|
-
And if you need an example with `Jest`, `@testing-library/react`, `React` and `@blocz/react-responsive`, you can take a look at [these tests](https://github.com/bloczjs/react-responsive/blob/
|
|
321
|
+
And if you need an example with `Jest`, `@testing-library/react`, `React` and `@blocz/react-responsive`, you can take a look at [these tests](https://github.com/bloczjs/react-responsive/blob/main/packages/tests/src/__tests__/ssr.ts).
|
|
322
|
+
|
|
323
|
+
### React 16 / 17 support
|
|
324
|
+
|
|
325
|
+
`@blocz/react-responsive` relies on `useSyncExternalStore`. This function was added in React 18.
|
|
326
|
+
If you are on React 16.8+ / React 17, you'll need to use [use-sync-external-store](https://npmx.dev/package/use-sync-external-store) to polyfill `useSyncExternalStore`.
|
|
321
327
|
|
|
322
328
|
### FAQ
|
|
323
329
|
|
|
324
|
-
For other questions, please take a look at our [FAQ document](https://github.com/bloczjs/react-responsive/blob/
|
|
330
|
+
For other questions, please take a look at our [FAQ document](https://github.com/bloczjs/react-responsive/blob/main/FAQ.md).
|
package/lib/react-responsive.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(`react`);c=s(c);const l=[`em`,`ex`,`%`,`px`,`cm`,`mm`,`in`,`pt`,`pc`,`ch`,`rem`,`vh`,`vw`,`vmin`,`vmax`],u=[`width`,`height`];function d(e){return Object.keys(e).reduce((t,n)=>{let r=e[n];if(!Array.isArray(r)||r.length<=1)return t;let[i,a,o,...s]=r;if(s.length>0){let e=Error(`The following fields "${s}" have been ignored`);console.error(e)}if(typeof i!=`number`||typeof a!=`number`)return t;let c,d;typeof o==`string`?c=o:typeof o==`object`&&(d=o.direction,c=o.unit);let f=Math.min(i,a),p=Math.max(i,a),m=c&&l.includes(c)?c:`px`,h=d&&u.includes(d)?d:`width`;return t[n]=[f,p,m,h],t[`${n}Up`]=[f,1/0,m,h],t[`${n}Down`]=[0,p,m,h],t},{})}const f={xs:[0,575,`px`],sm:[576,767,`px`],md:[768,991,`px`],lg:[992,1199,`px`],xl:[1200,1/0,`px`]},p=c.createContext(d(f));function m({breakpoints:e=f,additionalBreakpoints:t,children:n}){return c.createElement(p.Provider,{value:d({...e,...t})},n)}function h(e){let t=[],[n,r,i,a]=e,o;return n!==0&&(o=`${n}${i}`,t.push(`(min-${a}:${o})`)),r!==1/0&&(o=`${r}${i}`,t.push(`(max-${a}:${o})`)),` `+t.join(` and `)}function g(e){return function(t=``){if(!t)return``;let n=t.split(` `),r=n.map(t=>e[t]).filter(Boolean).map(e=>h(e)).filter(Boolean).join(`,`);if(!r){let e=n.length===1;console.error(`"${n.join(`", "`)}" ${e?`is`:`are`}n't ${e?`a `:``}valid breakpoint${e?``:`s`}`)}return r}}function _(e){let t=c.useMemo(()=>matchMedia(e),[e]);return c.useSyncExternalStore(c.useCallback(e=>(t.addListener(e),()=>t.removeListener(e)),[t]),()=>t.matches)}function v(e){let t=c.useContext(p),n=c.useMemo(()=>g(t),[t]);return _(c.useMemo(()=>n(e),[n,e])||`-`)}function y({matchMedia:e,on:t,as:n,children:r,...i}){let a=v(t),o=_(e||`-`);return a||o?c.createElement(n||c.Fragment,n?i:void 0,r):null}exports.BreakpointsContext=p,exports.BreakpointsProvider=m,exports.Only=y,exports.useBreakpoint=v,exports.useMediaQuery=_;
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(`react`);c=s(c);const l=[`em`,`ex`,`%`,`px`,`cm`,`mm`,`in`,`pt`,`pc`,`ch`,`rem`,`vh`,`vw`,`vmin`,`vmax`],u=[`width`,`height`];function d(e){return Object.keys(e).reduce((t,n)=>{let r=e[n];if(!Array.isArray(r)||r.length<=1)return t;let[i,a,o,...s]=r;if(s.length>0){let e=Error(`The following fields "${s}" have been ignored`);console.error(e)}if(typeof i!=`number`||typeof a!=`number`)return t;let c,d;typeof o==`string`?c=o:typeof o==`object`&&(d=o.direction,c=o.unit);let f=Math.min(i,a),p=Math.max(i,a),m=c&&l.includes(c)?c:`px`,h=d&&u.includes(d)?d:`width`;return t[n]=[f,p,m,h],t[`${n}Up`]=[f,1/0,m,h],t[`${n}Down`]=[0,p,m,h],t},{})}const f={xs:[0,575,`px`],sm:[576,767,`px`],md:[768,991,`px`],lg:[992,1199,`px`],xl:[1200,1/0,`px`]},p=c.createContext(d(f));function m({breakpoints:e=f,additionalBreakpoints:t,children:n}){return c.createElement(p.Provider,{value:d({...e,...t})},n)}function h(e){let t=[],[n,r,i,a]=e,o;return n!==0&&(o=`${n}${i}`,t.push(`(min-${a}:${o})`)),r!==1/0&&(o=`${r}${i}`,t.push(`(max-${a}:${o})`)),` `+t.join(` and `)}function g(e){return function(t=``){if(!t)return``;let n=t.split(` `),r=n.map(t=>e[t]).filter(Boolean).map(e=>h(e)).filter(Boolean).join(`,`);if(!r){let e=n.length===1;console.error(`"${n.join(`", "`)}" ${e?`is`:`are`}n't ${e?`a `:``}valid breakpoint${e?``:`s`}`)}return r}}function _(e){let t=c.useMemo(()=>matchMedia(e),[e]);return c.useSyncExternalStore(c.useCallback(e=>(t.addListener(e),()=>t.removeListener(e)),[t]),()=>t.matches,()=>t.matches)}function v(e){let t=c.useContext(p),n=c.useMemo(()=>g(t),[t]);return _(c.useMemo(()=>n(e),[n,e])||`-`)}function y({matchMedia:e,on:t,as:n,children:r,...i}){let a=v(t),o=_(e||`-`);return a||o?c.createElement(n||c.Fragment,n?i:void 0,r):null}exports.BreakpointsContext=p,exports.BreakpointsProvider=m,exports.Only=y,exports.useBreakpoint=v,exports.useMediaQuery=_;
|
|
2
2
|
//# sourceMappingURL=react-responsive.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-responsive.cjs","names":["React","React","React","React"],"sources":["../src/sanitize.ts","../src/BreakpointsContext.tsx","../src/fromBreakpointToMedia.ts","../src/mediaQueryBuilder.ts","../src/useMediaQuery.ts","../src/useBreakpoint.ts","../src/Only.tsx"],"sourcesContent":["export type Units =\n | \"em\"\n | \"ex\"\n | \"%\"\n | \"px\"\n | \"cm\"\n | \"mm\"\n | \"in\"\n | \"pt\"\n | \"pc\"\n | \"ch\"\n | \"rem\"\n | \"vh\"\n | \"vw\"\n | \"vmin\"\n | \"vmax\";\n\nconst listOfSupportedUnits: Units[] = [\n \"em\",\n \"ex\",\n \"%\",\n \"px\",\n \"cm\",\n \"mm\",\n \"in\",\n \"pt\",\n \"pc\",\n \"ch\",\n \"rem\",\n \"vh\",\n \"vw\",\n \"vmin\",\n \"vmax\",\n];\n\ntype Directions = \"width\" | \"height\";\n\nconst listOfSupportedDirections: Directions[] = [\"width\", \"height\"];\n\nexport type ExposedBreakpoint =\n | [number, number]\n | [number, number, Units]\n | [number, number, { unit?: Units; direction?: Directions }];\n\nexport interface ExposedBreakpoints {\n [key: string]: ExposedBreakpoint;\n}\n\nexport type Breakpoint = [number, number, Units, Directions];\n\nexport interface Breakpoints {\n [breakpoint: string]: Breakpoint;\n}\n\nexport function sanitize(inBreakpoints: ExposedBreakpoints): Breakpoints {\n return Object.keys(inBreakpoints).reduce<Breakpoints>((breakpoints, breakpointName) => {\n const breakpoint = inBreakpoints[breakpointName];\n\n if (!Array.isArray(breakpoint) || breakpoint.length <= 1) {\n return breakpoints;\n }\n\n const [supposedMin, supposedMax, options, ...rest] = breakpoint;\n if (rest.length > 0) {\n const error = new Error(`The following fields \"${rest}\" have been ignored`);\n console.error(error);\n }\n\n if (typeof supposedMin !== \"number\" || typeof supposedMax !== \"number\") {\n return breakpoints;\n }\n\n let supposedUnit: Units | undefined;\n let supposedDirection: Directions | undefined;\n if (typeof options === \"string\") {\n supposedUnit = options;\n } else if (typeof options === \"object\") {\n supposedDirection = options.direction;\n supposedUnit = options.unit;\n }\n\n const min = Math.min(supposedMin, supposedMax);\n const max = Math.max(supposedMin, supposedMax);\n const unit = supposedUnit && listOfSupportedUnits.includes(supposedUnit) ? supposedUnit : \"px\";\n const direction =\n supposedDirection && listOfSupportedDirections.includes(supposedDirection) ? supposedDirection : \"width\";\n\n breakpoints[breakpointName] = [min, max, unit, direction];\n breakpoints[`${breakpointName}Up`] = [min, Infinity, unit, direction];\n breakpoints[`${breakpointName}Down`] = [0, max, unit, direction];\n\n return breakpoints;\n }, {});\n}\n","import * as React from \"react\";\n\nimport { sanitize, ExposedBreakpoints, Breakpoints } from \"./sanitize\";\n\nconst defaultBreakpoints: ExposedBreakpoints = {\n xs: [0, 575, \"px\"], // Extra small devices (portrait phones)\n sm: [576, 767, \"px\"], // Small devices (landscape phones)\n md: [768, 991, \"px\"], // Medium devices (tablets)\n lg: [992, 1199, \"px\"], // Large devices (desktops)\n xl: [1200, Infinity, \"px\"], // Extra large devices (large desktops)\n};\n\nexport const BreakpointsContext: React.Context<Breakpoints> = React.createContext<Breakpoints>(\n sanitize(defaultBreakpoints),\n);\n\ninterface BreakpointsProviderProps {\n breakpoints?: ExposedBreakpoints;\n additionalBreakpoints?: ExposedBreakpoints;\n}\n\nexport function BreakpointsProvider({\n breakpoints = defaultBreakpoints,\n additionalBreakpoints,\n children,\n}: React.PropsWithChildren<BreakpointsProviderProps>): React.ReactElement {\n return (\n <BreakpointsContext.Provider\n value={sanitize({\n ...breakpoints,\n ...additionalBreakpoints,\n })}\n >\n {children}\n </BreakpointsContext.Provider>\n );\n}\n","import { Breakpoint } from \"./sanitize\";\n\nexport function fromBreakpointToMedia(breakpoint: Breakpoint): string {\n const mediaList: string[] = [];\n const [minValue, maxValue, unit, direction] = breakpoint;\n let str;\n\n // Min value\n if (minValue !== 0) {\n str = `${minValue}${unit}`;\n mediaList.push(`(min-${direction}:${str})`);\n }\n\n // Max value\n if (maxValue !== Infinity) {\n str = `${maxValue}${unit}`;\n mediaList.push(`(max-${direction}:${str})`);\n }\n\n return \" \" + mediaList.join(\" and \");\n}\n","import { Breakpoints } from \"./sanitize\";\nimport { fromBreakpointToMedia } from \"./fromBreakpointToMedia\";\n\nexport function mediaQueryBuilder(breakpoints: Breakpoints) {\n return function toMediaQuery(on = \"\"): string {\n if (!on) {\n return \"\";\n }\n const rawBreakpointNames = on.split(\" \");\n const filteredBreakpoints = rawBreakpointNames.map((breakpointName) => breakpoints[breakpointName]).filter(Boolean);\n const mediaQuery = filteredBreakpoints\n .map((breakpoint) => fromBreakpointToMedia(breakpoint))\n .filter(Boolean)\n .join(\",\");\n if (!mediaQuery) {\n const isUniqBreakpoint = rawBreakpointNames.length === 1;\n console.error(\n `\"${rawBreakpointNames.join('\", \"')}\" ${isUniqBreakpoint ? \"is\" : \"are\"}n't ${\n isUniqBreakpoint ? \"a \" : \"\"\n }valid breakpoint${isUniqBreakpoint ? \"\" : \"s\"}`,\n );\n }\n return mediaQuery;\n };\n}\n","import * as React from \"react\";\n\nexport function useMediaQuery(mediaQuery: string): boolean {\n const mediaQueryList = React.useMemo(() => matchMedia(mediaQuery), [mediaQuery]);\n\n // Those are important updates, so we don't want to use transitions on them\n return React.useSyncExternalStore(\n React.useCallback(\n (callback) => {\n // cannot use addEventListener for IE 11 and safari 13-\n mediaQueryList.addListener(callback);\n return () => mediaQueryList.removeListener(callback);\n },\n [mediaQueryList],\n ),\n () => mediaQueryList.matches,\n // Don't add `() => false`, so that node implementations can define their own behavior for server-side rendering via `mock-match-media`\n );\n}\n","import * as React from \"react\";\n\nimport { BreakpointsContext } from \"./BreakpointsContext\";\n\nimport { mediaQueryBuilder } from \"./mediaQueryBuilder\";\n\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport function useBreakpoint(on?: string): boolean {\n const breakpoints = React.useContext(BreakpointsContext);\n const toMediaQuery = React.useMemo(() => mediaQueryBuilder(breakpoints), [breakpoints]);\n\n const mediaQuery = React.useMemo(() => toMediaQuery(on), [toMediaQuery, on]);\n\n return useMediaQuery(mediaQuery || \"-\");\n}\n","import * as React from \"react\";\n\nimport { useBreakpoint } from \"./useBreakpoint\";\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport type OnlyProps<OtherProps = Record<string, never>> = OtherProps & {\n matchMedia?: string;\n on?: string;\n as?: string | React.ComponentType<OtherProps>;\n};\n\nexport function Only<OtherProps = Record<string, never>>({\n matchMedia,\n on,\n as,\n children,\n ...props\n}: React.PropsWithChildren<OnlyProps<OtherProps>>): React.ReactElement | null {\n const matchOn = useBreakpoint(on);\n const matchQuery = useMediaQuery(matchMedia || \"-\");\n const isShown = matchOn || matchQuery;\n\n if (!isShown) {\n return null;\n }\n\n return React.createElement(\n // @ts-expect-error – this is a complex type\n as || React.Fragment,\n as ? (props as OtherProps) : undefined,\n children,\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-responsive.cjs","names":["React","React","React","React"],"sources":["../src/sanitize.ts","../src/BreakpointsContext.tsx","../src/fromBreakpointToMedia.ts","../src/mediaQueryBuilder.ts","../src/useMediaQuery.ts","../src/useBreakpoint.ts","../src/Only.tsx"],"sourcesContent":["export type Units =\n | \"em\"\n | \"ex\"\n | \"%\"\n | \"px\"\n | \"cm\"\n | \"mm\"\n | \"in\"\n | \"pt\"\n | \"pc\"\n | \"ch\"\n | \"rem\"\n | \"vh\"\n | \"vw\"\n | \"vmin\"\n | \"vmax\";\n\nconst listOfSupportedUnits: Units[] = [\n \"em\",\n \"ex\",\n \"%\",\n \"px\",\n \"cm\",\n \"mm\",\n \"in\",\n \"pt\",\n \"pc\",\n \"ch\",\n \"rem\",\n \"vh\",\n \"vw\",\n \"vmin\",\n \"vmax\",\n];\n\ntype Directions = \"width\" | \"height\";\n\nconst listOfSupportedDirections: Directions[] = [\"width\", \"height\"];\n\nexport type ExposedBreakpoint =\n | [number, number]\n | [number, number, Units]\n | [number, number, { unit?: Units; direction?: Directions }];\n\nexport interface ExposedBreakpoints {\n [key: string]: ExposedBreakpoint;\n}\n\nexport type Breakpoint = [number, number, Units, Directions];\n\nexport interface Breakpoints {\n [breakpoint: string]: Breakpoint;\n}\n\nexport function sanitize(inBreakpoints: ExposedBreakpoints): Breakpoints {\n return Object.keys(inBreakpoints).reduce<Breakpoints>((breakpoints, breakpointName) => {\n const breakpoint = inBreakpoints[breakpointName];\n\n if (!Array.isArray(breakpoint) || breakpoint.length <= 1) {\n return breakpoints;\n }\n\n const [supposedMin, supposedMax, options, ...rest] = breakpoint;\n if (rest.length > 0) {\n const error = new Error(`The following fields \"${rest}\" have been ignored`);\n console.error(error);\n }\n\n if (typeof supposedMin !== \"number\" || typeof supposedMax !== \"number\") {\n return breakpoints;\n }\n\n let supposedUnit: Units | undefined;\n let supposedDirection: Directions | undefined;\n if (typeof options === \"string\") {\n supposedUnit = options;\n } else if (typeof options === \"object\") {\n supposedDirection = options.direction;\n supposedUnit = options.unit;\n }\n\n const min = Math.min(supposedMin, supposedMax);\n const max = Math.max(supposedMin, supposedMax);\n const unit = supposedUnit && listOfSupportedUnits.includes(supposedUnit) ? supposedUnit : \"px\";\n const direction =\n supposedDirection && listOfSupportedDirections.includes(supposedDirection) ? supposedDirection : \"width\";\n\n breakpoints[breakpointName] = [min, max, unit, direction];\n breakpoints[`${breakpointName}Up`] = [min, Infinity, unit, direction];\n breakpoints[`${breakpointName}Down`] = [0, max, unit, direction];\n\n return breakpoints;\n }, {});\n}\n","import * as React from \"react\";\n\nimport { sanitize, ExposedBreakpoints, Breakpoints } from \"./sanitize\";\n\nconst defaultBreakpoints: ExposedBreakpoints = {\n xs: [0, 575, \"px\"], // Extra small devices (portrait phones)\n sm: [576, 767, \"px\"], // Small devices (landscape phones)\n md: [768, 991, \"px\"], // Medium devices (tablets)\n lg: [992, 1199, \"px\"], // Large devices (desktops)\n xl: [1200, Infinity, \"px\"], // Extra large devices (large desktops)\n};\n\nexport const BreakpointsContext: React.Context<Breakpoints> = React.createContext<Breakpoints>(\n sanitize(defaultBreakpoints),\n);\n\ninterface BreakpointsProviderProps {\n breakpoints?: ExposedBreakpoints;\n additionalBreakpoints?: ExposedBreakpoints;\n}\n\nexport function BreakpointsProvider({\n breakpoints = defaultBreakpoints,\n additionalBreakpoints,\n children,\n}: React.PropsWithChildren<BreakpointsProviderProps>): React.ReactElement {\n return (\n <BreakpointsContext.Provider\n value={sanitize({\n ...breakpoints,\n ...additionalBreakpoints,\n })}\n >\n {children}\n </BreakpointsContext.Provider>\n );\n}\n","import { Breakpoint } from \"./sanitize\";\n\nexport function fromBreakpointToMedia(breakpoint: Breakpoint): string {\n const mediaList: string[] = [];\n const [minValue, maxValue, unit, direction] = breakpoint;\n let str;\n\n // Min value\n if (minValue !== 0) {\n str = `${minValue}${unit}`;\n mediaList.push(`(min-${direction}:${str})`);\n }\n\n // Max value\n if (maxValue !== Infinity) {\n str = `${maxValue}${unit}`;\n mediaList.push(`(max-${direction}:${str})`);\n }\n\n return \" \" + mediaList.join(\" and \");\n}\n","import { Breakpoints } from \"./sanitize\";\nimport { fromBreakpointToMedia } from \"./fromBreakpointToMedia\";\n\nexport function mediaQueryBuilder(breakpoints: Breakpoints) {\n return function toMediaQuery(on = \"\"): string {\n if (!on) {\n return \"\";\n }\n const rawBreakpointNames = on.split(\" \");\n const filteredBreakpoints = rawBreakpointNames.map((breakpointName) => breakpoints[breakpointName]).filter(Boolean);\n const mediaQuery = filteredBreakpoints\n .map((breakpoint) => fromBreakpointToMedia(breakpoint))\n .filter(Boolean)\n .join(\",\");\n if (!mediaQuery) {\n const isUniqBreakpoint = rawBreakpointNames.length === 1;\n console.error(\n `\"${rawBreakpointNames.join('\", \"')}\" ${isUniqBreakpoint ? \"is\" : \"are\"}n't ${\n isUniqBreakpoint ? \"a \" : \"\"\n }valid breakpoint${isUniqBreakpoint ? \"\" : \"s\"}`,\n );\n }\n return mediaQuery;\n };\n}\n","import * as React from \"react\";\n\nexport function useMediaQuery(mediaQuery: string): boolean {\n const mediaQueryList = React.useMemo(() => matchMedia(mediaQuery), [mediaQuery]);\n\n // Those are important updates, so we don't want to use transitions on them\n return React.useSyncExternalStore(\n React.useCallback(\n (callback) => {\n // cannot use addEventListener for IE 11 and safari 13-\n mediaQueryList.addListener(callback);\n return () => mediaQueryList.removeListener(callback);\n },\n [mediaQueryList],\n ),\n () => mediaQueryList.matches,\n () => mediaQueryList.matches,\n );\n}\n","import * as React from \"react\";\n\nimport { BreakpointsContext } from \"./BreakpointsContext\";\n\nimport { mediaQueryBuilder } from \"./mediaQueryBuilder\";\n\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport function useBreakpoint(on?: string): boolean {\n const breakpoints = React.useContext(BreakpointsContext);\n const toMediaQuery = React.useMemo(() => mediaQueryBuilder(breakpoints), [breakpoints]);\n\n const mediaQuery = React.useMemo(() => toMediaQuery(on), [toMediaQuery, on]);\n\n return useMediaQuery(mediaQuery || \"-\");\n}\n","import * as React from \"react\";\n\nimport { useBreakpoint } from \"./useBreakpoint\";\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport type OnlyProps<OtherProps = Record<string, never>> = OtherProps & {\n matchMedia?: string;\n on?: string;\n as?: string | React.ComponentType<OtherProps>;\n};\n\nexport function Only<OtherProps = Record<string, never>>({\n matchMedia,\n on,\n as,\n children,\n ...props\n}: React.PropsWithChildren<OnlyProps<OtherProps>>): React.ReactElement | null {\n const matchOn = useBreakpoint(on);\n const matchQuery = useMediaQuery(matchMedia || \"-\");\n const isShown = matchOn || matchQuery;\n\n if (!isShown) {\n return null;\n }\n\n return React.createElement(\n // @ts-expect-error – this is a complex type\n as || React.Fragment,\n as ? (props as OtherProps) : undefined,\n children,\n );\n}\n"],"mappings":"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"}
|
package/lib/react-responsive.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as e from"react";const t=[`em`,`ex`,`%`,`px`,`cm`,`mm`,`in`,`pt`,`pc`,`ch`,`rem`,`vh`,`vw`,`vmin`,`vmax`],n=[`width`,`height`];function r(e){return Object.keys(e).reduce((r,i)=>{let a=e[i];if(!Array.isArray(a)||a.length<=1)return r;let[o,s,c,...l]=a;if(l.length>0){let e=Error(`The following fields "${l}" have been ignored`);console.error(e)}if(typeof o!=`number`||typeof s!=`number`)return r;let u,d;typeof c==`string`?u=c:typeof c==`object`&&(d=c.direction,u=c.unit);let f=Math.min(o,s),p=Math.max(o,s),m=u&&t.includes(u)?u:`px`,h=d&&n.includes(d)?d:`width`;return r[i]=[f,p,m,h],r[`${i}Up`]=[f,1/0,m,h],r[`${i}Down`]=[0,p,m,h],r},{})}const i={xs:[0,575,`px`],sm:[576,767,`px`],md:[768,991,`px`],lg:[992,1199,`px`],xl:[1200,1/0,`px`]},a=e.createContext(r(i));function o({breakpoints:t=i,additionalBreakpoints:n,children:o}){return e.createElement(a.Provider,{value:r({...t,...n})},o)}function s(e){let t=[],[n,r,i,a]=e,o;return n!==0&&(o=`${n}${i}`,t.push(`(min-${a}:${o})`)),r!==1/0&&(o=`${r}${i}`,t.push(`(max-${a}:${o})`)),` `+t.join(` and `)}function c(e){return function(t=``){if(!t)return``;let n=t.split(` `),r=n.map(t=>e[t]).filter(Boolean).map(e=>s(e)).filter(Boolean).join(`,`);if(!r){let e=n.length===1;console.error(`"${n.join(`", "`)}" ${e?`is`:`are`}n't ${e?`a `:``}valid breakpoint${e?``:`s`}`)}return r}}function l(t){let n=e.useMemo(()=>matchMedia(t),[t]);return e.useSyncExternalStore(e.useCallback(e=>(n.addListener(e),()=>n.removeListener(e)),[n]),()=>n.matches)}function u(t){let n=e.useContext(a),r=e.useMemo(()=>c(n),[n]);return l(e.useMemo(()=>r(t),[r,t])||`-`)}function d({matchMedia:t,on:n,as:r,children:i,...a}){let o=u(n),s=l(t||`-`);return o||s?e.createElement(r||e.Fragment,r?a:void 0,i):null}export{a as BreakpointsContext,o as BreakpointsProvider,d as Only,u as useBreakpoint,l as useMediaQuery};
|
|
1
|
+
import*as e from"react";const t=[`em`,`ex`,`%`,`px`,`cm`,`mm`,`in`,`pt`,`pc`,`ch`,`rem`,`vh`,`vw`,`vmin`,`vmax`],n=[`width`,`height`];function r(e){return Object.keys(e).reduce((r,i)=>{let a=e[i];if(!Array.isArray(a)||a.length<=1)return r;let[o,s,c,...l]=a;if(l.length>0){let e=Error(`The following fields "${l}" have been ignored`);console.error(e)}if(typeof o!=`number`||typeof s!=`number`)return r;let u,d;typeof c==`string`?u=c:typeof c==`object`&&(d=c.direction,u=c.unit);let f=Math.min(o,s),p=Math.max(o,s),m=u&&t.includes(u)?u:`px`,h=d&&n.includes(d)?d:`width`;return r[i]=[f,p,m,h],r[`${i}Up`]=[f,1/0,m,h],r[`${i}Down`]=[0,p,m,h],r},{})}const i={xs:[0,575,`px`],sm:[576,767,`px`],md:[768,991,`px`],lg:[992,1199,`px`],xl:[1200,1/0,`px`]},a=e.createContext(r(i));function o({breakpoints:t=i,additionalBreakpoints:n,children:o}){return e.createElement(a.Provider,{value:r({...t,...n})},o)}function s(e){let t=[],[n,r,i,a]=e,o;return n!==0&&(o=`${n}${i}`,t.push(`(min-${a}:${o})`)),r!==1/0&&(o=`${r}${i}`,t.push(`(max-${a}:${o})`)),` `+t.join(` and `)}function c(e){return function(t=``){if(!t)return``;let n=t.split(` `),r=n.map(t=>e[t]).filter(Boolean).map(e=>s(e)).filter(Boolean).join(`,`);if(!r){let e=n.length===1;console.error(`"${n.join(`", "`)}" ${e?`is`:`are`}n't ${e?`a `:``}valid breakpoint${e?``:`s`}`)}return r}}function l(t){let n=e.useMemo(()=>matchMedia(t),[t]);return e.useSyncExternalStore(e.useCallback(e=>(n.addListener(e),()=>n.removeListener(e)),[n]),()=>n.matches,()=>n.matches)}function u(t){let n=e.useContext(a),r=e.useMemo(()=>c(n),[n]);return l(e.useMemo(()=>r(t),[r,t])||`-`)}function d({matchMedia:t,on:n,as:r,children:i,...a}){let o=u(n),s=l(t||`-`);return o||s?e.createElement(r||e.Fragment,r?a:void 0,i):null}export{a as BreakpointsContext,o as BreakpointsProvider,d as Only,u as useBreakpoint,l as useMediaQuery};
|
|
2
2
|
//# sourceMappingURL=react-responsive.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-responsive.mjs","names":[],"sources":["../src/sanitize.ts","../src/BreakpointsContext.tsx","../src/fromBreakpointToMedia.ts","../src/mediaQueryBuilder.ts","../src/useMediaQuery.ts","../src/useBreakpoint.ts","../src/Only.tsx"],"sourcesContent":["export type Units =\n | \"em\"\n | \"ex\"\n | \"%\"\n | \"px\"\n | \"cm\"\n | \"mm\"\n | \"in\"\n | \"pt\"\n | \"pc\"\n | \"ch\"\n | \"rem\"\n | \"vh\"\n | \"vw\"\n | \"vmin\"\n | \"vmax\";\n\nconst listOfSupportedUnits: Units[] = [\n \"em\",\n \"ex\",\n \"%\",\n \"px\",\n \"cm\",\n \"mm\",\n \"in\",\n \"pt\",\n \"pc\",\n \"ch\",\n \"rem\",\n \"vh\",\n \"vw\",\n \"vmin\",\n \"vmax\",\n];\n\ntype Directions = \"width\" | \"height\";\n\nconst listOfSupportedDirections: Directions[] = [\"width\", \"height\"];\n\nexport type ExposedBreakpoint =\n | [number, number]\n | [number, number, Units]\n | [number, number, { unit?: Units; direction?: Directions }];\n\nexport interface ExposedBreakpoints {\n [key: string]: ExposedBreakpoint;\n}\n\nexport type Breakpoint = [number, number, Units, Directions];\n\nexport interface Breakpoints {\n [breakpoint: string]: Breakpoint;\n}\n\nexport function sanitize(inBreakpoints: ExposedBreakpoints): Breakpoints {\n return Object.keys(inBreakpoints).reduce<Breakpoints>((breakpoints, breakpointName) => {\n const breakpoint = inBreakpoints[breakpointName];\n\n if (!Array.isArray(breakpoint) || breakpoint.length <= 1) {\n return breakpoints;\n }\n\n const [supposedMin, supposedMax, options, ...rest] = breakpoint;\n if (rest.length > 0) {\n const error = new Error(`The following fields \"${rest}\" have been ignored`);\n console.error(error);\n }\n\n if (typeof supposedMin !== \"number\" || typeof supposedMax !== \"number\") {\n return breakpoints;\n }\n\n let supposedUnit: Units | undefined;\n let supposedDirection: Directions | undefined;\n if (typeof options === \"string\") {\n supposedUnit = options;\n } else if (typeof options === \"object\") {\n supposedDirection = options.direction;\n supposedUnit = options.unit;\n }\n\n const min = Math.min(supposedMin, supposedMax);\n const max = Math.max(supposedMin, supposedMax);\n const unit = supposedUnit && listOfSupportedUnits.includes(supposedUnit) ? supposedUnit : \"px\";\n const direction =\n supposedDirection && listOfSupportedDirections.includes(supposedDirection) ? supposedDirection : \"width\";\n\n breakpoints[breakpointName] = [min, max, unit, direction];\n breakpoints[`${breakpointName}Up`] = [min, Infinity, unit, direction];\n breakpoints[`${breakpointName}Down`] = [0, max, unit, direction];\n\n return breakpoints;\n }, {});\n}\n","import * as React from \"react\";\n\nimport { sanitize, ExposedBreakpoints, Breakpoints } from \"./sanitize\";\n\nconst defaultBreakpoints: ExposedBreakpoints = {\n xs: [0, 575, \"px\"], // Extra small devices (portrait phones)\n sm: [576, 767, \"px\"], // Small devices (landscape phones)\n md: [768, 991, \"px\"], // Medium devices (tablets)\n lg: [992, 1199, \"px\"], // Large devices (desktops)\n xl: [1200, Infinity, \"px\"], // Extra large devices (large desktops)\n};\n\nexport const BreakpointsContext: React.Context<Breakpoints> = React.createContext<Breakpoints>(\n sanitize(defaultBreakpoints),\n);\n\ninterface BreakpointsProviderProps {\n breakpoints?: ExposedBreakpoints;\n additionalBreakpoints?: ExposedBreakpoints;\n}\n\nexport function BreakpointsProvider({\n breakpoints = defaultBreakpoints,\n additionalBreakpoints,\n children,\n}: React.PropsWithChildren<BreakpointsProviderProps>): React.ReactElement {\n return (\n <BreakpointsContext.Provider\n value={sanitize({\n ...breakpoints,\n ...additionalBreakpoints,\n })}\n >\n {children}\n </BreakpointsContext.Provider>\n );\n}\n","import { Breakpoint } from \"./sanitize\";\n\nexport function fromBreakpointToMedia(breakpoint: Breakpoint): string {\n const mediaList: string[] = [];\n const [minValue, maxValue, unit, direction] = breakpoint;\n let str;\n\n // Min value\n if (minValue !== 0) {\n str = `${minValue}${unit}`;\n mediaList.push(`(min-${direction}:${str})`);\n }\n\n // Max value\n if (maxValue !== Infinity) {\n str = `${maxValue}${unit}`;\n mediaList.push(`(max-${direction}:${str})`);\n }\n\n return \" \" + mediaList.join(\" and \");\n}\n","import { Breakpoints } from \"./sanitize\";\nimport { fromBreakpointToMedia } from \"./fromBreakpointToMedia\";\n\nexport function mediaQueryBuilder(breakpoints: Breakpoints) {\n return function toMediaQuery(on = \"\"): string {\n if (!on) {\n return \"\";\n }\n const rawBreakpointNames = on.split(\" \");\n const filteredBreakpoints = rawBreakpointNames.map((breakpointName) => breakpoints[breakpointName]).filter(Boolean);\n const mediaQuery = filteredBreakpoints\n .map((breakpoint) => fromBreakpointToMedia(breakpoint))\n .filter(Boolean)\n .join(\",\");\n if (!mediaQuery) {\n const isUniqBreakpoint = rawBreakpointNames.length === 1;\n console.error(\n `\"${rawBreakpointNames.join('\", \"')}\" ${isUniqBreakpoint ? \"is\" : \"are\"}n't ${\n isUniqBreakpoint ? \"a \" : \"\"\n }valid breakpoint${isUniqBreakpoint ? \"\" : \"s\"}`,\n );\n }\n return mediaQuery;\n };\n}\n","import * as React from \"react\";\n\nexport function useMediaQuery(mediaQuery: string): boolean {\n const mediaQueryList = React.useMemo(() => matchMedia(mediaQuery), [mediaQuery]);\n\n // Those are important updates, so we don't want to use transitions on them\n return React.useSyncExternalStore(\n React.useCallback(\n (callback) => {\n // cannot use addEventListener for IE 11 and safari 13-\n mediaQueryList.addListener(callback);\n return () => mediaQueryList.removeListener(callback);\n },\n [mediaQueryList],\n ),\n () => mediaQueryList.matches,\n // Don't add `() => false`, so that node implementations can define their own behavior for server-side rendering via `mock-match-media`\n );\n}\n","import * as React from \"react\";\n\nimport { BreakpointsContext } from \"./BreakpointsContext\";\n\nimport { mediaQueryBuilder } from \"./mediaQueryBuilder\";\n\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport function useBreakpoint(on?: string): boolean {\n const breakpoints = React.useContext(BreakpointsContext);\n const toMediaQuery = React.useMemo(() => mediaQueryBuilder(breakpoints), [breakpoints]);\n\n const mediaQuery = React.useMemo(() => toMediaQuery(on), [toMediaQuery, on]);\n\n return useMediaQuery(mediaQuery || \"-\");\n}\n","import * as React from \"react\";\n\nimport { useBreakpoint } from \"./useBreakpoint\";\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport type OnlyProps<OtherProps = Record<string, never>> = OtherProps & {\n matchMedia?: string;\n on?: string;\n as?: string | React.ComponentType<OtherProps>;\n};\n\nexport function Only<OtherProps = Record<string, never>>({\n matchMedia,\n on,\n as,\n children,\n ...props\n}: React.PropsWithChildren<OnlyProps<OtherProps>>): React.ReactElement | null {\n const matchOn = useBreakpoint(on);\n const matchQuery = useMediaQuery(matchMedia || \"-\");\n const isShown = matchOn || matchQuery;\n\n if (!isShown) {\n return null;\n }\n\n return React.createElement(\n // @ts-expect-error – this is a complex type\n as || React.Fragment,\n as ? (props as OtherProps) : undefined,\n children,\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-responsive.mjs","names":[],"sources":["../src/sanitize.ts","../src/BreakpointsContext.tsx","../src/fromBreakpointToMedia.ts","../src/mediaQueryBuilder.ts","../src/useMediaQuery.ts","../src/useBreakpoint.ts","../src/Only.tsx"],"sourcesContent":["export type Units =\n | \"em\"\n | \"ex\"\n | \"%\"\n | \"px\"\n | \"cm\"\n | \"mm\"\n | \"in\"\n | \"pt\"\n | \"pc\"\n | \"ch\"\n | \"rem\"\n | \"vh\"\n | \"vw\"\n | \"vmin\"\n | \"vmax\";\n\nconst listOfSupportedUnits: Units[] = [\n \"em\",\n \"ex\",\n \"%\",\n \"px\",\n \"cm\",\n \"mm\",\n \"in\",\n \"pt\",\n \"pc\",\n \"ch\",\n \"rem\",\n \"vh\",\n \"vw\",\n \"vmin\",\n \"vmax\",\n];\n\ntype Directions = \"width\" | \"height\";\n\nconst listOfSupportedDirections: Directions[] = [\"width\", \"height\"];\n\nexport type ExposedBreakpoint =\n | [number, number]\n | [number, number, Units]\n | [number, number, { unit?: Units; direction?: Directions }];\n\nexport interface ExposedBreakpoints {\n [key: string]: ExposedBreakpoint;\n}\n\nexport type Breakpoint = [number, number, Units, Directions];\n\nexport interface Breakpoints {\n [breakpoint: string]: Breakpoint;\n}\n\nexport function sanitize(inBreakpoints: ExposedBreakpoints): Breakpoints {\n return Object.keys(inBreakpoints).reduce<Breakpoints>((breakpoints, breakpointName) => {\n const breakpoint = inBreakpoints[breakpointName];\n\n if (!Array.isArray(breakpoint) || breakpoint.length <= 1) {\n return breakpoints;\n }\n\n const [supposedMin, supposedMax, options, ...rest] = breakpoint;\n if (rest.length > 0) {\n const error = new Error(`The following fields \"${rest}\" have been ignored`);\n console.error(error);\n }\n\n if (typeof supposedMin !== \"number\" || typeof supposedMax !== \"number\") {\n return breakpoints;\n }\n\n let supposedUnit: Units | undefined;\n let supposedDirection: Directions | undefined;\n if (typeof options === \"string\") {\n supposedUnit = options;\n } else if (typeof options === \"object\") {\n supposedDirection = options.direction;\n supposedUnit = options.unit;\n }\n\n const min = Math.min(supposedMin, supposedMax);\n const max = Math.max(supposedMin, supposedMax);\n const unit = supposedUnit && listOfSupportedUnits.includes(supposedUnit) ? supposedUnit : \"px\";\n const direction =\n supposedDirection && listOfSupportedDirections.includes(supposedDirection) ? supposedDirection : \"width\";\n\n breakpoints[breakpointName] = [min, max, unit, direction];\n breakpoints[`${breakpointName}Up`] = [min, Infinity, unit, direction];\n breakpoints[`${breakpointName}Down`] = [0, max, unit, direction];\n\n return breakpoints;\n }, {});\n}\n","import * as React from \"react\";\n\nimport { sanitize, ExposedBreakpoints, Breakpoints } from \"./sanitize\";\n\nconst defaultBreakpoints: ExposedBreakpoints = {\n xs: [0, 575, \"px\"], // Extra small devices (portrait phones)\n sm: [576, 767, \"px\"], // Small devices (landscape phones)\n md: [768, 991, \"px\"], // Medium devices (tablets)\n lg: [992, 1199, \"px\"], // Large devices (desktops)\n xl: [1200, Infinity, \"px\"], // Extra large devices (large desktops)\n};\n\nexport const BreakpointsContext: React.Context<Breakpoints> = React.createContext<Breakpoints>(\n sanitize(defaultBreakpoints),\n);\n\ninterface BreakpointsProviderProps {\n breakpoints?: ExposedBreakpoints;\n additionalBreakpoints?: ExposedBreakpoints;\n}\n\nexport function BreakpointsProvider({\n breakpoints = defaultBreakpoints,\n additionalBreakpoints,\n children,\n}: React.PropsWithChildren<BreakpointsProviderProps>): React.ReactElement {\n return (\n <BreakpointsContext.Provider\n value={sanitize({\n ...breakpoints,\n ...additionalBreakpoints,\n })}\n >\n {children}\n </BreakpointsContext.Provider>\n );\n}\n","import { Breakpoint } from \"./sanitize\";\n\nexport function fromBreakpointToMedia(breakpoint: Breakpoint): string {\n const mediaList: string[] = [];\n const [minValue, maxValue, unit, direction] = breakpoint;\n let str;\n\n // Min value\n if (minValue !== 0) {\n str = `${minValue}${unit}`;\n mediaList.push(`(min-${direction}:${str})`);\n }\n\n // Max value\n if (maxValue !== Infinity) {\n str = `${maxValue}${unit}`;\n mediaList.push(`(max-${direction}:${str})`);\n }\n\n return \" \" + mediaList.join(\" and \");\n}\n","import { Breakpoints } from \"./sanitize\";\nimport { fromBreakpointToMedia } from \"./fromBreakpointToMedia\";\n\nexport function mediaQueryBuilder(breakpoints: Breakpoints) {\n return function toMediaQuery(on = \"\"): string {\n if (!on) {\n return \"\";\n }\n const rawBreakpointNames = on.split(\" \");\n const filteredBreakpoints = rawBreakpointNames.map((breakpointName) => breakpoints[breakpointName]).filter(Boolean);\n const mediaQuery = filteredBreakpoints\n .map((breakpoint) => fromBreakpointToMedia(breakpoint))\n .filter(Boolean)\n .join(\",\");\n if (!mediaQuery) {\n const isUniqBreakpoint = rawBreakpointNames.length === 1;\n console.error(\n `\"${rawBreakpointNames.join('\", \"')}\" ${isUniqBreakpoint ? \"is\" : \"are\"}n't ${\n isUniqBreakpoint ? \"a \" : \"\"\n }valid breakpoint${isUniqBreakpoint ? \"\" : \"s\"}`,\n );\n }\n return mediaQuery;\n };\n}\n","import * as React from \"react\";\n\nexport function useMediaQuery(mediaQuery: string): boolean {\n const mediaQueryList = React.useMemo(() => matchMedia(mediaQuery), [mediaQuery]);\n\n // Those are important updates, so we don't want to use transitions on them\n return React.useSyncExternalStore(\n React.useCallback(\n (callback) => {\n // cannot use addEventListener for IE 11 and safari 13-\n mediaQueryList.addListener(callback);\n return () => mediaQueryList.removeListener(callback);\n },\n [mediaQueryList],\n ),\n () => mediaQueryList.matches,\n () => mediaQueryList.matches,\n );\n}\n","import * as React from \"react\";\n\nimport { BreakpointsContext } from \"./BreakpointsContext\";\n\nimport { mediaQueryBuilder } from \"./mediaQueryBuilder\";\n\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport function useBreakpoint(on?: string): boolean {\n const breakpoints = React.useContext(BreakpointsContext);\n const toMediaQuery = React.useMemo(() => mediaQueryBuilder(breakpoints), [breakpoints]);\n\n const mediaQuery = React.useMemo(() => toMediaQuery(on), [toMediaQuery, on]);\n\n return useMediaQuery(mediaQuery || \"-\");\n}\n","import * as React from \"react\";\n\nimport { useBreakpoint } from \"./useBreakpoint\";\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport type OnlyProps<OtherProps = Record<string, never>> = OtherProps & {\n matchMedia?: string;\n on?: string;\n as?: string | React.ComponentType<OtherProps>;\n};\n\nexport function Only<OtherProps = Record<string, never>>({\n matchMedia,\n on,\n as,\n children,\n ...props\n}: React.PropsWithChildren<OnlyProps<OtherProps>>): React.ReactElement | null {\n const matchOn = useBreakpoint(on);\n const matchQuery = useMediaQuery(matchMedia || \"-\");\n const isShown = matchOn || matchQuery;\n\n if (!isShown) {\n return null;\n }\n\n return React.createElement(\n // @ts-expect-error – this is a complex type\n as || React.Fragment,\n as ? (props as OtherProps) : undefined,\n children,\n );\n}\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`)):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`@blocz/react-responsive`]={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),c(t||!e||!e.__esModule?r(i,`default`,{value:e,enumerable:!0}):i,e)))(t);let l=[`em`,`ex`,`%`,`px`,`cm`,`mm`,`in`,`pt`,`pc`,`ch`,`rem`,`vh`,`vw`,`vmin`,`vmax`],u=[`width`,`height`];function d(e){return Object.keys(e).reduce((t,n)=>{let r=e[n];if(!Array.isArray(r)||r.length<=1)return t;let[i,a,o,...s]=r;if(s.length>0){let e=Error(`The following fields "${s}" have been ignored`);console.error(e)}if(typeof i!=`number`||typeof a!=`number`)return t;let c,d;typeof o==`string`?c=o:typeof o==`object`&&(d=o.direction,c=o.unit);let f=Math.min(i,a),p=Math.max(i,a),m=c&&l.includes(c)?c:`px`,h=d&&u.includes(d)?d:`width`;return t[n]=[f,p,m,h],t[`${n}Up`]=[f,1/0,m,h],t[`${n}Down`]=[0,p,m,h],t},{})}let f={xs:[0,575,`px`],sm:[576,767,`px`],md:[768,991,`px`],lg:[992,1199,`px`],xl:[1200,1/0,`px`]},p=t.createContext(d(f));function m({breakpoints:e=f,additionalBreakpoints:n,children:r}){return t.createElement(p.Provider,{value:d({...e,...n})},r)}function h(e){let t=[],[n,r,i,a]=e,o;return n!==0&&(o=`${n}${i}`,t.push(`(min-${a}:${o})`)),r!==1/0&&(o=`${r}${i}`,t.push(`(max-${a}:${o})`)),` `+t.join(` and `)}function g(e){return function(t=``){if(!t)return``;let n=t.split(` `),r=n.map(t=>e[t]).filter(Boolean).map(e=>h(e)).filter(Boolean).join(`,`);if(!r){let e=n.length===1;console.error(`"${n.join(`", "`)}" ${e?`is`:`are`}n't ${e?`a `:``}valid breakpoint${e?``:`s`}`)}return r}}function _(e){let n=t.useMemo(()=>matchMedia(e),[e]);return t.useSyncExternalStore(t.useCallback(e=>(n.addListener(e),()=>n.removeListener(e)),[n]),()=>n.matches)}function v(e){let n=t.useContext(p),r=t.useMemo(()=>g(n),[n]);return _(t.useMemo(()=>r(e),[r,e])||`-`)}function y({matchMedia:e,on:n,as:r,children:i,...a}){let o=v(n),s=_(e||`-`);return o||s?t.createElement(r||t.Fragment,r?a:void 0,i):null}e.BreakpointsContext=p,e.BreakpointsProvider=m,e.Only=y,e.useBreakpoint=v,e.useMediaQuery=_});
|
|
1
|
+
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`)):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`@blocz/react-responsive`]={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),c(t||!e||!e.__esModule?r(i,`default`,{value:e,enumerable:!0}):i,e)))(t);let l=[`em`,`ex`,`%`,`px`,`cm`,`mm`,`in`,`pt`,`pc`,`ch`,`rem`,`vh`,`vw`,`vmin`,`vmax`],u=[`width`,`height`];function d(e){return Object.keys(e).reduce((t,n)=>{let r=e[n];if(!Array.isArray(r)||r.length<=1)return t;let[i,a,o,...s]=r;if(s.length>0){let e=Error(`The following fields "${s}" have been ignored`);console.error(e)}if(typeof i!=`number`||typeof a!=`number`)return t;let c,d;typeof o==`string`?c=o:typeof o==`object`&&(d=o.direction,c=o.unit);let f=Math.min(i,a),p=Math.max(i,a),m=c&&l.includes(c)?c:`px`,h=d&&u.includes(d)?d:`width`;return t[n]=[f,p,m,h],t[`${n}Up`]=[f,1/0,m,h],t[`${n}Down`]=[0,p,m,h],t},{})}let f={xs:[0,575,`px`],sm:[576,767,`px`],md:[768,991,`px`],lg:[992,1199,`px`],xl:[1200,1/0,`px`]},p=t.createContext(d(f));function m({breakpoints:e=f,additionalBreakpoints:n,children:r}){return t.createElement(p.Provider,{value:d({...e,...n})},r)}function h(e){let t=[],[n,r,i,a]=e,o;return n!==0&&(o=`${n}${i}`,t.push(`(min-${a}:${o})`)),r!==1/0&&(o=`${r}${i}`,t.push(`(max-${a}:${o})`)),` `+t.join(` and `)}function g(e){return function(t=``){if(!t)return``;let n=t.split(` `),r=n.map(t=>e[t]).filter(Boolean).map(e=>h(e)).filter(Boolean).join(`,`);if(!r){let e=n.length===1;console.error(`"${n.join(`", "`)}" ${e?`is`:`are`}n't ${e?`a `:``}valid breakpoint${e?``:`s`}`)}return r}}function _(e){let n=t.useMemo(()=>matchMedia(e),[e]);return t.useSyncExternalStore(t.useCallback(e=>(n.addListener(e),()=>n.removeListener(e)),[n]),()=>n.matches,()=>n.matches)}function v(e){let n=t.useContext(p),r=t.useMemo(()=>g(n),[n]);return _(t.useMemo(()=>r(e),[r,e])||`-`)}function y({matchMedia:e,on:n,as:r,children:i,...a}){let o=v(n),s=_(e||`-`);return o||s?t.createElement(r||t.Fragment,r?a:void 0,i):null}e.BreakpointsContext=p,e.BreakpointsProvider=m,e.Only=y,e.useBreakpoint=v,e.useMediaQuery=_});
|
|
2
2
|
//# sourceMappingURL=react-responsive.umd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-responsive.umd.js","names":["React","React","React","React"],"sources":["../src/sanitize.ts","../src/BreakpointsContext.tsx","../src/fromBreakpointToMedia.ts","../src/mediaQueryBuilder.ts","../src/useMediaQuery.ts","../src/useBreakpoint.ts","../src/Only.tsx"],"sourcesContent":["export type Units =\n | \"em\"\n | \"ex\"\n | \"%\"\n | \"px\"\n | \"cm\"\n | \"mm\"\n | \"in\"\n | \"pt\"\n | \"pc\"\n | \"ch\"\n | \"rem\"\n | \"vh\"\n | \"vw\"\n | \"vmin\"\n | \"vmax\";\n\nconst listOfSupportedUnits: Units[] = [\n \"em\",\n \"ex\",\n \"%\",\n \"px\",\n \"cm\",\n \"mm\",\n \"in\",\n \"pt\",\n \"pc\",\n \"ch\",\n \"rem\",\n \"vh\",\n \"vw\",\n \"vmin\",\n \"vmax\",\n];\n\ntype Directions = \"width\" | \"height\";\n\nconst listOfSupportedDirections: Directions[] = [\"width\", \"height\"];\n\nexport type ExposedBreakpoint =\n | [number, number]\n | [number, number, Units]\n | [number, number, { unit?: Units; direction?: Directions }];\n\nexport interface ExposedBreakpoints {\n [key: string]: ExposedBreakpoint;\n}\n\nexport type Breakpoint = [number, number, Units, Directions];\n\nexport interface Breakpoints {\n [breakpoint: string]: Breakpoint;\n}\n\nexport function sanitize(inBreakpoints: ExposedBreakpoints): Breakpoints {\n return Object.keys(inBreakpoints).reduce<Breakpoints>((breakpoints, breakpointName) => {\n const breakpoint = inBreakpoints[breakpointName];\n\n if (!Array.isArray(breakpoint) || breakpoint.length <= 1) {\n return breakpoints;\n }\n\n const [supposedMin, supposedMax, options, ...rest] = breakpoint;\n if (rest.length > 0) {\n const error = new Error(`The following fields \"${rest}\" have been ignored`);\n console.error(error);\n }\n\n if (typeof supposedMin !== \"number\" || typeof supposedMax !== \"number\") {\n return breakpoints;\n }\n\n let supposedUnit: Units | undefined;\n let supposedDirection: Directions | undefined;\n if (typeof options === \"string\") {\n supposedUnit = options;\n } else if (typeof options === \"object\") {\n supposedDirection = options.direction;\n supposedUnit = options.unit;\n }\n\n const min = Math.min(supposedMin, supposedMax);\n const max = Math.max(supposedMin, supposedMax);\n const unit = supposedUnit && listOfSupportedUnits.includes(supposedUnit) ? supposedUnit : \"px\";\n const direction =\n supposedDirection && listOfSupportedDirections.includes(supposedDirection) ? supposedDirection : \"width\";\n\n breakpoints[breakpointName] = [min, max, unit, direction];\n breakpoints[`${breakpointName}Up`] = [min, Infinity, unit, direction];\n breakpoints[`${breakpointName}Down`] = [0, max, unit, direction];\n\n return breakpoints;\n }, {});\n}\n","import * as React from \"react\";\n\nimport { sanitize, ExposedBreakpoints, Breakpoints } from \"./sanitize\";\n\nconst defaultBreakpoints: ExposedBreakpoints = {\n xs: [0, 575, \"px\"], // Extra small devices (portrait phones)\n sm: [576, 767, \"px\"], // Small devices (landscape phones)\n md: [768, 991, \"px\"], // Medium devices (tablets)\n lg: [992, 1199, \"px\"], // Large devices (desktops)\n xl: [1200, Infinity, \"px\"], // Extra large devices (large desktops)\n};\n\nexport const BreakpointsContext: React.Context<Breakpoints> = React.createContext<Breakpoints>(\n sanitize(defaultBreakpoints),\n);\n\ninterface BreakpointsProviderProps {\n breakpoints?: ExposedBreakpoints;\n additionalBreakpoints?: ExposedBreakpoints;\n}\n\nexport function BreakpointsProvider({\n breakpoints = defaultBreakpoints,\n additionalBreakpoints,\n children,\n}: React.PropsWithChildren<BreakpointsProviderProps>): React.ReactElement {\n return (\n <BreakpointsContext.Provider\n value={sanitize({\n ...breakpoints,\n ...additionalBreakpoints,\n })}\n >\n {children}\n </BreakpointsContext.Provider>\n );\n}\n","import { Breakpoint } from \"./sanitize\";\n\nexport function fromBreakpointToMedia(breakpoint: Breakpoint): string {\n const mediaList: string[] = [];\n const [minValue, maxValue, unit, direction] = breakpoint;\n let str;\n\n // Min value\n if (minValue !== 0) {\n str = `${minValue}${unit}`;\n mediaList.push(`(min-${direction}:${str})`);\n }\n\n // Max value\n if (maxValue !== Infinity) {\n str = `${maxValue}${unit}`;\n mediaList.push(`(max-${direction}:${str})`);\n }\n\n return \" \" + mediaList.join(\" and \");\n}\n","import { Breakpoints } from \"./sanitize\";\nimport { fromBreakpointToMedia } from \"./fromBreakpointToMedia\";\n\nexport function mediaQueryBuilder(breakpoints: Breakpoints) {\n return function toMediaQuery(on = \"\"): string {\n if (!on) {\n return \"\";\n }\n const rawBreakpointNames = on.split(\" \");\n const filteredBreakpoints = rawBreakpointNames.map((breakpointName) => breakpoints[breakpointName]).filter(Boolean);\n const mediaQuery = filteredBreakpoints\n .map((breakpoint) => fromBreakpointToMedia(breakpoint))\n .filter(Boolean)\n .join(\",\");\n if (!mediaQuery) {\n const isUniqBreakpoint = rawBreakpointNames.length === 1;\n console.error(\n `\"${rawBreakpointNames.join('\", \"')}\" ${isUniqBreakpoint ? \"is\" : \"are\"}n't ${\n isUniqBreakpoint ? \"a \" : \"\"\n }valid breakpoint${isUniqBreakpoint ? \"\" : \"s\"}`,\n );\n }\n return mediaQuery;\n };\n}\n","import * as React from \"react\";\n\nexport function useMediaQuery(mediaQuery: string): boolean {\n const mediaQueryList = React.useMemo(() => matchMedia(mediaQuery), [mediaQuery]);\n\n // Those are important updates, so we don't want to use transitions on them\n return React.useSyncExternalStore(\n React.useCallback(\n (callback) => {\n // cannot use addEventListener for IE 11 and safari 13-\n mediaQueryList.addListener(callback);\n return () => mediaQueryList.removeListener(callback);\n },\n [mediaQueryList],\n ),\n () => mediaQueryList.matches,\n // Don't add `() => false`, so that node implementations can define their own behavior for server-side rendering via `mock-match-media`\n );\n}\n","import * as React from \"react\";\n\nimport { BreakpointsContext } from \"./BreakpointsContext\";\n\nimport { mediaQueryBuilder } from \"./mediaQueryBuilder\";\n\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport function useBreakpoint(on?: string): boolean {\n const breakpoints = React.useContext(BreakpointsContext);\n const toMediaQuery = React.useMemo(() => mediaQueryBuilder(breakpoints), [breakpoints]);\n\n const mediaQuery = React.useMemo(() => toMediaQuery(on), [toMediaQuery, on]);\n\n return useMediaQuery(mediaQuery || \"-\");\n}\n","import * as React from \"react\";\n\nimport { useBreakpoint } from \"./useBreakpoint\";\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport type OnlyProps<OtherProps = Record<string, never>> = OtherProps & {\n matchMedia?: string;\n on?: string;\n as?: string | React.ComponentType<OtherProps>;\n};\n\nexport function Only<OtherProps = Record<string, never>>({\n matchMedia,\n on,\n as,\n children,\n ...props\n}: React.PropsWithChildren<OnlyProps<OtherProps>>): React.ReactElement | null {\n const matchOn = useBreakpoint(on);\n const matchQuery = useMediaQuery(matchMedia || \"-\");\n const isShown = matchOn || matchQuery;\n\n if (!isShown) {\n return null;\n }\n\n return React.createElement(\n // @ts-expect-error – this is a complex type\n as || React.Fragment,\n as ? (props as OtherProps) : undefined,\n children,\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-responsive.umd.js","names":["React","React","React","React"],"sources":["../src/sanitize.ts","../src/BreakpointsContext.tsx","../src/fromBreakpointToMedia.ts","../src/mediaQueryBuilder.ts","../src/useMediaQuery.ts","../src/useBreakpoint.ts","../src/Only.tsx"],"sourcesContent":["export type Units =\n | \"em\"\n | \"ex\"\n | \"%\"\n | \"px\"\n | \"cm\"\n | \"mm\"\n | \"in\"\n | \"pt\"\n | \"pc\"\n | \"ch\"\n | \"rem\"\n | \"vh\"\n | \"vw\"\n | \"vmin\"\n | \"vmax\";\n\nconst listOfSupportedUnits: Units[] = [\n \"em\",\n \"ex\",\n \"%\",\n \"px\",\n \"cm\",\n \"mm\",\n \"in\",\n \"pt\",\n \"pc\",\n \"ch\",\n \"rem\",\n \"vh\",\n \"vw\",\n \"vmin\",\n \"vmax\",\n];\n\ntype Directions = \"width\" | \"height\";\n\nconst listOfSupportedDirections: Directions[] = [\"width\", \"height\"];\n\nexport type ExposedBreakpoint =\n | [number, number]\n | [number, number, Units]\n | [number, number, { unit?: Units; direction?: Directions }];\n\nexport interface ExposedBreakpoints {\n [key: string]: ExposedBreakpoint;\n}\n\nexport type Breakpoint = [number, number, Units, Directions];\n\nexport interface Breakpoints {\n [breakpoint: string]: Breakpoint;\n}\n\nexport function sanitize(inBreakpoints: ExposedBreakpoints): Breakpoints {\n return Object.keys(inBreakpoints).reduce<Breakpoints>((breakpoints, breakpointName) => {\n const breakpoint = inBreakpoints[breakpointName];\n\n if (!Array.isArray(breakpoint) || breakpoint.length <= 1) {\n return breakpoints;\n }\n\n const [supposedMin, supposedMax, options, ...rest] = breakpoint;\n if (rest.length > 0) {\n const error = new Error(`The following fields \"${rest}\" have been ignored`);\n console.error(error);\n }\n\n if (typeof supposedMin !== \"number\" || typeof supposedMax !== \"number\") {\n return breakpoints;\n }\n\n let supposedUnit: Units | undefined;\n let supposedDirection: Directions | undefined;\n if (typeof options === \"string\") {\n supposedUnit = options;\n } else if (typeof options === \"object\") {\n supposedDirection = options.direction;\n supposedUnit = options.unit;\n }\n\n const min = Math.min(supposedMin, supposedMax);\n const max = Math.max(supposedMin, supposedMax);\n const unit = supposedUnit && listOfSupportedUnits.includes(supposedUnit) ? supposedUnit : \"px\";\n const direction =\n supposedDirection && listOfSupportedDirections.includes(supposedDirection) ? supposedDirection : \"width\";\n\n breakpoints[breakpointName] = [min, max, unit, direction];\n breakpoints[`${breakpointName}Up`] = [min, Infinity, unit, direction];\n breakpoints[`${breakpointName}Down`] = [0, max, unit, direction];\n\n return breakpoints;\n }, {});\n}\n","import * as React from \"react\";\n\nimport { sanitize, ExposedBreakpoints, Breakpoints } from \"./sanitize\";\n\nconst defaultBreakpoints: ExposedBreakpoints = {\n xs: [0, 575, \"px\"], // Extra small devices (portrait phones)\n sm: [576, 767, \"px\"], // Small devices (landscape phones)\n md: [768, 991, \"px\"], // Medium devices (tablets)\n lg: [992, 1199, \"px\"], // Large devices (desktops)\n xl: [1200, Infinity, \"px\"], // Extra large devices (large desktops)\n};\n\nexport const BreakpointsContext: React.Context<Breakpoints> = React.createContext<Breakpoints>(\n sanitize(defaultBreakpoints),\n);\n\ninterface BreakpointsProviderProps {\n breakpoints?: ExposedBreakpoints;\n additionalBreakpoints?: ExposedBreakpoints;\n}\n\nexport function BreakpointsProvider({\n breakpoints = defaultBreakpoints,\n additionalBreakpoints,\n children,\n}: React.PropsWithChildren<BreakpointsProviderProps>): React.ReactElement {\n return (\n <BreakpointsContext.Provider\n value={sanitize({\n ...breakpoints,\n ...additionalBreakpoints,\n })}\n >\n {children}\n </BreakpointsContext.Provider>\n );\n}\n","import { Breakpoint } from \"./sanitize\";\n\nexport function fromBreakpointToMedia(breakpoint: Breakpoint): string {\n const mediaList: string[] = [];\n const [minValue, maxValue, unit, direction] = breakpoint;\n let str;\n\n // Min value\n if (minValue !== 0) {\n str = `${minValue}${unit}`;\n mediaList.push(`(min-${direction}:${str})`);\n }\n\n // Max value\n if (maxValue !== Infinity) {\n str = `${maxValue}${unit}`;\n mediaList.push(`(max-${direction}:${str})`);\n }\n\n return \" \" + mediaList.join(\" and \");\n}\n","import { Breakpoints } from \"./sanitize\";\nimport { fromBreakpointToMedia } from \"./fromBreakpointToMedia\";\n\nexport function mediaQueryBuilder(breakpoints: Breakpoints) {\n return function toMediaQuery(on = \"\"): string {\n if (!on) {\n return \"\";\n }\n const rawBreakpointNames = on.split(\" \");\n const filteredBreakpoints = rawBreakpointNames.map((breakpointName) => breakpoints[breakpointName]).filter(Boolean);\n const mediaQuery = filteredBreakpoints\n .map((breakpoint) => fromBreakpointToMedia(breakpoint))\n .filter(Boolean)\n .join(\",\");\n if (!mediaQuery) {\n const isUniqBreakpoint = rawBreakpointNames.length === 1;\n console.error(\n `\"${rawBreakpointNames.join('\", \"')}\" ${isUniqBreakpoint ? \"is\" : \"are\"}n't ${\n isUniqBreakpoint ? \"a \" : \"\"\n }valid breakpoint${isUniqBreakpoint ? \"\" : \"s\"}`,\n );\n }\n return mediaQuery;\n };\n}\n","import * as React from \"react\";\n\nexport function useMediaQuery(mediaQuery: string): boolean {\n const mediaQueryList = React.useMemo(() => matchMedia(mediaQuery), [mediaQuery]);\n\n // Those are important updates, so we don't want to use transitions on them\n return React.useSyncExternalStore(\n React.useCallback(\n (callback) => {\n // cannot use addEventListener for IE 11 and safari 13-\n mediaQueryList.addListener(callback);\n return () => mediaQueryList.removeListener(callback);\n },\n [mediaQueryList],\n ),\n () => mediaQueryList.matches,\n () => mediaQueryList.matches,\n );\n}\n","import * as React from \"react\";\n\nimport { BreakpointsContext } from \"./BreakpointsContext\";\n\nimport { mediaQueryBuilder } from \"./mediaQueryBuilder\";\n\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport function useBreakpoint(on?: string): boolean {\n const breakpoints = React.useContext(BreakpointsContext);\n const toMediaQuery = React.useMemo(() => mediaQueryBuilder(breakpoints), [breakpoints]);\n\n const mediaQuery = React.useMemo(() => toMediaQuery(on), [toMediaQuery, on]);\n\n return useMediaQuery(mediaQuery || \"-\");\n}\n","import * as React from \"react\";\n\nimport { useBreakpoint } from \"./useBreakpoint\";\nimport { useMediaQuery } from \"./useMediaQuery\";\n\nexport type OnlyProps<OtherProps = Record<string, never>> = OtherProps & {\n matchMedia?: string;\n on?: string;\n as?: string | React.ComponentType<OtherProps>;\n};\n\nexport function Only<OtherProps = Record<string, never>>({\n matchMedia,\n on,\n as,\n children,\n ...props\n}: React.PropsWithChildren<OnlyProps<OtherProps>>): React.ReactElement | null {\n const matchOn = useBreakpoint(on);\n const matchQuery = useMediaQuery(matchMedia || \"-\");\n const isShown = matchOn || matchQuery;\n\n if (!isShown) {\n return null;\n }\n\n return React.createElement(\n // @ts-expect-error – this is a complex type\n as || React.Fragment,\n as ? (props as OtherProps) : undefined,\n children,\n );\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocz/react-responsive",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.0.0",
|
|
4
4
|
"description": "🔍 <Only /> displays some contents for a specific screen size",
|
|
5
5
|
"source": "src/index.ts",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -43,6 +43,6 @@
|
|
|
43
43
|
"tsdown": "^0.22.0"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|
|
46
|
-
"react": "
|
|
46
|
+
"react": "18.0.0 - 19.x.x"
|
|
47
47
|
}
|
|
48
48
|
}
|
package/tsconfig.tsbuildinfo
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"fileNames":["../../node_modules/typescript/lib/lib.es5.d.ts","../../node_modules/typescript/lib/lib.es2015.d.ts","../../node_modules/typescript/lib/lib.es2016.d.ts","../../node_modules/typescript/lib/lib.es2017.d.ts","../../node_modules/typescript/lib/lib.es2018.d.ts","../../node_modules/typescript/lib/lib.es2019.d.ts","../../node_modules/typescript/lib/lib.dom.d.ts","../../node_modules/typescript/lib/lib.dom.iterable.d.ts","../../node_modules/typescript/lib/lib.dom.asynciterable.d.ts","../../node_modules/typescript/lib/lib.webworker.importscripts.d.ts","../../node_modules/typescript/lib/lib.scripthost.d.ts","../../node_modules/typescript/lib/lib.es2015.core.d.ts","../../node_modules/typescript/lib/lib.es2015.collection.d.ts","../../node_modules/typescript/lib/lib.es2015.generator.d.ts","../../node_modules/typescript/lib/lib.es2015.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.promise.d.ts","../../node_modules/typescript/lib/lib.es2015.proxy.d.ts","../../node_modules/typescript/lib/lib.es2015.reflect.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2016.array.include.d.ts","../../node_modules/typescript/lib/lib.es2016.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.arraybuffer.d.ts","../../node_modules/typescript/lib/lib.es2017.date.d.ts","../../node_modules/typescript/lib/lib.es2017.object.d.ts","../../node_modules/typescript/lib/lib.es2017.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2017.string.d.ts","../../node_modules/typescript/lib/lib.es2017.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.typedarrays.d.ts","../../node_modules/typescript/lib/lib.es2018.asyncgenerator.d.ts","../../node_modules/typescript/lib/lib.es2018.asynciterable.d.ts","../../node_modules/typescript/lib/lib.es2018.intl.d.ts","../../node_modules/typescript/lib/lib.es2018.promise.d.ts","../../node_modules/typescript/lib/lib.es2018.regexp.d.ts","../../node_modules/typescript/lib/lib.es2019.array.d.ts","../../node_modules/typescript/lib/lib.es2019.object.d.ts","../../node_modules/typescript/lib/lib.es2019.string.d.ts","../../node_modules/typescript/lib/lib.es2019.symbol.d.ts","../../node_modules/typescript/lib/lib.es2019.intl.d.ts","../../node_modules/typescript/lib/lib.decorators.d.ts","../../node_modules/typescript/lib/lib.decorators.legacy.d.ts","../../node_modules/typescript/lib/lib.es2019.full.d.ts","../../node_modules/rolldown/dist/shared/logging-c6h4g8da.d.mts","../../node_modules/@oxc-project/types/types.d.ts","../../node_modules/rolldown/dist/shared/binding-zh1vcmbm.d.mts","../../node_modules/@rolldown/pluginutils/dist/filter/composable-filters.d.ts","../../node_modules/@rolldown/pluginutils/dist/filter/filter-vite-plugins.d.ts","../../node_modules/@rolldown/pluginutils/dist/filter/simple-filters.d.ts","../../node_modules/@rolldown/pluginutils/dist/filter/index.d.ts","../../node_modules/@rolldown/pluginutils/dist/index.d.ts","../../node_modules/rolldown/dist/shared/define-config-5hj1b9vg.d.mts","../../node_modules/rolldown/dist/index.d.mts","../../node_modules/tsdown/dist/index-ctz4qxd_.d.mts","../../node_modules/hookable/dist/index.d.mts","../../node_modules/rolldown/dist/shared/transform-dgz3pasd.d.mts","../../node_modules/rolldown/dist/shared/constructors-d0w3rnfa.d.mts","../../node_modules/rolldown/dist/experimental-index.d.mts","../../node_modules/get-tsconfig/dist/index.d.mts","../../node_modules/rolldown-plugin-dts/dist/index.d.mts","../../node_modules/tsdown/dist/types-cqasba5u.d.mts","../../node_modules/tsdown/dist/config-bweum0f3.d.mts","../../node_modules/tsdown/dist/index.d.mts","./tsdown.config.ts","../../node_modules/@types/react/global.d.ts","../../node_modules/csstype/index.d.ts","../../node_modules/@types/react/index.d.ts","./lib/react-responsive.d.cts","./lib/react-responsive.d.mts","./src/sanitize.ts","./src/breakpointscontext.tsx","./src/frombreakpointtomedia.ts","./src/mediaquerybuilder.ts","./src/usemediaquery.ts","./src/usebreakpoint.ts","./src/only.tsx","./src/index.ts"],"fileIdsList":[[46,47,48],[49],[64,65],[52,57,58],[45,51,55,56],[43,45,51],[44],[45,51],[43,44,45,50],[43,45],[60],[52],[52,53,60,61],[52,53,54,59],[66],[66,69],[69],[69,70,73,74,75],[69,71],[66,73,74],[66,70,72,73],[62]],"fileInfos":[{"version":"bcd24271a113971ba9eb71ff8cb01bc6b0f872a85c23fdbe5d93065b375933cd","affectsGlobalScope":true,"impliedFormat":1},{"version":"3f88bedbeb09c6f5a6645cb24c7c55f1aa22d19ae96c8e6959cbd8b85a707bc6","impliedFormat":1},{"version":"7fe93b39b810eadd916be8db880dd7f0f7012a5cc6ffb62de8f62a2117fa6f1f","impliedFormat":1},{"version":"bb0074cc08b84a2374af33d8bf044b80851ccc9e719a5e202eacf40db2c31600","impliedFormat":1},{"version":"1a7daebe4f45fb03d9ec53d60008fbf9ac45a697fdc89e4ce218bc94b94f94d6","impliedFormat":1},{"version":"f94b133a3cb14a288803be545ac2683e0d0ff6661bcd37e31aaaec54fc382aed","impliedFormat":1},{"version":"d6b1eba8496bdd0eed6fc8a685768fe01b2da4a0388b5fe7df558290bffcf32f","affectsGlobalScope":true,"impliedFormat":1},{"version":"7f57fc4404ff020bc45b9c620aff2b40f700b95fe31164024c453a5e3c163c54","impliedFormat":1},{"version":"7f57fc4404ff020bc45b9c620aff2b40f700b95fe31164024c453a5e3c163c54","impliedFormat":1},{"version":"2a2de5b9459b3fc44decd9ce6100b72f1b002ef523126c1d3d8b2a4a63d74d78","affectsGlobalScope":true,"impliedFormat":1},{"version":"f13f4b465c99041e912db5c44129a94588e1aafee35a50eab51044833f50b4ee","affectsGlobalScope":true,"impliedFormat":1},{"version":"eadcffda2aa84802c73938e589b9e58248d74c59cb7fcbca6474e3435ac15504","affectsGlobalScope":true,"impliedFormat":1},{"version":"105ba8ff7ba746404fe1a2e189d1d3d2e0eb29a08c18dded791af02f29fb4711","affectsGlobalScope":true,"impliedFormat":1},{"version":"00343ca5b2e3d48fa5df1db6e32ea2a59afab09590274a6cccb1dbae82e60c7c","affectsGlobalScope":true,"impliedFormat":1},{"version":"ebd9f816d4002697cb2864bea1f0b70a103124e18a8cd9645eeccc09bdf80ab4","affectsGlobalScope":true,"impliedFormat":1},{"version":"2c1afac30a01772cd2a9a298a7ce7706b5892e447bb46bdbeef720f7b5da77ad","affectsGlobalScope":true,"impliedFormat":1},{"version":"7b0225f483e4fa685625ebe43dd584bb7973bbd84e66a6ba7bbe175ee1048b4f","affectsGlobalScope":true,"impliedFormat":1},{"version":"c0a4b8ac6ce74679c1da2b3795296f5896e31c38e888469a8e0f99dc3305de60","affectsGlobalScope":true,"impliedFormat":1},{"version":"3084a7b5f569088e0146533a00830e206565de65cae2239509168b11434cd84f","affectsGlobalScope":true,"impliedFormat":1},{"version":"c5079c53f0f141a0698faa903e76cb41cd664e3efb01cc17a5c46ec2eb0bef42","affectsGlobalScope":true,"impliedFormat":1},{"version":"32cafbc484dea6b0ab62cf8473182bbcb23020d70845b406f80b7526f38ae862","affectsGlobalScope":true,"impliedFormat":1},{"version":"fca4cdcb6d6c5ef18a869003d02c9f0fd95df8cfaf6eb431cd3376bc034cad36","affectsGlobalScope":true,"impliedFormat":1},{"version":"b93ec88115de9a9dc1b602291b85baf825c85666bf25985cc5f698073892b467","affectsGlobalScope":true,"impliedFormat":1},{"version":"f5c06dcc3fe849fcb297c247865a161f995cc29de7aa823afdd75aaaddc1419b","affectsGlobalScope":true,"impliedFormat":1},{"version":"b77e16112127a4b169ef0b8c3a4d730edf459c5f25fe52d5e436a6919206c4d7","affectsGlobalScope":true,"impliedFormat":1},{"version":"fbffd9337146eff822c7c00acbb78b01ea7ea23987f6c961eba689349e744f8c","affectsGlobalScope":true,"impliedFormat":1},{"version":"a995c0e49b721312f74fdfb89e4ba29bd9824c770bbb4021d74d2bf560e4c6bd","affectsGlobalScope":true,"impliedFormat":1},{"version":"c7b3542146734342e440a84b213384bfa188835537ddbda50d30766f0593aff9","affectsGlobalScope":true,"impliedFormat":1},{"version":"ce6180fa19b1cccd07ee7f7dbb9a367ac19c0ed160573e4686425060b6df7f57","affectsGlobalScope":true,"impliedFormat":1},{"version":"3f02e2476bccb9dbe21280d6090f0df17d2f66b74711489415a8aa4df73c9675","affectsGlobalScope":true,"impliedFormat":1},{"version":"45e3ab34c1c013c8ab2dc1ba4c80c780744b13b5676800ae2e3be27ae862c40c","affectsGlobalScope":true,"impliedFormat":1},{"version":"805c86f6cca8d7702a62a844856dbaa2a3fd2abef0536e65d48732441dde5b5b","affectsGlobalScope":true,"impliedFormat":1},{"version":"e42e397f1a5a77994f0185fd1466520691456c772d06bf843e5084ceb879a0ad","affectsGlobalScope":true,"impliedFormat":1},{"version":"f4c2b41f90c95b1c532ecc874bd3c111865793b23aebcc1c3cbbabcd5d76ffb0","affectsGlobalScope":true,"impliedFormat":1},{"version":"ab26191cfad5b66afa11b8bf935ef1cd88fabfcb28d30b2dfa6fad877d050332","affectsGlobalScope":true,"impliedFormat":1},{"version":"2088bc26531e38fb05eedac2951480db5309f6be3fa4a08d2221abb0f5b4200d","affectsGlobalScope":true,"impliedFormat":1},{"version":"cb9d366c425fea79716a8fb3af0d78e6b22ebbab3bd64d25063b42dc9f531c1e","affectsGlobalScope":true,"impliedFormat":1},{"version":"500934a8089c26d57ebdb688fc9757389bb6207a3c8f0674d68efa900d2abb34","affectsGlobalScope":true,"impliedFormat":1},{"version":"689da16f46e647cef0d64b0def88910e818a5877ca5379ede156ca3afb780ac3","affectsGlobalScope":true,"impliedFormat":1},{"version":"1ce14b81c5cc821994aa8ec1d42b220dd41b27fcc06373bce3958af7421b77d4","affectsGlobalScope":true,"impliedFormat":1},{"version":"b3a048b3e9302ef9a34ef4ebb9aecfb28b66abb3bce577206a79fee559c230da","affectsGlobalScope":true,"impliedFormat":1},{"version":"e3de8409485b0c198a5a075bd4a1d06d8f42dc52b377709d33b131b97de56456","impliedFormat":1},{"version":"c73fdf42528325dd17940937ed787b15ae3445c6a2dae1a2b74bc4d87d337ca2","impliedFormat":99},{"version":"e8e17dfef3cfa9f0847ac93dd535a9896af7fb57c1a1b164484bb1b0ee4a25d8","impliedFormat":99},{"version":"51d2ffea2d1ee4a81c775938588c1e16620281adb60cbc26579a2fc6baa10bd2","impliedFormat":99},{"version":"148debd12783ded0a60d115daeacd8136f77757ae89a05c4e18de6dd77646fd2","impliedFormat":99},{"version":"0088b02dca63c47b273a140d0a3944bdc6dc2eb765fff0ca98e3c3a2786b3a5a","impliedFormat":99},{"version":"a651d06b780fa354231f19b040cbcde484bede3218885752b4f9e9a8f72d3b5f","impliedFormat":99},{"version":"06e26f75bed4c8389a8a63f0e6d6a9068038873dc95d8d1338e8c370a0ae8bc3","impliedFormat":99},{"version":"a2155e2675fd1af52b0b70779371c28611cdd1076b29d0f68bf93b983e5ddce0","impliedFormat":99},{"version":"a413e4b0b99280e1e58f5fe7b2b585e8a9be4996df8c58585399c9e2ca8a683e","impliedFormat":99},{"version":"609ab2c225766bc0851251c1db0fd5492673e190074045d21dc5dc7c3c46d785","impliedFormat":99},{"version":"20d4521e9c8b38361b5f6a08e0d37979e1ac25c79262fb415a1b28144ba22ca3","impliedFormat":99},{"version":"ff950ba5f6f793019656541f9a5d08c7d8b715305a8780861f1c43b6883fd04d","affectsGlobalScope":true,"impliedFormat":99},{"version":"5a9834c603c65aee5cba0c1d6b3c7aee85cdc7862832a23165c6aa4139c165f2","impliedFormat":99},{"version":"7f3857dc5cfe1e5e977edb14e931d9939a952e8e41997263a927f8f0299ea652","impliedFormat":99},{"version":"cf1f6108a913a1ca87a3add1b0620160939a1928018d7cfe51130b475dc999e7","impliedFormat":99},{"version":"bb69672ec6bfda990fd8461747a95ef2391e6aa853cd47bc97fa72e2df753dd5","impliedFormat":99},{"version":"f85a56fc7396bc665913166dee7d5921c4801cbfe595942d9cd46d9919d33d78","impliedFormat":99},{"version":"3aa985bad725d47ead2df14b6f65a40c091a92a30f5c23df24fa0ff2a8a70e86","impliedFormat":99},{"version":"462afa79c9ca13850b4b5d1a3fbc873c0a837e139d1c0a1523b87a58c7bf3fe4","impliedFormat":99},{"version":"394e5ee3e898e3fb4b32baf8a9a230d11f282e29c8d49a94d367a0b6fb120296","impliedFormat":99},{"version":"857a2114ba25161b60bcfe68c3735340bcd36407aa83fb0673b78a5f78af257e","signature":"fe2f383849bbe57bf295c0f0e107adcba1f2021ccc4d62bc0f1e48806ea5c97f"},{"version":"7e29f41b158de217f94cb9676bf9cbd0cd9b5a46e1985141ed36e075c52bf6ad","affectsGlobalScope":true,"impliedFormat":1},{"version":"ac51dd7d31333793807a6abaa5ae168512b6131bd41d9c5b98477fc3b7800f9f","impliedFormat":1},{"version":"dc0a7f107690ee5cd8afc8dbf05c4df78085471ce16bdd9881642ec738bc81fe","impliedFormat":1},{"version":"22ffa57b232e3694788733258b268a18b6c41fbc26df3211c04d68e941f9215f","impliedFormat":1},{"version":"22ffa57b232e3694788733258b268a18b6c41fbc26df3211c04d68e941f9215f","impliedFormat":99},{"version":"d259b107745b2d494f14ac20e167ec78ca1c0f69892fd978db4e9ce3de05197d","signature":"5fcabb6903051f0598764908a5d940e4e87538e1d5d8f3e5b0c6c5372dd1efd4"},{"version":"cddbb1367085c133c936c3a56bef4a355f42cbb96eaededf799927d3ac5a52e8","signature":"8f2e9ecdcd3b6ec45a1017dab51b069fadc75f195aefa7bdc0b99b70545f1917"},{"version":"7c9b78f4c8d79a9ad8e0e0f7e4eee21eb83a27f663d8e52bb6149c1a334697f6","signature":"cd069937e9f50b91e88abb05a75774bfb1412d46c16048c3abdc223c8342a64b"},{"version":"d2b6565e166682125191c665fdbf14d252a043456446d47a89745b06752b0696","signature":"47f0e5b1423529cfd6890792ad725f76b849a644996461ebb91ed0708cde8086"},{"version":"9ce2a61761223382f559fbb71248a7a6bd08000aa16e13688e190487f95244fc","signature":"a0fc9b22fd5599ca1720ad13cf1d6423ad57d139cb57ac42e478c7d8e5640826"},{"version":"ef5a79a2015a2c1081b34de10b4c2c338241d69e8a33d207e1cb1c0706131c52","signature":"2fad073531c9984272ee6e3ef0b0dea1f37d64dca02ee4d9122b0b052c721859"},"1a24bbd113e79ec424091e39ad3cc1f501f4aa00cd7d58dd61929f9e128fbb50","f00c1ea740cefe40fde62f03ae3f058dcb93b99b46e39532a4a9815bc149c768"],"root":[63,[67,76]],"options":{"allowJs":false,"alwaysStrict":true,"composite":true,"declaration":true,"isolatedDeclarations":true,"jsx":2,"module":99,"noFallthroughCasesInSwitch":true,"noImplicitAny":true,"noImplicitReturns":true,"noImplicitThis":true,"noUnusedLocals":true,"noUnusedParameters":true,"rootDir":"./","skipLibCheck":true,"strict":true,"strictFunctionTypes":true,"strictNullChecks":true,"target":6},"referencedMap":[[49,1],[50,2],[66,3],[59,4],[57,5],[52,6],[45,7],[56,8],[51,9],[55,10],[61,11],[53,12],[62,13],[60,14],[67,15],[68,15],[70,16],[71,17],[76,18],[72,19],[75,20],[74,21],[73,15],[63,22]],"affectedFilesPendingEmit":[[70,17],[71,17],[76,17],[72,17],[75,17],[69,17],[74,17],[73,17],[63,17]],"emitSignatures":[63,69,70,71,72,73,74,75,76],"version":"6.0.3"}
|