react-flexbox-z
Version:
React wrapper for flexbox
2 lines (1 loc) • 7.96 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("styled-components")):"function"==typeof define&&define.amd?define(["exports","react","styled-components"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).ReactFlexBox={},e.React,e.styled)}(this,(function(e,t,n){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=r(t),a=r(n),i=function(e,t){return i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])},i(e,t)};var o=function(){return o=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var l in t=arguments[n])Object.prototype.hasOwnProperty.call(t,l)&&(e[l]=t[l]);return e},o.apply(this,arguments)};function u(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(r=Object.getOwnPropertySymbols(e);l<r.length;l++)t.indexOf(r[l])<0&&Object.prototype.propertyIsEnumerable.call(e,r[l])&&(n[r[l]]=e[r[l]])}return n}function c(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}"function"==typeof SuppressedError&&SuppressedError;var f,s=function(e){return Object.entries(e).reduce((function(e,t){var n=t[0],r=t[1];return void 0!==r&&(e[n]=r),e}),{})},d=function(e){for(var t=[],n=1;n<arguments.length;n++)t[n-1]=arguments[n];t.filter(Boolean).length>1&&console.warn('Multiple values have been provided for "'.concat(e,'".'))},p=a.default.div(f||(f=c(["\n ","\n ","\n\n ","\n"],["\n ","\n ","\n\n ","\n"])),(function(e){var t=e.$width;return t&&"width: ".concat(t,";")}),(function(e){var t=e.$height;return t&&"height: ".concat(t,";")}),(function(e){var t=e.$custom;return Object.entries(t).map((function(e){var t=e[0],n=e[1];return"".concat(t,": ").concat(n,";")})).join("\n")}));function g(e){var t,n=e.inline,r=e.width,a=e.height,i=e.gap,c=e.rowGap,f=e.columnGap,g=e.row,m=e.rowReverse,h=e.column,y=e.columnReverse,x=e.flexDirection,w=e.wrap,v=e.noWrap,S=e.wrapReverse,E=e.flexWrap,C=e.justifyStart,j=e.justifyEnd,F=e.justifyCenter,b=e.justifySpaceBetween,O=e.justifySpaceAround,I=e.justifyContent,A=e.alignItemsStart,B=e.alignItemsEnd,R=e.alignItemsCenter,$=e.alignItemsBaseline,_=e.alignItemsStretch,P=e.alignItems,W=e.alignContentStart,G=e.alignContentEnd,J=e.alignContentCenter,k=e.alignContentSpaceBetween,T=e.alignContentSpaceAround,q=e.alignContentStretch,D=e.alignContent,M=e.flow,H=e.as,N=e.children,U=u(e,["inline","width","height","gap","rowGap","columnGap","row","rowReverse","column","columnReverse","flexDirection","wrap","noWrap","wrapReverse","flexWrap","justifyStart","justifyEnd","justifyCenter","justifySpaceBetween","justifySpaceAround","justifyContent","alignItemsStart","alignItemsEnd","alignItemsCenter","alignItemsBaseline","alignItemsStretch","alignItems","alignContentStart","alignContentEnd","alignContentCenter","alignContentSpaceBetween","alignContentSpaceAround","alignContentStretch","alignContent","flow","as","children"]),z=s({display:n?"inline-flex":"flex",gap:i,"row-gap":c,"column-gap":f,"flex-direction":x||(d("flex-direction",g,m,h,y),g?"row":m?"row-reverse":h?"column":y?"column-reverse":void 0),"flex-wrap":E||(d("flex-wrap",w,v,S),w?"wrap":v?"nowrap":S?"wrap-reverse":void 0),"justify-content":I||(d("justify-content",C,j,F,b,O),C?"flex-start":j?"flex-end":F?"center":b?"space-between":O?"space-around":void 0),"align-items":P||(d("align-items",A,B,R,$,_),A?"flex-start":B?"flex-end":R?"center":$?"baseline":_?"stretch":void 0),"align-content":D||(d("align-content",W,G,J,k,T,q),W?"flex-start":G?"flex-end":J?"center":k?"space-between":T?"space-around":q?"stretch":void 0),"flex-flow":M});return l.default.createElement(p,o({as:null!==(t=H)&&void 0!==t?t:"div",$custom:z,$width:r,$height:a},U),N)}var m,h=a.default.div(m||(m=c(["\n ","\n ","\n\n ","\n"],["\n ","\n ","\n\n ","\n"])),(function(e){var t=e.$width;return t&&"width: ".concat(t,";")}),(function(e){var t=e.$height;return t&&"height: ".concat(t,";")}),(function(e){var t=e.$custom;return Object.entries(t).map((function(e){var t=e[0],n=e[1];return"".concat(t,": ").concat(n,";")})).join("\n")}));function y(e){var t,n=e.width,r=e.height,a=e.order,i=e.grow,c=e.shrink,f=e.basis,p=e.flex,g=e.alignSelfAuto,m=e.alignSelfStart,y=e.alignSelfEnd,x=e.alignSelfCenter,w=e.alignSelfBaseline,v=e.alignSelfStretch,S=e.alignSelf,E=e.as,C=e.children,j=u(e,["width","height","order","grow","shrink","basis","flex","alignSelfAuto","alignSelfStart","alignSelfEnd","alignSelfCenter","alignSelfBaseline","alignSelfStretch","alignSelf","as","children"]),F=s({order:a,"flex-grow":i,"flex-shrink":c,"flex-basis":f,flex:p,"align-self":S||(d("align-self",g,m,y,x,w,v),g?"auto":m?"flex-start":y?"flex-end":x?"center":w?"baseline":v?"stretch":void 0)});return l.default.createElement(h,o({as:null!==(t=E)&&void 0!==t?t:"div",$custom:F,$width:n,$height:r},j),C)}var x=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}i(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}(t,e),t.prototype.render=function(){return l.default.createElement(g,o({},this.props))},t.Item=y,t}(l.default.Component);e.Flex=x,e.FlexAlignCenter=function(e){return l.default.createElement(g,o({},e,{alignItemsCenter:!0}))},e.FlexAlignEnd=function(e){return l.default.createElement(g,o({},e,{alignItemsEnd:!0}))},e.FlexAlignStart=function(e){return l.default.createElement(g,o({},e,{alignItemsStart:!0}))},e.FlexAlignStretch=function(e){return l.default.createElement(g,o({},e,{alignItemsStretch:!0}))},e.FlexCenter=function(e){return l.default.createElement(g,o({},e,{justifyCenter:!0,alignItemsCenter:!0}))},e.FlexCol=function(e){return l.default.createElement(g,o({},e,{column:!0}))},e.FlexColCenter=function(e){return l.default.createElement(g,o({},e,{column:!0,justifyCenter:!0,alignItemsCenter:!0}))},e.FlexContainer=g,e.FlexFill=function(e){return l.default.createElement(g,o({},e,{width:"100%",height:"100%"}))},e.FlexFullCenter=function(e){return l.default.createElement(g,o({},e,{justifyCenter:!0,alignItemsCenter:!0,width:"100%",height:"100%"}))},e.FlexFullHeight=function(e){return l.default.createElement(g,o({},e,{height:"100%"}))},e.FlexFullWidth=function(e){return l.default.createElement(g,o({},e,{width:"100%"}))},e.FlexGap16=function(e){return l.default.createElement(g,o({},e,{gap:"16px"}))},e.FlexGap24=function(e){return l.default.createElement(g,o({},e,{gap:"24px"}))},e.FlexGap4=function(e){return l.default.createElement(g,o({},e,{gap:"4px"}))},e.FlexGap8=function(e){return l.default.createElement(g,o({},e,{gap:"8px"}))},e.FlexItem=y,e.FlexJustifyAround=function(e){return l.default.createElement(g,o({},e,{justifySpaceAround:!0}))},e.FlexJustifyBetween=function(e){return l.default.createElement(g,o({},e,{justifySpaceBetween:!0}))},e.FlexJustifyEnd=function(e){return l.default.createElement(g,o({},e,{justifyEnd:!0}))},e.FlexJustifyEvenly=function(e){return l.default.createElement(g,o({},e,{justifySpaceEvenly:!0}))},e.FlexJustifyStart=function(e){return l.default.createElement(g,o({},e,{justifyStart:!0}))},e.FlexNoWrap=function(e){return l.default.createElement(g,o({},e,{noWrap:!0}))},e.FlexRow=function(e){return l.default.createElement(g,o({},e,{row:!0}))},e.FlexRowCenter=function(e){return l.default.createElement(g,o({},e,{row:!0,justifyCenter:!0,alignItemsCenter:!0}))},e.FlexWrap=function(e){return l.default.createElement(g,o({},e,{wrap:!0}))},e.FlexWrapReverse=function(e){return l.default.createElement(g,o({},e,{wrapReverse:!0}))},e.default=x,e.notifyOverlapping=d,e.removeUndefined=s,Object.defineProperty(e,"__esModule",{value:!0})}));