{"componentChunkName":"component---src-pages-components-content-switcher-code-mdx","path":"/components/content-switcher/code/","webpackCompilationHash":"aaa6c4cbb44f8ca938e9","result":{"pageContext":{"isCreatedByStatefulCreatePages":true,"frontmatter":{"title":"Content switcher","description":"Content switchers manipulate the content shown following an exclusive or “either/or” pattern. It is used to toggle between two or more content sections within the same space on screen.","tabs":["Code","Usage","Style"]},"relativePagePath":"/components/content-switcher/code.mdx","titleType":"prepend","MdxNode":{"id":"162bfd04-b0d0-5df1-954d-b035255882ad","children":[],"parent":"fd5854e6-c3f8-5e87-83e1-0ccc51efbb45","internal":{"content":"---\ntitle: Content switcher\ndescription: Content switchers manipulate the content shown following an exclusive or “either/or” pattern. It is used to toggle between two or more content sections within the same space on screen.\ntabs: ['Code', 'Usage', 'Style']\n---\n\n## Content switcher\n\n<ComponentCode\n  name=\"Content switcher\"\n  component=\"content-switcher\"\n  variation=\"content-switcher\"\n  hasReactVersion=\"contentswitcher--default\"\n  hasVueVersion=\"contentswitcher--default\"\n  hasAngularVersion=\"?path=/story/content-switcher--basic\"\n  codepen=\"QPybNw\"></ComponentCode>\n\n## Content switcher disabled\n\n<ComponentCode\n  name=\"Content switcher disabled\"\n  component=\"content-switcher\"\n  variation=\"content-switcher--disabled\"\n  hasReactVersion=\"contentswitcher--default\"\n  hasVueVersion=\"contentswitcher--default&knob-with%20icon=true\"\n  hasAngularVersion=\"?path=/story/content-switcher--basic\"\n  codepen=\"OGMVxK\"></ComponentCode>\n\n## Documentation\n\n<ComponentDocs component=\"content-switcher\"></ComponentDocs>\n","type":"Mdx","contentDigest":"d3efcc0661ff82a579fb9bd372da95a8","counter":1104,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"Content switcher","description":"Content switchers manipulate the content shown following an exclusive or “either/or” pattern. It is used to toggle between two or more content sections within the same space on screen.","tabs":["Code","Usage","Style"]},"exports":{},"rawBody":"---\ntitle: Content switcher\ndescription: Content switchers manipulate the content shown following an exclusive or “either/or” pattern. It is used to toggle between two or more content sections within the same space on screen.\ntabs: ['Code', 'Usage', 'Style']\n---\n\n## Content switcher\n\n<ComponentCode\n  name=\"Content switcher\"\n  component=\"content-switcher\"\n  variation=\"content-switcher\"\n  hasReactVersion=\"contentswitcher--default\"\n  hasVueVersion=\"contentswitcher--default\"\n  hasAngularVersion=\"?path=/story/content-switcher--basic\"\n  codepen=\"QPybNw\"></ComponentCode>\n\n## Content switcher disabled\n\n<ComponentCode\n  name=\"Content switcher disabled\"\n  component=\"content-switcher\"\n  variation=\"content-switcher--disabled\"\n  hasReactVersion=\"contentswitcher--default\"\n  hasVueVersion=\"contentswitcher--default&knob-with%20icon=true\"\n  hasAngularVersion=\"?path=/story/content-switcher--basic\"\n  codepen=\"OGMVxK\"></ComponentCode>\n\n## Documentation\n\n<ComponentDocs component=\"content-switcher\"></ComponentDocs>\n","fileAbsolutePath":"/tmp/42b44a0/src/pages/components/content-switcher/code.mdx"}}}}