Toggles (#24)

* Toggles!

* Toggle component

* Ran prettier

lib/components/base/Toggle.vue

@@ -0,0 +1,37 @@
+<template>
+  <input
+    :id="id"
+    type="checkbox"
+    class="switch stylized-toggle"
+    :checked="checked"
+    @change="toggle"
+  />
+</template>
+
+<script>
+export default {
+  props: {
+    id: {
+      type: String,
+      required: true,
+    },
+    modelValue: {
+      type: Boolean,
+    },
+    checked: {
+      type: Boolean,
+      required: true,
+    },
+  },
+  emits: ['update:modelValue'],
+  methods: {
+    toggle() {
+      if (!this.disabled) {
+        this.$emit('update:modelValue', !this.modelValue)
+      }
+    },
+  },
+}
+</script>
+
+<style scoped></style>

lib/components/index.js

@@ -16,6 +16,7 @@ export { default as EnvironmentIndicator } from './base/EnvironmentIndicator.vue
 export { default as DropdownSelect } from './base/DropdownSelect.vue'
 export { default as FileInput } from './base/FileInput.vue'
 export { default as DropArea } from './base/DropArea.vue'
+export { default as Toggle } from './base/Toggle.vue'
 
 export { default as Categories } from './search/Categories.vue'
 export { default as SearchFilter } from './search/SearchFilter.vue'