UNPKG

@greg-md/ng-flex-css-layout

Version:

Flex-CSS-Layout is an alternative behaviour of Flex-Layout directives, that will still work with Angular Universal and App Shell.

150 lines (149 loc) 11.9 kB
/** * @fileoverview added by tsickle * @suppress {checkTypes} checked by tsc */ /** * @param {?} align * @return {?} */ export function normalizeLayoutAlignValue(align) { align = align || 'start stretch'; let [mainAxis, crossAxis] = align.split(' '); switch (mainAxis) { case 'center': case 'space-around': case 'space-between': case 'space-evenly': break; case 'end': case 'flex-end': mainAxis = 'flex-end'; break; case 'start': case 'flex-start': default: mainAxis = 'flex-start'; // default main axis break; } switch (crossAxis) { case 'start': case 'flex-start': crossAxis = 'flex-start'; break; case 'baseline': case 'center': crossAxis = 'center'; break; case 'end': case 'flex-end': crossAxis = 'flex-end'; break; case 'stretch': default: // 'stretch' crossAxis = 'stretch'; // default cross axis break; } return [mainAxis, crossAxis]; } /** * @param {?} direction * @param {?} wrap * @param {?} isInline * @param {?} breakpoint * @return {?} */ export function generateLayoutClassName(direction, wrap, isInline, breakpoint) { return 'fcLayout' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + direction + (wrap ? '-' + wrap : '') + (isInline ? '-inline' : ''); } /** * @param {?} mainAxis * @param {?} crossAxis * @param {?} breakpoint * @return {?} */ export function generateLayoutAlignClassName(mainAxis, crossAxis, breakpoint) { return 'fcLayoutAlign' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + mainAxis + '-' + crossAxis; } /** * @param {?} value * @param {?} breakpoint * @return {?} */ export function generateLayoutGapClassName(value, breakpoint) { return 'fcLayoutGap' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + valueToClassName(value); } /** * @param {?} grow * @param {?} shrink * @param {?} basis * @param {?} breakpoint * @return {?} */ export function generateFlexClassName(grow, shrink, basis, breakpoint) { return 'fcFlex' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + valueToClassName(grow) + '-' + valueToClassName(shrink) + (basis ? '-' + valueToClassName(basis) : ''); } /** * @param {?} order * @param {?} breakpoint * @return {?} */ export function generateFlexOrderClassName(order, breakpoint) { return 'fcFlexOrder' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + valueToClassName(order); } /** * @param {?} offset * @param {?} breakpoint * @return {?} */ export function generateFlexOffsetClassName(offset, breakpoint) { return 'fcFlexOffset' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + valueToClassName(offset); } /** * @param {?} align * @param {?} breakpoint * @return {?} */ export function generateFlexAlignClassName(align, breakpoint) { return 'fcFlexAlign' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + valueToClassName(align); } /** * @return {?} */ export function generateFlexFillClassName() { return 'fcFlexFill'; } /** * @param {?} display * @param {?} show * @param {?} breakpoint * @return {?} */ export function generateFlexShowHideClassName(display, show, breakpoint) { return 'fcShow' + (breakpoint !== 'all' ? '--' + breakpoint : '') + '--' + valueToClassName(display) + '--' + (show ? 'show' : 'hide'); } /** * @param {?} value * @return {?} */ export function valueToClassName(value) { return String(value).replace(/[^a-zA-Z0-9-]/, '-'); } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGVscGVycy5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BncmVnLW1kL25nLWZsZXgtY3NzLWxheW91dC8iLCJzb3VyY2VzIjpbImxpYi9oZWxwZXJzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBQUEsTUFBTSxvQ0FBb0MsS0FBYTtJQUNyRCxLQUFLLEdBQUcsS0FBSyxJQUFJLGVBQWUsQ0FBQztJQUVqQyxJQUFJLENBQUMsUUFBUSxFQUFFLFNBQVMsQ0FBQyxHQUFHLEtBQUssQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUM7SUFFN0MsTUFBTSxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQztRQUNqQixLQUFLLFFBQVEsQ0FBQztRQUNkLEtBQUssY0FBYyxDQUFDO1FBQ3BCLEtBQUssZUFBZSxDQUFDO1FBQ3JCLEtBQUssY0FBYztZQUNqQixLQUFLLENBQUM7UUFDUixLQUFLLEtBQUssQ0FBQztRQUNYLEtBQUssVUFBVTtZQUNiLFFBQVEsR0FBRyxVQUFVLENBQUM7WUFDdEIsS0FBSyxDQUFDO1FBQ1IsS0FBSyxPQUFPLENBQUM7UUFDYixLQUFLLFlBQVksQ0FBQztRQUNsQjtZQUNFLFFBQVEsR0FBRyxZQUFZLENBQUM7WUFDeEIsS0FBSyxDQUFDO0tBQ1Q7SUFFRCxNQUFNLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDO1FBQ2xCLEtBQUssT0FBTyxDQUFDO1FBQ2IsS0FBSyxZQUFZO1lBQ2YsU0FBUyxHQUFHLFlBQVksQ0FBQztZQUN6QixLQUFLLENBQUM7UUFDUixLQUFLLFVBQVUsQ0FBQztRQUNoQixLQUFLLFFBQVE7WUFDWCxTQUFTLEdBQUcsUUFBUSxDQUFDO1lBQ3JCLEtBQUssQ0FBQztRQUNSLEtBQUssS0FBSyxDQUFDO1FBQ1gsS0FBSyxVQUFVO1lBQ2IsU0FBUyxHQUFHLFVBQVUsQ0FBQztZQUN2QixLQUFLLENBQUM7UUFDUixLQUFLLFNBQVMsQ0FBQztRQUNmOztZQUNFLFNBQVMsR0FBRyxTQUFTLENBQUM7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LFFBQVE7VUFDWCxDQUFDLFVBQVUsS0FBSyxLQUFLLENBQUMsQ0FBQyxDQUFDLElBQUksR0FBRyxVQUFVLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztVQUMvQyxJQUFJLEdBQUcsZ0JBQWdCLENBQUMsT0FBTyxDQUFDO1VBQ2hDLElBQUksR0FBRyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQztDQUNyQzs7Ozs7QUFFRCxNQUFNLDJCQUEyQixLQUFLO0lBQ3BDLE1BQU0sQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUMsT0FBTyxDQUFDLGVBQWUsRUFBRSxHQUFHLENBQUMsQ0FBQztDQUNwRCIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBmdW5jdGlvbiBub3JtYWxpemVMYXlvdXRBbGlnblZhbHVlKGFsaWduOiBzdHJpbmcpIHtcbiAgYWxpZ24gPSBhbGlnbiB8fCAnc3RhcnQgc3RyZXRjaCc7XG5cbiAgbGV0IFttYWluQXhpcywgY3Jvc3NBeGlzXSA9IGFsaWduLnNwbGl0KCcgJyk7XG5cbiAgc3dpdGNoIChtYWluQXhpcykge1xuICAgIGNhc2UgJ2NlbnRlcic6XG4gICAgY2FzZSAnc3BhY2UtYXJvdW5kJzpcbiAgICBjYXNlICdzcGFjZS1iZXR3ZWVuJzpcbiAgICBjYXNlICdzcGFjZS1ldmVubHknOlxuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnZW5kJzpcbiAgICBjYXNlICdmbGV4LWVuZCc6XG4gICAgICBtYWluQXhpcyA9ICdmbGV4LWVuZCc7XG4gICAgICBicmVhaztcbiAgICBjYXNlICdzdGFydCc6XG4gICAgY2FzZSAnZmxleC1zdGFydCc6XG4gICAgZGVmYXVsdCA6XG4gICAgICBtYWluQXhpcyA9ICdmbGV4LXN0YXJ0JzsgIC8vIGRlZmF1bHQgbWFpbiBheGlzXG4gICAgICBicmVhaztcbiAgfVxuXG4gIHN3aXRjaCAoY3Jvc3NBeGlzKSB7XG4gICAgY2FzZSAnc3RhcnQnOlxuICAgIGNhc2UgJ2ZsZXgtc3RhcnQnOlxuICAgICAgY3Jvc3NBeGlzID0gJ2ZsZXgtc3RhcnQnO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnYmFzZWxpbmUnOlxuICAgIGNhc2UgJ2NlbnRlcic6XG4gICAgICBjcm9zc0F4aXMgPSAnY2VudGVyJztcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ2VuZCc6XG4gICAgY2FzZSAnZmxleC1lbmQnOlxuICAgICAgY3Jvc3NBeGlzID0gJ2ZsZXgtZW5kJztcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ3N0cmV0Y2gnOlxuICAgIGRlZmF1bHQgOiAvLyAnc3RyZXRjaCdcbiAgICAgIGNyb3NzQXhpcyA9ICdzdHJldGNoJzsgICAvLyBkZWZhdWx0IGNyb3NzIGF4aXNcbiAgICAgIGJyZWFrO1xuICB9XG5cbiAgcmV0dXJuIFttYWluQXhpcywgY3Jvc3NBeGlzXTtcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIGdlbmVyYXRlTGF5b3V0Q2xhc3NOYW1lKGRpcmVjdGlvbjogc3RyaW5nLCB3cmFwOiBzdHJpbmcsIGlzSW5saW5lOiBib29sZWFuLCBicmVha3BvaW50OiBzdHJpbmcpIHtcbiAgcmV0dXJuICdmY0xheW91dCdcbiAgICArIChicmVha3BvaW50ICE9PSAnYWxsJyA/ICctLScgKyBicmVha3BvaW50IDogJycpXG4gICAgKyAnLS0nICsgZGlyZWN0aW9uICsgKHdyYXAgPyAnLScgKyB3cmFwIDogJycpICsgKGlzSW5saW5lID8gJy1pbmxpbmUnIDogJycpO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gZ2VuZXJhdGVMYXlvdXRBbGlnbkNsYXNzTmFtZShtYWluQXhpczogc3RyaW5nLCBjcm9zc0F4aXM6IHN0cmluZywgYnJlYWtwb2ludDogc3RyaW5nKSB7XG4gIHJldHVybiAnZmNMYXlvdXRBbGlnbidcbiAgICArIChicmVha3BvaW50ICE9PSAnYWxsJyA/ICctLScgKyBicmVha3BvaW50IDogJycpXG4gICAgKyAnLS0nICsgbWFpbkF4aXMgKyAnLScgKyBjcm9zc0F4aXM7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBnZW5lcmF0ZUxheW91dEdhcENsYXNzTmFtZSh2YWx1ZTogc3RyaW5nLCBicmVha3BvaW50OiBzdHJpbmcpIHtcbiAgcmV0dXJuICdmY0xheW91dEdhcCdcbiAgICArIChicmVha3BvaW50ICE9PSAnYWxsJyA/ICctLScgKyBicmVha3BvaW50IDogJycpXG4gICAgKyAnLS0nICsgdmFsdWVUb0NsYXNzTmFtZSh2YWx1ZSk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBnZW5lcmF0ZUZsZXhDbGFzc05hbWUoZ3Jvdywgc2hyaW5rLCBiYXNpcywgYnJlYWtwb2ludDogc3RyaW5nKSB7XG4gIHJldHVybiAnZmNGbGV4J1xuICAgICsgKGJyZWFrcG9pbnQgIT09ICdhbGwnID8gJy0tJyArIGJyZWFrcG9pbnQgOiAnJylcbiAgICArICctLScgKyB2YWx1ZVRvQ2xhc3NOYW1lKGdyb3cpICsgJy0nICsgdmFsdWVUb0NsYXNzTmFtZShzaHJpbmspICsgKGJhc2lzID8gJy0nICsgdmFsdWVUb0NsYXNzTmFtZShiYXNpcykgOiAnJyk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBnZW5lcmF0ZUZsZXhPcmRlckNsYXNzTmFtZShvcmRlciwgYnJlYWtwb2ludDogc3RyaW5nKSB7XG4gIHJldHVybiAnZmNGbGV4T3JkZXInXG4gICAgKyAoYnJlYWtwb2ludCAhPT0gJ2FsbCcgPyAnLS0nICsgYnJlYWtwb2ludCA6ICcnKVxuICAgICsgJy0tJyArIHZhbHVlVG9DbGFzc05hbWUob3JkZXIpO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gZ2VuZXJhdGVGbGV4T2Zmc2V0Q2xhc3NOYW1lKG9mZnNldCwgYnJlYWtwb2ludDogc3RyaW5nKSB7XG4gIHJldHVybiAnZmNGbGV4T2Zmc2V0J1xuICAgICsgKGJyZWFrcG9pbnQgIT09ICdhbGwnID8gJy0tJyArIGJyZWFrcG9pbnQgOiAnJylcbiAgICArICctLScgKyB2YWx1ZVRvQ2xhc3NOYW1lKG9mZnNldCk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBnZW5lcmF0ZUZsZXhBbGlnbkNsYXNzTmFtZShhbGlnbiwgYnJlYWtwb2ludDogc3RyaW5nKSB7XG4gIHJldHVybiAnZmNGbGV4QWxpZ24nXG4gICAgKyAoYnJlYWtwb2ludCAhPT0gJ2FsbCcgPyAnLS0nICsgYnJlYWtwb2ludCA6ICcnKVxuICAgICsgJy0tJyArIHZhbHVlVG9DbGFzc05hbWUoYWxpZ24pO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gZ2VuZXJhdGVGbGV4RmlsbENsYXNzTmFtZSgpIHtcbiAgcmV0dXJuICdmY0ZsZXhGaWxsJztcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIGdlbmVyYXRlRmxleFNob3dIaWRlQ2xhc3NOYW1lKGRpc3BsYXksIHNob3c6IGJvb2xlYW4sIGJyZWFrcG9pbnQ6IHN0cmluZykge1xuICByZXR1cm4gJ2ZjU2hvdydcbiAgICArIChicmVha3BvaW50ICE9PSAnYWxsJyA/ICctLScgKyBicmVha3BvaW50IDogJycpXG4gICAgKyAnLS0nICsgdmFsdWVUb0NsYXNzTmFtZShkaXNwbGF5KVxuICAgICsgJy0tJyArIChzaG93ID8gJ3Nob3cnIDogJ2hpZGUnKTtcbn1cblxuZXhwb3J0IGZ1bmN0aW9uIHZhbHVlVG9DbGFzc05hbWUodmFsdWUpIHtcbiAgcmV0dXJuIFN0cmluZyh2YWx1ZSkucmVwbGFjZSgvW15hLXpBLVowLTktXS8sICctJyk7XG59XG4iXX0=