{"componentChunkName":"component---src-pages-components-content-switcher-usage-mdx","path":"/components/content-switcher/usage/","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/usage.mdx","titleType":"prepend","MdxNode":{"id":"09c094e3-43f4-50e7-91a4-d04768872af0","children":[],"parent":"a2a4529e-25a6-5bbe-8d24-8e04c0147f47","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## General guidance\n\n_Content switcher_ manipulates the content shown following an exclusive or “either/or” pattern.\nIt is used to toggle between two or more content sections within the same space on screen. Only one section can be shown at a time.\n\n#### Text\n\nBe concise and specific. Titles have a max of two words.\n\n#### Default selection\n\nBased on usage, there should be a default selection. The default selection is always the first option in a switcher.\n\n## Related components\n\n#### Content switcher vs. toggle\n\nThe content switcher is used for large groups of content, as opposed to the [toggle](/components/toggle/code) which is meant for a “yes/no” or “on/off” binary decision.\n\n<Row>\n<Column colLg={8}>\n\n![content switcher example](images/content-switcher-usage-1.png)\n\n</Column>\n</Row>\n","type":"Mdx","contentDigest":"00abc1526a716621d46bf768054b7c31","counter":1330,"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## General guidance\n\n_Content switcher_ manipulates the content shown following an exclusive or “either/or” pattern.\nIt is used to toggle between two or more content sections within the same space on screen. Only one section can be shown at a time.\n\n#### Text\n\nBe concise and specific. Titles have a max of two words.\n\n#### Default selection\n\nBased on usage, there should be a default selection. The default selection is always the first option in a switcher.\n\n## Related components\n\n#### Content switcher vs. toggle\n\nThe content switcher is used for large groups of content, as opposed to the [toggle](/components/toggle/code) which is meant for a “yes/no” or “on/off” binary decision.\n\n<Row>\n<Column colLg={8}>\n\n![content switcher example](images/content-switcher-usage-1.png)\n\n</Column>\n</Row>\n","fileAbsolutePath":"/zeit/1252fd04/src/pages/components/content-switcher/usage.mdx"}}}}