@retailmenot/anchor
Version:
A React UI Library by RetailMeNot
47 lines • 1.98 kB
JavaScript
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
// REACT
import * as React from 'react';
// VENDOR
import Responsive from 'react-responsive';
// COMPONENTS
import { ResponsiveContext } from '../ResponsiveProvider';
export const Adaptor = (_a) => {
var { from, to } = _a, props = __rest(_a, ["from", "to"]);
const { breakpoints } = React.useContext(ResponsiveContext);
const breakpointValues = {
minWidth: undefined,
maxWidth: undefined,
};
if ((from !== undefined || to !== undefined) && !breakpoints.length) {
/* eslint-disable-next-line */
console.warn(`When using the 'from' and/or 'to' props, the ResponsiveProvider must also be used.`);
return null;
}
if (from === undefined && to !== undefined) {
/* eslint-disable-next-line */
console.warn(`Although the 'from' prop can be used by itself, the 'to' prop requires 'from' to also exist`);
return null;
}
if (from) {
const min = breakpoints.find(bp => Object.keys(bp)[0] === from);
breakpointValues.minWidth =
typeof min === 'object' ? Object.values(min)[0] : undefined;
}
if (from && to) {
const max = breakpoints.find(bp => Object.keys(bp)[0] === to);
breakpointValues.maxWidth =
typeof max === 'object' ? Object.values(max)[0] : undefined;
}
return (React.createElement(Responsive, Object.assign({ className: "anchor-adaptor" }, breakpointValues, props)));
};
//# sourceMappingURL=Adaptor.component.js.map