{"componentChunkName":"component---src-pages-components-tile-code-mdx","path":"/components/tile/code/","result":{"pageContext":{"isCreatedByStatefulCreatePages":true,"frontmatter":{"title":"Tile","description":"Tiles are a flexible component for displaying a wide variety of content, including informational, getting started, how-to, next steps, and more.","tabs":["Code","Usage","Style","Accessibility"]},"relativePagePath":"/components/tile/code.mdx","titleType":"prepend","MdxNode":{"id":"10d1cd2f-b4fd-594e-bad6-6f8a0c8686c5","children":[],"parent":"d85e1757-c138-595b-9d0d-dc8e2e1a3b91","internal":{"content":"---\ntitle: Tile\ndescription: Tiles are a flexible component for displaying a wide variety of content, including informational, getting started, how-to, next steps, and more.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\n## Tile\n\n<ComponentCode\n  name=\"Tile\"\n  component=\"tile\"\n  variation=\"tile\"\n  hasReactVersion=\"tile--default\"\n  hasVueVersion=\"tile--default\"\n  hasAngularVersion=\"?path=/story/tiles--basic\"\n  codepen=\"qwZRWy\"></ComponentCode>\n\n## Clickable tile\n\n<ComponentCode\n  name=\"Clickable tile\"\n  component=\"tile\"\n  variation=\"tile--clickable\"\n  hasReactVersion=\"tile--clickable\"\n  hasVueVersion=\"tile--clickable\"\n  hasAngularVersion=\"?path=/story/tiles--clickable\"\n  codepen=\"yrOgyM\"></ComponentCode>\n\n## Selectable tile\n\n<ComponentCode\n  name=\"Selectable tile\"\n  component=\"tile\"\n  variation=\"tile--selectable\"\n  hasReactVersion=\"tile--selectable\"\n  hasVueVersion=\"tile--selectable\"\n  codepen=\"wZGgKK\"></ComponentCode>\n\n## Expandable tile\n\n<ComponentCode\n  name=\"Expandable tile\"\n  component=\"tile\"\n  variation=\"tile--expandable\"\n  hasReactVersion=\"tile--expandable\"\n  hasVueVersion=\"tile--expandable\"\n  codepen=\"QPNdNG\"></ComponentCode>\n\n## Grid tile\n\n<ComponentCode\n  name=\"Grid tile\"\n  component=\"tile\"\n  variation=\"tile--grid\"></ComponentCode>\n\n## Documentation\n\n<ComponentDocs component=\"tile\"></ComponentDocs>\n","type":"Mdx","contentDigest":"f4ce589e2b7d597513b33a14e9ca57a2","counter":1585,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"Tile","description":"Tiles are a flexible component for displaying a wide variety of content, including informational, getting started, how-to, next steps, and more.","tabs":["Code","Usage","Style","Accessibility"]},"exports":{},"rawBody":"---\ntitle: Tile\ndescription: Tiles are a flexible component for displaying a wide variety of content, including informational, getting started, how-to, next steps, and more.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\n## Tile\n\n<ComponentCode\n  name=\"Tile\"\n  component=\"tile\"\n  variation=\"tile\"\n  hasReactVersion=\"tile--default\"\n  hasVueVersion=\"tile--default\"\n  hasAngularVersion=\"?path=/story/tiles--basic\"\n  codepen=\"qwZRWy\"></ComponentCode>\n\n## Clickable tile\n\n<ComponentCode\n  name=\"Clickable tile\"\n  component=\"tile\"\n  variation=\"tile--clickable\"\n  hasReactVersion=\"tile--clickable\"\n  hasVueVersion=\"tile--clickable\"\n  hasAngularVersion=\"?path=/story/tiles--clickable\"\n  codepen=\"yrOgyM\"></ComponentCode>\n\n## Selectable tile\n\n<ComponentCode\n  name=\"Selectable tile\"\n  component=\"tile\"\n  variation=\"tile--selectable\"\n  hasReactVersion=\"tile--selectable\"\n  hasVueVersion=\"tile--selectable\"\n  codepen=\"wZGgKK\"></ComponentCode>\n\n## Expandable tile\n\n<ComponentCode\n  name=\"Expandable tile\"\n  component=\"tile\"\n  variation=\"tile--expandable\"\n  hasReactVersion=\"tile--expandable\"\n  hasVueVersion=\"tile--expandable\"\n  codepen=\"QPNdNG\"></ComponentCode>\n\n## Grid tile\n\n<ComponentCode\n  name=\"Grid tile\"\n  component=\"tile\"\n  variation=\"tile--grid\"></ComponentCode>\n\n## Documentation\n\n<ComponentDocs component=\"tile\"></ComponentDocs>\n","fileAbsolutePath":"/zeit/2c7f9303/src/pages/components/tile/code.mdx"}}}}