{"componentChunkName":"component---src-pages-components-toggle-code-mdx","path":"/components/toggle/code/","result":{"pageContext":{"frontmatter":{"title":"Toggle","description":"A toggle is a control that is used to quickly switch between two possible states. They are commonly used for “on/off” switches.","tabs":["Code","Usage","Style","Accessibility"]},"relativePagePath":"/components/toggle/code.mdx","titleType":"prepend","MdxNode":{"id":"351d4192-528d-5342-8e1a-2aff4e6641e2","children":[],"parent":"e322b4d3-b7fa-51b9-a444-1be7bdaaec2f","internal":{"content":"---\ntitle: Toggle\ndescription: A toggle is a control that is used to quickly switch between two possible states. They are commonly used for “on/off” switches.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\n## Toggle\n\n<ComponentCode\n  name=\"Toggle\"\n  component=\"toggle\"\n  variation=\"toggle\"\n  hasReactVersion=\"toggle--toggled\"\n  hasVueVersion=\"toggle--default\"\n  hasAngularVersion=\"?path=/story/toggle--basic\"\n  codepen=\"QPNddd\"></ComponentCode>\n\n## Small toggle\n\n<ComponentCode\n  name=\"Small toggle\"\n  component=\"toggle\"\n  variation=\"toggle--small\"\n  hasReactVersion=\"togglesmall--toggled\"\n  hasVueVersion=\"toggle--default&knob-small=true\"\n  hasAngularVersion=\"?path=/story/toggle--basic&knob-disabled=&knob-checked=&knob-size=sm\"\n  codepen=\"XQdppE\"></ComponentCode>\n","type":"Mdx","contentDigest":"3535b3c488a72fcf5eb4e86c85b719b5","counter":1592,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"Toggle","description":"A toggle is a control that is used to quickly switch between two possible states. They are commonly used for “on/off” switches.","tabs":["Code","Usage","Style","Accessibility"]},"exports":{},"rawBody":"---\ntitle: Toggle\ndescription: A toggle is a control that is used to quickly switch between two possible states. They are commonly used for “on/off” switches.\ntabs: ['Code', 'Usage', 'Style', 'Accessibility']\n---\n\n## Toggle\n\n<ComponentCode\n  name=\"Toggle\"\n  component=\"toggle\"\n  variation=\"toggle\"\n  hasReactVersion=\"toggle--toggled\"\n  hasVueVersion=\"toggle--default\"\n  hasAngularVersion=\"?path=/story/toggle--basic\"\n  codepen=\"QPNddd\"></ComponentCode>\n\n## Small toggle\n\n<ComponentCode\n  name=\"Small toggle\"\n  component=\"toggle\"\n  variation=\"toggle--small\"\n  hasReactVersion=\"togglesmall--toggled\"\n  hasVueVersion=\"toggle--default&knob-small=true\"\n  hasAngularVersion=\"?path=/story/toggle--basic&knob-disabled=&knob-checked=&knob-size=sm\"\n  codepen=\"XQdppE\"></ComponentCode>\n","fileAbsolutePath":"/zeit/767b4790/src/pages/components/toggle/code.mdx"}}}}