@nfq/react-grid
Version:
An fork of react-awesome-styled-grid with more screen classes and some features.
614 lines (595 loc) • 129 kB
JavaScript
'use strict';
var _styled = require('@emotion/styled/base');
var React = require('react');
var react = require('@emotion/react');
var uuid = require('uuid');
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
var _styled__default = /*#__PURE__*/_interopDefault(_styled);
var React__default = /*#__PURE__*/_interopDefault(React);
function _extends() {
return _extends = Object.assign ? Object.assign.bind() : function (n) {
for (var e = 1; e < arguments.length; e++) {
var t = arguments[e];
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
}
return n;
}, _extends.apply(null, arguments);
}
const configCache = new Map();
const VAR_PREFIX = 'nfq-grid';
const defaultBaseSpacing = 0.5;
const defaultBreakpoints = {
lg: 992,
md: 769,
sm: 576,
xl: 1200,
xs: 0,
xxl: 1600
};
const defaultColumnGap = 20;
const defaultColumns = 12;
const defaultContainerPadding = 10;
const defaultDebug = {
col: {
background: '#9a67cb',
outline: '#ffffff',
padding: '#c2cf8a'
},
container: {
background: '#5901ad40',
outline: '#ffffff',
padding: '#c2cf8a'
},
row: {
background: '#5901ad40',
outline: '#ffffff',
padding: '#c2cf8a'
},
spacer: {
background: '#f9cc9d',
outline: '#ffffff',
padding: '#c2cf8a'
}
};
const defaultMediaQuery = 'only screen';
const defaultSkeleton = {
dark: {
animation: {
delay: 0.02,
direction: 'normal',
duration: 1.8
},
borderRadius: 0.4,
colors: {
base: 'rgba(0, 0, 102, 0.3)',
baseHighlight: 'rgba(0, 0, 102, 0)',
highlight: 'rgba(0, 0, 102, 0.3)'
}
},
light: {
animation: {
delay: 0.02,
direction: 'reverse',
duration: 1.8
},
borderRadius: 0.4,
colors: {
base: 'rgba(255, 255, 255, 0.3)',
baseHighlight: 'rgba(0, 0, 102, 0)',
highlight: 'rgba(0, 0, 102, 0.3)'
}
}
};
const defaultSkeletonDefault = 'dark';
const isObject = item => Boolean(item && typeof item === 'object' && !Array.isArray(item));
const isNotNullOrUndefined = input => input !== null && typeof input !== 'undefined';
const fillObject = (breakpoints, defaultValue) => breakpoints.reduce((acc, curr) => ({
...acc,
[curr]: defaultValue
}), {});
const mergeDeep = (target, source) => {
if (!source) {
return target;
}
if (isObject(target) && isObject(source)) {
Object.keys(source).forEach(key => {
if (isObject(source[key])) {
if (!target[key]) {
Object.assign(target, {
[key]: {}
});
}
mergeDeep(target[key], source[key]);
} else {
Object.assign(target, {
[key]: source[key]
});
}
});
}
return target;
};
const remapWithPrefix = (obj, prefix) => Object.fromEntries(Object.entries(obj).map(([key, value]) => [key, typeof value === 'string' ? value === 'fluid' ? '100%' : value : `${value}${prefix}`]));
const mergeScreens = (conf, breakpointOrder) => {
let lastValue = 0;
return breakpointOrder.map((screenSize, index) => {
if (index === 0 && conf[screenSize] === undefined || index === 0 && conf[screenSize] === lastValue) {
return {
key: screenSize,
val: lastValue
};
}
if (conf[screenSize] === undefined || conf[screenSize] === null || conf[screenSize] === lastValue) {
return null;
}
lastValue = conf[screenSize];
return {
key: screenSize,
val: lastValue
};
}).filter(isNotNullOrUndefined).reduce((acc, {
key,
val
}) => {
acc[key] = val;
return acc;
}, {});
};
const generateMediaString = screenSize => {
const {
breakpoints
} = configCache.get('breakpointConfig');
return `${defaultMediaQuery}${breakpoints[screenSize] >= 0 ? ` and (min-width: ${breakpoints[screenSize]}px)` : ''}`;
};
const generateMediaStringBetween = (screenSizeMin, screenSizeMax) => {
const {
breakpoints
} = configCache.get('breakpointConfig');
return `${defaultMediaQuery} and (min-width: ${breakpoints[screenSizeMin]}px) and (max-width: ${breakpoints[screenSizeMax] - 1}px)`;
};
const mediaInternal = screenSize => (...args) => react.css("@media ", generateMediaString(screenSize), "{", react.css(...args), ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImhlbHBlcnMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkl3SCIsImZpbGUiOiJoZWxwZXJzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgc2VjdXJpdHkvZGV0ZWN0LW9iamVjdC1pbmplY3Rpb24gKi9cbmltcG9ydCB7Y3NzfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7ZGVmYXVsdE1lZGlhUXVlcnl9IGZyb20gJy4uL2NvbmZpZy9kZWZhdWx0cyc7XG5cbmltcG9ydCB7Y29uZmlnQ2FjaGV9IGZyb20gJy4vY2FjaGUnO1xuaW1wb3J0IHtpc05vdE51bGxPclVuZGVmaW5lZH0gZnJvbSAnLi91dGlscyc7XG5cbmltcG9ydCB0eXBlIHtCcmVha3BvaW50c30gZnJvbSAnLi4vc2hhcmVkVHlwZXMvYnJlYWtwb2ludFR5cGVzJztcblxuLyoqXG4gKiBNZXJnZXMgYSBwYXJ0aWFsbHkgZGVmaW5lZCByZXNwb25zaXZlIGNvbmZpZ3VyYXRpb24gaW50byBhIGNvbXBhY3QgYnJlYWtwb2ludC10by12YWx1ZSBtYXAuXG4gKiBUaGlzIGZ1bmN0aW9uIGl0ZXJhdGVzIHRocm91Z2ggdGhlIHByb3ZpZGVkIGBicmVha3BvaW50T3JkZXJgIGFuZCBmaWx0ZXJzIG91dCByZWR1bmRhbnQgb3IgdW5kZWZpbmVkIHZhbHVlcy5cbiAqIElmIGEgdmFsdWUgYXQgYSBicmVha3BvaW50IGlzIHRoZSBzYW1lIGFzIHRoZSBwcmV2aW91cyBvbmUsIG9yIGlzIGB1bmRlZmluZWRgL2BudWxsYCwgaXQgaXMgb21pdHRlZCBmcm9tIHRoZSBmaW5hbCBvdXRwdXQuXG4gKiBUaGUgZ29hbCBpcyB0byBtaW5pbWl6ZSBkdXBsaWNhdGlvbiB3aGlsZSBwcmVzZXJ2aW5nIHRoZSBuZWNlc3Nhcnkgb3ZlcnJpZGVzIGFjcm9zcyBicmVha3BvaW50cy5cbiAqIFRoaXMgaXMgcGFydGljdWxhcmx5IHVzZWZ1bCBpbiBgQG5mcS9yZWFjdC1ncmlkYCBmb3Igb3B0aW1pemluZyB0aGUgY29uZmlndXJhdGlvbiBvZiBsYXlvdXQgcHJvcGVydGllcyBzdWNoIGFzXG4gKiBgY29sdW1uc2AsIGBjb2x1bW5HYXBgLCBgY29udGFpbmVyYCwgb3IgYGNvbnRhaW5lclBhZGRpbmdgLCBlbnN1cmluZyB0aGUgb3V0cHV0IG9ubHkgaW5jbHVkZXMgbWVhbmluZ2Z1bCBjaGFuZ2VzLlxuICpcbiAqIEBwYXJhbSBjb25mICAgICAgICAgICAgQSBwYXJ0aWFsIHJlY29yZCBvZiB2YWx1ZXMgaW5kZXhlZCBieSBicmVha3BvaW50IG5hbWVzLlxuICogQHBhcmFtIGJyZWFrcG9pbnRPcmRlciBBbiBvcmRlcmVkIGFycmF5IG9mIGJyZWFrcG9pbnRzIHRoYXQgZGV0ZXJtaW5lcyBpdGVyYXRpb24gYW5kIG92ZXJyaWRlIGhpZXJhcmNoeS5cbiAqIEByZXR1cm5zIEEgY2xlYW5lZC11cCB2ZXJzaW9uIG9mIHRoZSBpbnB1dCBvYmplY3QsIHdoZXJlIG9ubHkgZGlzdGluY3QgYW5kIGRlZmluZWQgYnJlYWtwb2ludCB2YWx1ZXMgYXJlIHByZXNlcnZlZC5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBgdHNcbiAqIGNvbnN0IHJlc3VsdCA9IG1lcmdlU2NyZWVucyhcbiAqICAgeyB4czogNCwgbWQ6IDQsIGxnOiA4LCB4bDogdW5kZWZpbmVkIH0sXG4gKiAgIFsneHMnLCAnbWQnLCAnbGcnLCAneGwnXVxuICogKTtcbiAqXG4gKiAvLyBSZXR1cm5zOlxuICogLy8ge1xuICogLy8gICB4czogNCxcbiAqIC8vICAgbGc6IDhcbiAqIC8vIH1cbiAqIGBgYFxuICovXG5leHBvcnQgY29uc3QgbWVyZ2VTY3JlZW5zID0gPFQgZXh0ZW5kcyBQYXJ0aWFsPFJlY29yZDxCcmVha3BvaW50cywgdW5rbm93bj4+PihcbiAgICBjb25mOiBULFxuICAgIGJyZWFrcG9pbnRPcmRlcjogQnJlYWtwb2ludHNbXVxuKTogVCA9PiB7XG4gICAgbGV0IGxhc3RWYWx1ZTogVFtrZXlvZiBUXSA9IDAgYXMgVFtrZXlvZiBUXTtcblxuICAgIHJldHVybiBicmVha3BvaW50T3JkZXIubWFwKChzY3JlZW5TaXplLCBpbmRleCkgPT4ge1xuICAgICAgICBpZiAoKGluZGV4ID09PSAwICYmIGNvbmZbc2NyZWVuU2l6ZV0gPT09IHVuZGVmaW5lZCkgfHwgKGluZGV4ID09PSAwICYmIGNvbmZbc2NyZWVuU2l6ZV0gPT09IGxhc3RWYWx1ZSkpIHtcbiAgICAgICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICAgICAga2V5OiBzY3JlZW5TaXplLFxuICAgICAgICAgICAgICAgIHZhbDogbGFzdFZhbHVlXG4gICAgICAgICAgICB9O1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKGNvbmZbc2NyZWVuU2l6ZV0gPT09IHVuZGVmaW5lZCB8fCBjb25mW3NjcmVlblNpemVdID09PSBudWxsIHx8IGNvbmZbc2NyZWVuU2l6ZV0gPT09IGxhc3RWYWx1ZSkge1xuICAgICAgICAgICAgcmV0dXJuIG51bGw7XG4gICAgICAgIH1cblxuICAgICAgICBsYXN0VmFsdWUgPSBjb25mW3NjcmVlblNpemVdIGFzIFRba2V5b2YgVF07XG5cbiAgICAgICAgcmV0dXJuIHtcbiAgICAgICAgICAgIGtleTogc2NyZWVuU2l6ZSxcbiAgICAgICAgICAgIHZhbDogbGFzdFZhbHVlXG4gICAgICAgIH07XG4gICAgfSkuZmlsdGVyKGlzTm90TnVsbE9yVW5kZWZpbmVkKS5yZWR1Y2U8VD4oKGFjYywge2tleSwgdmFsfSkgPT4ge1xuICAgICAgICBhY2Nba2V5XSA9IHZhbDtcblxuICAgICAgICByZXR1cm4gYWNjO1xuICAgIH0sIHt9IGFzIFQpO1xufTtcblxuLyoqXG4gKiBHZW5lcmF0ZXMgYSByZXNwb25zaXZlIG1lZGlhIHF1ZXJ5IHN0cmluZyBmb3IgYSBnaXZlbiBicmVha3BvaW50IG5hbWUuXG4gKiBUaGlzIGZ1bmN0aW9uIHJldHJpZXZlcyB0aGUgcGl4ZWwgdmFsdWUgZm9yIHRoZSBwcm92aWRlZCBgc2NyZWVuU2l6ZWAgZnJvbSB0aGUgaW50ZXJuYWwgYGNvbmZpZ0NhY2hlYFxuICogYW5kIGNvbnN0cnVjdHMgYSBmdWxsIG1lZGlhIHF1ZXJ5IHN0cmluZy4gSWYgdGhlIHZhbHVlIGlzIGA+PSAwYCwgaXQgYXBwZW5kcyBhIGBtaW4td2lkdGhgIGNvbmRpdGlvblxuICogdG8gdGhlIGJhc2UgcXVlcnkuIE90aGVyd2lzZSwgaXQgcmV0dXJucyBqdXN0IHRoZSBgZGVmYXVsdE1lZGlhUXVlcnlgLCBhbGxvd2luZyBmb3IgZmxleGlibGUgY29udHJvbFxuICogb3ZlciB0aGUgYnJlYWtwb2ludCBzeXN0ZW0gaW4gYEBuZnEvcmVhY3QtZ3JpZGAuXG4gKiBUaGlzIGlzIHR5cGljYWxseSB1c2VkIHRvIHdyYXAgQ1NTIHZhcmlhYmxlIGRlZmluaXRpb25zIG9yIG90aGVyIHJ1bGVzIGluc2lkZSBhIG1lZGlhIHF1ZXJ5XG4gKiBtYXRjaGluZyB0aGUgbGF5b3V04oCZcyByZXNwb25zaXZlIGJyZWFrcG9pbnQgdGhyZXNob2xkcy5cbiAqXG4gKiBAcGFyYW0gc2NyZWVuU2l6ZSBUaGUgbmFtZSBvZiB0aGUgYnJlYWtwb2ludCAoZS5nLiBgJ3hzJ2AsIGAnbWQnYCwgYCd4bCdgKSBmb3Igd2hpY2ggdG8gZ2VuZXJhdGUgdGhlIHF1ZXJ5LlxuICogQHJldHVybnMgQSBjb21wbGV0ZSBDU1MgbWVkaWEgcXVlcnkgc3RyaW5nIGZvciB0aGUgZ2l2ZW4gYnJlYWtwb2ludC5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBgdHNcbiAqIC8vIEFzc3VtaW5nIGJyZWFrcG9pbnRzID0geyB4czogMCwgbWQ6IDc2OCwgbGc6IDEwMjQgfVxuICogZ2VuZXJhdGVNZWRpYVN0cmluZygnbWQnKTtcbiAqIC8vIFJldHVybnM6IFwiQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY4cHgpXCJcbiAqIGBgYFxuICovXG5leHBvcnQgY29uc3QgZ2VuZXJhdGVNZWRpYVN0cmluZyA9IChzY3JlZW5TaXplOiBCcmVha3BvaW50cykgPT4ge1xuICAgIGNvbnN0IHticmVha3BvaW50c30gPSBjb25maWdDYWNoZS5nZXQoJ2JyZWFrcG9pbnRDb25maWcnKSE7XG5cbiAgICByZXR1cm4gYCR7ZGVmYXVsdE1lZGlhUXVlcnl9JHticmVha3BvaW50c1tzY3JlZW5TaXplXSA+PSAwID8gYCBhbmQgKG1pbi13aWR0aDogJHticmVha3BvaW50c1tzY3JlZW5TaXplXX1weClgIDogJyd9YDtcbn07XG5cbi8qKlxuICogR2VuZXJhdGVzIGEgbWVkaWEgcXVlcnkgc3RyaW5nIHRoYXQgdGFyZ2V0cyBhIHNwZWNpZmljIHJhbmdlIGJldHdlZW4gdHdvIGJyZWFrcG9pbnRzLlxuICogVGhpcyBmdW5jdGlvbiBpcyB1c2VkIHdpdGhpbiB0aGUgYEBuZnEvcmVhY3QtZ3JpZGAgc3lzdGVtIHRvIGNyZWF0ZSByZXNwb25zaXZlIHJ1bGVzIHRoYXQgYXBwbHlcbiAqIGJldHdlZW4gYSBtaW5pbXVtIGFuZCBhIG1heGltdW0gc2NyZWVuIHNpemUuIEl0IGZldGNoZXMgdGhlIHBpeGVsIHZhbHVlcyBvZiB0aGUgcHJvdmlkZWQgYnJlYWtwb2ludHNcbiAqIGZyb20gdGhlIGludGVybmFsIGBjb25maWdDYWNoZWAgYW5kIGdlbmVyYXRlcyBhIG1lZGlhIHF1ZXJ5IHdpdGggYm90aCBgbWluLXdpZHRoYCBhbmQgYG1heC13aWR0aGAgY29uc3RyYWludHMuXG4gKiBUaGUgYG1heC13aWR0aGAgaXMgYWRqdXN0ZWQgYnkgc3VidHJhY3RpbmcgMXB4IHRvIHByZXZlbnQgb3ZlcmxhcHBpbmcgd2l0aCB0aGUgbmV4dCBicmVha3BvaW50IHJhbmdlLlxuICogVGhpcyBlbnN1cmVzIHRoYXQgcmFuZ2VzIGFyZSBleGNsdXNpdmUgYW5kIGRvIG5vdCBjb2xsaWRlIHdpdGggbGFyZ2VyIGJyZWFrcG9pbnRzLlxuICpcbiAqIEBwYXJhbSBzY3JlZW5TaXplTWluIFRoZSBuYW1lIG9mIHRoZSBtaW5pbXVtIGJyZWFrcG9pbnQgKGluY2x1c2l2ZSkuXG4gKiBAcGFyYW0gc2NyZWVuU2l6ZU1heCBUaGUgbmFtZSBvZiB0aGUgbWF4aW11bSBicmVha3BvaW50IChleGNsdXNpdmUpLlxuICogQHJldHVybnMgQSBmdWxsIG1lZGlhIHF1ZXJ5IHN0cmluZyBjb3ZlcmluZyB0aGUgcmFuZ2UgZnJvbSBgc2NyZWVuU2l6ZU1pbmAgdG8ganVzdCBiZWxvdyBgc2NyZWVuU2l6ZU1heGAuXG4gKlxuICogQGV4YW1wbGVcbiAqIGBgYHRzXG4gKiAvLyBBc3N1bWluZyBicmVha3BvaW50cyA9IHsgc206IDU3NiwgbWQ6IDc2OCwgbGc6IDEwMjQgfVxuICogZ2VuZXJhdGVNZWRpYVN0cmluZ0JldHdlZW4oJ3NtJywgJ2xnJyk7XG4gKiAvLyBSZXR1cm5zOiBcIkBtZWRpYSBzY3JlZW4gYW5kIChtaW4td2lkdGg6IDU3NnB4KSBhbmQgKG1heC13aWR0aDogMTAyM3B4KVwiXG4gKiBgYGBcbiAqL1xuZXhwb3J0IGNvbnN0IGdlbmVyYXRlTWVkaWFTdHJpbmdCZXR3ZWVuID0gKFxuICAgIHNjcmVlblNpemVNaW46IEJyZWFrcG9pbnRzLFxuICAgIHNjcmVlblNpemVNYXg6IEJyZWFrcG9pbnRzXG4pID0+IHtcbiAgICBjb25zdCB7YnJlYWtwb2ludHN9ID0gY29uZmlnQ2FjaGUuZ2V0KCdicmVha3BvaW50Q29uZmlnJykhO1xuXG4gICAgcmV0dXJuIGAke2RlZmF1bHRNZWRpYVF1ZXJ5fSBhbmQgKG1pbi13aWR0aDogJHticmVha3BvaW50c1tzY3JlZW5TaXplTWluXX1weCkgYW5kIChtYXgtd2lkdGg6ICR7YnJlYWtwb2ludHNbc2NyZWVuU2l6ZU1heF0gLSAxfXB4KWA7XG59O1xuXG4vKipcbiAqIEdlbmVyYXRlcyBhIG1lZGlhLXF1ZXJ5LXdyYXBwZWQgQ1NTIGJsb2NrIGZvciBhIHNwZWNpZmljIGJyZWFrcG9pbnQuXG4gKiBUaGlzIHV0aWxpdHkgZnVuY3Rpb24gaXMgdXNlZCBpbnRlcm5hbGx5IGJ5IHRoZSBgQG5mcS9yZWFjdC1ncmlkYCBzeXN0ZW0gdG8gYXBwbHkgQ1NTIHN0eWxlc1xuICogY29uZGl0aW9uYWxseSBiYXNlZCBvbiBhIHNpbmdsZSBicmVha3BvaW50LiBJdCByZXR1cm5zIGEgdGFnZ2VkIHRlbXBsYXRlIGZ1bmN0aW9uIHRoYXQgY2FuIGJlIHVzZWRcbiAqIHdpdGggYHN0eWxlZC1jb21wb25lbnRzYCBvciBgZW1vdGlvbmAgdG8gd3JhcCBzdHlsZXMgaW4gYSBgQG1lZGlhYCBxdWVyeSB0YXJnZXRpbmcgdGhlIGdpdmVuIGBzY3JlZW5TaXplYC5cbiAqIEl0IGxldmVyYWdlcyB0aGUgaW50ZXJuYWwgYGdlbmVyYXRlTWVkaWFTdHJpbmcoKWAgZnVuY3Rpb24gdG8gcmVzb2x2ZSB0aGUgY29ycmVjdCBgbWluLXdpZHRoYCBxdWVyeS5cbiAqXG4gKiBAcGFyYW0gc2NyZWVuU2l6ZSBUaGUgYnJlYWtwb2ludCB0byBnZW5lcmF0ZSB0aGUgbWVkaWEgcXVlcnkgZm9yIChlLmcuIGAnbWQnYCwgYCdsZydgLCBgJ3hsJ2ApLlxuICogQHJldHVybnMgQSB0YWdnZWQgdGVtcGxhdGUgZnVuY3Rpb24gdGhhdCB3cmFwcyBzdHlsZXMgaW4gYSBtZWRpYSBxdWVyeSBmb3IgdGhlIGdpdmVuIHNjcmVlbiBzaXplLlxuICpcbiAqIEBleGFtcGxlXG4gKiBgYGB0c3hcbiAqIGNvbnN0IFN0eWxlZEJveCA9IHN0eWxlZC5kaXZgXG4gKiAgIGNvbG9yOiByZWQ7XG4gKiAgICR7bWVkaWFJbnRlcm5hbCgnbWQnKWBcbiAqICAgICBjb2xvcjogYmx1ZTtcbiAqICAgICBwYWRkaW5nOiAycmVtO1xuICogICBgfVxuICogYDtcbiAqIGBgYFxuICovXG5leHBvcnQgY29uc3QgbWVkaWFJbnRlcm5hbCA9IChzY3JlZW5TaXplOiBCcmVha3BvaW50cykgPT4gKC4uLmFyZ3M6IFtUZW1wbGF0ZVN0cmluZ3NBcnJheSwgLi4uKHN0cmluZyB8IG51bGwpW11dKSA9PiBjc3NgXG4gICAgICAgIEBtZWRpYSAke2dlbmVyYXRlTWVkaWFTdHJpbmcoc2NyZWVuU2l6ZSl9IHtcbiAgICAgICAgICAgICR7Y3NzKC4uLmFyZ3MpfVxuICAgICAgICB9XG4gICAgYDsiXX0= */"));
const mergeMediaQueries = (...cssFunctions) => props => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
const mediaQueries = cssFunctions.map(cssFunction => cssFunction(props));
return breakpointOrder.map((screenSize, index) => {
const mediaQuery = mediaQueries.map(query => query?.[index]).filter(Boolean).join('');
return mediaQuery ? mediaInternal(screenSize)`${mediaQuery}` : null;
});
};
const useDebug = () => {
if (process.env.NODE_ENV !== 'production') {
const [debug, setDebug] = React.useState(false);
React.useEffect(() => {
const toggleDebug = e => {
if (e.ctrlKey && e.code === 'KeyD') {
e.preventDefault();
setDebug(oldDebug => !oldDebug);
}
};
if (process.env.NODE_ENV !== 'production') {
window.addEventListener('keydown', toggleDebug);
}
return () => {
if (process.env.NODE_ENV !== 'production') {
window.removeEventListener('keydown', toggleDebug);
}
};
}, []);
return debug ? 'debug' : '';
}
return '';
};
const cssKeys = {
$align: 'align-items',
$justify: 'justify-content',
$order: 'order'
};
const calcAlignment = prop => ({
[prop]: cssProp
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if (typeof cssProp !== 'object') {
cssProp = {
xs: cssProp
};
}
const cssKey = cssKeys[prop];
const mediaQuery = breakpointOrder.map(screenSize => {
const currentCssProp = cssProp[screenSize];
if (currentCssProp) {
return `${cssKey}: ${currentCssProp};`;
}
return null;
});
return mediaQuery;
};
const calcDirection = defaultDirection => ({
$direction,
$hasNoWrap,
$isReverse
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if (typeof $direction === 'string') {
$direction = {
xs: $direction
};
} else if (typeof $direction === 'undefined') {
$direction = {
xs: defaultDirection
};
} else if (typeof $direction.xs === 'undefined') {
$direction = {
...$direction,
xs: defaultDirection
};
}
if (!Array.isArray($hasNoWrap)) {
$hasNoWrap = $hasNoWrap ? breakpointOrder : [];
}
if (!Array.isArray($isReverse)) {
$isReverse = $isReverse ? breakpointOrder : [];
}
let lastDirection;
let lastDirectionString;
const mediaQuery = breakpointOrder.map(screenSize => {
const currentDirection = $direction[screenSize];
const currentWrap = $hasNoWrap.includes(screenSize) || (currentDirection ?? lastDirection) === 'column' ? 'nowrap' : 'wrap';
const currentReverse = $isReverse.includes(screenSize) ? '-reverse' : '';
const directionString = `${currentDirection ?? lastDirection}${currentReverse} ${currentWrap}${currentWrap === 'nowrap' ? '' : currentReverse}`;
if (currentDirection) {
lastDirection = currentDirection;
}
if (lastDirectionString !== directionString) {
lastDirectionString = directionString;
return `flex-flow: ${directionString};`;
}
return null;
});
return mediaQuery;
};
const debugCss = element => () => {
if (process.env.NODE_ENV !== 'production') {
return react.css("&.debug{background-clip:content-box,padding-box;background-image:linear-gradient(to bottom, var(--nfq-grid-debug-", element, "-background) 0%, var(--nfq-grid-debug-", element, "-background) 100%),linear-gradient(to bottom, var(--nfq-grid-debug-", element, "-padding) 0%, var(--nfq-grid-debug-", element, "-padding) 100%);outline:var(--nfq-grid-debug-", element, "-outline) solid 1px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRlYnVnQ3NzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCa0IiLCJmaWxlIjoiZGVidWdDc3MudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge2Nzc30gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEdlbmVyYXRlcyBkZWJ1ZyBDU1Mgc3R5bGVzIGZvciBhIGdyaWQgbGF5b3V0IGVsZW1lbnQgaW4gbm9uLXByb2R1Y3Rpb24gZW52aXJvbm1lbnRzLlxuICogVGhpcyB1dGlsaXR5IGlzIHBhcnQgb2YgdGhlIGBAbmZxL3JlYWN0LWdyaWRgIGRldmVsb3BtZW50IHRvb2xzZXQgYW5kIHByb3ZpZGVzIG9wdGlvbmFsIHZpc3VhbFxuICogc3R5bGluZyBmb3IgbGF5b3V0IGVsZW1lbnRzIHN1Y2ggYXMgY29sdW1ucywgY29udGFpbmVycywgcm93cywgYW5kIHNwYWNlcnMuIEl0IHVzZXMgQ1NTIGN1c3RvbSBwcm9wZXJ0aWVzXG4gKiBwcmVmaXhlZCB3aXRoIGAtLW5mcS1ncmlkLWRlYnVnLSpgIHRvIGNvbnRyb2wgYmFja2dyb3VuZCBjb2xvciwgcGFkZGluZyBpbmRpY2F0b3JzLCBhbmQgb3V0bGluZXMuXG4gKiBXaGVuIGBOT0RFX0VOViAhPT0gJ3Byb2R1Y3Rpb24nYCwgdGhlIGZ1bmN0aW9uIHJldHVybnMgYSBgY3NzYCBibG9jayB0aGF0IHRhcmdldHMgdGhlIGAuZGVidWdgIGNsYXNzLFxuICogYWxsb3dpbmcgZGV2ZWxvcGVycyB0byB0b2dnbGUgbGF5b3V0IGRlYnVnZ2luZyBzdHlsZXMgYnkgY29uZGl0aW9uYWxseSBhcHBseWluZyB0aGF0IGNsYXNzLlxuICogSW4gcHJvZHVjdGlvbiBtb2RlLCBpdCByZXR1cm5zIGBudWxsYCB0byBhdm9pZCBpbmplY3RpbmcgdW5uZWNlc3Nhcnkgc3R5bGVzLlxuICpcbiAqIEBwYXJhbSBlbGVtZW50IFRoZSBncmlkIGVsZW1lbnQgdHlwZSB0byBkZWJ1ZyAoYCdjb2wnYCwgYCdjb250YWluZXInYCwgYCdyb3cnYCwgb3IgYCdzcGFjZXInYCkuXG4gKiBAcmV0dXJucyBBIGZ1bmN0aW9uIHRoYXQgcmV0dXJucyBhIHN0eWxlZC1jb21wb25lbnRzIGBjc3NgIGJsb2NrIGZvciB0aGUgZGVidWcgc3R5bGVzLCBvciBgbnVsbGAgaW4gcHJvZHVjdGlvbi5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBgdHN4XG4gKiBjb25zdCBkZWJ1Z1N0eWxlcyA9IGRlYnVnQ3NzKCdjb2wnKSgpO1xuICpcbiAqIGNvbnN0IFN0eWxlZENvbHVtbiA9IHN0eWxlZC5kaXZgXG4gKiAgICR7ZGVidWdTdHlsZXN9XG4gKiBgO1xuICpcbiAqIC8vIFdoZW4gdGhlIGNvbXBvbmVudCBoYXMgY2xhc3NOYW1lIFwiZGVidWdcIiwgaXQgd2lsbCBkaXNwbGF5IGRlYnVnIG91dGxpbmVzIGFuZCBjb2xvcnMuXG4gKiBgYGBcbiAqL1xuZXhwb3J0IGNvbnN0IGRlYnVnQ3NzID0gKGVsZW1lbnQ6ICdjb2wnIHwgJ2NvbnRhaW5lcicgfCAncm93JyB8ICdzcGFjZXInKSA9PiAoKSA9PiB7XG4gICAgaWYgKHByb2Nlc3MuZW52Lk5PREVfRU5WICE9PSAncHJvZHVjdGlvbicpIHtcbiAgICAgICAgcmV0dXJuIGNzc2BcbiAgICAgICAgICAgICYuZGVidWcge1xuICAgICAgICAgICAgICAgIGJhY2tncm91bmQtY2xpcDogY29udGVudC1ib3gsIHBhZGRpbmctYm94O1xuICAgICAgICAgICAgICAgIGJhY2tncm91bmQtaW1hZ2U6XG4gICAgICAgICAgICAgICAgICAgIGxpbmVhci1ncmFkaWVudCh0byBib3R0b20sIHZhcigtLW5mcS1ncmlkLWRlYnVnLSR7ZWxlbWVudH0tYmFja2dyb3VuZCkgMCUsIHZhcigtLW5mcS1ncmlkLWRlYnVnLSR7ZWxlbWVudH0tYmFja2dyb3VuZCkgMTAwJSksXG4gICAgICAgICAgICAgICAgICAgIGxpbmVhci1ncmFkaWVudCh0byBib3R0b20sIHZhcigtLW5mcS1ncmlkLWRlYnVnLSR7ZWxlbWVudH0tcGFkZGluZykgMCUsIHZhcigtLW5mcS1ncmlkLWRlYnVnLSR7ZWxlbWVudH0tcGFkZGluZykgMTAwJSk7XG4gICAgICAgICAgICAgICAgb3V0bGluZTogdmFyKC0tbmZxLWdyaWQtZGVidWctJHtlbGVtZW50fS1vdXRsaW5lKSBzb2xpZCAxcHg7XG4gICAgICAgICAgICB9XG4gICAgICAgIGA7XG4gICAgfVxuXG4gICAgcmV0dXJuIG51bGw7XG59OyJdfQ== */"));
}
return null;
};
const calcPadding = ({
$padding,
$paddingLeft,
$paddingRight
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if ($padding) {
$paddingLeft = typeof $padding === 'object' ? $padding : {
xs: $padding
};
$paddingRight = typeof $padding === 'object' ? $padding : {
xs: $padding
};
} else {
$paddingLeft = typeof $paddingLeft === 'object' ? $paddingLeft : {
xs: $paddingLeft
};
$paddingRight = typeof $paddingRight === 'object' ? $paddingRight : {
xs: $paddingRight
};
}
let lastPaddingLeft;
let lastPaddingRight;
const mediaQuery = breakpointOrder.map(screenSize => {
const paddingLeft = $paddingLeft[screenSize];
const paddingRight = $paddingRight[screenSize];
if (paddingLeft !== undefined) {
lastPaddingLeft = paddingLeft;
}
if (paddingRight !== undefined) {
lastPaddingRight = paddingRight;
}
if (paddingLeft !== undefined || paddingRight !== undefined) {
return `
padding-inline-start: ${paddingLeft ?? lastPaddingLeft};
padding-inline-end: ${paddingRight ?? lastPaddingRight};
`;
}
return null;
});
return mediaQuery;
};
const calcSizes = ({
$sizes
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
let lastColSize = 'auto';
let lastRealSize;
if (Object.keys($sizes).length > 0) {
const mediaQuery = breakpointOrder.map(screenSize => {
const size = $sizes[screenSize];
let realSize;
if (size) {
lastColSize = size;
}
if (['auto', 'max-content', 'min-content'].includes(size ?? lastColSize)) {
realSize = size ?? lastColSize;
} else {
realSize = `calc(100% / var(--nfq-grid-columns) * clamp(1, ${size ?? lastColSize}, var(--nfq-grid-columns)) - var(--column-gap, 0px) + var(--column-gap, 0px) * clamp(1, ${size ?? lastColSize}, var(--nfq-grid-columns)) / var(--nfq-grid-columns))`;
}
if (lastRealSize !== realSize) {
lastRealSize = realSize;
return `
flex: ${realSize === 'auto' ? 'auto' : `0 0 ${realSize}`};
max-width: ${realSize === 'auto' ? 'initial' : realSize};
`;
}
return null;
});
return mediaQuery;
}
return null;
};
const calcOffset = ({
$offset
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if (typeof $offset !== 'object') {
$offset = {
xs: $offset
};
}
let lastOffset = 0;
let lastRealOffset;
const mediaQuery = breakpointOrder.map(screenSize => {
const currentOffset = $offset[screenSize];
if (currentOffset) {
lastOffset = currentOffset;
}
const finalOffset = currentOffset ?? lastOffset;
const realOffset = finalOffset === 0 ? undefined : `calc(100% / var(--nfq-grid-columns) * ${finalOffset} + var(--column-gap, 0px) * ${finalOffset} / var(--nfq-grid-columns))`;
if (lastRealOffset !== realOffset) {
lastRealOffset = realOffset;
return `margin-inline-start: ${realOffset};`;
}
return null;
});
return mediaQuery;
};
const Col = React.forwardRef(({
align,
as,
children,
className,
direction = 'column',
isReverse,
justify,
offset,
onClick,
onContextMenu,
onDoubleClick,
onDrag,
onDragEnd,
onDragEnter,
onDragLeave,
onDragOver,
onDrop,
onMouseDown,
onMouseEnter,
onMouseLeave,
onMouseMove,
onMouseOut,
onMouseOver,
onMouseUp,
onScroll,
order,
padding,
paddingLeft,
paddingRight,
testId,
...sizes
}, ref) => {
const classNames = [className, useDebug()];
const handler = {
onClick,
onContextMenu,
onDoubleClick,
onDrag,
onDragEnd,
onDragEnter,
onDragLeave,
onDragOver,
onDrop,
onMouseDown,
onMouseEnter,
onMouseLeave,
onMouseMove,
onMouseOut,
onMouseOver,
onMouseUp,
onScroll
};
return React__default.default.createElement(ColElement, _extends({
ref: ref,
$align: align,
$direction: direction,
$isReverse: isReverse,
$justify: justify,
$offset: offset,
$order: order,
$padding: padding,
$paddingLeft: paddingLeft,
$paddingRight: paddingRight,
$sizes: sizes,
as: as,
className: classNames.join(' '),
"data-cy": testId
}, handler), children);
});
Col.displayName = 'Col';
const ColElement = _styled__default.default("div", {
target: "e1fw5zo50"
})("box-sizing:border-box;display:flex;flex:1 0 auto;flex-direction:column;max-width:100%;", mergeMediaQueries(calcPadding, calcSizes, calcOffset, calcAlignment('$order'), calcDirection('column'), calcAlignment('$align'), calcAlignment('$justify')), " ", debugCss('col'), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNk04QyIsImZpbGUiOiJDb2wudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgbm8tdW5kZWZpbmVkICovXG5pbXBvcnQgdHlwZSB7RWxlbWVudFR5cGV9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBSZWFjdCwge2ZvcndhcmRSZWZ9IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQge21lcmdlTWVkaWFRdWVyaWVzfSBmcm9tICcuLi8uLi91dGlscy9zdHlsaW5nJztcbmltcG9ydCB7dXNlRGVidWd9IGZyb20gJy4uL2hvb2tzL3VzZURlYnVnJztcbmltcG9ydCB7Y2FsY0FsaWdubWVudH0gZnJvbSAnLi4vdXRpbC9jYWxjQWxpZ25tZW50JztcbmltcG9ydCB7Y2FsY0RpcmVjdGlvbn0gZnJvbSAnLi4vdXRpbC9jYWxjRGlyZWN0aW9uJztcbmltcG9ydCB7ZGVidWdDc3N9IGZyb20gJy4uL3V0aWwvZGVidWdDc3MnO1xuXG5pbXBvcnQge2NhbGNPZmZzZXQsIGNhbGNQYWRkaW5nLCBjYWxjU2l6ZXN9IGZyb20gJy4vdXRpbHMnO1xuXG5pbXBvcnQgdHlwZSB7QnJlYWtwb2ludHN9IGZyb20gJy4uLy4uL3NoYXJlZFR5cGVzL2JyZWFrcG9pbnRUeXBlcyc7XG5pbXBvcnQgdHlwZSB7XG4gICAgQWxpZ25PYmplY3QsXG4gICAgRGlyZWN0aW9uT2JqZWN0LFxuICAgIEZsZXhBbGlnbixcbiAgICBGbGV4RGlyZWN0aW9uLFxuICAgIEZsZXhKdXN0aWZ5LFxuICAgIEp1c3RpZnlPYmplY3QsXG4gICAgTW91c2VFdmVudEhhbmRsZXIsXG4gICAgT2Zmc2V0T2JqZWN0LFxuICAgIE9yZGVyT2JqZWN0LFxuICAgIFBhZGRpbmcsXG4gICAgUGFkZGluZ09iamVjdCxcbiAgICBTaXplc09iamVjdCxcbiAgICBTdHJpbmdTaXplcyxcbiAgICBXaXRoQ2hpbGRyZW5cbn0gZnJvbSAnLi4vLi4vc2hhcmVkVHlwZXMvY29tcG9uZW50VHlwZXMnO1xuXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L2NvbnNpc3RlbnQtaW5kZXhlZC1vYmplY3Qtc3R5bGVcbnR5cGUgQnJlYWtwb2ludFByb3BzID0ge1xuICAgIFtrZXkgaW4gQnJlYWtwb2ludHNdPzogU3RyaW5nU2l6ZXMgfCBudW1iZXI7XG59O1xuXG5pbnRlcmZhY2UgQ29tcG9uZW50UHJvcHMgZXh0ZW5kcyBCcmVha3BvaW50UHJvcHMge1xuICAgIC8qKiBEZWZpbmVzIHRoZSBjb250ZW50IGFsaWdubWVudCBvZiB0aGUgY29sdW1uLiBJdCB0YWtlcyBhIGBBbGlnbk9iamVjdGAgb3IgYSBgRmxleEFsaWduYCB0eXBlIHZhbHVlLiBJdHMgZGlyZWN0aW9uIGlzIGRlcGVuZGVudCBvbiB0aGUgYGRpcmVjdGlvbmAgcHJvcC4gKi9cbiAgICBhbGlnbj86IEFsaWduT2JqZWN0IHwgRmxleEFsaWduO1xuICAgIC8qKiBTZXRzIHRoZSBodG1sIGVsZW1lbnQgdHlwZSBvZiB0aGUgY29sdW1uLiBJZiB5b3Ugb3ZlcndyaXRlIGl0cyBzdHlsZXMgd2l0aCBzdHlsZWQoKSBpdCBoYXMgdG8gYmUgZm9yd2FyZGVkQXMuICovXG4gICAgYXM/OiBFbGVtZW50VHlwZTtcbiAgICAvKiogQ2xhc3NuYW1lIHByb3BlcnR5IHRvIG92ZXJ3cml0ZSBzdHlsZXMgd2l0aCBzdHlsZWQoKS4gKi9cbiAgICBjbGFzc05hbWU/OiBzdHJpbmc7XG4gICAgLyoqIFNldHMgdGhlIGRpcmVjdGlvbiB0aGUgY29sdW1uIGNoaWxkcmVuIHNob3VsZCByZW5kZXIgKCdyb3cnIG9yICdjb2x1bW4nKS4gSXQgdGFrZXMgYSBgRGlyZWN0aW9uT2JqZWN0YCBvciBhIGBGbGV4RGlyZWN0aW9uYCB0eXBlIHZhbHVlLiAqL1xuICAgIGRpcmVjdGlvbj86IERpcmVjdGlvbk9iamVjdCB8IEZsZXhEaXJlY3Rpb247XG4gICAgLyoqIFJldmVyc2VzIHRoZSBkaXJlY3Rpb24gb2YgdGhlIGNvbHVtbi4gSXQgdGFrZXMgYW4gYXJyYXkgb2YgYEJyZWFrcG9pbnRzYCBvciBhIGBib29sZWFuYCB2YWx1ZS4gKi9cbiAgICBpc1JldmVyc2U/OiBCcmVha3BvaW50c1tdIHwgYm9vbGVhbjtcbiAgICAvKiogRGVmaW5lcyB0aGUgY29udGVudCBqdXN0aWZpY2F0aW9uIG9mIHRoZSBjb2x1bW4uIEl0IHRha2VzIGEgYEZsZXhKdXN0aWZ5YCBvciBhIGBKdXN0aWZ5T2JqZWN0YCB0eXBlIHZhbHVlLiBJdHMgZGlyZWN0aW9uIGlzIGRlcGVuZGVudCBvbiB0aGUgYGRpcmVjdGlvbmAgcHJvcC4gKi9cbiAgICBqdXN0aWZ5PzogRmxleEp1c3RpZnkgfCBKdXN0aWZ5T2JqZWN0O1xuICAgIC8qKiBTZXRzIHRoZSBudW1iZXIgb2YgY29sdW1ucyB0aGlzIGNvbHVtbiBzaG91bGQgb2Zmc2V0IHRvIHRoZSBsZWZ0LiBJdCB0YWtlcyBhbiBgT2Zmc2V0T2JqZWN0YCBvciBhIGBudW1iZXJgIHZhbHVlLiAqL1xuICAgIG9mZnNldD86IE9mZnNldE9iamVjdCB8IG51bWJlcjtcbiAgICAvKiogU2V0cyB0aGUgb3JkZXIgdGhpcyBjb2x1bW4gc2hvdWxkIGJlIGluLiBJdCB0YWtlcyBhbiBgT3JkZXJPYmplY3RgIG9yIGEgYG51bWJlcmAgdmFsdWUuICovXG4gICAgb3JkZXI/OiBPcmRlck9iamVjdCB8IG51bWJlcjtcbiAgICAgLyoqIFNldHMgdGhlIHBhZGRpbmcgYWRkZWQgdG8gYm90aCBzaWRlcyBvZiB0aGUgY29sdW1uLiBJdCB0YWtlcyBhIGBQYWRkaW5nYCBvciBhIGBQYWRkaW5nT2JqZWN0YCB0eXBlIHZhbHVlLiAqL1xuICAgIHBhZGRpbmc/OiBQYWRkaW5nIHwgUGFkZGluZ09iamVjdDtcbiAgICAvKiogU2V0cyB0aGUgcGFkZGluZyBhZGRlZCB0byB0aGUgbGVmdCBzaWRlIG9mIHRoZSBjb2x1bW4gKEdldHMgb3ZlcndyaXR0ZW4gYnkgcGFkZGluZykuIEl0IHRha2VzIGEgYFBhZGRpbmdgIG9yIGEgYFBhZGRpbmdPYmplY3RgIHR5cGUgdmFsdWUuICovXG4gICAgcGFkZGluZ0xlZnQ/OiBQYWRkaW5nIHwgUGFkZGluZ09iamVjdDtcbiAgICAvKiogU2V0cyB0aGUgcGFkZGluZyBhZGRlZCB0byB0aGUgcmlnaHQgc2lkZSBvZiB0aGUgY29sdW1uIChHZXRzIG92ZXJ3cml0dGVuIGJ5IHBhZGRpbmcpLiBJdCB0YWtlcyBhIGBQYWRkaW5nYCBvciBhIGBQYWRkaW5nT2JqZWN0YCB0eXBlIHZhbHVlLiAqL1xuICAgIHBhZGRpbmdSaWdodD86IFBhZGRpbmcgfCBQYWRkaW5nT2JqZWN0O1xuICAgIC8qKiBUZXN0SWQgZm9yIGN5cHJlc3MgdGVzdGluZy4gKi9cbiAgICB0ZXN0SWQ/OiBzdHJpbmc7XG59XG5cbi8qKlxuICogQ29sIGNvbXBvbmVudCB0aGF0IGNyZWF0ZXMgYSBncmlkIGNvbHVtbi5cbiAqXG4gKiBUaGUgQ29sIGNvbXBvbmVudCBpcyB1c2VkIHRvIGNyZWF0ZSBhIGdyaWQgY29sdW1uLiBJdCBwcm92aWRlcyBhIHdpZGUgcmFuZ2Ugb2YgcHJvcGVydGllcyB0byBjb250cm9sIGNvbHVtblxuICogYmVoYXZpb3IgYW5kIGxheW91dC4gVGhlIENvbCBjb21wb25lbnQgdXNlcyBGbGV4Ym94IHByb3BlcnRpZXMgdG8gYWNoaWV2ZSBjb2x1bW4gbGF5b3V0cy4gSXQgaXMgaW1wb3J0YW50IHRvIG5vdGVcbiAqIHRoYXQgdGhlIENvbCBjb21wb25lbnQgaXMgZGVzaWduZWQgdG8gYmUgdXNlZCB3aXRoaW4gYSBSb3cgY29tcG9uZW50IHRvIGNyZWF0ZSBhIGdyaWQgc3lzdGVtLlxuICpcbiAqIEBwYXJhbSBwcm9wcyAgICAgICAgICAgICAgVGhlIHByb3BzIGZvciB0aGUgQ29sIGNvbXBvbmVudC5cbiAqIEBwYXJhbSBwcm9wcy5hbGlnbiAgICAgICAgRGVmaW5lcyB0aGUgY29udGVudCBhbGlnbm1lbnQgb2YgdGhlIGNvbHVtbi4gSXQgdGFrZXMgYSBgQWxpZ25PYmplY3RgIG9yIGEgYEZsZXhBbGlnbmAgdHlwZSB2YWx1ZS4gSXRzIGRpcmVjdGlvbiBpcyBkZXBlbmRlbnQgb24gdGhlIGBkaXJlY3Rpb25gIHByb3AuXG4gKiBAcGFyYW0gcHJvcHMuYXMgICAgICAgICAgIFNldHMgdGhlIGh0bWwgZWxlbWVudCB0eXBlIG9mIHRoZSBjb2x1bW4uIElmIHlvdSBvdmVyd3JpdGUgaXRzIHN0eWxlcyB3aXRoIHN0eWxlZCgpIGl0IGhhcyB0byBiZSBmb3J3YXJkZWRBcy5cbiAqIEBwYXJhbSBwcm9wcy5jaGlsZHJlbiAgICAgVGhlIGNoaWxkIGVsZW1lbnRzIHRvIGJlIHJlbmRlcmVkIHdpdGhpbiB0aGUgY29sdW1uLlxuICogQHBhcmFtIHByb3BzLmNsYXNzTmFtZSAgICBDbGFzc25hbWUgcHJvcGVydHkgdG8gb3ZlcndyaXRlIHN0eWxlcyB3aXRoIHN0eWxlZCgpLlxuICogQHBhcmFtIHByb3BzLmRpcmVjdGlvbiAgICBTZXRzIHRoZSBkaXJlY3Rpb24gdGhlIGNvbHVtbiBjaGlsZHJlbiBzaG91bGQgcmVuZGVyICgncm93JyBvciAnY29sdW1uJykuIEl0IHRha2VzIGEgYERpcmVjdGlvbk9iamVjdGAgb3IgYSBgRmxleERpcmVjdGlvbmAgdHlwZSB2YWx1ZS5cbiAqIEBwYXJhbSBwcm9wcy5pc1JldmVyc2UgICAgUmV2ZXJzZXMgdGhlIGRpcmVjdGlvbiBvZiB0aGUgY29sdW1uLiBJdCB0YWtlcyBhbiBhcnJheSBvZiBgQnJlYWtwb2ludHNgIG9yIGEgYGJvb2xlYW5gIHZhbHVlLlxuICogQHBhcmFtIHByb3BzLmp1c3RpZnkgICAgICBEZWZpbmVzIHRoZSBjb250ZW50IGp1c3RpZmljYXRpb24gb2YgdGhlIGNvbHVtbi4gSXQgdGFrZXMgYSBgRmxleEp1c3RpZnlgIG9yIGEgYEp1c3RpZnlPYmplY3RgIHR5cGUgdmFsdWUuIEl0cyBkaXJlY3Rpb24gaXMgZGVwZW5kZW50IG9uIHRoZSBgZGlyZWN0aW9uYCBwcm9wLlxuICogQHBhcmFtIHByb3BzLmxnICAgICAgICAgICBTZXRzIHRoZSBudW1iZXIgb2YgY29sdW1ucyB0aGUgY29sIHRha2VzIGluIHdpZHRoIG9uIHNjcmVlbnMgbGcuIChDYW4gYWxzbyBiZSBhdXRvLCBtYXgtY29udGVudCwgbWluLWNvbnRlbnQpLlxuICogQHBhcmFtIHByb3BzLm1kICAgICAgICAgICBTZXRzIHRoZSBudW1iZXIgb2YgY29sdW1ucyB0aGUgY29sIHRha2VzIGluIHdpZHRoIG9uIHNjcmVlbnMgbWQuIChDYW4gYWxzbyBiZSBhdXRvLCBtYXgtY29udGVudCwgbWluLWNvbnRlbnQpLlxuICogQHBhcmFtIHByb3BzLm9mZnNldCAgICAgICBTZXRzIHRoZSBudW1iZXIgb2YgY29sdW1ucyB0aGlzIGNvbHVtbiBzaG91bGQgb2Zmc2V0IHRvIHRoZSBsZWZ0LiBJdCB0YWtlcyBhbiBgT2Zmc2V0T2JqZWN0YCBvciBhIGBudW1iZXJgIHZhbHVlLlxuICogQHBhcmFtIHByb3BzLm9yZGVyICAgICAgICBTZXRzIHRoZSBvcmRlciB0aGlzIGNvbHVtbiBzaG91bGQgYmUgaW4uIEl0IHRha2VzIGFuIGBPcmRlck9iamVjdGAgb3IgYSBgbnVtYmVyYCB2YWx1ZS5cbiAqIEBwYXJhbSBwcm9wcy5wYWRkaW5nICAgICAgU2V0cyB0aGUgcGFkZGluZyBhZGRlZCB0byBib3RoIHNpZGVzIG9mIHRoZSBjb2x1bW4uIEl0IHRha2VzIGEgYFBhZGRpbmdgIG9yIGEgYFBhZGRpbmdPYmplY3RgIHR5cGUgdmFsdWUuXG4gKiBAcGFyYW0gcHJvcHMucGFkZGluZ0xlZnQgIFNldHMgdGhlIHBhZGRpbmcgYWRkZWQgdG8gdGhlIGxlZnQgc2lkZSBvZiB0aGUgY29sdW1uIChHZXRzIG92ZXJ3cml0dGVuIGJ5IHBhZGRpbmcuKS4gSXQgdGFrZXMgYSBgUGFkZGluZ2Agb3IgYSBgUGFkZGluZ09iamVjdGAgdHlwZSB2YWx1ZS5cbiAqIEBwYXJhbSBwcm9wcy5wYWRkaW5nUmlnaHQgU2V0cyB0aGUgcGFkZGluZyBhZGRlZCB0byB0aGUgcmlnaHQgc2lkZSBvZiB0aGUgY29sdW1uIChHZXRzIG92ZXJ3cml0dGVuIGJ5IHBhZGRpbmcuKS4gSXQgdGFrZXMgYSBgUGFkZGluZ2Agb3IgYSBgUGFkZGluZ09iamVjdGAgdHlwZSB2YWx1ZS5cbiAqIEBwYXJhbSBwcm9wcy5zbSAgICAgICAgICAgU2V0cyB0aGUgbnVtYmVyIG9mIGNvbHVtbnMgdGhlIGNvbCB0YWtlcyBpbiB3aWR0aCBvbiBzY3JlZW5zIHNtLiAoQ2FuIGFsc28gYmUgYXV0bywgbWF4LWNvbnRlbnQsIG1pbi1jb250ZW50KS5cbiAqIEBwYXJhbSBwcm9wcy50ZXN0SWQgICAgICAgVGVzdElkIGZvciBjeXByZXNzIHRlc3RpbmcuXG4gKiBAcGFyYW0gcHJvcHMueGwgICAgICAgICAgIFNldHMgdGhlIG51bWJlciBvZiBjb2x1bW5zIHRoZSBjb2wgdGFrZXMgaW4gd2lkdGggb24gc2NyZWVucyB4bC4gKENhbiBhbHNvIGJlIGF1dG8sIG1heC1jb250ZW50LCBtaW4tY29udGVudCkuXG4gKiBAcGFyYW0gcHJvcHMueHMgICAgICAgICAgIFNldHMgdGhlIG51bWJlciBvZiBjb2x1bW5zIHRoZSBjb2wgdGFrZXMgaW4gd2lkdGggb24gc2NyZWVucyB4cy4gKENhbiBhbHNvIGJlIGF1dG8sIG1heC1jb250ZW50LCBtaW4tY29udGVudCkuXG4gKiBAcGFyYW0gcHJvcHMueHhsICAgICAgICAgIFNldHMgdGhlIG51bWJlciBvZiBjb2x1bW5zIHRoZSBjb2wgdGFrZXMgaW4gd2lkdGggb24gc2NyZWVucyB4eGwuIChDYW4gYWxzbyBiZSBhdXRvLCBtYXgtY29udGVudCwgbWluLWNvbnRlbnQpLlxuICpcbiAqIEByZXR1cm5zIFRoZSBDb2wgY29tcG9uZW50LlxuICogQGV4YW1wbGVcbiAqIGBgYHRzeFxuICogaW1wb3J0IHtDb2wsIFJvd30gZnJvbSAnQG5mcS9yZWFjdC1ncmlkJztcbiAqXG4gKiBjb25zdCBBcHAgPSAoKSA9PiAoXG4gKiAgICAgPFJvdz5cbiAqICAgICAgICAgPENvbCB4cz17MTJ9IHNtPXs2fSBtZD17NH0gbGc9ezN9IHhsPXsyfSB4eGw9ezF9PlxuICogICAgICAgICAgICAgPGRpdj5Db2x1bW4gMTwvZGl2PlxuICogICAgICAgICA8L0NvbD5cbiAqICAgICAgICAgPENvbCB4cz17MTJ9IHNtPXs2fSBtZD17NH0gbGc9ezN9IHhsPXsyfSB4eGw9ezF9PlxuICogICAgICAgICAgICAgPGRpdj5Db2x1bW4gMjwvZGl2PlxuICogICAgICAgICA8L0NvbD5cbiAqICAgICA8L1Jvdz5cbiAqICk7XG4gKiBgYGBcbiAqL1xuY29uc3QgQ29sID0gZm9yd2FyZFJlZjxIVE1MRGl2RWxlbWVudCwgV2l0aENoaWxkcmVuPENvbXBvbmVudFByb3BzICYgTW91c2VFdmVudEhhbmRsZXI+Pigoe1xuICAgIGFsaWduLFxuICAgIGFzLFxuICAgIGNoaWxkcmVuLFxuICAgIGNsYXNzTmFtZSxcbiAgICBkaXJlY3Rpb24gPSAnY29sdW1uJyxcbiAgICBpc1JldmVyc2UsXG4gICAganVzdGlmeSxcbiAgICBvZmZzZXQsXG4gICAgb25DbGljayxcbiAgICBvbkNvbnRleHRNZW51LFxuICAgIG9uRG91YmxlQ2xpY2ssXG4gICAgb25EcmFnLFxuICAgIG9uRHJhZ0VuZCxcbiAgICBvbkRyYWdFbnRlcixcbiAgICBvbkRyYWdMZWF2ZSxcbiAgICBvbkRyYWdPdmVyLFxuICAgIG9uRHJvcCxcbiAgICBvbk1vdXNlRG93bixcbiAgICBvbk1vdXNlRW50ZXIsXG4gICAgb25Nb3VzZUxlYXZlLFxuICAgIG9uTW91c2VNb3ZlLFxuICAgIG9uTW91c2VPdXQsXG4gICAgb25Nb3VzZU92ZXIsXG4gICAgb25Nb3VzZVVwLFxuICAgIG9uU2Nyb2xsLFxuICAgIG9yZGVyLFxuICAgIHBhZGRpbmcsXG4gICAgcGFkZGluZ0xlZnQsXG4gICAgcGFkZGluZ1JpZ2h0LFxuICAgIHRlc3RJZCxcbiAgICAuLi5zaXplc1xufSwgcmVmKSA9PiB7XG4gICAgY29uc3QgY2xhc3NOYW1lcyA9IFtjbGFzc05hbWUsIHVzZURlYnVnKCldO1xuICAgIGNvbnN0IGhhbmRsZXIgPSB7XG4gICAgICAgIG9uQ2xpY2ssXG4gICAgICAgIG9uQ29udGV4dE1lbnUsXG4gICAgICAgIG9uRG91YmxlQ2xpY2ssXG4gICAgICAgIG9uRHJhZyxcbiAgICAgICAgb25EcmFnRW5kLFxuICAgICAgICBvbkRyYWdFbnRlcixcbiAgICAgICAgb25EcmFnTGVhdmUsXG4gICAgICAgIG9uRHJhZ092ZXIsXG4gICAgICAgIG9uRHJvcCxcbiAgICAgICAgb25Nb3VzZURvd24sXG4gICAgICAgIG9uTW91c2VFbnRlcixcbiAgICAgICAgb25Nb3VzZUxlYXZlLFxuICAgICAgICBvbk1vdXNlTW92ZSxcbiAgICAgICAgb25Nb3VzZU91dCxcbiAgICAgICAgb25Nb3VzZU92ZXIsXG4gICAgICAgIG9uTW91c2VVcCxcbiAgICAgICAgb25TY3JvbGxcbiAgICB9O1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPENvbEVsZW1lbnRcbiAgICAgICAgICAgIHJlZj17cmVmfVxuICAgICAgICAgICAgJGFsaWduPXthbGlnbn1cbiAgICAgICAgICAgICRkaXJlY3Rpb249e2RpcmVjdGlvbn1cbiAgICAgICAgICAgICRpc1JldmVyc2U9e2lzUmV2ZXJzZX1cbiAgICAgICAgICAgICRqdXN0aWZ5PXtqdXN0aWZ5fVxuICAgICAgICAgICAgJG9mZnNldD17b2Zmc2V0fVxuICAgICAgICAgICAgJG9yZGVyPXtvcmRlcn1cbiAgICAgICAgICAgICRwYWRkaW5nPXtwYWRkaW5nfVxuICAgICAgICAgICAgJHBhZGRpbmdMZWZ0PXtwYWRkaW5nTGVmdH1cbiAgICAgICAgICAgICRwYWRkaW5nUmlnaHQ9e3BhZGRpbmdSaWdodH1cbiAgICAgICAgICAgICRzaXplcz17c2l6ZXN9XG4gICAgICAgICAgICBhcz17YXN9XG4gICAgICAgICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZXMuam9pbignICcpfVxuICAgICAgICAgICAgZGF0YS1jeT17dGVzdElkfVxuICAgICAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0L2pzeC1wcm9wcy1uby1zcHJlYWRpbmdcbiAgICAgICAgICAgIHsuLi5oYW5kbGVyfVxuICAgICAgICA+XG4gICAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvQ29sRWxlbWVudD5cbiAgICApO1xufSk7XG5cbkNvbC5kaXNwbGF5TmFtZSA9ICdDb2wnO1xuXG5leHBvcnQge0NvbH07XG5cbmludGVyZmFjZSBDb2xFbGVtZW50UHJvcHMge1xuICAgICRhbGlnbj86IEFsaWduT2JqZWN0IHwgRmxleEFsaWduO1xuICAgICRkaXJlY3Rpb24/OiBEaXJlY3Rpb25PYmplY3QgfCBGbGV4RGlyZWN0aW9uO1xuICAgICRpc1JldmVyc2U/OiBCcmVha3BvaW50c1tdIHwgYm9vbGVhbjtcbiAgICAkanVzdGlmeT86IEZsZXhKdXN0aWZ5IHwgSnVzdGlmeU9iamVjdDtcbiAgICAkb2Zmc2V0PzogT2Zmc2V0T2JqZWN0IHwgbnVtYmVyO1xuICAgICRvcmRlcj86IE9yZGVyT2JqZWN0IHwgbnVtYmVyO1xuICAgICRwYWRkaW5nPzogUGFkZGluZyB8IFBhZGRpbmdPYmplY3Q7XG4gICAgJHBhZGRpbmdMZWZ0PzogUGFkZGluZyB8IFBhZGRpbmdPYmplY3Q7XG4gICAgJHBhZGRpbmdSaWdodD86IFBhZGRpbmcgfCBQYWRkaW5nT2JqZWN0O1xuICAgICRzaXplczogU2l6ZXNPYmplY3Q7XG59XG5cbi8qIGVzbGludC1kaXNhYmxlIGluZGVudCAqL1xuY29uc3QgQ29sRWxlbWVudCA9IHN0eWxlZC5kaXY8Q29sRWxlbWVudFByb3BzPmBcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgZmxleDogMSAwIGF1dG87XG4gICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG5cbiAgICAke21lcmdlTWVkaWFRdWVyaWVzPENvbEVsZW1lbnRQcm9wcz4oXG4gICAgICAgIGNhbGNQYWRkaW5nLFxuICAgICAgICBjYWxjU2l6ZXMsXG4gICAgICAgIGNhbGNPZmZzZXQsXG4gICAgICAgIGNhbGNBbGlnbm1lbnQoJyRvcmRlcicpLFxuICAgICAgICBjYWxjRGlyZWN0aW9uKCdjb2x1bW4nKSxcbiAgICAgICAgY2FsY0FsaWdubWVudCgnJGFsaWduJyksXG4gICAgICAgIGNhbGNBbGlnbm1lbnQoJyRqdXN0aWZ5JylcbiAgICApfVxuICAgICR7ZGVidWdDc3MoJ2NvbCcpfVxuYDtcbi8qIGVzbGludC1lbmFibGUgaW5kZW50ICovIl19 */"));
const calcContainerPadding = ({
$hasNoPadding
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if (!Array.isArray($hasNoPadding)) {
$hasNoPadding = $hasNoPadding ? breakpointOrder : [];
}
let lastHasNoPadding = null;
const mediaQuery = breakpointOrder.map(screenSize => {
const hasNoPadding = $hasNoPadding.includes(screenSize);
if (hasNoPadding !== lastHasNoPadding) {
lastHasNoPadding = hasNoPadding;
return `
--nfq-grid-container-no-padding: ${hasNoPadding ? 'initial' : 'var(--nfq-grid-container-padding)'};
`;
}
return null;
});
return mediaQuery;
};
const calcContainerSize = ({
$isFluid
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if (!Array.isArray($isFluid)) {
$isFluid = $isFluid ? breakpointOrder : [];
}
let lastFluid = null;
const mediaQuery = breakpointOrder.map(screenSize => {
const actualFluid = $isFluid.includes(screenSize);
if (actualFluid !== lastFluid) {
lastFluid = actualFluid;
return `--nfq-grid-container-width: ${actualFluid ? '100%' : 'var(--nfq-grid-container)'};`;
}
return null;
});
return mediaQuery;
};
const calcContainerMaxWidth = ({
$maxWidth
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if (typeof $maxWidth !== 'object') {
$maxWidth = {
xs: $maxWidth
};
}
const mediaQuery = breakpointOrder.map(screenSize => {
const currentValue = $maxWidth[screenSize];
if (currentValue !== undefined) {
return `--nfq-grid-container-max-width: ${currentValue}${typeof currentValue === 'number' ? 'px' : ''};`;
}
return null;
});
return mediaQuery;
};
const Container = React.forwardRef(({
as,
children,
className,
hasNoPadding = false,
isFluid = false,
maxWidth,
testId,
...handler
}, ref) => {
const classNames = [className, useDebug()];
return React__default.default.createElement(ContainerElement, _extends({
ref: ref,
$hasNoPadding: hasNoPadding,
$isFluid: isFluid,
$maxWidth: maxWidth,
as: as,
className: classNames.join(' '),
"data-cy": testId
}, handler), children);
});
Container.displayName = 'Container';
const ContainerElement = _styled__default.default("div", {
target: "e1eibjqh0"
})("box-sizing:border-box;margin-left:auto;margin-right:auto;max-width:var(--nfq-grid-container-max-width, 100%);padding-inline-end:var(--nfq-grid-container-no-padding, 0px);padding-inline-start:var(--nfq-grid-container-no-padding, 0px);width:var(--nfq-grid-container-width, 100%);", mergeMediaQueries(calcContainerPadding, calcContainerSize, calcContainerMaxWidth), " ", debugCss('container'), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbnRhaW5lci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOEgwRCIsImZpbGUiOiJDb250YWluZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgbm8tdW5kZWZpbmVkICovXG5pbXBvcnQgdHlwZSB7RWxlbWVudFR5cGV9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBSZWFjdCwge2ZvcndhcmRSZWZ9IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG5pbXBvcnQge21lcmdlTWVkaWFRdWVyaWVzfSBmcm9tICcuLi8uLi91dGlscy9zdHlsaW5nJztcbmltcG9ydCB7dXNlRGVidWd9IGZyb20gJy4uL2hvb2tzL3VzZURlYnVnJztcbmltcG9ydCB7ZGVidWdDc3N9IGZyb20gJy4uL3V0aWwvZGVidWdDc3MnO1xuXG5pbXBvcnQge2NhbGNDb250YWluZXJNYXhXaWR0aCwgY2FsY0NvbnRhaW5lclBhZGRpbmcsIGNhbGNDb250YWluZXJTaXplfSBmcm9tICcuL3V0aWxzJztcblxuaW1wb3J0IHR5cGUge0JyZWFrcG9pbnRzfSBmcm9tICcuLi8uLi9zaGFyZWRUeXBlcy9icmVha3BvaW50VHlwZXMnO1xuaW1wb3J0IHR5cGUge01vdXNlRXZlbnRIYW5kbGVyLCBTaXplc09iamVjdCwgV2l0aENoaWxkcmVufSBmcm9tICcuLi8uLi9zaGFyZWRUeXBlcy9jb21wb25lbnRUeXBlcyc7XG5cbi8qKlxuICogUHJvcHMgZm9yIHRoZSBgPENvbnRhaW5lciAvPmAgY29tcG9uZW50IGluIGBAbmZxL3JlYWN0LWdyaWRgLlxuICogVGhpcyBpbnRlcmZhY2UgZGVmaW5lcyBjb25maWd1cmF0aW9uIG9wdGlvbnMgZm9yIHJlbmRlcmluZyBhIGxheW91dCBjb250YWluZXIsXG4gKiBpbmNsdWRpbmcgdGFnIG5hbWUgY29udHJvbCwgZmx1aWQgYmVoYXZpb3IsIHNwYWNpbmcsIGFuZCB0ZXN0IGlkZW50aWZpZXJzLlxuICogSXQgc3VwcG9ydHMgcmVzcG9uc2l2ZSBiZWhhdmlvciBhbmQgb3ZlcnJpZGVzIGZvciBkZWZhdWx0IGdyaWQgc3lzdGVtIHNldHRpbmdzLlxuICovXG5pbnRlcmZhY2UgQ29tcG9uZW50UHJvcHMge1xuICAgIC8qKlxuICAgICAqIFNldHMgdGhlIEhUTUwgZWxlbWVudCB0eXBlIHRvIGJlIHJlbmRlcmVkIGJ5IHRoZSBjb250YWluZXIuXG4gICAgICogVGhpcyBhbGxvd3Mgc2VtYW50aWMgb3Igc3RydWN0dXJhbCBjb250cm9sIChlLmcuLCByZW5kZXJpbmcgYXMgYHNlY3Rpb25gLCBgbWFpbmAsIGBkaXZgLCBldGMuKS5cbiAgICAgKiBJZiB5b3UncmUgdXNpbmcgYSBzdHlsZWQgdmVyc2lvbiBvZiBgQ29udGFpbmVyYCwgeW91IHNob3VsZCB1c2UgYGZvcndhcmRlZEFzYCBpbnN0ZWFkIG9mIGBhc2AgdG8gcHJlc2VydmUgc3R5bGluZyBiZWhhdmlvci5cbiAgICAgKi9cbiAgICBhcz86IEVsZW1lbnRUeXBlO1xuICAgIC8qKlxuICAgICAqIE9wdGlvbmFsIGNsYXNzIG5hbWUgdG8gYXBwbHkgY3VzdG9tIHN0eWxlcyB0byB0aGUgY29udGFpbmVyLlxuICAgICAqIENhbiBiZSB1c2VkIGluIGNvbmp1bmN0aW9uIHdpdGggYHN0eWxlZChDb250YWluZXIpYCBvciB0cmFkaXRpb25hbCBDU1MgdG8gb3ZlcnJpZGUgbGF5b3V0IGRlZmF1bHRzLlxuICAgICAqL1xuICAgIGNsYXNzTmFtZT86IHN0cmluZztcbiAgICAvKipcbiAgICAgKiBDb250cm9scyB3aGV0aGVyIHBhZGRpbmcgc2hvdWxkIGJlIHJlbW92ZWQgZnJvbSB0aGUgY29udGFpbmVyLlxuICAgICAqIElmIGB0cnVlYCwgdGhlIGNvbnRhaW5lciBoYXMgbm8gaG9yaXpvbnRhbCBwYWRkaW5nIGF0IGFsbCBicmVha3BvaW50cy5cbiAgICAgKiBJZiBhbiBhcnJheSBvZiBgQnJlYWtwb2ludHNgIGlzIHByb3ZpZGVkLCBwYWRkaW5nIGlzIG9ubHkgcmVtb3ZlZCBmb3IgdGhlIHNwZWNpZmllZCBicmVha3BvaW50cy5cbiAgICAgKi9cbiAgICBoYXNOb1BhZGRpbmc/OiBCcmVha3BvaW50c1tdIHwgYm9vbGVhbjtcbiAgICAvKipcbiAgICAgKiBFbmFibGVzIGZsdWlkIGJlaGF2aW9yIGZvciB0aGUgY29udGFpbmVyLCBtYWtpbmcgaXQgc3BhbiB0aGUgZnVsbCB3aWR0aCBvZiB0aGUgc2NyZWVuLlxuICAgICAqIFRoaXMgaXMgdXNlZnVsIHdoZW4gdGhlIGNvbnRhaW5lciBpcyBuZXN0ZWQgaW5zaWRlIGFub3RoZXIgY29udGFpbmVyIGFuZCBzaG91bGQgbm90IGluaGVyaXQgbWF4LXdpZHRoIGNvbnN0cmFpbnRzLlxuICAgICAqIEFjY2VwdHMgZWl0aGVyIGEgYm9vbGVhbiAoZm9yIGdsb2JhbCBiZWhhdmlvcikgb3IgYW4gYXJyYXkgb2YgYEJyZWFrcG9pbnRzYCB0byBhcHBseSBmbHVpZCBiZWhhdmlvciBjb25kaXRpb25hbGx5LlxuICAgICAqL1xuICAgIGlzRmx1aWQ/OiBCcmVha3BvaW50c1tdIHwgYm9vbGVhbjtcbiAgICAvKipcbiAgICAgKiBPdmVycmlkZXMgdGhlIG1heC13aWR0aCBvZiB0aGUgY29udGFpbmVyIGZvciBub24tZmx1aWQgYnJlYWtwb2ludHMuXG4gICAgICogVGhpcyBjYW4gYmUgYSBzaW5nbGUgbnVtYmVyIG9yIGEgcmVzcG9uc2l2ZSBgU2l6ZXNPYmplY3RgIHRvIGFwcGx5IGRpZmZlcmVudCBtYXggd2lkdGhzIHBlciBicmVha3BvaW50LlxuICAgICAqIEl0IG9ubHkgYXBwbGllcyB3aGVuIGBpc0ZsdWlkYCBpcyBub3QgYWN0aXZlIGZvciBhIGdpdmVuIGJyZWFrcG9pbnQuXG4gICAgICovXG4gICAgbWF4V2lkdGg/OiBTaXplc09iamVjdCB8IG51bWJlcjtcbiAgICAvKipcbiAgICAgKiBBIHRlc3QgaWRlbnRpZmllciB1c2VkIGZvciBDeXByZXNzIG9yIG90aGVyIGVuZC10by1lbmQgdGVzdGluZyBmcmFtZXdvcmtzLlxuICAgICAqIFRoaXMgdmFsdWUgd2lsbCBiZSBhc3NpZ25lZCB0byB0aGUgYGRhdGEtY3lgIGF0dHJpYnV0ZSBvZiB0aGUgY29udGFpbmVyLCBlbmFibGluZyBjb25zaXN0ZW50IHRlc3Qgc2VsZWN0b3JzLlxuICAgICAqL1xuICAgIHRlc3RJZD86IHN0cmluZztcbn1cblxuLyoqXG4gKiBBIGZsZXhpYmxlIGxheW91dCBjb250YWluZXIgY29tcG9uZW50IHVzZWQgaW4gdGhlIGBAbmZxL3JlYWN0LWdyaWRgIHN5c3RlbS5cbiAqIFRoZSBgQ29udGFpbmVyYCBjb21wb25lbnQgcHJvdmlkZXMgbGF5b3V0IGJvdW5kYXJpZXMgdXNpbmcgdGhlIGNvbmZpZ3VyZWQgZ3JpZCBzeXN0ZW0uXG4gKiBJdCBzdXBwb3J0cyByZXNwb25zaXZlIGZsdWlkIGJlaGF2aW9yLCBtYXgtd2lkdGggb3ZlcnJpZGVzLCBhbmQgb3B0aW9uYWwgcGFkZGluZyB0b2dnbGluZy5cbiAqIFRoZSBjb21wb25lbnQgYWxzbyBhY2NlcHRzIGZvcndhcmRlZCByZWZzIGFuZCBzcHJlYWRzIGFueSBhZGRpdGlvbmFsIG1vdXNlIGV2ZW50IGhhbmRsZXJzLlxuICogVGhlIHVuZGVybHlpbmcgSFRNTCB0YWcgY2FuIGJlIGN1c3RvbWl6ZWQgdXNpbmcgdGhlIGBhc2AgcHJvcCwgYW5kIGRlYnVnIGxheW91dCBzdHlsZXNcbiAqIGNhbiBiZSBhY3RpdmF0ZWQgdmlhIGB1c2VEZWJ1Z2AsIHdoaWNoIGNvbmRpdGlvbmFsbHkgYWRkcyBhIGBcImRlYnVnXCJgIGNsYXNzIGluIGRldmVsb3BtZW50LlxuICogVGhpcyBtYWtlcyBgQ29udGFpbmVyYCBzdWl0YWJsZSBmb3IgYm90aCBzZW1hbnRpYyBsYXlvdXQgYW5kIGRlYnVnLWZyaWVuZGx5IGluc3BlY3Rpb24uXG4gKlxuICogQHBhcmFtIHByb3BzICAgICAgICAgICAgICBUaGUgY29tcG9uZW50IHByb3BzLlxuICogQHBhcmFtIHByb3BzLmFzICAgICAgICAgICBPcHRpb25hbCBIVE1MIGVsZW1lbnQgdHlwZSB0byByZW5kZXIgKGUuZy4sIGBzZWN0aW9uYCwgYG1haW5gLCBgZGl2YCkuXG4gKiBAcGFyYW0gcHJvcHMuY2hpbGRyZW4gICAgIFRoZSBjb250ZW50IHRvIGJlIHdyYXBwZWQgaW5zaWRlIHRoZSBjb250YWluZXIuXG4gKiBAcGFyYW0gcHJvcHMuY2xhc3NOYW1lICAgIEFkZGl0aW9uYWwgQ1NTIGNsYXNzIG5hbWVzIGZvciBjdXN0b20gc3R5bGluZy5cbiAqIEBwYXJhbSBwcm9wcy5oYXNOb1BhZGRpbmcgRGlzYWJsZXMgaG9yaXpvbnRhbCBwYWRkaW5nIGdsb2JhbGx5IG9yIGZvciBzcGVjaWZpYyBicmVha3BvaW50cy5cbiAqIEBwYXJhbSBwcm9wcy5pc0ZsdWlkICAgICAgTWFrZXMgdGhlIGNvbnRhaW5lciBmdWxsLXdpZHRoIGVpdGhlciBnbG9iYWxseSBvciBhdCBzcGVjaWZpYyBicmVha3BvaW50cy5cbiAqIEBwYXJhbSBwcm9wcy5tYXhXaWR0aCAgICAgT3ZlcnJpZGVzIHRoZSBkZWZhdWx0IG1heC13aWR0aCBmb3Igbm9uLWZsdWlkIGJyZWFrcG9pbnRzLlxuICogQHBhcmFtIHByb3BzLnRlc3RJZCAgICAgICBUZXN0IGlkZW50aWZpZXIgYXBwbGllZCBhcyBgZGF0YS1jeWAgZm9yIEN5cHJlc3Mgb3Igb3RoZXIgdGVzdCB0b29scy5cbiAqIEBwYXJhbSBwcm9wcy5yZWYgICAgICAgICAgRm9yd2FyZGVkIHJlZmVyZW5jZSB0byB0aGUgcm9vdCBlbGVtZW50LlxuICogQHBhcmFtIHByb3BzLlsuLi5oYW5kbGVyXSBBZGRpdGlvbmFsIG1vdXNlIGV2ZW50IGhhbmRsZXJzIChlLmcuLCBgb25DbGlja2AsIGBvbk1vdXNlRW50ZXJgKS5cbiAqIEByZXR1cm5zIEEgcmVzcG9uc2l2ZSBsYXlvdXQgd3JhcHBlciBlbGVtZW50IHdpdGggcGFkZGluZywgZmx1aWRpdHksIGFuZCBtYXgtd2lkdGggY29udHJvbC5cbiAqXG4gKiBAZXhhbXBsZVxuICogYGBgdHN4XG4gKiA8Q29udGFpbmVyIGlzRmx1aWQgbWF4V2lkdGg9ezE0NDB9IHRlc3RJZD1cIm1haW4tY29udGFpbmVyXCI+XG4gKiAgIDxDb250ZW50IC8+XG4gKiA8L0NvbnRhaW5lcj5cbiAqIGBgYFxuICovXG5jb25zdCBDb250YWluZXIgPSBmb3J3YXJkUmVmPEhUTUxEaXZFbGVtZW50LCBXaXRoQ2hpbGRyZW48Q29tcG9uZW50UHJvcHMgJiBNb3VzZUV2ZW50SGFuZGxlcj4+KCh7XG4gICAgYXMsXG4gICAgY2hpbGRyZW4sXG4gICAgY2xhc3NOYW1lLFxuICAgIGhhc05vUGFkZGluZyA9IGZhbHNlLFxuICAgIGlzRmx1aWQgPSBmYWxzZSxcbiAgICBtYXhXaWR0aCxcbiAgICB0ZXN0SWQsXG4gICAgLi4uaGFuZGxlclxufSwgcmVmKSA9PiB7XG4gICAgY29uc3QgY2xhc3NOYW1lcyA9IFtjbGFzc05hbWUsIHVzZURlYnVnKCldO1xuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPENvbnRhaW5lckVsZW1lbnRcbiAgICAgICAgICAgIHJlZj17cmVmfVxuICAgICAgICAgICAgJGhhc05vUGFkZGluZz17aGFzTm9QYWRkaW5nfVxuICAgICAgICAgICAgJGlzRmx1aWQ9e2lzRmx1aWR9XG4gICAgICAgICAgICAkbWF4V2lkdGg9e21heFdpZHRofVxuICAgICAgICAgICAgYXM9e2FzfVxuICAgICAgICAgICAgY2xhc3NOYW1lPXtjbGFzc05hbWVzLmpvaW4oJyAnKX1cbiAgICAgICAgICAgIGRhdGEtY3k9e3Rlc3RJZH1cbiAgICAgICAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC9qc3gtcHJvcHMtbm8tc3ByZWFkaW5nXG4gICAgICAgICAgICB7Li4uaGFuZGxlcn1cbiAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICA8L0NvbnRhaW5lckVsZW1lbnQ+XG4gICAgKTtcbn0pO1xuXG5Db250YWluZXIuZGlzcGxheU5hbWUgPSAnQ29udGFpbmVyJztcblxuZXhwb3J0IHtDb250YWluZXJ9O1xuXG5pbnRlcmZhY2UgQ29udGFpbmVyRWxlbWVudFByb3BzIHtcbiAgICAkaGFzTm9QYWRkaW5nOiBCcmVha3BvaW50c1tdIHwgYm9vbGVhbjtcbiAgICAkaXNGbHVpZDogQnJlYWtwb2ludHNbXSB8IGJvb2xlYW47XG4gICAgJG1heFdpZHRoPzogU2l6ZXNPYmplY3QgfCBudW1iZXI7XG59XG5cbi8qIGVzbGludC1kaXNhYmxlIGluZGVudCAqL1xuY29uc3QgQ29udGFpbmVyRWxlbWVudCA9IHN0eWxlZC5kaXY8Q29udGFpbmVyRWxlbWVudFByb3BzPmBcbiAgICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICAgIG1hcmdpbi1sZWZ0OiBhdXRvO1xuICAgIG1hcmdpbi1yaWdodDogYXV0bztcbiAgICBtYXgtd2lkdGg6IHZhcigtLW5mcS1ncmlkLWNvbnRhaW5lci1tYXgtd2lkdGgsIDEwMCUpO1xuICAgIHBhZGRpbmctaW5saW5lLWVuZDogdmFyKC0tbmZxLWdyaWQtY29udGFpbmVyLW5vLXBhZGRpbmcsIDBweCk7XG4gICAgcGFkZGluZy1pbmxpbmUtc3RhcnQ6IHZhcigtLW5mcS1ncmlkLWNvbnRhaW5lci1uby1wYWRkaW5nLCAwcHgpO1xuICAgIHdpZHRoOiB2YXIoLS1uZnEtZ3JpZC1jb250YWluZXItd2lkdGgsIDEwMCUpO1xuXG4gICAgJHttZXJnZU1lZGlhUXVlcmllczxDb250YWluZXJFbGVtZW50UHJvcHM+KFxuICAgICAgICBjYWxjQ29udGFpbmVyUGFkZGluZyxcbiAgICAgICAgY2FsY0NvbnRhaW5lclNpemUsXG4gICAgICAgIGNhbGNDb250YWluZXJNYXhXaWR0aFxuICAgICl9XG4gICAgJHtkZWJ1Z0NzcygnY29udGFpbmVyJyl9XG5gO1xuLyogZXNsaW50LWVuYWJsZSBpbmRlbnQgKi8iXX0= */"));
const calcGap = ({
$hasNoGap = false
}) => {
const {
breakpointOrder
} = configCache.get('breakpointConfig');
if (typeof $hasNoGap === 'boolean' || typeof $hasNoGap === 'string') {
$hasNoGap = {
xs: $hasNoGap
};
}
let lastGapConfig;
let lastColumnGapVar;
let lastRowGap;
const mediaQuery = breakpointOrder.map(screenSize => {
const gapConfig = $hasNoGap[screenSize];
if (gapConfig !== undefined) {
lastGapConfig = gapConfig;
}
const columnGapVar = `--column-gap: ${(gapConfig ?? lastGapConfig) === 'no-column' || (gapConfig ?? lastGapConfig) === true ? '0px' : 'var(--nfq-grid-column-gap)'};`;
const columnGap = 'column-gap: var(--column-gap);';
const rowGap = `row-gap: ${(gapConfig ?? lastGapConfig) === 'no-row' || (gapConfig ?? lastGapConfig) === true ? '0px' : 'var(--nfq-grid-column-gap)'};`;
if (lastColumnGapVar !== columnGapVar || lastRowGap !== rowGap) {
lastColumnGapVar = columnGapVar;
lastRowGap = rowGap;
return `
${columnGapVar}
${columnGap}
${rowGap}
`;
}
return null;
});
return mediaQuery;
};
const Row = React.forwardRef(({
align,
as,
children,
className,
direction = 'row',
hasNoGap = false,
hasNoWrap = false,
isReverse = false,
justify,
order,
testId,
...handler
}, ref) => {
const classNames = [className, useDebug()];
return React__default.default.createElement(RowElement, _extends({
ref: ref,
$align: align,
$direction: direction,
$hasNoGap: hasNoGap,
$hasNoWrap: hasNoWrap,
$isReverse: isReverse,
$justify: justify,
$order: order,
as: as,
className: classNames.join(' '),
"data-cy": testId
}, handler), children);
});
Row.displayName = 'Row';
const RowElement = _styled__default.default("div", {
target: "enuv09l0"
})("box-sizing:border-box;display:flex;flex:1 1 auto;flex-wrap:wrap;", mergeMediaQueries(calcGap, calcDirection('row'), calcAlignment('$order'), calcAlignment('$align'), calcAlignment('$justify')), " ", debugCss('row'), ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlJvdy50c3giXSwibmFtZXMiOltd