@nfq/react-grid/dist/esm/grid/Hidden.js

An fork of react-awesome-styled-grid with more screen classes and some features.

import _styled from '@emotion/styled/base';
import React from 'react';
import { useScreenSize } from '../hooks/useScreenSize.js';
import { configCache } from '../utils/cache.js';
import { media, mediaBetween } from '../utils/layout.js';

const Hidden = ({
  children,
  isLoadingHtml = false,
  ...screenSizes
}) => {
  const {
    breakpointOrder
  } = configCache.get('breakpointConfig');
  const screenSize = useScreenSize();
  if (isLoadingHtml) {
    return React.createElement(HiddenWrap, {
      $breakpointOrder: breakpointOrder,
      $classes: screenSizes
    }, children);
  }
  return screenSizes[screenSize] ? null : children;
};
const HiddenWrap = _styled(({
  children,
  ...props
}) => React.cloneElement(children, props), {
  target: "e1onwe6s0"
})(({
  $breakpointOrder,
  $classes
}) => $breakpointOrder.map((size, index) => {
  if ($classes[size]) {
    return $breakpointOrder.length - 1 === index ? `${media(size)} {
                    display: none!important;
                }` : `${mediaBetween(size, $breakpointOrder[index + 1])} {
                    display: none!important;
                }`;
  }
  return null;
}), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkhpZGRlbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBbUZrQiIsImZpbGUiOiJIaWRkZW4udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgc2VjdXJpdHkvZGV0ZWN0LW9iamVjdC1pbmplY3Rpb24sIHJlYWN0L2Jvb2xlYW4tcHJvcC1uYW1pbmcsIEB0eXBlc2NyaXB0LWVzbGludC9jb25zaXN0ZW50LWluZGV4ZWQtb2JqZWN0LXN0eWxlICovXG5pbXBvcnQgdHlwZSB7UmVhY3RFbGVtZW50fSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB7dXNlU2NyZWVuU2l6ZX0gZnJvbSAnLi4vaG9va3MvdXNlU2NyZWVuU2l6ZSc7XG5pbXBvcnQge2NvbmZpZ0NhY2hlfSBmcm9tICcuLi91dGlscy9jYWNoZSc7XG5pbXBvcnQge21lZGlhLCBtZWRpYUJldHdlZW59IGZyb20gJy4uL3V0aWxzL2xheW91dCc7XG5cbmltcG9ydCB0eXBlIHtCcmVha3BvaW50c30gZnJvbSAnLi4vc2hhcmVkVHlwZXMvYnJlYWtwb2ludFR5cGVzJztcbmltcG9ydCB0eXBlIHtCcmVha3BvaW50T2JqZWN0fSBmcm9tICcuLi9zaGFyZWRUeXBlcy9jb21wb25lbnRUeXBlcyc7XG5cbnR5cGUgQnJlYWtwb2ludFByb3BzID0ge1xuICAgIFtrZXkgaW4gQnJlYWtwb2ludHNdPzogYm9vbGVhbjtcbn07XG5cbi8qKlxuICogVGhpcyBpbnRlcmZhY2UgZXh0ZW5kcyBgQnJlYWtwb2ludFByb3BzYCwgYWxsb3dpbmcgYnJlYWtwb2ludC1zcGVjaWZpYyB2aXNpYmlsaXR5IGZsYWdzIChlLmcuLCBgeHNgLCBgbWRgLCBgbGdgKS5cbiAqIEl0IGRlZmluZXMgdGhlIGNvbnRlbnQgdG8gY29uZGl0aW9uYWxseSBoaWRlIChgY2hpbGRyZW5gKSBhbmQgYW4gb3B0aW9uYWwgYGlzTG9hZGluZ0h0bWxgIG1vZGVcbiAqIHRoYXQgZm9yY2VzIHRoZSBjb21wb25lbnQgdG8gcmVuZGVyIGl0cyBjb250ZW50IGluIHRoZSBET00gZXZlbiB3aGVuIGhpZGRlbuKAlHVzZWZ1bCBmb3IgU1NSIG9yIHN0YXRpYyBIVE1MLlxuICovXG5pbnRlcmZhY2UgQ29tcG9uZW50UHJvcHMgZXh0ZW5kcyBCcmVha3BvaW50UHJvcHMge1xuICAgIC8qKlxuICAgICAqIFRoZSBlbGVtZW50IHRoYXQgc2hvdWxkIGJlIGNvbmRpdGlvbmFsbHkgaGlkZGVuLlxuICAgICAqIE11c3QgYmUgYSBzaW5nbGUgYFJlYWN0RWxlbWVudGAgKGUuZy4sIGEgY29tcG9uZW50IG9yIERPTSBlbGVtZW50KS5cbiAgICAgKi9cbiAgICBjaGlsZHJlbjogUmVhY3RFbGVtZW50O1xuICAgIC8qKlxuICAgICAqIFNldCB0byBgdHJ1ZWAgdG8gcmVuZGVyIHRoZSBIVE1MIGVsZW1lbnQgaW4gdGhlIERPTSBldmVuIHdoZW4gaXQgaXMgdmlzdWFsbHkgaGlkZGVuLlxuICAgICAqIFRoaXMgaXMgdXNlZnVsIGZvciBzZXJ2ZXItc2lkZSByZW5kZXJpbmcgKFNTUikgb3Igc3RhdGljIG1hcmt1cCB3aGVyZSB2aXNpYmlsaXR5XG4gICAgICogaXMgbGF0ZXIgdG9nZ2xlZCBieSBDU1Mgb3IgY2xpZW50LXNpZGUgbG9naWMuXG4gICAgICovXG4gICAgaXNMb2FkaW5nSHRtbD86IGJvb2xlYW47XG59XG5cbi8qKlxuICogQ29uZGl0aW9uYWxseSBoaWRlcyBvciByZW5kZXJzIGl0cyBjaGlsZHJlbiBiYXNlZCBvbiB0aGUgY3VycmVudCBzY3JlZW4gc2l6ZS5cbiAqIFRoaXMgY29tcG9uZW50IGlzIHBhcnQgb2YgdGhlIGBAbmZxL3JlYWN0LWdyaWRgIHN5c3RlbSBhbmQgdXNlcyB0aGUgY29uZmlndXJlZCBicmVha3BvaW50IG1hcFxuICogdG8gZGV0ZXJtaW5lIHdoZXRoZXIgdG8gcmVuZGVyIG9yIGhpZGUgaXRzIGBjaGlsZHJlbmAuIEl0IHN1cHBvcnRzIHR3byBtb2RlczpcbiAqIC0gKipDbGllbnQgTW9kZSAoZGVmYXVsdCk6KiogSGlkZXMgYGNoaWxkcmVuYCBvbiBzcGVjaWZpYyBicmVha3BvaW50cyB1c2luZyBhIHNpbXBsZSBydW50aW1lIGNoZWNrLlxuICogLSAqKkhUTUwgTW9kZSAoYGlzTG9hZGluZ0h0bWwgPSB0cnVlYCk6KiogV3JhcHMgdGhlIGNoaWxkcmVuIGluIGEgYDxIaWRkZW5XcmFwIC8+YCBjb21wb25lbnQgdG8gcHJvZHVjZVxuICogU1NSLXNhZmUsIENTUy1iYXNlZCBoaWRkZW4gY29udGVudCBmb3Igc3RhdGljIG1hcmt1cCByZW5kZXJpbmcuXG4gKiBUaGUgY29tcG9uZW50IGV4cGVjdHMgYSBzZXQgb2YgYm9vbGVhbiBmbGFncyBtYXRjaGluZyBicmVha3BvaW50IG5hbWVzIChgeHNgLCBgbWRgLCBldGMuKSxcbiAqIHdoZXJlIGEgYHRydWVgIHZhbHVlIG1lYW5zIHRoZSBjaGlsZHJlbiBzaG91bGQgYmUgaGlkZGVuIGF0IHRoYXQgYnJlYWtwb2ludC5cbiAqXG4gKiBAcGFyYW0gcHJvcHMgICAgICAgICAgICAgICBUaGUgY29tcG9uZW50IHByb3BzLlxuICogQHBhcmFtIHByb3BzLmNoaWxkcmVuICAgICAgVGhlIGNvbnRlbnQgdG8gY29uZGl0aW9uYWxseSByZW5kZXIgb3IgaGlkZS5cbiAqIEBwYXJhbSBwcm9wcy5pc0xvYWRpbmdIdG1sIEVuYWJsZXMgU1NSLWZyaWVuZGx5IHJlbmRlcmluZyB1c2luZyBgPEhpZGRlbldyYXAgLz5gLiBEZWZhdWx0cyB0byBgZmFsc2VgLlxuICogQHBhcmFtIHByb3BzLltCcmVha3BvaW50c10gQm9vbGVhbiBmbGFncyBmb3IgZWFjaCBicmVha3BvaW50IChgdHJ1ZWAgPSBoaWRlLCBgZmFsc2VgID0gc2hvdykuXG4gKiBAcmV0dXJucyBUaGUgY2hpbGRyZW4gb3IgYG51bGxgLCBiYXNlZCBvbiB3aGV0aGVyIHRoZXkgc2hvdWxkIGJlIHZpc2libGUgYXQgdGhlIGN1cnJlbnQgYnJlYWtwb2ludC5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBgdHN4XG4gKiAvLyBIaWRlcyBjb250ZW50IG9ubHkgb24gJ21kJyBhbmQgJ2xnJyBicmVha3BvaW50c1xuICogPEhpZGRlbiBtZCBsZz5cbiAqICAgPFNpZGViYXIgLz5cbiAqIDwvSGlkZGVuPlxuICpcbiAqIC8vIFNTUi1zYWZlIHZlcnNpb24gb2YgdGhlIHNhbWUgbG9naWNcbiAqIDxIaWRkZW4gaXNMb2FkaW5nSHRtbCBtZCBsZz5cbiAqICAgPFNpZGViYXIgLz5cbiAqIDwvSGlkZGVuPlxuICogYGBgXG4gKi9cbmNvbnN0IEhpZGRlbiA9ICh7Y2hpbGRyZW4sIGlzTG9hZGluZ0h0bWwgPSBmYWxzZSwgLi4uc2NyZWVuU2l6ZXN9OiBDb21wb25lbnRQcm9wcykgPT4ge1xuICAgIGNvbnN0IHticmVha3BvaW50T3JkZXJ9ID0gY29uZmlnQ2FjaGUuZ2V0KCdicmVha3BvaW50Q29uZmlnJykhO1xuICAgIGNvbnN0IHNjcmVlblNpemUgPSB1c2VTY3JlZW5TaXplKCk7XG5cbiAgICBpZiAoaXNMb2FkaW5nSHRtbCkge1xuICAgICAgICByZXR1cm4gPEhpZGRlbldyYXAgJGJyZWFrcG9pbnRPcmRlcj17YnJlYWtwb2ludE9yZGVyfSAkY2xhc3Nlcz17c2NyZWVuU2l6ZXN9PntjaGlsZHJlbn08L0hpZGRlbldyYXA+O1xuICAgIH1cblxuICAgIHJldHVybiBzY3JlZW5TaXplc1tzY3JlZW5TaXplXSA/IG51bGwgOiBjaGlsZHJlbjtcbn07XG5cbmludGVyZmFjZSBIaWRkZW5XcmFwUHJvcHMge1xuICAgICRicmVha3BvaW50T3JkZXI6IEJyZWFrcG9pbnRzW107XG4gICAgJGNsYXNzZXM6IEJyZWFrcG9pbnRPYmplY3Q7XG59XG5cbmNvbnN0IEhpZGRlbldyYXAgPSBzdHlsZWQoXG4gICAgKHtjaGlsZHJlbiwgLi4ucHJvcHN9OiB7Y2hpbGRyZW46IFJlYWN0RWxlbWVudH0pID0+IFJlYWN0LmNsb25lRWxlbWVudChjaGlsZHJlbiwgcHJvcHMpXG4pPEhpZGRlbldyYXBQcm9wcz5gXG4gICAgJHsoeyRicmVha3BvaW50T3JkZXIsICRjbGFzc2VzfSkgPT4gJGJyZWFrcG9pbnRPcmRlci5tYXAoKHNpemUsIGluZGV4KSA9PiB7XG4gICAgICAgIGlmICgkY2xhc3Nlc1tzaXplXSkge1xuICAgICAgICAgICAgcmV0dXJuICgkYnJlYWtwb2ludE9yZGVyLmxlbmd0aCAtIDEgPT09IGluZGV4KVxuICAgICAgICAgICAgICAgID8gYCR7bWVkaWEoc2l6ZSl9IHtcbiAgICAgICAgICAgICAgICAgICAgZGlzcGxheTogbm9uZSFpbXBvcnRhbnQ7XG4gICAgICAgICAgICAgICAgfWBcbiAgICAgICAgICAgICAgICA6IGAke21lZGlhQmV0d2VlbihzaXplLCAkYnJlYWtwb2ludE9yZGVyW2luZGV4ICsgMV0pfSB7XG4gICAgICAgICAgICAgICAgICAgIGRpc3BsYXk6IG5vbmUhaW1wb3J0YW50O1xuICAgICAgICAgICAgICAgIH1gO1xuICAgICAgICB9XG5cbiAgICAgICAgcmV0dXJuIG51bGw7XG4gICAgfSl9XG5gO1xuXG5IaWRkZW4uZGlzcGxheU5hbWUgPSAnSGlkZGVuJztcblxuZXhwb3J0IHtIaWRkZW59OyJdfQ== */"));
Hidden.displayName = 'Hidden';

export { Hidden };
//# sourceMappingURL=Hidden.js.map