Dc3e4 new matrix field (#484)

* fix password reset bug

* wip: matrix input

* wip: matrix input

* wip: matrix input

* Fixed matric input component logic

* matrix input cleanup

* fix lint errors

* table border and radius

* cleanup, linting

* fix component methos

* wip matrix input

* matrix condition for contains and not contain

* patch matrix input condition logic

* linting

* refactor and cleanup

* fix syntax error

* Polished the matrix input

* Fix linting

---------

Co-authored-by: Julien Nahum <julien@nahum.net>

client/components/forms/components/CheckboxIcon.vue

@@ -0,0 +1,27 @@
+<template>
+  <Icon
+    :name="isChecked ? 'material-symbols:check-box' : 'material-symbols:check-box-outline-blank'"
+    :class="[
+      theme.FlatSelectInput.icon,
+      isChecked ? '' : theme.FlatSelectInput.unselectedIcon,
+    ]"
+    :color="isChecked ? color : undefined"
+  />
+</template>
+
+<script setup>
+const props = defineProps({
+  isChecked: {
+    type: Boolean,
+    required: true
+  },
+  color: {
+    type: String,
+    default: ''
+  },
+  theme: {
+    type: Object,
+    required: true
+  }
+})
+</script>

client/components/forms/components/RadioButtonIcon.vue

@@ -0,0 +1,29 @@
+<template>
+  <Icon
+    :name="isChecked ? 'ic:round-radio-button-checked' : 'ic:round-radio-button-unchecked'"
+    :class="[
+      theme.FlatSelectInput.icon,
+      isChecked ? '' : theme.FlatSelectInput.unselectedIcon,
+    ]"
+    :color="isChecked ? color : undefined"
+  />
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+const props = defineProps({
+  isChecked: {
+    type: Boolean,
+    required: true
+  },
+  color: {
+    type: String,
+    default: ''
+  },
+  theme: {
+    type: Object,
+    required: true
+  }
+})
+</script>