{"componentChunkName":"component---src-templates-block-js","path":"/blocks/footers/basic","result":{"data":{"block":{"id":"799e2505-ff98-5e21-9bee-026dcf047458","displayName":"FooterBasic","src":"/** @jsx jsx */\nimport { jsx } from 'theme-ui'\nimport { Link } from '@theme-ui/components'\nimport { ControlType, applyPropertyControls } from 'property-controls'\n\nconst FooterBasic = ({ justifyContent = 'space-between', ...props }) => {\n  return (\n    <footer\n      sx={{\n        variant: 'styles.footer',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent\n      }}\n      {...props}\n    />\n  )\n}\n\nFooterBasic.Logo = props => {\n  return (\n    <Link\n      sx={{\n        variant: 'styles.navLink',\n        p: 2,\n        mr: 3\n      }}\n      {...props}\n    />\n  )\n}\nFooterBasic.Nav = props => {\n  return <nav {...props} />\n}\nFooterBasic.Link = props => {\n  return (\n    <Link\n      sx={{\n        variant: 'styles.navLink',\n        p: 2\n      }}\n      {...props}\n    />\n  )\n}\nFooterBasic.Copyright = props => {\n  return <p sx={{ m: 0 }} {...props} />\n}\n\napplyPropertyControls(FooterBasic, {\n  justifyContent: {\n    type: ControlType.Enum,\n    defaultValue: 'right',\n    options: ['space-between', 'start', 'space-evenly']\n  },\n  sx: {\n    type: ControlType.Style\n  }\n})\n\napplyPropertyControls(FooterBasic.Nav, {\n  sx: {\n    type: ControlType.Style\n  }\n})\napplyPropertyControls(FooterBasic.Copyright, {\n  children: {\n    title: 'Text',\n    type: ControlType.String\n  },\n  sx: {\n    type: ControlType.Style\n  }\n})\n\nconst linkControls = {\n  children: {\n    title: 'Text',\n    type: ControlType.String,\n    required: true\n  },\n  to: {\n    title: 'URL',\n    type: ControlType.String,\n    defaultValue: '#!',\n    required: true\n  },\n  sx: {\n    type: ControlType.Style\n  }\n}\n\napplyPropertyControls(FooterBasic.Logo, linkControls)\napplyPropertyControls(FooterBasic.Link, linkControls)\n\nFooterBasic.usage = `\n  <FooterBasic>\n    <FooterBasic.Nav>\n      <FooterBasic.Logo to=\"/\">Hello</FooterBasic.Logo>\n      <FooterBasic.Link to=\"/about\">About</FooterBasic.Link>\n      <FooterBasic.Link to=\"/blog\">Blog</FooterBasic.Link>\n      <FooterBasic.Link to=\"/contact\">Contact</FooterBasic.Link>\n    </FooterBasic.Nav>\n    <FooterBasic.Copyright>\n      © 2048 Blocks UI\n    </FooterBasic.Copyright>\n  </FooterBasic>\n`\n\nexport default FooterBasic\n","transformed":"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nconst BLOCKS_Container = () => jsx(FooterBasic, null, jsx(FooterBasic.Nav, null, jsx(FooterBasic.Logo, {\n  to: \"/\"\n}, \"Hello\"), jsx(FooterBasic.Link, {\n  to: \"/about\"\n}, \"About\"), jsx(FooterBasic.Link, {\n  to: \"/blog\"\n}, \"Blog\"), jsx(FooterBasic.Link, {\n  to: \"/contact\"\n}, \"Contact\")), jsx(FooterBasic.Copyright, null, \"\\xA9 2048 Blocks UI\"));\n\nconst BLOCKS_Root = ({\n  children\n}) => {\n  return jsx(BLOCKS_Droppable, {\n    droppableId: \"root\"\n  }, (provided, snapshot) => jsx(\"div\", _extends({}, provided.droppableProps, {\n    style: {\n      minHeight: 'calc(100vh - 41px)'\n    },\n    ref: provided.innerRef\n  }), children, provided.placeholder));\n};"}},"pageContext":{"isCreatedByStatefulCreatePages":false,"id":"799e2505-ff98-5e21-9bee-026dcf047458","slug":"blocks/footers/basic"}}}