{"componentChunkName":"component---src-templates-post-js","path":"/use-component-in-mdx","webpackCompilationHash":"204cd2f21dbe64876cac","result":{"data":{"mdx":{"body":"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\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsx mdx */\nvar _frontmatter = {\n  \"date\": \"2018-01-03\",\n  \"title\": \"Use component in MDX\",\n  \"categories\": [\"Coding\"]\n};\n\nvar makeShortcode = function makeShortcode(name) {\n  return function MDXDefaultShortcode(props) {\n    console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n    return mdx(\"div\", props);\n  };\n};\n\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n      props = _objectWithoutProperties(_ref, [\"components\"]);\n\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"p\", null, \"This is an example how you can use React components with MDX.\"), mdx(SpotifyPlayer, {\n    uri: \"spotify:user:bbcamerica:playlist:3w18u69NplCpXVG4fQG726\",\n    size: \"large\",\n    theme: \"black\",\n    view: \"list\",\n    mdxType: \"SpotifyPlayer\"\n  }));\n}\n;\nMDXContent.isMDXComponent = true;","excerpt":"This is an example how you can use React components with MDX.","frontmatter":{"title":"Use component in MDX","date":"01/03/2018","categories":["Coding"]},"timeToRead":1,"parent":{"__typename":"File","mtime":"2019-10-05T17:41:42.494Z","birthtime":"2019-10-05T17:41:42.494Z"}}},"pageContext":{"isCreatedByStatefulCreatePages":false,"slug":"/use-component-in-mdx","prev":{"fields":{"slug":"/markdown-cheatsheet"},"frontmatter":{"title":"Markdown Cheatsheet","categories":["General"]}},"next":{"fields":{"slug":"/react-live-code-example"},"frontmatter":{"title":"React-Live & Code example","categories":["Coding","Help"]}}}}}