component---src-pages-toolbox-tsx-a0693ffa2bbe4d58e72a.js.map

{"version":3,"sources":["webpack:///./src/pages/toolbox.tsx"],"names":["tools","category","url","title","ToolBoxPage","props","data","categories","Array","from","Set","map","n","keywords","site","siteMetadata","className","key","filter","tool","to","query"],"mappings":"4FAAA,8FAMMA,GANN,UAMc,CACZ,CACEC,SAAU,UACVC,IAAK,sBACLC,MAAO,cAET,CACEF,SAAU,UACVC,IAAK,4BACLC,MAAO,YAET,CACEF,SAAU,UACVC,IAAK,4BACLC,MAAO,YAET,CACEF,SAAU,QACVC,IAAK,wBACLC,MAAO,UAET,CACEF,SAAU,QACVC,IAAK,6BACLC,MAAO,eAET,CACEF,SAAU,QACVC,IAAK,uBACLC,MAAO,cAET,CACEF,SAAU,QACVC,IAAK,4BACLC,MAAO,cAET,CACEF,SAAU,QACVC,IAAK,wBACLC,MAAO,UAET,CACEF,SAAU,SACVC,IAAK,uBACLC,MAAO,iBAiCIC,UA7B0B,SAACC,GAAU,IAC1CC,EAASD,EAATC,KAEFC,EAAaC,MAAMC,KAAK,IAAIC,IAAIV,EAAMW,KAAI,SAAAC,GAAC,OAAIA,EAAEX,cAEvD,OACE,kBAAC,IAAD,KACE,kBAAC,IAAD,CACEE,MAAM,KACNU,SAAUP,EAAKQ,KAAKC,aAAaF,WAEnC,yBAAKG,UAAU,2BAEXT,EAAWI,KAAI,SAAAV,GAAQ,OACvB,kBAAC,WAAD,CAAUgB,IAAKhB,GACb,wBAAIe,UAAU,kBAAkBf,GAChC,yBAAKe,UAAU,kBACXhB,EAAMkB,QAAO,SAAAN,GAAC,OAAIA,EAAEX,WAAaA,KAAUU,KAAI,SAAAQ,GAAI,OACnD,kBAAC,OAAD,CAAMF,IAAKE,EAAKjB,IAAKc,UAAU,OAAOI,GAAID,EAAKjB,KAAMiB,EAAKhB,kBAanE,IAAMkB,EAAQ,c","file":"component---src-pages-toolbox-tsx-a0693ffa2bbe4d58e72a.js","sourcesContent":["import React, { Fragment, FC } from 'react'\nimport { Link, graphql } from 'gatsby'\nimport { Layout, SEO } from '../components'\nimport './toolbox.scss'\nimport { GatsbyDataProps } from '../utils/interface'\n\nconst tools = [\n  {\n    category: \"Browser\",\n    url: \"/toolbox/browser-ua\",\n    title: \"User Agent\"\n  },\n  {\n    category: \"Browser\",\n    url: \"/toolbox/browser-viewport\",\n    title: \"Viewport\"\n  },\n  {\n    category: \"Browser\",\n    url: \"/toolbox/browser-keyboard\",\n    title: \"Keyboard\"\n  },\n  {\n    category: \"HTML5\",\n    url: \"/toolbox/html5-canvas\",\n    title: \"Canvas\"\n  },\n  {\n    category: \"HTML5\",\n    url: \"/toolbox/html5-geolocation\",\n    title: \"Geolocation\"\n  },\n  {\n    category: \"HTML5\",\n    url: \"/toolbox/html5-input\",\n    title: \"Input Type\"\n  },\n  {\n    category: \"HTML5\",\n    url: \"/toolbox/html5-connection\",\n    title: \"Connection\"\n  },\n  {\n    category: \"HTML5\",\n    url: \"/toolbox/html5-online\",\n    title: \"Online\"\n  },\n  {\n    category: \"Device\",\n    url: \"/toolbox/device-data\",\n    title: \"Device Data\"\n  }\n]\n\nconst ToolBoxPage: FC<GatsbyDataProps> = (props) => {\n  const { data } = props\n\n  const categories = Array.from(new Set(tools.map(n => n.category)))\n\n  return (\n    <Layout>\n      <SEO\n        title='工具'\n        keywords={data.site.siteMetadata.keywords}\n      />\n      <div className='mf-content tool-catalog'>\n\n        { categories.map(category => (\n          <Fragment key={category}>\n            <h1 className='category-title'>{category}</h1>\n            <div className='category-items'>\n              { tools.filter(n => n.category === category).map(tool => (\n                <Link key={tool.url} className='item' to={tool.url}>{tool.title}</Link>\n              )) }\n            </div>\n          </Fragment>\n        ))}\n\n      </div>\n    </Layout>\n  )\n}\n\nexport default ToolBoxPage\n\nexport const query = graphql`\nquery {\n  site {\n    siteMetadata {\n      title,\n      keywords\n    }\n  }\n}`\n"],"sourceRoot":""}