feat: shared request (#3486)

Co-authored-by: jamesgeorge007 <jamesgeorge998001@gmail.com>

packages/hoppscotch-ui/src/components/smart/Checkbox.vue

@@ -16,6 +16,9 @@
     <label
       for="checkbox"
       class="pl-0 font-semibold truncate align-middle cursor-pointer"
+      :class="{
+        'before:mr-2': labelSlot.default
+      }"
     >
       <slot></slot>
     </label>
@@ -23,6 +26,8 @@
 </template>
 
 <script setup lang="ts">
+import { useSlots } from 'vue';
+
 defineProps({
   on: {
     type: Boolean,
@@ -33,6 +38,9 @@ defineProps({
 const emit = defineEmits<{
   (e: "change"): void
 }>()
+
+// used to check if the default slot is used and add a margin to the label if exists
+const labelSlot = useSlots()
 </script>
 
 <style lang="scss" scoped>
@@ -55,7 +63,6 @@ const emit = defineEmits<{
       @apply h-4;
       @apply w-4;
       @apply font-icon;
-      @apply mr-2;
       @apply transition;
       @apply content-["\e5ca"];
     }

packages/hoppscotch-ui/src/components/smart/RadioGroup.vue

@@ -1,12 +1,18 @@
 <template>
   <div class="flex flex-col">
-    <HoppSmartRadio v-for="(radio, index) in radios" :key="`radio-${index}`" :value="radio.value" :label="radio.label"
-      :selected="modelValue === radio.value" @change="emit('update:modelValue', radio.value)" />
+    <HoppSmartRadio
+      v-for="(radio, index) in radios"
+      :key="`radio-${index}`"
+      :value="radio.value"
+      :label="radio.label"
+      :selected="modelValue === radio.value"
+      @change="emit('update:modelValue', radio.value)"
+    />
   </div>
 </template>
 
 <script setup lang="ts">
-import { HoppSmartRadio } from '.';
+import { HoppSmartRadio } from "."
 
 const emit = defineEmits<{
   (e: "update:modelValue", value: string): void