UNPKG

light-layout-component

Version:

easy and useful layout component

1 lines 11.8 kB
"use strict";(self.webpackChunklight_layout_component=self.webpackChunklight_layout_component||[]).push([[823],{"./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){function _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _toConsumableArray(arr){return function _arrayWithoutHoles(arr){if(Array.isArray(arr))return _arrayLikeToArray(arr)}(arr)||function _iterableToArray(iter){if("undefined"!=typeof Symbol&&null!=iter[Symbol.iterator]||null!=iter["@@iterator"])return Array.from(iter)}(arr)||function _unsupportedIterableToArray(o,minLen){if(o){if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);return"Object"===n&&o.constructor&&(n=o.constructor.name),"Map"===n||"Set"===n?Array.from(o):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?_arrayLikeToArray(o,minLen):void 0}}(arr)||function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}__webpack_require__.d(__webpack_exports__,{Z:function(){return _toConsumableArray}})},"./src/stories/Flex.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Example:function(){return Example},__namedExportsOrder:function(){return __namedExportsOrder}});var _Example$parameters,_Example$parameters2,_Example$parameters2$,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/objectSpread2.js"),_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_toConsumableArray_js__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js"),_lib_Container__WEBPACK_IMPORTED_MODULE_1__=(__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./src/lib/Container/index.tsx")),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js");__webpack_exports__.default={title:"Flex",component:_lib_Container__WEBPACK_IMPORTED_MODULE_1__.Z,tags:["autodocs"]};var FlexItem=function FlexItem(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_lib_Container__WEBPACK_IMPORTED_MODULE_1__.Z,{minWidth:"10px",maxWidth:"50px",background:"pink",children:"item"})},Example=function Template(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_lib_Container__WEBPACK_IMPORTED_MODULE_1__.Z,(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__.Z)((0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__.Z)({},props),{},{children:(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_toConsumableArray_js__WEBPACK_IMPORTED_MODULE_4__.Z)(Array(3)).map((function(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(FlexItem,{})}))}))}.bind({});Example.args={direction:"column",align:"center"},Example.parameters=(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__.Z)((0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__.Z)({},Example.parameters),{},{docs:(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__.Z)((0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__.Z)({},null===(_Example$parameters=Example.parameters)||void 0===_Example$parameters?void 0:_Example$parameters.docs),{},{source:(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_3__.Z)({originalSource:"props => <Flex {...props}>\n {[...Array(3)].map(() => <FlexItem />)}\n </Flex>"},null===(_Example$parameters2=Example.parameters)||void 0===_Example$parameters2||null===(_Example$parameters2$=_Example$parameters2.docs)||void 0===_Example$parameters2$?void 0:_Example$parameters2$.source)})});var __namedExportsOrder=["Example"]},"./src/lib/Container/index.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){var _templateObject,_templateObject2,_templateObject3,_templateObject4,_templateObject5,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js"),_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/objectSpread2.js"),_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js"),styled_components__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/jsx-runtime.js"),_excluded=["as","mediaTarget","minWidth","maxWidth"],Container=function Container(_ref){var _ref$as=_ref.as,as=void 0===_ref$as?"div":_ref$as,mediaTarget=_ref.mediaTarget,minWidth=_ref.minWidth,maxWidth=_ref.maxWidth,props=(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectWithoutProperties_js__WEBPACK_IMPORTED_MODULE_1__.Z)(_ref,_excluded),getMediaTargetMinWidth=function getMediaTargetMinWidth(){return mediaTarget?MEDIA_TARGET_WIDTH[mediaTarget].minWidth:minWidth},getMediaTargetMaxWidth=function getMediaTargetMaxWidth(){return mediaTarget?MEDIA_TARGET_WIDTH[mediaTarget].maxWidth:maxWidth};switch(as){case"div":return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(Div,(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)((0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)({minWidth:getMediaTargetMinWidth(),maxWidth:getMediaTargetMaxWidth()},props),{},{children:props.children}));case"main":return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(Main,(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)((0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)({minWidth:getMediaTargetMinWidth(),maxWidth:getMediaTargetMaxWidth()},props),{},{children:props.children}));case"header":return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(Header,(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)((0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)({minWidth:getMediaTargetMinWidth(),maxWidth:getMediaTargetMaxWidth()},props),{},{children:props.children}));case"footer":return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(Footer,(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)((0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_objectSpread2_js__WEBPACK_IMPORTED_MODULE_2__.Z)({minWidth:getMediaTargetMinWidth(),maxWidth:getMediaTargetMaxWidth()},props),{},{children:props.children}))}},MEDIA_TARGET_WIDTH={mobile:{minWidth:"320px",maxWidth:"480px"},tablet:{minWidth:"768px",maxWidth:"1024px"},desktop:{minWidth:"1050px",maxWidth:"1680px"}},ContainerCss=(0,styled_components__WEBPACK_IMPORTED_MODULE_3__.iv)(_templateObject||(_templateObject=(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_4__.Z)(["\n min-width: ",";\n max-width: ",";\n min-height: ",";\n max-height: ",";\n padding: ",";\n margin: ",";\n background: ",";\n border: ",";\n border-radius: ",";\n overflow: ",";\n"])),(function(props){return props.minWidth}),(function(props){return props.maxWidth}),(function(props){return props.minHeight}),(function(props){return props.maxHeight}),(function(props){return props.padding}),(function(props){return props.margin}),(function(props){return props.background}),(function(props){return props.border}),(function(props){return props.borderRadius}),(function(props){return props.overflow})),Div=styled_components__WEBPACK_IMPORTED_MODULE_3__.ZP.div(_templateObject2||(_templateObject2=(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_4__.Z)(["\n ","\n"])),ContainerCss),Main=styled_components__WEBPACK_IMPORTED_MODULE_3__.ZP.main(_templateObject3||(_templateObject3=(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_4__.Z)(["\n ","\n"])),ContainerCss),Header=styled_components__WEBPACK_IMPORTED_MODULE_3__.ZP.header(_templateObject4||(_templateObject4=(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_4__.Z)(["\n ","\n"])),ContainerCss),Footer=styled_components__WEBPACK_IMPORTED_MODULE_3__.ZP.footer(_templateObject5||(_templateObject5=(0,_Users_kang_yeongmin_layout_component_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_4__.Z)(["\n ","\n"])),ContainerCss);__webpack_exports__.Z=Container;try{Container.displayName="Container",Container.__docgenInfo={description:"",displayName:"Container",props:{as:{defaultValue:{value:"div"},description:"",name:"as",required:!1,type:{name:"enum",value:[{value:'"div"'},{value:'"main"'},{value:'"header"'},{value:'"footer"'}]}},mediaTarget:{defaultValue:null,description:"",name:"mediaTarget",required:!1,type:{name:"enum",value:[{value:'"mobile"'},{value:'"tablet"'},{value:'"desktop"'}]}},minWidth:{defaultValue:null,description:"",name:"minWidth",required:!1,type:{name:"string"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string"}},minHeight:{defaultValue:null,description:"",name:"minHeight",required:!1,type:{name:"string"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string"}},padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"string"}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"string"}},background:{defaultValue:null,description:"",name:"background",required:!1,type:{name:"string"}},borderRadius:{defaultValue:null,description:"",name:"borderRadius",required:!1,type:{name:"string"}},border:{defaultValue:null,description:"",name:"border",required:!1,type:{name:"string"}},overflow:{defaultValue:null,description:"",name:"overflow",required:!1,type:{name:"string"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/lib/Container/index.tsx#Container"]={docgenInfo:Container.__docgenInfo,name:"Container",path:"src/lib/Container/index.tsx#Container"})}catch(__react_docgen_typescript_loader_error){}}}]);