feat: Barcode row height support

Signed-off-by: mertmit <mertmit99@gmail.com>

packages/nc-gui/components/virtual-cell/barcode/Barcode.vue

@@ -1,8 +1,13 @@
 <script setup lang="ts">
 import JsBarcodeWrapper from './JsBarcodeWrapper.vue'
+import { ComputedRef } from 'vue'
+import { GridType } from 'nocodb-sdk'
+import { ActiveViewInj } from '#imports'
 
 const maxNumberOfAllowedCharsForBarcodeValue = 100
 
+const view = inject(ActiveViewInj, ref())
+
 const cellValue = inject(CellValueInj)
 
 const column = inject(ColumnInj)
@@ -29,6 +34,22 @@ const handleModalOkClick = () => (modalVisible.value = false)
 const showBarcode = computed(() => barcodeValue?.value.length > 0 && !tooManyCharsForBarcode.value)
 
 const { showEditNonEditableFieldWarning, showClearNonEditableFieldWarning } = useShowNotEditableWarning()
+
+
+const rowHeight = computed(() => {
+  if ((view.value?.view as GridType)?.row_height !== undefined) {
+    switch ((view.value?.view as GridType)?.row_height) {
+      case 0:
+        return 1
+      case 1:
+        return 2
+      case 2:
+        return 4
+      case 3:
+        return 6
+    }
+  }
+})
 </script>
 
 <template>
@@ -46,6 +67,7 @@ const { showEditNonEditableFieldWarning, showClearNonEditableFieldWarning } = us
     v-if="showBarcode"
     :barcode-value="barcodeValue"
     :barcode-format="barcodeMeta.barcodeFormat"
+    :custom-style="{ height: rowHeight ? `${rowHeight * 1.4}rem` : `1.4rem` }"
     @on-click-barcode="showBarcodeModal"
   >
     <template #barcodeRenderError>

packages/nc-gui/components/virtual-cell/barcode/JsBarcodeWrapper.vue

@@ -5,11 +5,12 @@ import { onMounted } from '#imports'
 const props = defineProps({
   barcodeValue: { type: String, required: true },
   barcodeFormat: { type: String, required: true },
+  customStyle: { type: Object, required: false },
 })
 
 const emit = defineEmits(['onClickBarcode'])
 
-const barcodeSvgRef = ref(null)
+const barcodeSvgRef = ref<HTMLElement>()
 const errorForCurrentInput = ref(false)
 
 const generate = () => {
@@ -17,6 +18,13 @@ const generate = () => {
     JsBarcode(barcodeSvgRef.value, String(props.barcodeValue), {
       format: props.barcodeFormat,
     })
+    if (props.customStyle) {
+      if (barcodeSvgRef.value) {
+        for (const key in props.customStyle) {
+          barcodeSvgRef.value.style.setProperty(key, props.customStyle[key])
+        }
+      }
+    }
     errorForCurrentInput.value = false
   } catch (e) {
     console.log('e', e)
@@ -29,7 +37,7 @@ const onBarcodeClick = (ev: MouseEvent) => {
   emit('onClickBarcode')
 }
 
-watch([() => props.barcodeValue, () => props.barcodeFormat], generate)
+watch([() => props.barcodeValue, () => props.barcodeFormat, () => props.customStyle], generate)
 onMounted(generate)
 </script>