{"componentChunkName":"component---src-pages-components-toggle-code-mdx","path":"/components/toggle/code/","webpackCompilationHash":"9a5cb62a61994334ab3f","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":"ae3b75a7-9827-530e-825f-2f394ce0a98d","children":[],"parent":"6257f275-89c1-5c78-a20b-c748c37b99fa","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":"3584636dfb6b8502120cde227b6de321","counter":1245,"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":"/tmp/35443907/src/pages/components/toggle/code.mdx"}}}}