{"version":3,"sources":["webpack:///./src/templates/blog-post.module.scss","webpack:///./src/templates/blog-post.js"],"names":["module","exports","BlogPostTemplate","html","post","data","markdownRemark","title","frontmatter","description","excerpt","className","to","class","type","permalink","last_modified_date","created_by","styles","section","dangerouslySetInnerHTML","__html","alertMatch","alertText","match","replace","constructAlert","pageQuery"],"mappings":"iFACAA,EAAOC,QAAU,CAAC,QAAU,qC,kCCD5B,mIA8DeC,UA/BU,SAAC,GAAc,IAJxBC,EAKRC,EAD+B,EAAXC,KACRC,eAElB,OACE,kBAAC,IAAD,KACE,kBAAC,IAAD,CAAKC,MAAOH,EAAKI,YAAYD,MAAOE,YAAaL,EAAKM,UACtD,yBAAKC,UAAU,gBACb,kBAAC,OAAD,CAAMC,GAAG,KAAT,WACA,6BAASC,MAAM,YAAYC,KAAK,gBAChC,kBAAC,OAAD,CAAMF,GAAG,KAAT,mBACA,6BAASC,MAAM,YAAYC,KAAK,gBAChC,kBAAC,OAAD,CAAMF,GAAE,mBAAqBR,EAAKI,YAAYO,WAAcX,EAAKI,YAAYD,QAE/E,iCACE,4BAAQI,UAAU,cAChB,+CACA,wBAAIA,UAAU,aAAaP,EAAKI,YAAYD,OAC5C,yBAAKI,UAAU,QACb,0BAAMA,UAAU,QAAhB,oBAAyCP,EAAKI,YAAYQ,oBAC1D,8CAAoBZ,EAAKI,YAAYS,cAGzC,6BACEN,UAAWO,IAAOC,QAClBC,wBAAyB,CAAEC,QA5BrBlB,EA4BoCC,EAAKD,KAhDlC,SAACA,GACtB,IAAMmB,EAAa,sDACfC,EAAYpB,EAAKqB,MAAMF,GAE3B,OAAKC,GAILA,EAAYA,EAAU,GAAGE,QAAQ,2BAA4B,IAEtDtB,EAAKsB,QACVH,EADK,0EAIDC,EAJC,0BALEpB,EAgBFuB,CAAevB,UAoCjB,IAAMwB,EAAS","file":"component---src-templates-blog-post-js-bde76f511b4bf88af7bb.js","sourcesContent":["// extracted by mini-css-extract-plugin\nmodule.exports = {\"section\":\"blog-post-module--section--3lI_D\"};","import React from 'react';\nimport { graphql, Link } from 'gatsby';\n\nimport styles from './blog-post.module.scss';\nimport Layout from '../components/layout.js';\nimport SEO from '../components/seo.js';\n\nconst constructAlert = (html) => {\n  const alertMatch = /<p><strong>Note:<\\/strong> .+?(?=<\\/p?)<\\/p>/gis;\n  let alertText = html.match(alertMatch)\n\n  if (!alertText) {\n    return html;\n  }\n\n  alertText = alertText[0].replace(/<strong>Note:<\\/strong>/g, '');\n\n  return html.replace(\n    alertMatch,\n    `\n    <hx-alert class=\"my-5\" persist status=\"note\" type=\"info\">\n      ${alertText}\n    </hx-alert>\n  `\n  );\n};\n\nconst format = (html) => {\n  return constructAlert(html);\n};\n\nconst BlogPostTemplate = ({ data }) => {\n  const post = data.markdownRemark;\n\n  return (\n    <Layout>\n      <SEO title={post.frontmatter.title} description={post.excerpt} />\n      <nav className=\"hxBreadcrumb\">\n        <Link to=\"/\">Support</Link>\n        <hx-icon class=\"delimiter\" type=\"angle-right\"></hx-icon>\n        <Link to=\"/\">How-to Articles</Link>\n        <hx-icon class=\"delimiter\" type=\"angle-right\"></hx-icon>\n        <Link to={`/support/how-to/${post.frontmatter.permalink}`}>{post.frontmatter.title}</Link>\n      </nav>\n      <article>\n        <header className=\"mt-5 mb-10\">\n          <h1>How-to Articles</h1>\n          <h2 className=\"mb-2 mt-5\">{post.frontmatter.title}</h2>\n          <div className=\"flex\">\n            <span className=\"mr-8\">Last updated on: {post.frontmatter.last_modified_date}</span>\n            <span>Authored by: {post.frontmatter.created_by}</span>\n          </div>\n        </header>\n        <section\n          className={styles.section}\n          dangerouslySetInnerHTML={{ __html: format(post.html) }}\n        />\n      </article>\n    </Layout>\n  );\n};\n\nexport default BlogPostTemplate;\n\nexport const pageQuery = graphql`\n  query BlogPostBySlug($slug: String!) {\n    markdownRemark(fields: { slug: { eq: $slug } }) {\n      id\n      excerpt(pruneLength: 160)\n      html\n      fields {\n        slug\n      }\n      frontmatter {\n        title\n        permalink\n        last_modified_date\n        created_by\n      }\n    }\n  }\n`;\n"],"sourceRoot":""}