diff --git a/app/components/app/person-address/entry-form-relative.vue b/app/components/app/person-address/entry-form-relative.vue
index cc294bab..bc24be15 100644
--- a/app/components/app/person-address/entry-form-relative.vue
+++ b/app/components/app/person-address/entry-form-relative.vue
@@ -1,21 +1,14 @@
 <script setup lang="ts">
 import type { FormErrors } from '~/types/error'
 import { toTypedSchema } from '@vee-validate/zod'
-import Block from '~/components/pub/my-ui/form/block.vue'
-import FieldGroup from '~/components/pub/my-ui/form/field-group.vue'
-import Field from '~/components/pub/my-ui/form/field.vue'
-import InputBase from '~/components/pub/my-ui/form/input-base.vue'
-import Label from '~/components/pub/my-ui/form/label.vue'
+
+// components
+import { Form } from '~/components/pub/ui/form'
+import * as DE from '~/components/pub/my-ui/doc-entry'
 import { Label as RadioLabel } from '~/components/pub/ui/label'
 import { RadioGroup, RadioGroupItem } from '~/components/pub/ui/radio-group'
-import SelectDistrict from './_common/select-district.vue'
-import SelectPostal from './_common/select-postal.vue'
-import SelectProvince from './_common/select-province.vue'
-import SelectRegency from './_common/select-regency.vue'
-import SelectVillage from './_common/select-village.vue'
-import { Form } from '~/components/pub/ui/form'
-
-import * as DE from '~/components/pub/my-ui/doc-entry'
+import { SelectDistrict, SelectPostal, SelectProvince, SelectRegency, SelectVillage } from './fields'
+import InputBase from '~/components/pub/my-ui/form/input-base.vue'
 
 const props = defineProps<{
   title: string
@@ -262,7 +255,7 @@ watch(
     <div>
       <p
         v-if="props.title"
-        class="text-sm 2xl:text-base mb-2 2xl:mb-3 font-semibold"
+        class="mb-2 text-sm font-semibold 2xl:mb-3 2xl:text-base"
       >
         {{ props.title }}
       </p>
@@ -278,7 +271,10 @@ watch(
         value="identity"
       />
     </FormField>
-    <DE.Block :col-count="4" :cell-flex="false">
+    <DE.Block
+      :col-count="4"
+      :cell-flex="false"
+    >
       <DE.Cell :col-span="4">
         <DE.Label
           size="fit"
@@ -389,6 +385,5 @@ watch(
         :is-disabled="getFieldState('postalRegion_code').disabled || !values.village_code"
       />
     </DE.Block>
-
   </Form>
 </template>
diff --git a/app/components/app/person-address/entry-form.vue b/app/components/app/person-address/entry-form.vue
index b3ef300d..40fd1db7 100644
--- a/app/components/app/person-address/entry-form.vue
+++ b/app/components/app/person-address/entry-form.vue
@@ -1,18 +1,12 @@
 <script setup lang="ts">
 import type { FormErrors } from '~/types/error'
 import { toTypedSchema } from '@vee-validate/zod'
-import FieldGroup from '~/components/pub/my-ui/form/field-group.vue'
-import Field from '~/components/pub/my-ui/form/field.vue'
-import InputBase from '~/components/pub/my-ui/form/input-base.vue'
-import Label from '~/components/pub/my-ui/form/label.vue'
-import SelectDistrict from './_common/select-district.vue'
-import SelectPostal from './_common/select-postal.vue'
-import SelectProvince from './_common/select-province.vue'
-import SelectRegency from './_common/select-regency.vue'
-import SelectVillage from './_common/select-village.vue'
-import { Form } from '~/components/pub/ui/form'
 
+// components
+import { Form } from '~/components/pub/ui/form'
 import * as DE from '~/components/pub/my-ui/doc-entry'
+import InputBase from '~/components/pub/my-ui/form/input-base.vue'
+import { SelectDistrict, SelectPostal, SelectProvince, SelectRegency, SelectVillage } from './fields'
 
 const props = defineProps<{
   title: string
@@ -169,7 +163,7 @@ watch(
     <div>
       <p
         v-if="props.title"
-        class="text-sm 2xl:text-base mb-2 2xl:mb-3 font-semibold"
+        class="mb-2 text-sm font-semibold 2xl:mb-3 2xl:text-base"
       >
         {{ props.title }}
       </p>
@@ -185,7 +179,10 @@ watch(
       />
     </FormField>
 
-    <DE.Block :col-count="4" :cell-flex="false">
+    <DE.Block
+      :col-count="4"
+      :cell-flex="false"
+    >
       <SelectProvince
         field-name="province_code"
         placeholder="Pilih"
@@ -223,7 +220,7 @@ watch(
             :errors="errors"
             numeric-only
             :max-length="2"
-            />
+          />
           <InputBase
             field-name="rw"
             label="RW"
@@ -235,11 +232,11 @@ watch(
         </div>
       </DE.Cell>
       <SelectPostal
-          field-name="postalRegion_code"
-          placeholder="Pilih kelurahan dahulu"
-          :village-code="values.village_code"
-          :is-disabled="!values.village_code"
-        />
+        field-name="postalRegion_code"
+        placeholder="Pilih kelurahan dahulu"
+        :village-code="values.village_code"
+        :is-disabled="!values.village_code"
+      />
     </DE.Block>
   </Form>
 </template>
diff --git a/app/components/app/person-address/fields/index.ts b/app/components/app/person-address/fields/index.ts
new file mode 100644
index 00000000..8dda6cde
--- /dev/null
+++ b/app/components/app/person-address/fields/index.ts
@@ -0,0 +1,6 @@
+export { default as RadioResidence } from './radio-residence.vue'
+export { default as SelectDistrict } from './select-district.vue'
+export { default as SelectPostal } from './select-postal.vue'
+export { default as SelectProvince } from './select-province.vue'
+export { default as SelectRegency } from './select-regency.vue'
+export { default as SelectVillage } from './select-village.vue'
diff --git a/app/components/app/person-address/_common/radio-residence.vue b/app/components/app/person-address/fields/radio-residence.vue
similarity index 100%
rename from app/components/app/person-address/_common/radio-residence.vue
rename to app/components/app/person-address/fields/radio-residence.vue
diff --git a/app/components/app/person-address/_common/select-district.vue b/app/components/app/person-address/fields/select-district.vue
similarity index 100%
rename from app/components/app/person-address/_common/select-district.vue
rename to app/components/app/person-address/fields/select-district.vue
diff --git a/app/components/app/person-address/_common/select-postal.vue b/app/components/app/person-address/fields/select-postal.vue
similarity index 100%
rename from app/components/app/person-address/_common/select-postal.vue
rename to app/components/app/person-address/fields/select-postal.vue
diff --git a/app/components/app/person-address/_common/select-province.vue b/app/components/app/person-address/fields/select-province.vue
similarity index 100%
rename from app/components/app/person-address/_common/select-province.vue
rename to app/components/app/person-address/fields/select-province.vue
diff --git a/app/components/app/person-address/_common/select-regency.vue b/app/components/app/person-address/fields/select-regency.vue
similarity index 100%
rename from app/components/app/person-address/_common/select-regency.vue
rename to app/components/app/person-address/fields/select-regency.vue
diff --git a/app/components/app/person-address/_common/select-village.vue b/app/components/app/person-address/fields/select-village.vue
similarity index 100%
rename from app/components/app/person-address/_common/select-village.vue
rename to app/components/app/person-address/fields/select-village.vue
diff --git a/app/components/app/person-contact/entry-form.vue b/app/components/app/person-contact/entry-form.vue
index 431a3c79..cd3fb0c3 100644
--- a/app/components/app/person-contact/entry-form.vue
+++ b/app/components/app/person-contact/entry-form.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
 import type { FormErrors } from '~/types/error'
 import { toTypedSchema } from '@vee-validate/zod'
-import { FieldArray } from 'vee-validate'
-import InputBase from '~/components/pub/my-ui/form/input-base.vue'
-import SelectContactType from './_common/select-contact-type.vue'
+
+// components
 import { Form } from '~/components/pub/ui/form'
+import { FieldArray } from 'vee-validate'
+import { SelectContactType } from './fields'
+import { InputBase } from '~/components/pub/my-ui/form'
 
 const props = defineProps<{
   title: string
@@ -39,7 +41,7 @@ defineExpose({
     <div>
       <p
         v-if="props.title"
-        class="text-sm 2xl:text-base mb-2 2xl:mb-3 font-semibold"
+        class="mb-2 text-sm font-semibold 2xl:mb-3 2xl:text-base"
       >
         {{ props.title || 'Kontak Pasien' }}
       </p>
diff --git a/app/components/app/person-contact/fields/index.ts b/app/components/app/person-contact/fields/index.ts
new file mode 100644
index 00000000..883e16c7
--- /dev/null
+++ b/app/components/app/person-contact/fields/index.ts
@@ -0,0 +1 @@
+export { default as SelectContactType } from './select-contact-type.vue'
diff --git a/app/components/app/person-contact/_common/select-contact-type.vue b/app/components/app/person-contact/fields/select-contact-type.vue
similarity index 100%
rename from app/components/app/person-contact/_common/select-contact-type.vue
rename to app/components/app/person-contact/fields/select-contact-type.vue