define([], function() { return "import * as React from 'react';\nimport './Layer.Interactive.Example.scss';\nimport {\n  ChoiceGroup,\n  IChoiceGroupOption,\n  Layer\n} from '../../../../index';\n\nexport interface ILayerInteractiveExampleState {\n  contentType: string;\n}\n\nexport class LayerInteractiveExample extends React.Component<any, ILayerInteractiveExampleState> {\n  constructor() {\n    super();\n\n    this.state = {\n      contentType: 'A'\n    };\n\n    this._onChanged = this._onChanged.bind(this);\n  }\n\n  public render() {\n    let {\n      contentType\n    } = this.state;\n\n    let content: JSX.Element;\n\n    switch (contentType) {\n      case 'A':\n        content = this._getContentA();\n        break;\n      case 'B':\n        content = this._getContentB();\n        break;\n      case 'C':\n        content = this._getContentC();\n        break;\n    }\n\n    return (\n      <div>\n        <ChoiceGroup options={ [\n          {\n            key: 'A',\n            text: 'Content A',\n            isChecked: contentType === 'A'\n          },\n          {\n            key: 'B',\n            text: 'Content B'\n          },\n          {\n            key: 'C',\n            text: 'Content C'\n          }\n        ] }\n          onChanged={ this._onChanged }\n        />\n\n        <Layer>\n          <div className='ms-LayerInteractiveExample-content'>\n            { content }\n          </div>\n        </Layer>\n      </div>\n    );\n  }\n\n  private _onChanged(option: IChoiceGroupOption) {\n    this.setState({\n      contentType: option.key\n    });\n  }\n\n  private _getContentA() {\n    return (\n      <span>Content A</span>\n    );\n  }\n\n  private _getContentB() {\n    return (\n      <strong>Content B</strong>\n    );\n  }\n\n  private _getContentC() {\n    return (\n      <em>Content C</em>\n    );\n  }\n}\n"; });