{"componentChunkName":"component---src-pages-components-pagination-code-mdx","path":"/components/pagination/code/","result":{"pageContext":{"frontmatter":{"title":"Pagination","description":"Pagination is used for splitting up content or data into several pages, with a control for navigating to the next or previous page.","tabs":["Code","Usage","Style","Accessibility"]},"relativePagePath":"/components/pagination/code.mdx","titleType":"prepend","MdxNode":{"id":"1ff83bb3-41f9-5783-b3ab-b4e66c06ba35","children":[],"parent":"3b22e211-9598-5a09-abe4-cb007532eb09","internal":{"content":"---\ntitle: Pagination\ndescription: Pagination is used for splitting up content or data into several pages, with a control for navigating to the next or previous page.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\n## Pagination\n\n<ComponentCode\n  name=\"Pagination\"\n  component=\"pagination\"\n  variation=\"pagination\"\n  hasReactVersion=\"pagination--pagination\"\n  hasVueVersion=\"pagination--default\"\n  hasAngularVersion=\"?path=/story/pagination--default\"\n  codepen=\"KYzgVB\"\n/>\n\n## Disabled pagination buttons\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination\"\n  variation=\"pagination--disabled-pagination-buttons\"\n  hasReactVersion=\"pagination--pagination\"\n  hasVueVersion=\"pagination--default&knob-Number%20of%20items=10\"\n  codepen=\"LvNRZV\"\n/>\n\n## Pagination nav\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination-nav\"\n  variation=\"pagination-nav\"\n/>\n\n## Pagination nav with select\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination-nav\"\n  variation=\"pagination-nav--default--with-select\"\n/>\n\n## Pagination nav as anchor tags\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination-nav\"\n  variation=\"pagination-nav--default--as-anchor\"\n/>\n\n## Pagination Documentation\n\n<ComponentDocs component=\"pagination\" />\n\n## Pagination nav documentation\n\n<ComponentDocs component=\"pagination-nav\" />\n","type":"Mdx","contentDigest":"722ce522204800b6e7a456ab695c1dc0","counter":1557,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"Pagination","description":"Pagination is used for splitting up content or data into several pages, with a control for navigating to the next or previous page.","tabs":["Code","Usage","Style","Accessibility"]},"exports":{},"rawBody":"---\ntitle: Pagination\ndescription: Pagination is used for splitting up content or data into several pages, with a control for navigating to the next or previous page.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\n## Pagination\n\n<ComponentCode\n  name=\"Pagination\"\n  component=\"pagination\"\n  variation=\"pagination\"\n  hasReactVersion=\"pagination--pagination\"\n  hasVueVersion=\"pagination--default\"\n  hasAngularVersion=\"?path=/story/pagination--default\"\n  codepen=\"KYzgVB\"\n/>\n\n## Disabled pagination buttons\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination\"\n  variation=\"pagination--disabled-pagination-buttons\"\n  hasReactVersion=\"pagination--pagination\"\n  hasVueVersion=\"pagination--default&knob-Number%20of%20items=10\"\n  codepen=\"LvNRZV\"\n/>\n\n## Pagination nav\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination-nav\"\n  variation=\"pagination-nav\"\n/>\n\n## Pagination nav with select\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination-nav\"\n  variation=\"pagination-nav--default--with-select\"\n/>\n\n## Pagination nav as anchor tags\n\n<ComponentCode\n  name=\"Pagination nav\"\n  component=\"pagination-nav\"\n  variation=\"pagination-nav--default--as-anchor\"\n/>\n\n## Pagination Documentation\n\n<ComponentDocs component=\"pagination\" />\n\n## Pagination nav documentation\n\n<ComponentDocs component=\"pagination-nav\" />\n","fileAbsolutePath":"/zeit/3f757860/src/pages/components/pagination/code.mdx"}}}}