Add gauge 4896 (#4919)

* Add new Gauge component

Co-authored-by: Charles Hacskaylo <charlesh88@gmail.com>
Co-authored-by: Jamie V <jamie.j.vigliotta@nasa.gov>
Co-authored-by: John Hill <john.c.hill@nasa.gov>
Co-authored-by: Andrew Henry <akhenry@gmail.com>

src/api/forms/components/controls/CheckBoxField.vue

@@ -0,0 +1,55 @@
+/*****************************************************************************
+* Open MCT, Copyright (c) 2014-2022, United States Government
+* as represented by the Administrator of the National Aeronautics and Space
+* Administration. All rights reserved.
+*
+* Open MCT is licensed under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+* http://www.apache.org/licenses/LICENSE-2.0.
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+* License for the specific language governing permissions and limitations
+* under the License.
+*
+* Open MCT includes source code licensed under additional open source
+* licenses. See the Open Source Licenses file (LICENSES.md) included with
+* this source code distribution or the Licensing information page available
+* at runtime from the About dialog for additional information.
+*****************************************************************************/
+
+<template>
+<span class="form-control shell">
+    <span
+        class="field control"
+        :class="model.cssClass"
+    >
+        <input
+            type="checkbox"
+            :checked="isChecked"
+            @input="toggleCheckBox"
+        >
+    </span>
+</span>
+</template>
+
+<script>
+import toggleMixin from '../../toggle-check-box-mixin';
+
+export default {
+    mixins: [toggleMixin],
+    props: {
+        model: {
+            type: Object,
+            required: true
+        }
+    },
+    data() {
+        return {
+            isChecked: this.model.value
+        };
+    }
+};
+</script>