{"componentChunkName":"component---src-pages-components-content-switcher-usage-mdx","path":"/components/content-switcher/usage/","result":{"pageContext":{"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","Accessibility"]},"relativePagePath":"/components/content-switcher/usage.mdx","titleType":"prepend","MdxNode":{"id":"f12395c5-8536-5a61-b99b-146e14758188","children":[],"parent":"7f92beef-1c35-5137-a6f3-f5716a4a9109","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', 'Accessibility']\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":"4b52c0ba6f2e38040a6c07ae8b09470c","counter":1495,"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","Accessibility"]},"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', 'Accessibility']\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/45b021a8/src/pages/components/content-switcher/usage.mdx"}}}}