component---node-modules-pitayan-gatsby-theme-pitayan-src-templates-post-index-tsx-content-file-path-content-posts-2022-04-04-a-post-with-source-code-index-mdx-c6fd69a29f0990d12a8e.js.map

{"version":3,"file":"component---node-modules-pitayan-gatsby-theme-pitayan-src-templates-post-index-tsx-content-file-path-content-posts-2022-04-04-a-post-with-source-code-index-mdx-c6fd69a29f0990d12a8e.js","mappings":"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","sources":["webpack://www/./content/posts/2022-04-04-a-post-with-source-code/index.mdx","webpack://www/./node_modules/@pitayan/gatsby-theme-pitayan/src/templates/post/index.tsx"],"sourcesContent":["/*@jsxRuntime classic @jsx React.createElement @jsxFrag React.Fragment*/\nimport {useMDXComponents as _provideComponents} from \"@mdx-js/react\";\nimport React from \"react\";\nfunction _createMdxContent(props) {\n  const _components = Object.assign({\n    h1: \"h1\",\n    a: \"a\",\n    span: \"span\",\n    p: \"p\"\n  }, _provideComponents(), props.components);\n  return React.createElement(React.Fragment, null, React.createElement(_components.h1, {\n    id: \"firstly\",\n    style: {\n      position: \"relative\"\n    }\n  }, React.createElement(_components.a, {\n    href: \"#firstly\",\n    \"aria-label\": \"firstly permalink\",\n    className: \"heading-anchor before\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span>#</span>\"\n    }\n  })), \"Firstly\"), \"\\n\", React.createElement(_components.p, null, \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus pharetra egestas odio id accumsan. In vel ipsum quam. Fusce scelerisque rutrum tempus. Mauris in velit sapien. In mi nibh, dignissim in ligula ut, faucibus lacinia libero. Etiam volutpat turpis est, a scelerisque sem commodo eu. Morbi lectus quam, molestie eget vestibulum in, porta ac tellus. Aliquam feugiat, orci non vehicula tristique, augue ex congue dui, non suscipit velit purus vitae diam. Phasellus dui augue, faucibus sed neque id, pellentesque porta magna. Cras nec lacinia dui. Pellentesque lacinia, nisi non porta condimentum, risus nisi semper erat, vel ullamcorper neque justo sit amet erat. Mauris lacinia dolor in arcu tempor pretium.\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<div class=\\\"gatsby-highlight\\\" data-language=\\\"diff\\\"><pre class=\\\"language-diff-python\\\"><code class=\\\"language-diff-python\\\">from datetime import date\\n\\ndef hello():\\n<span class=\\\"token deleted-sign deleted language-python\\\"><span class=\\\"token prefix deleted\\\">-</span>  today <span class=\\\"token operator\\\">=</span> date<span class=\\\"token punctuation\\\">.</span>today<span class=\\\"token punctuation\\\">(</span><span class=\\\"token punctuation\\\">)</span>\\n</span><span class=\\\"token inserted-sign inserted language-python\\\"><span class=\\\"token prefix inserted\\\">+</span>  <span class=\\\"token keyword\\\">print</span><span class=\\\"token punctuation\\\">(</span><span class=\\\"token string\\\">\\\"Today's date:\\\"</span><span class=\\\"token punctuation\\\">,</span> today<span class=\\\"token punctuation\\\">)</span>\\n</span>\\nif __name__ == \\\"__main__\\\":\\n<span class=\\\"token unchanged language-python\\\"><span class=\\\"token prefix unchanged\\\"> </span> hello<span class=\\\"token punctuation\\\">(</span><span class=\\\"token punctuation\\\">)</span></span></code></pre></div>\"\n    }\n  }), \"\\n\", React.createElement(_components.p, null, \"Donec venenatis blandit erat. In a sodales neque, sit amet dignissim eros. Donec sit amet semper ligula. Praesent vel ligula ultrices, efficitur nisi non, tincidunt dolor. Proin a dolor dolor. Fusce malesuada ornare felis eu auctor. Morbi vestibulum venenatis lectus scelerisque tempus.\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<div class=\\\"gatsby-highlight\\\" data-language=\\\"bash\\\"><pre class=\\\"language-bash\\\"><code class=\\\"language-bash\\\">$ <span class=\\\"token builtin class-name\\\">cd</span> ~\\n$ <span class=\\\"token function\\\">chmod</span> a+x my_shell.sh\\n$ ./my_shell.sh <span class=\\\"token string\\\">\\\"my name\\\"</span> <span class=\\\"token string\\\">\\\"my hobby\\\"</span></code></pre></div>\"\n    }\n  }), \"\\n\", React.createElement(_components.h1, {\n    id: \"second-heading\",\n    style: {\n      position: \"relative\"\n    }\n  }, React.createElement(_components.a, {\n    href: \"#second-heading\",\n    \"aria-label\": \"second heading permalink\",\n    className: \"heading-anchor before\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span>#</span>\"\n    }\n  })), \"Second Heading\"), \"\\n\", React.createElement(_components.p, null, \"Vivamus hendrerit eleifend nunc sed imperdiet. Ut sed sem at nisi rhoncus faucibus. Cras varius ex quis semper lacinia. Sed eu leo lectus. Quisque pellentesque condimentum metus, non dapibus justo lobortis mattis. Suspendisse sit amet eros justo. Cras iaculis elementum nisl, quis vehicula diam tincidunt quis. Aliquam id aliquam odio, bibendum tristique nibh. Suspendisse mattis pharetra turpis, et pharetra urna eleifend quis. Proin tempor molestie magna in egestas. Vivamus arcu ante, eleifend eget mattis ac, aliquam at lorem. Nulla vehicula consectetur pulvinar. Quisque sit amet ligula ac ipsum eleifend ultrices. Suspendisse potenti. Aenean a massa iaculis, posuere elit in, vehicula arcu. Aliquam erat volutpat.\"), \"\\n\", React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<div class=\\\"gatsby-highlight\\\" data-language=\\\"js\\\"><pre class=\\\"language-js\\\"><code class=\\\"language-js\\\"><span class=\\\"token comment\\\">// Just a comment</span>\\nconsole<span class=\\\"token punctuation\\\">.</span><span class=\\\"token function\\\">log</span><span class=\\\"token punctuation\\\">(</span><span class=\\\"token string\\\">\\\"hello world\\\"</span><span class=\\\"token punctuation\\\">)</span>\\n\\n<span class=\\\"token keyword\\\">try</span> <span class=\\\"token punctuation\\\">{</span>\\n  <span class=\\\"token keyword\\\">throw</span> <span class=\\\"token keyword\\\">new</span> <span class=\\\"token class-name\\\">Error</span><span class=\\\"token punctuation\\\">(</span><span class=\\\"token string\\\">\\\"It's a mistake\\\"</span><span class=\\\"token punctuation\\\">)</span>\\n<span class=\\\"token punctuation\\\">}</span> <span class=\\\"token keyword\\\">catch</span> <span class=\\\"token punctuation\\\">{</span>\\n  <span class=\\\"token comment\\\">// I don't wanna do anything about this error</span>\\n<span class=\\\"token punctuation\\\">}</span></code></pre></div>\"\n    }\n  }), \"\\n\", React.createElement(_components.p, null, \"Sed tempus velit augue, fringilla mollis dui bibendum non. Vestibulum volutpat nisi ut dolor pretium, quis euismod tellus pulvinar. Vestibulum ut ligula vitae elit lobortis scelerisque eget a nisl. Nam libero nibh, euismod in pulvinar ut, venenatis id odio. Mauris varius vel lectus sed sagittis. Nulla facilisi. Fusce suscipit lectus eros, vel viverra eros posuere a. Vivamus gravida, tellus vitae varius consectetur, eros nisl malesuada mauris, eget malesuada mi est sit amet nisl. Ut vitae mauris sit amet justo congue iaculis. Nullam vestibulum dapibus velit. Sed mauris nunc, aliquam ac nisl eget, tincidunt sollicitudin orci. Nullam dictum efficitur tincidunt. Proin sollicitudin mi vitae purus iaculis, ut interdum libero fermentum.\"), \"\\n\", React.createElement(_components.h1, {\n    id: \"third-heading\",\n    style: {\n      position: \"relative\"\n    }\n  }, React.createElement(_components.a, {\n    href: \"#third-heading\",\n    \"aria-label\": \"third heading permalink\",\n    className: \"heading-anchor before\"\n  }, React.createElement(_components.span, {\n    dangerouslySetInnerHTML: {\n      __html: \"<span>#</span>\"\n    }\n  })), \"Third Heading\"), \"\\n\", React.createElement(_components.p, null, \"Donec at lorem commodo, facilisis nunc eu, facilisis magna. Praesent nec pharetra dolor, sit amet vehicula turpis. Cras eros turpis, commodo eu cursus sed, molestie et nibh. Fusce tempus orci orci, ac ultricies tortor venenatis nec. Maecenas eu interdum nulla, quis sodales diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Etiam sem ligula, aliquam in luctus ut, finibus eu lectus.\"));\n}\nfunction MDXContent(props = {}) {\n  const {wrapper: MDXLayout} = Object.assign({}, _provideComponents(), props.components);\n  return MDXLayout ? React.createElement(MDXLayout, props, React.createElement(_createMdxContent, props)) : _createMdxContent(props);\n}\nexport default MDXContent;\n","import GATSBY_COMPILED_MDX from \"/home/eric/git/oaac-web/content/posts/2022-04-04-a-post-with-source-code/index.mdx\";\nimport React, {useRef} from \"react\";\nimport {Link} from \"gatsby\";\nimport {MDXProvider} from \"@mdx-js/react\";\nimport {RiArrowLeftLine, RiArrowRightLine} from \"react-icons/ri\";\nimport {GatsbyImage, getImage} from \"gatsby-plugin-image\";\nimport {useLocation} from \"@reach/router\";\nimport DefaultLayout from \"@pitayan/gatsby-theme-pitayan/src/layouts/Default\";\nimport PostMeta from \"@pitayan/gatsby-theme-pitayan/src/components/PostMeta\";\nimport AuthorCard from \"@pitayan/gatsby-theme-pitayan/src/components/AuthorCard\";\nimport SocialSharing from \"@pitayan/gatsby-theme-pitayan/src/components/SocialSharing\";\nimport CategoryTags from \"@pitayan/gatsby-theme-pitayan/src/components/CategoryTags\";\nimport BackToTop from \"@pitayan/gatsby-theme-pitayan/src/components/BackToTop\";\nimport PostAuthors from \"@pitayan/gatsby-theme-pitayan/src/components/PostAuthors\";\nimport SelectionPopup from \"@pitayan/gatsby-theme-pitayan/src/components/SelectionPopup\";\nimport ScrollVisibility from \"@pitayan/gatsby-theme-pitayan/src/components/ScrollVisibility\";\nimport TableOfContents from \"@pitayan/gatsby-theme-pitayan/src/components/TableOfContents\";\nimport {useSiteMetadata} from \"@pitayan/gatsby-theme-pitayan/src/hooks\";\nimport {SOCIAL_RESOURCES} from \"@pitayan/gatsby-theme-pitayan/src/constants\";\nimport PostsGroup from \"@pitayan/gatsby-theme-pitayan/src/components/PostsGroup\";\nconst PostImage = _ref => {\n  let {image} = _ref;\n  return image ? React.createElement(GatsbyImage, {\n    className: \"gatsby-resp-image-image\",\n    image: image,\n    alt: \"\"\n  }) : null;\n};\nconst Post = _ref2 => {\n  let {data: {mdx: {body, tableOfContents, frontmatter: {author: coAuthors, title, date, categories, hero, description, keywords}, fields: {slug}, timeToRead, relatedPosts}}, pageContext: {tableOfContentsLevels, previous, next}, children} = _ref2;\n  const articleRef = useRef(null);\n  const postImage = getImage(hero === null || hero === void 0 ? void 0 : hero.medium);\n  const {siteUrl} = useSiteMetadata();\n  const {href: url} = useLocation();\n  const authors = coAuthors.map(_ref3 => {\n    let {id, yamlId, name, bio, sns} = _ref3;\n    const socialUrls = sns.filter(s => s[0] != \"mailto\" && s[0] != \"url\").map(s => {\n      const network = SOCIAL_RESOURCES[s[0]].url;\n      const profile = s[1];\n      return network + \"/\" + profile;\n    });\n    return {\n      id,\n      yamlId,\n      name,\n      bio,\n      socialUrls\n    };\n  });\n  return React.createElement(DefaultLayout, {\n    postDescription: description,\n    pageImage: postImage.images.fallback.src,\n    pageUrl: \"\" + siteUrl + slug,\n    postTitle: title,\n    pageTitle: title,\n    keywords: keywords,\n    date: date,\n    timeToRead: timeToRead,\n    authors: authors\n  }, React.createElement(SelectionPopup, {\n    ref: articleRef\n  }), React.createElement(\"div\", {\n    className: \"hidden md:block\"\n  }, React.createElement(ScrollVisibility, {\n    className: \"fixed right-[6%] bottom-[6%] flex flex-col justify-center z-50\"\n  }, React.createElement(BackToTop, null))), React.createElement(\"div\", {\n    className: \"max-w-lg md:max-w-2xl mx-auto mb-24\"\n  }, React.createElement(\"h1\", {\n    className: \"text-center\"\n  }, title), React.createElement(PostMeta, {\n    className: \"block mb-4 text-center\",\n    date: date,\n    timeToRead: timeToRead\n  }), React.createElement(\"div\", {\n    className: \"block sm:flex flex-wrap items-center justify-center sm:justify-between\"\n  }, React.createElement(PostAuthors, {\n    data: coAuthors\n  }), React.createElement(SocialSharing, {\n    url: url,\n    title: title,\n    hashtags: categories.join(\",\"),\n    description: description,\n    className: \"space-x-6 text-xl py-4 justify-center\",\n    twitter: true,\n    facebook: true,\n    linkedin: true,\n    pocket: true,\n    copy: true\n  }))), React.createElement(\"div\", {\n    className: \"text-center mb-24\"\n  }, React.createElement(PostImage, {\n    image: postImage\n  })), React.createElement(\"div\", {\n    className: \"lg:grid lg:grid-cols-9 lg:gaps-5\"\n  }, React.createElement(SocialSharing, {\n    url: url,\n    title: title,\n    hashtags: categories.join(\",\"),\n    description: description,\n    className: \"hidden lg:flex text-xl mt-12 flex-col lg:col-start-1 lg:col-end-3 top-[2rem] sticky self-start max-h-full overflow-y-auto space-y-6\",\n    twitter: true,\n    facebook: true,\n    linkedin: true,\n    pocket: true,\n    copy: true\n  }), React.createElement(\"article\", {\n    className: \"markdown lg:col-start-3 lg:col-end-8\",\n    ref: articleRef\n  }, React.createElement(MDXProvider, {\n    components: {}\n  }, children)), React.createElement(TableOfContents, {\n    className: \"hidden lg:block lg:col-span-2 mt-12 top-[2rem] sticky self-start text-xs font-semibold ml-12 mr-auto mb-6 overflow-y-auto max-h-full\",\n    items: tableOfContents.items,\n    ref: articleRef,\n    levels: tableOfContentsLevels\n  })), React.createElement(\"div\", {\n    className: \"my-8 max-w-lg md:max-w-2xl mx-auto\"\n  }, React.createElement(\"div\", {\n    className: \"block sm:flex flex-wrap items-center justify-center sm:justify-between\"\n  }, React.createElement(CategoryTags, {\n    className: \"my-8 justify-center\",\n    categories: categories\n  }), React.createElement(SocialSharing, {\n    url: url,\n    title: title,\n    hashtags: categories.join(\",\"),\n    description: description,\n    className: \"space-x-6 text-xl my-8 justify-center\",\n    twitter: true,\n    facebook: true,\n    linkedin: true,\n    pocket: true,\n    copy: true\n  })), React.createElement(\"div\", {\n    className: \"flex justify-around flex-wrap text-base mt-12 mb-24\"\n  }, React.createElement(\"div\", {\n    className: \"p-4 my-4 bg-gray-50 border border-solid border-gray-100 dark:bg-gray-800 dark:border-gray-800 rounded mr-auto w-full md:w-[49%]\"\n  }, React.createElement(Link, {\n    to: previous.slug,\n    className: \"site-link my-2 block\"\n  }, React.createElement(\"div\", {\n    className: \"flex items-start space-x-2\"\n  }, React.createElement(RiArrowLeftLine, {\n    className: \"block h-6 w-6\"\n  }), React.createElement(\"span\", null, previous.title)))), React.createElement(\"div\", {\n    className: \"p-4 my-4 bg-gray-50 border border-solid border-gray-100 dark:bg-gray-800 dark:border-gray-800 rounded ml-auto w-full md:w-[49%]\"\n  }, React.createElement(Link, {\n    to: next.slug,\n    className: \"site-link my-2 block text-right\"\n  }, React.createElement(\"div\", {\n    className: \"flex items-start space-x-2 justify-end\"\n  }, React.createElement(\"span\", null, next.title), React.createElement(RiArrowRightLine, {\n    className: \"block h-6 w-6\"\n  }))))), React.createElement(\"h5\", {\n    className: \"text-center mb-12\"\n  }, \"Written by\"), coAuthors.map(_ref4 => {\n    let {bio, name, initial, avatar, sns, yamlId} = _ref4;\n    return React.createElement(AuthorCard, {\n      className: \"p-8 mb-4 bg-gray-50 border border-solid border-gray-100 dark:bg-gray-800 dark:border-gray-800 rounded\",\n      key: yamlId,\n      bio: bio,\n      name: name,\n      initial: initial,\n      avatar: avatar,\n      sns: sns,\n      yamlId: yamlId\n    });\n  })), React.createElement(\"div\", {\n    className: \"my-24 max-w-lg sm:max-w-full mx-auto\"\n  }, React.createElement(\"h5\", {\n    className: \"mb-12 text-center\"\n  }, \"Related Posts\"), React.createElement(PostsGroup, {\n    posts: relatedPosts,\n    className: \"grid sm:grid-cols-3 row-auto auto-cols-auto gap-8\"\n  })));\n};\nconst pageQuery = \"2224090640\";\nPost\nexport default function GatsbyMDXWrapper(props) {\n  return React.createElement(Post, props, React.createElement(GATSBY_COMPILED_MDX, props));\n}\n"],"names":["_createMdxContent","props","_components","Object","assign","h1","a","span","p","_provideComponents","components","React","id","style","position","href","className","dangerouslySetInnerHTML","__html","wrapper","MDXLayout","PostImage","_ref","image","GatsbyImage","alt","Post","_ref2","data","mdx","body","tableOfContents","frontmatter","author","coAuthors","title","date","categories","hero","description","keywords","fields","slug","timeToRead","relatedPosts","pageContext","tableOfContentsLevels","previous","next","children","articleRef","useRef","postImage","getImage","medium","siteUrl","useSiteMetadata","url","useLocation","authors","map","_ref3","yamlId","name","bio","sns","socialUrls","filter","s","SOCIAL_RESOURCES","DefaultLayout","postDescription","pageImage","images","fallback","src","pageUrl","postTitle","pageTitle","SelectionPopup","ref","ScrollVisibility","BackToTop","PostMeta","PostAuthors","SocialSharing","hashtags","join","twitter","facebook","linkedin","pocket","copy","MDXProvider","TableOfContents","items","levels","CategoryTags","Link","to","RiArrowLeftLine","RiArrowRightLine","_ref4","initial","avatar","AuthorCard","key","PostsGroup","posts","GatsbyMDXWrapper","GATSBY_COMPILED_MDX"],"sourceRoot":""}