{"componentChunkName":"component---src-pages-components-toggle-code-mdx","path":"/components/toggle/code/","result":{"pageContext":{"isCreatedByStatefulCreatePages":true,"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"]},"relativePagePath":"/components/toggle/code.mdx","titleType":"prepend","MdxNode":{"id":"50832faa-4dce-5126-9e5c-0cb47cd5bd14","children":[],"parent":"d25e88db-5848-58bc-ae55-e927f0a94d74","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']\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\n## Documentation\n\n<ComponentDocs component=\"toggle\"></ComponentDocs>\n","type":"Mdx","contentDigest":"74ff6c76ce1d92ab3666f7ca9b882b03","counter":1401,"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"]},"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']\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\n## Documentation\n\n<ComponentDocs component=\"toggle\"></ComponentDocs>\n","fileAbsolutePath":"/zeit/1252fd04/src/pages/components/toggle/code.mdx"}}}}