declare const tutorial = "\n<div style=\"padding: 15px 20px\" default-source-provider=\"Demo\">\n\n<style>\n  frc-accelerometer {\n    margin-bottom: 10px;\n  }\n\n  h1 {\n    margin: 0 0 10px;\n  }\n</style>\n<fwc-code-sample title=\"With attributes\">\n  <!-- Code for \"With attributes\" example -->\n  <frc-accelerometer value=\".5\"></frc-accelerometer>\n  <frc-accelerometer value=\".9\" min=\"0\"></frc-accelerometer>\n  <frc-accelerometer \n    value=\"2\"\n    min=\"-5\"\n    max=\"5\"\n    center=\"0\"\n    precision=\"4\"\n    num-tick-marks=\"3\"\n    unit=\"g\"\n  ></frc-accelerometer>\n  <frc-accelerometer \n    value=\"-.5\"\n    hide-text\n    num-tick-marks=\"10\"\n  ></frc-accelerometer>\n</fwc-code-sample>\n<fwc-code-sample title=\"With styles\">\n  <style>\n    .with-styles {\n      width: 700px;\n    }\n  </style>\n  <frc-accelerometer \n    class=\"with-styles\"\n    value=\".9\"\n    num-tick-marks=\"11\"\n  ></frc-accelerometer>\n</fwc-code-sample>\n\n<!-- code for \"Try it out\" section -->\n<h3>Try it out!</h3>\n<fwc-number source-key=\"/playground/value\" value=\"1\"></fwc-number>\n<fwc-number source-key=\"/playground/min\" value=\"-10\"></fwc-number>\n<fwc-number source-key=\"/playground/max\" value=\"10\"></fwc-number>\n<fwc-number source-key=\"/playground/center\" value=\"0\"></fwc-number>\n<fwc-number source-key=\"/playground/precision\" value=\"0\"></fwc-number>\n<fwc-boolean source-key=\"/playground/hideText\"></fwc-boolean>\n<fwc-number source-key=\"/playground/numTickMarks\" value=\"7\"></fwc-number>\n<fwc-string source-key=\"/playground/unit\" value=\"g\"></fwc-string>\n<frc-accelerometer source-key=\"/playground\"></frc-accelerometer>\n\n<style>\n  .try-it-out {\n    display: flex;\n    flex-direction: row;\n    column-gap: 10px;\n    max-width: 800px;\n    flex-wrap: wrap;\n  }\n  .try-it-out vaadin-number-field, .try-it-out vaadin-text-field {\n    width: 160px;\n  }\n</style>\n\n<div class=\"try-it-out\">\n  <vaadin-number-field \n    label=\"Value\" \n    theme=\"small\" \n    source-key=\"/playground/value\"\n    has-controls\n  ></vaadin-number-field>\n  <vaadin-number-field \n    label=\"Min\" \n    theme=\"small\" \n    source-key=\"/playground/min\"\n    has-controls\n  ></vaadin-number-field>\n  <vaadin-number-field \n    label=\"Max\" \n    theme=\"small\" \n    source-key=\"/playground/max\"\n    has-controls\n  ></vaadin-number-field>\n  <vaadin-number-field \n    label=\"Center\" \n    theme=\"small\" \n    source-key=\"/playground/center\"\n    has-controls\n  ></vaadin-number-field>\n  <vaadin-number-field \n    label=\"Precision\" \n    theme=\"small\" \n    source-key=\"/playground/precision\"\n    has-controls\n  ></vaadin-number-field>\n  <vaadin-number-field \n    label=\"Number of Ticks Marks\" \n    theme=\"small\" \n    source-key=\"/playground/numTickMarks\"\n    has-controls\n  ></vaadin-number-field>\n  <vaadin-number-field \n    label=\"Number of Ticks Marks\" \n    theme=\"small\" \n    has-controls\n  ></vaadin-number-field>\n  <vaadin-text-field \n    label=\"Unit\" \n    theme=\"small\" \n    source-key=\"/playground/unit\"\n  ></vaadin-text-field>\n</div>\n<vaadin-checkbox-group theme=\"horizontal\">\n  <vaadin-checkbox source-key=\"/playground/hideText\">Hide Text</vaadin-checkbox>\n</vaadin-checkbox-group>\n\n</div>\n";
export default tutorial;