From 94ed079a3a6a61099cb6dbb9145f08d1f3c89f4d Mon Sep 17 00:00:00 2001
From: LEMSantos <lu.casmou.ra177833@gmail.com>
Date: Wed, 26 Nov 2025 16:10:53 -0300
Subject: [PATCH 01/13] =?UTF-8?q?build:=20adiciona=20o=20luxon=20para=20a?=
 =?UTF-8?q?=20manipula=C3=A7=C3=A3o=20de=20datas?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json | 10 +++++-----
 package.json      |  3 ++-
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6a38c8e..f3ed671 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,15 +1,16 @@
 {
 	"name": "@sysvale/citizen-components",
-	"version": "1.0.0",
+	"version": "1.7.1",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "@sysvale/citizen-components",
-			"version": "1.0.0",
+			"version": "1.7.1",
 			"dependencies": {
 				"@vueuse/core": "^13.9.0",
-				"lodash": "^4.17.21"
+				"lodash": "^4.17.21",
+				"luxon": "^3.7.2"
 			},
 			"devDependencies": {
 				"@faker-js/faker": "^10.0.0",
@@ -53,7 +54,7 @@
 			},
 			"peerDependencies": {
 				"@sysvale/cuida": "^3.148.0",
-				"@sysvale/foundry": "^1.6.0",
+				"@sysvale/foundry": "^1.7.0",
 				"vee-validate": "^4.15.1",
 				"vue": "^3.5.13"
 			}
@@ -8692,7 +8693,6 @@
 			"version": "3.7.2",
 			"resolved": "https://registry.npmjs.org/luxon/-/luxon-3.7.2.tgz",
 			"integrity": "sha512-vtEhXh/gNjI9Yg1u4jX/0YVPMvxzHuGgCm6tC5kZyb08yjGWGnqAjGJvcXbqQR2P3MyMEFnRbpcdFS6PBcLqew==",
-			"dev": true,
 			"license": "MIT",
 			"engines": {
 				"node": ">=12"
diff --git a/package.json b/package.json
index e5e616c..c699289 100644
--- a/package.json
+++ b/package.json
@@ -39,7 +39,8 @@
 	},
 	"dependencies": {
 		"@vueuse/core": "^13.9.0",
-		"lodash": "^4.17.21"
+		"lodash": "^4.17.21",
+		"luxon": "^3.7.2"
 	},
 	"peerDependencies": {
 		"@sysvale/cuida": "^3.148.0",

From 43b68aaa7e62ce2348c8f54d654dfa9cc4a89e63 Mon Sep 17 00:00:00 2001
From: LEMSantos <lu.casmou.ra177833@gmail.com>
Date: Wed, 26 Nov 2025 16:12:03 -0300
Subject: [PATCH 02/13] =?UTF-8?q?feat:=20adiciona=20uma=20fun=C3=A7=C3=A3o?=
 =?UTF-8?q?=20para=20recuperar=20o=20objeto=20de=20g=C3=AAnero=20pelo=20ti?=
 =?UTF-8?q?po?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/constants/genders.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/constants/genders.ts b/src/constants/genders.ts
index 79011a5..95c96fd 100644
--- a/src/constants/genders.ts
+++ b/src/constants/genders.ts
@@ -14,3 +14,7 @@ const GENDERS: Gender[] = [
 export const genders = () => {
 	return GENDERS;
 }
+
+export const genderFromType = (type: string) => {
+	return GENDERS.find(gender => gender.value === type);
+}

From 34c124217946aada56275ae99773e3ca4e4de9e1 Mon Sep 17 00:00:00 2001
From: LEMSantos <lu.casmou.ra177833@gmail.com>
Date: Thu, 27 Nov 2025 11:30:39 -0300
Subject: [PATCH 03/13] =?UTF-8?q?feat:=20adiciona=20o=20componente=20para?=
 =?UTF-8?q?=20a=20section=20do=20card=20de=20visualiza=C3=A7=C3=A3o=20do?=
 =?UTF-8?q?=20resumo=20do=20cidad=C3=A3o?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../InternalComponents/ResumeSection.vue      | 49 +++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 src/components/InternalComponents/ResumeSection.vue

diff --git a/src/components/InternalComponents/ResumeSection.vue b/src/components/InternalComponents/ResumeSection.vue
new file mode 100644
index 0000000..353896f
--- /dev/null
+++ b/src/components/InternalComponents/ResumeSection.vue
@@ -0,0 +1,49 @@
+<template>
+	<CdsFlexbox
+		gap="1"
+		direction="column"
+		class="resume-section"
+	>
+		<CdsDivider
+			:text="title"
+			inline
+			dimmed
+		/>
+
+		<CdsGrid
+			cols="minmax(25%, 200px) minmax(25%, 200px) minmax(25%, 200px)"
+			row-gap="3"
+			col-gap="6"
+		>
+			<CdsGridItem
+				v-for="item in items"
+				:key="item.label"
+				:col-span="item.fill ? 3 : 1"
+			>
+				<CdsText
+					as="body-2"
+					color="n-600"
+					font-weight="semibold"
+				>
+					{{ item.label }}:
+				</CdsText>
+				<CdsText
+					as="body-2"
+					color="n-600"
+				>
+					{{ item.value }}
+				</CdsText>
+			</CdsGridItem>
+		</CdsGrid>
+	</CdsFlexbox>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+	title: string,
+	items: Array<{ label: string, value: Nullable<string>, fill?: boolean }>,
+}>()
+</script>
+
+<style lang="scss" scoped>
+</style>

From 57773bf1c809de0e773c8c1296d2f1251cb58d0c Mon Sep 17 00:00:00 2001
From: LEMSantos <lu.casmou.ra177833@gmail.com>
Date: Thu, 27 Nov 2025 11:31:30 -0300
Subject: [PATCH 04/13] =?UTF-8?q?feat:=20adiciona=20o=20componente=20para?=
 =?UTF-8?q?=20a=20visualiza=C3=A7=C3=A3o=20do=20resumo=20de=20informa?=
 =?UTF-8?q?=C3=A7=C3=B5es=20do=20cidad=C3=A3o?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/CitizenResumeViewer.vue | 118 +++++++++++++++++++++++++
 src/index.ts                           |   1 +
 2 files changed, 119 insertions(+)
 create mode 100644 src/components/CitizenResumeViewer.vue

diff --git a/src/components/CitizenResumeViewer.vue b/src/components/CitizenResumeViewer.vue
new file mode 100644
index 0000000..5678a21
--- /dev/null
+++ b/src/components/CitizenResumeViewer.vue
@@ -0,0 +1,118 @@
+<template>
+	<div
+		class="citizen-resume-viewer"
+		:class="{ 'citizen-resume-viewer--limit-width': !fluid }"
+	>
+		<CdsBox fluid>
+			<CdsFlexbox
+				gap="6"
+				direction="column"
+			>
+				<CdsFlexbox
+					justify="space-between"
+				>
+					<CdsFlexbox
+						gap="3"
+						align="center"
+					>
+						<CdsText
+							as="subheading-2"
+							no-margin
+							font-weight="semibold"
+							color="n-700"
+						>
+							{{ smartTitleCase(citizen.name) }}
+						</CdsText>
+
+						<CdsBadge
+							v-if="isPregnant"
+							size="sm"
+							variant="pink"
+						>
+							Gestante
+						</CdsBadge>
+					</CdsFlexbox>
+
+					<CdsFlexbox gap="3">
+						<CdsIconButton
+							size="sm"
+							tooltip-text="Editar"
+							icon="edit-outline"
+						/>
+
+						<CdsIconButton
+							size="sm"
+							tooltip-text="Fechar"
+							icon="x-outline"
+						/>
+					</CdsFlexbox>
+				</CdsFlexbox>
+
+				<ResumeSection
+					title="Dados pessoais"
+					:items="personalInfoSectionItems"
+				/>
+
+				<ResumeSection
+					title="Informações de contato"
+					:items="contactInfoSectionItems"
+				/>
+			</CdsFlexbox>
+		</CdsBox>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue';
+import { maskCpf, maskCns, maskPhone, smartTitleCase } from '@sysvale/foundry';
+import { DateTime } from 'luxon';
+import { genderFromType } from '@/constants/genders';
+import ResumeSection from './InternalComponents/ResumeSection.vue';
+
+const props = defineProps<{ citizen: Citizen, fluid?: boolean }>();
+
+const isPregnant = computed(() => {
+	return props.citizen.pregnant;
+});
+
+const personalInfoSectionItems = computed(() => {
+	return [
+		{ label: 'CPF', value: maskCpf(props.citizen.cpf) ?? '--' },
+		{ label: 'CNS', value: maskCns(props.citizen.cns) ?? '--' },
+		{ label: 'RG', value: props.citizen.identification_document ?? '--' },
+		{ label: 'Nascimento', value: DateTime.fromISO(props.citizen.birth_date).toFormat('dd/MM/yyyy') },
+		{ label: 'Sexo', value: genderFromType(props.citizen.gender)?.name ?? '--' },
+		{ label: 'Raça/Cor', value: props.citizen.race ?? '--' },
+	];
+});
+
+const contactInfoSectionItems = computed(() => {
+	return [
+		{ label: 'Telefone', value: maskPhone(props.citizen.phone) ?? '--' },
+		{ label: 'Celular', value: maskPhone(props.citizen.cellphone) ?? '--' },
+		{ label: 'E-mail', value: props.citizen.email ?? '--' },
+		{ label: 'Endereço', value: getFancyAddress(), fill: true },
+	];
+});
+
+function getFancyAddress() {
+	const address = props.citizen.address
+
+	if (!address) {
+		return '--'
+	}
+
+	return `${address.street},
+		${address.number},
+		${address.neighborhood},
+		${address.city} - ${address.uf}`
+}
+</script>
+
+<style lang="scss" scoped>
+.citizen-resume-viewer {
+	&--limit-width {
+		width: 800px;
+	}
+}
+</style>
diff --git a/src/index.ts b/src/index.ts
index 16d36c5..edc0297 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,6 +1,7 @@
 export { default as CitizenSelect } from './components/CitizenSelect.vue';
 export { default as CitizenTable } from './components/CitizenTable.vue';
 export { default as CreateCitizenSidesheet } from './components/CreateCitizenSidesheet.vue';
+export { default as CitizenResumeViewer } from './components/CitizenResumeViewer.vue';
 
 export { default as CitizenComponentsPlugin } from './plugin';
 export { default } from './plugin';

From f5b131225d6b5e73f2c16f80ca96d1207141d5e7 Mon Sep 17 00:00:00 2001
From: LEMSantos <lu.casmou.ra177833@gmail.com>
Date: Thu, 27 Nov 2025 11:32:18 -0300
Subject: [PATCH 05/13] =?UTF-8?q?test:=20adiciona=20o=20c=C3=B3digo=20de?=
 =?UTF-8?q?=20teste=20para=20o=20novo=20componente?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index b2d4f48..386e760 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -13,14 +13,23 @@
 		>
 			Change Model
 		</CdsButton>
+
+		<CdsFlexbox justify="center" style="background-color: grey; padding: 30px">
+			<div style="width: 1000px;">
+				<CitizenResumeViewer :citizen="citizen" />
+			</div>
+		</CdsFlexbox>
 	</div>
 </template>
 
 <script setup lang="ts">
 import { ref } from 'vue';
 import CitizenSelect from './components/CitizenSelect.vue';
+import CitizenResumeViewer from './components/CitizenResumeViewer.vue';
 const citizen = ref<CitizenSelectModelType>(null);
 
+changeModel();
+
 function changeModel() {
 	console.log('no change model')
 	citizen.value = {
@@ -34,7 +43,7 @@ function changeModel() {
 		'birth_date': '1946-10-02',
 		'phone': '38 4017-7733',
 		'cellphone': '83 7530-1849',
-		'email': 'Delta1@hotmail.com',
+		'email': 'joaopaulosncastro@sysvale.com.br',
 		'address': {
 			'cep': '44443',
 			'street': 'Jakubowski Manors',
@@ -47,7 +56,7 @@ function changeModel() {
 		'race': 'black',
 		'co_cidadao': 2852,
 		'is_dead': true,
-		'pregnant': false,
+		'pregnant': true,
 		'identification_document': '040516263',
 		'issuing_agency': 'SSP'
 	}

From cbe0dd2bbc5d909daba7958c0139a75ddd0ab10a Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 16:51:45 -0300
Subject: [PATCH 06/13] =?UTF-8?q?feat:=20Adiciona=20novas=20regras=20de=20?=
 =?UTF-8?q?valida=C3=A7=C3=A3o=20do=20vee=20validate?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                   | 31 +++++++++++++++-------------
 package.json                        |  2 ++
 src/utils/rules/citizenFormRules.ts | 32 ++++++++++++++---------------
 3 files changed, 34 insertions(+), 31 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index f3ed671..7b15817 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,8 @@
 			"name": "@sysvale/citizen-components",
 			"version": "1.7.1",
 			"dependencies": {
+				"@vee-validate/i18n": "^4.15.1",
+				"@vee-validate/rules": "^4.15.1",
 				"@vueuse/core": "^13.9.0",
 				"lodash": "^4.17.21",
 				"luxon": "^3.7.2"
@@ -4199,6 +4201,21 @@
 			"dev": true,
 			"license": "ISC"
 		},
+		"node_modules/@vee-validate/i18n": {
+			"version": "4.15.1",
+			"resolved": "https://registry.npmjs.org/@vee-validate/i18n/-/i18n-4.15.1.tgz",
+			"integrity": "sha512-6ogEyxkoTr7IZk4EAUT0rD3pr34Nw/YEToez/c0DSlI1/cBeOpunSmGmoYPh32pmd3imxFPEawCB7IyFvRJSAw==",
+			"license": "MIT"
+		},
+		"node_modules/@vee-validate/rules": {
+			"version": "4.15.1",
+			"resolved": "https://registry.npmjs.org/@vee-validate/rules/-/rules-4.15.1.tgz",
+			"integrity": "sha512-2TGXq2MYt21nT8ysuxyFY/LBVQDcMPKn1hY0w3uIDmG333vzBkOtXAylmvrS93AsJ7N5coHMJjcCGG4JxCO2hQ==",
+			"license": "MIT",
+			"dependencies": {
+				"vee-validate": "4.15.1"
+			}
+		},
 		"node_modules/@vitejs/plugin-vue": {
 			"version": "5.2.4",
 			"resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
@@ -4555,7 +4572,6 @@
 			"version": "7.7.7",
 			"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-7.7.7.tgz",
 			"integrity": "sha512-lwOnNBH2e7x1fIIbVT7yF5D+YWhqELm55/4ZKf45R9T8r9dE2AIOy8HKjfqzGsoTHFbWbr337O4E0A0QADnjBg==",
-			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@vue/devtools-kit": "^7.7.7"
@@ -4602,7 +4618,6 @@
 			"version": "7.7.7",
 			"resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.7.7.tgz",
 			"integrity": "sha512-wgoZtxcTta65cnZ1Q6MbAfePVFxfM+gq0saaeytoph7nEa7yMXoi6sCPy4ufO111B9msnw0VOWjPEFCXuAKRHA==",
-			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@vue/devtools-shared": "^7.7.7",
@@ -4618,7 +4633,6 @@
 			"version": "7.7.7",
 			"resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.7.7.tgz",
 			"integrity": "sha512-+udSj47aRl5aKb0memBvcUG9koarqnxNM5yjuREvqwK6T3ap4mn3Zqqc17QrBFTqSMjr3HK1cvStEZpMDpfdyw==",
-			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"rfdc": "^1.4.1"
@@ -5222,7 +5236,6 @@
 			"version": "2.6.1",
 			"resolved": "https://registry.npmjs.org/birpc/-/birpc-2.6.1.tgz",
 			"integrity": "sha512-LPnFhlDpdSH6FJhJyn4M0kFO7vtQ5iPw24FnG0y21q09xC7e8+1LeR31S1MAIrDAHp4m7aas4bEkTDTvMAtebQ==",
-			"dev": true,
 			"license": "MIT",
 			"funding": {
 				"url": "https://github.com/sponsors/antfu"
@@ -5979,7 +5992,6 @@
 			"version": "3.0.5",
 			"resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-3.0.5.tgz",
 			"integrity": "sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==",
-			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"is-what": "^4.1.8"
@@ -7765,7 +7777,6 @@
 			"version": "5.5.3",
 			"resolved": "https://registry.npmjs.org/hookable/-/hookable-5.5.3.tgz",
 			"integrity": "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==",
-			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/hosted-git-info": {
@@ -8164,7 +8175,6 @@
 			"version": "4.1.16",
 			"resolved": "https://registry.npmjs.org/is-what/-/is-what-4.1.16.tgz",
 			"integrity": "sha512-ZhMwEosbFJkA0YhFnNDgTM4ZxDRsS6HqTo7qsZM08fehyRYIYa0yHu5R6mgo1n/8MgaPBXiPimPD77baVFYg+A==",
-			"dev": true,
 			"license": "MIT",
 			"engines": {
 				"node": ">=12.13"
@@ -9065,7 +9075,6 @@
 			"version": "3.0.1",
 			"resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
 			"integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
-			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/mkdirp": {
@@ -12340,7 +12349,6 @@
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/perfect-debounce/-/perfect-debounce-1.0.0.tgz",
 			"integrity": "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==",
-			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/picocolors": {
@@ -12890,7 +12898,6 @@
 			"version": "1.4.1",
 			"resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz",
 			"integrity": "sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==",
-			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/rollup": {
@@ -13921,7 +13928,6 @@
 			"version": "14.0.1",
 			"resolved": "https://registry.npmjs.org/speakingurl/-/speakingurl-14.0.1.tgz",
 			"integrity": "sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==",
-			"dev": true,
 			"license": "BSD-3-Clause",
 			"engines": {
 				"node": ">=0.10.0"
@@ -14185,7 +14191,6 @@
 			"version": "2.2.2",
 			"resolved": "https://registry.npmjs.org/superjson/-/superjson-2.2.2.tgz",
 			"integrity": "sha512-5JRxVqC8I8NuOUjzBbvVJAKNM8qoVuH0O77h4WInc/qC2q5IreqKxYwgkga3PfA22OayK2ikceb/B26dztPl+Q==",
-			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"copy-anything": "^3.0.2"
@@ -14662,7 +14667,6 @@
 			"version": "4.41.0",
 			"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.41.0.tgz",
 			"integrity": "sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA==",
-			"dev": true,
 			"license": "(MIT OR CC0-1.0)",
 			"engines": {
 				"node": ">=16"
@@ -14988,7 +14992,6 @@
 			"version": "4.15.1",
 			"resolved": "https://registry.npmjs.org/vee-validate/-/vee-validate-4.15.1.tgz",
 			"integrity": "sha512-DkFsiTwEKau8VIxyZBGdO6tOudD+QoUBPuHj3e6QFqmbfCRj1ArmYWue9lEp6jLSWBIw4XPlDLjFIZNLdRAMSg==",
-			"dev": true,
 			"license": "MIT",
 			"dependencies": {
 				"@vue/devtools-api": "^7.5.2",
diff --git a/package.json b/package.json
index c699289..bfa971e 100644
--- a/package.json
+++ b/package.json
@@ -38,6 +38,8 @@
 		"semantic-release:test": "semantic-release --dry-run --no-ci"
 	},
 	"dependencies": {
+		"@vee-validate/i18n": "^4.15.1",
+		"@vee-validate/rules": "^4.15.1",
 		"@vueuse/core": "^13.9.0",
 		"lodash": "^4.17.21",
 		"luxon": "^3.7.2"
diff --git a/src/utils/rules/citizenFormRules.ts b/src/utils/rules/citizenFormRules.ts
index 0e56d72..3b19e84 100644
--- a/src/utils/rules/citizenFormRules.ts
+++ b/src/utils/rules/citizenFormRules.ts
@@ -1,25 +1,23 @@
-import { defineRule } from 'vee-validate';
+import { defineRule, configure } from 'vee-validate';
+import { email, min, required } from '@vee-validate/rules';
+import { localize, setLocale } from '@vee-validate/i18n';
 import { cpfValidator, cnsValidator } from '@sysvale/foundry';
 
-defineRule('required', (value: string | object) => {
-	if (!value) {
-		return 'Esse campo é obrigatório';
-	}
+setLocale('pt-BR');
 
-	return true;
+configure({
+	generateMessage: localize('pt-BR', {
+		messages: {
+			required: 'Este campo é obrigatório',
+			email: 'O e-mail é inválido',
+			min: 'O campo deve ter no mínimo 0:{min} caracteres',
+		}
+	})
 });
 
-defineRule('minLength', (value: string, [limit]: [number]) => {
-	if (!value || !value.length) {
-		return true;
-	}
-
-	if (value.length < limit) {
-		return `O campo deve ter no mínimo ${limit} caracteres`;
-	}
-
-	return true;
-});
+defineRule('required', required);
+defineRule('min', min);
+defineRule('email', email);
 
 defineRule('cpf', (value: string) => {
 	const res = cpfValidator(value);

From a7b69e44b9e92bcdd2f81d0fe19bae38b5ade65e Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 16:52:15 -0300
Subject: [PATCH 07/13] feat: Adiciona novos tipos

---
 src/types.ts | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/src/types.ts b/src/types.ts
index 587f28c..532c81a 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -16,3 +16,17 @@ export interface Gender {
 	name: 'Masculino' | 'Feminino';
 	value: 'M' | 'F';
 }
+
+export interface Race {
+	name: 'Branca' | 'Preta' | 'Parda' | 'Amarela' | 'Indígena';
+	value: 'white' | 'black' | 'mixed' | 'asian' | 'indigenous';
+}
+
+export interface Address {
+	street: string;
+	number: string;
+	complement?: string;
+	neighborhood: string;
+	city?: string;
+	uf?: string;
+}

From 7378a2abe24525ecc9043f9ff6b36c42c52a2a74 Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 16:52:58 -0300
Subject: [PATCH 08/13] =?UTF-8?q?feat:=20Adiciona=20novos=20campos=20ao=20?=
 =?UTF-8?q?cidad=C3=A3o?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/constants/genders.ts              |  29 +++++---
 src/constants/races.ts                |  32 +++++++++
 src/models/Citizen.ts                 | 100 +++++++++++++++++++++++---
 src/services/citizen/citizen.types.ts |   7 ++
 4 files changed, 147 insertions(+), 21 deletions(-)
 create mode 100644 src/constants/races.ts

diff --git a/src/constants/genders.ts b/src/constants/genders.ts
index 95c96fd..2d78d26 100644
--- a/src/constants/genders.ts
+++ b/src/constants/genders.ts
@@ -1,20 +1,27 @@
 import type { Gender } from '@/types';
 
-const GENDERS: Gender[] = [
-	{
-		name: 'Feminino',
-		value: 'F',
-	},
-	{
-		name: 'Masculino',
-		value: 'M',
-	},
-];
+const male: Gender = {
+	name: 'Masculino',
+	value: 'M',
+};
+
+const female: Gender = {
+	name: 'Feminino',
+	value: 'F',
+};
+
+const GENDERS: Gender[] = [female, male];
 
 export const genders = () => {
 	return GENDERS;
 }
 
 export const genderFromType = (type: string) => {
-	return GENDERS.find(gender => gender.value === type);
+	const resolvedGender = GENDERS.find(gender => gender.value === type);
+
+	if (!resolvedGender) {
+		return male;
+	}
+
+	return resolvedGender;
 }
diff --git a/src/constants/races.ts b/src/constants/races.ts
new file mode 100644
index 0000000..257b698
--- /dev/null
+++ b/src/constants/races.ts
@@ -0,0 +1,32 @@
+import type { Race } from '@/types';
+
+export const white: Race = {
+	name: 'Branca',
+	value: 'white',
+};
+
+export const black: Race = {
+	name: 'Preta',
+	value: 'black',
+};
+
+export const mixed: Race = {
+	name: 'Parda',
+	value: 'mixed',
+};
+
+export const asian: Race = {
+	name: 'Amarela',
+	value: 'asian',
+};
+
+export const indigenous: Race = {
+	name: 'Indígena',
+	value: 'indigenous',
+}
+export const races: Race[] = [white, black, mixed, asian, indigenous];
+
+export const raceMapByValue = Object.fromEntries(
+	races.map(race => [race.value, race])
+);
+
diff --git a/src/models/Citizen.ts b/src/models/Citizen.ts
index 67e4c2b..31c7162 100644
--- a/src/models/Citizen.ts
+++ b/src/models/Citizen.ts
@@ -1,13 +1,32 @@
 import type { CreateCitizenParams } from '@/services/citizen/citizen.types';
-import type { Gender } from '@/types';
-import { removeCpfMask, removeCnsMask } from '@sysvale/foundry';
+import type { Address, Gender, Race } from '@/types';
+import { raceMapByValue } from '@/constants/races';
+import { genderFromType } from '@/constants/genders';
+import { DateTime } from 'luxon';
+import {
+	removeCpfMask,
+	removeCnsMask,
+	maskCpf,
+	maskCns,
+	maskPhone,
+} from '@sysvale/foundry';
 
 export class Citizen {
-	private cpf: string;
-	private cns: string;
-	private name: string;
-	private gender: Gender;
-	private birth_date: string;
+	public cpf: string | undefined;
+	public cns: string | undefined;
+	public name: string;
+	private internalGender: Gender = {
+		name: 'Masculino',
+		value: 'M',
+	};
+	public birth_date: string;
+	public identification_document: string;
+	public pregnant: boolean;
+	public address?: Address;
+	public cellphone?: string;
+	public phone: string;
+	public email: string;
+	public race?: Race;
 
 	constructor(args: any) {
 		this.cpf = args.cpf;
@@ -15,15 +34,76 @@ export class Citizen {
 		this.name = args.name;
 		this.gender = args.gender;
 		this.birth_date = args.birth_date;
+		this.identification_document = args.identification_document;
+		this.pregnant = args.pregnant;
+		this.address = args.address;
+		this.phone = args.phone;
+		this.cellphone = args.cellphone;
+		this.email = args.email;
+
+		if (args.race) {
+			this.race = typeof args.race === 'string'
+				? raceMapByValue[args.race]
+				: args.race;
+		}
+	}
+
+	set gender(gender: Gender | string) {
+		if (typeof gender === 'string') {
+			this.internalGender = genderFromType(gender);
+			return
+		}
+		this.internalGender = gender;
+	}
+
+	get gender() {
+		return this.internalGender;
+	}
+
+	get personalInfo() {
+		return [
+			{ label: 'CPF', value: maskCpf(this.cpf) ?? 'Não informado' },
+			{ label: 'CNS', value: maskCns(this.cns) ?? 'Não informado' },
+			{ label: 'RG', value: this.identification_document ?? 'Não informado' },
+			{ label: 'Data de nascimento', value: DateTime.fromISO(this.birth_date).toFormat('dd/MM/yyyy') },
+			{ label: 'Sexo', value: this.internalGender.name },
+			{ label: 'Raça/Cor', value: this.race?.name ?? 'Não informado' },
+		];	
+	}
+
+	get contactInfo() {
+		return [
+			{ label: 'Telefone', value: maskPhone(this.phone) ?? 'Não informado' },
+			{ label: 'Celular', value: maskPhone(this.cellphone) ?? 'Não informado' },
+			{ label: 'E-mail', value: this.email ?? 'Não informado' },
+			{ label: 'Endereço', value: this.fancyAddress, fill: true },
+		];
+	}
+
+	get fancyAddress() {
+		if (!this.address) {
+			return 'Não informado';
+		}
+
+		return `${this.address.street},
+			${this.address.number},
+			${this.address.neighborhood},
+			${this.address.city} - ${this.address.uf}`
 	}
 
-	asRequestPayload: () => CreateCitizenParams = () => {
+	asRequestPayload = (): CreateCitizenParams => {
 		return {
 			cpf: removeCpfMask(this.cpf),
 			cns: removeCnsMask(this.cns),
 			name: this.name,
-			gender: this.gender.value,
+			gender: this.internalGender?.value,
 			birth_date: this.birth_date,
-		};
+			identification_document: this.identification_document,
+			pregnant: this.pregnant,
+			...(this.address && { address: this.address }),
+			phone: this.phone,
+			email: this.email,
+			...(this.race && { race: this.race.value }),
+		} as CreateCitizenParams;
 	};
 }
diff --git a/src/services/citizen/citizen.types.ts b/src/services/citizen/citizen.types.ts
index dd27c09..1d64537 100644
--- a/src/services/citizen/citizen.types.ts
+++ b/src/services/citizen/citizen.types.ts
@@ -1,3 +1,5 @@
+import type { Address } from '@/types';
+
 export type Nullable<T> = T | null;
 
 export interface CitizenResponse {
@@ -55,6 +57,11 @@ export interface CreateCitizenParams {
 	cpf: string;
 	cns: string;
 	gender: string;
+	identification_document?: string;
+	pregnant?: boolean;
+	address: Address;
+	phone: string;
+	email: string;
 }
 
 export interface CreateCitizenResponse {

From 49ee6f8ed0707ca2e378e9e666ccb3a0217b6684 Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 16:53:29 -0300
Subject: [PATCH 09/13] =?UTF-8?q?feat:=20Adiciona=20novos=20campos=20?=
 =?UTF-8?q?=C3=A0=20sidesheet=20de=20cria=C3=A7=C3=A3o=20de=20cidad=C3=A3o?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/CreateCitizenSidesheet.vue | 242 ++++++++++++++++++++--
 1 file changed, 227 insertions(+), 15 deletions(-)

diff --git a/src/components/CreateCitizenSidesheet.vue b/src/components/CreateCitizenSidesheet.vue
index f211ccf..b26cdbc 100644
--- a/src/components/CreateCitizenSidesheet.vue
+++ b/src/components/CreateCitizenSidesheet.vue
@@ -3,6 +3,7 @@
 		v-bind="$attrs"
 		v-model="model"
 		title="Cadastrar usuário SUS"
+		size="lg"
 		no-close-ok-button
 		:disable-ok-button="isLoading || $attrs['disable-ok-button']"
 		:disable-cancel-button="isLoading || $attrs['disable-cancel-button']"
@@ -13,15 +14,16 @@
 		<template #default>
 			<Form ref="formRef">
 				<CdsGrid
-					:cols="2"
-					gap="20px"
+					:cols="6"
+					col-gap="2"
+					row-gap="4"
 				>
-					<CdsGridItem :col-span="2">
+					<CdsGridItem :col-span="6">
 						<Field
 							v-slot="{ field, errors, meta }"
 							name="name"
 							label="nome"
-							rules="required|minLength:5"
+							rules="required|min:5"
 						>
 							<CdsTextInput
 								v-bind="field"
@@ -36,8 +38,7 @@
 							/>
 						</Field>
 					</CdsGridItem>
-
-					<CdsGridItem>
+					<CdsGridItem :col-span="3">
 						<Field
 							v-slot="{ field, errors, meta }"
 							name="cns"
@@ -58,8 +59,7 @@
 							/>
 						</Field>
 					</CdsGridItem>
-
-					<CdsGridItem>
+					<CdsGridItem :col-span="3">
 						<Field
 							v-slot="{ field, errors, meta }"
 							name="cpf"
@@ -80,11 +80,10 @@
 							/>
 						</Field>
 					</CdsGridItem>
-
-					<CdsGridItem>
+					<CdsGridItem :col-span="3">
 						<Field
 							v-slot="{ field, errors, meta }"
-							name="birth_date"
+							name="birthDate"
 							label="data de nascimento"
 							rules="required"
 						>
@@ -92,6 +91,7 @@
 								v-bind="field"
 								v-model="field.value"
 								label="Data de nascimento"
+								required
 								fluid
 								:variant="$attrs['action-button-variant']"
 								:disabled="isLoading"
@@ -101,8 +101,52 @@
 							/>
 						</Field>
 					</CdsGridItem>
-
-					<CdsGridItem>
+					<CdsGridItem :col-span="3">
+						<Field
+							v-slot="{ field, errors, meta }"
+							name="rg"
+							label="RG"
+							rules="required"
+						>
+							<CdsTextInput
+								v-bind="field"
+								v-model="field.value"
+								label="RG"
+								placeholder="Número do RG"
+								required
+								fluid
+								:disabled="isLoading"
+								mask="###########"
+								:state="inputStateResolver(meta)"
+								:error-message="errors[0]"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="2">
+						<Field
+							v-slot="{ field, errors, meta }"
+							name="race"
+							label="raça/cor"
+							rules="required"
+						>
+							<CdsSelect
+								v-bind="field"
+								v-model="field.value"
+								options-field="name"
+								:options="races"
+								fluid
+								:disabled="isLoading"
+								label="Raça/cor"
+								placeholder="Selecione a raça/cor"
+								required
+								:state="inputStateResolver(meta)"
+								:error-message="errors[0]"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem
+						:col-span="2"
+					>
 						<Field
 							v-slot="{ field, errors, meta }"
 							name="gender"
@@ -121,10 +165,144 @@
 								required
 								:state="inputStateResolver(meta)"
 								:error-message="errors[0]"
+								@update:model-value="handleGenderChange"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="2">
+						<Field
+							v-slot="{ field }"
+							name="pregnant"
+							label="gestante"
+							as="div"
+							class="pregnant__container"
+						>
+							<CdsCheckbox
+								v-bind="field"
+								v-model="field.value"
+								label="Está gestante"
+								variant="green"
+								:disabled="isLoading || disablePregnantField"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="3">
+						<Field
+							v-slot="{ field, errors, meta }"
+							name="phone"
+							label="telefone"
+							rules="required"
+						>
+							<CdsTextInput
+								v-bind="field"
+								v-model="field.value"
+								label="Telefone"
+								placeholder="(00) 00000-0000"
+								required
+								fluid
+								:disabled="isLoading"
+								mask="(##) # ####-####"
+								:state="inputStateResolver(meta)"
+								:error-message="errors[0]"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="3">
+						<Field
+							v-slot="{ field, errors, meta }"
+							name="email"
+							label="e-mail"
+							rules="required|email"
+						>
+							<CdsTextInput
+								v-bind="field"
+								v-model="field.value"
+								label="E-mail"
+								placeholder="seu.email@exemplo.com"
+								required
+								fluid
+								:disabled="isLoading"
+								:state="inputStateResolver(meta)"
+								:error-message="errors[0]"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="4">
+						<Field
+							v-slot="{ field, errors, meta }"
+							name="street"
+							label="rua"
+							rules="required"
+						>
+							<CdsTextInput
+								v-bind="field"
+								v-model="field.value"
+								label="Rua"
+								placeholder="Ex.: Rua Coronel Exemplio Lima"
+								required
+								fluid
+								:disabled="isLoading"
+								:state="inputStateResolver(meta)"
+								:error-message="errors[0]"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="2">
+						<Field
+							v-slot="{ field, errors, meta }"
+							name="number"
+							label="número"
+							rules="required"
+						>
+							<CdsTextInput
+								v-bind="field"
+								v-model="field.value"
+								label="Número"
+								placeholder="00"
+								required
+								fluid
+								:disabled="isLoading"
+								:state="inputStateResolver(meta)"
+								:error-message="errors[0]"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="3">
+						<Field
+							v-slot="{ field }"
+							name="complement"
+							label="complemento"
+						>
+							<CdsTextInput
+								v-bind="field"
+								v-model="field.value"
+								label="Complemento"
+								placeholder="Ex.: Casa, prédio..."
+								fluid
+								:disabled="isLoading"
+							/>
+						</Field>
+					</CdsGridItem>
+					<CdsGridItem :col-span="3">
+						<Field
+							v-slot="{ field, errors, meta }"
+							name="neighborhood"
+							label="bairro"
+							rules="required"
+						>
+							<CdsTextInput
+								v-bind="field"
+								v-model="field.value"
+								label="Bairro"
+								placeholder="Ex.: Centro"
+								required
+								fluid
+								:disabled="isLoading"
+								:state="inputStateResolver(meta)"
+								:error-message="errors[0]"
 							/>
 						</Field>
 					</CdsGridItem>
-
 					<CdsToast
 						variant="green"
 						size="md"
@@ -140,8 +318,10 @@ import { computed, inject, ref } from 'vue';
 import { Form, Field, type FormContext } from 'vee-validate';
 import inputStateResolver from '@/utils/inputStateResolver';
 import { genders } from '@/constants/genders';
+import { races } from '@/constants/races';
 import { CitizenService } from '@/services/citizen/citizen.service';
 import { Citizen } from '@/models/Citizen';
+import type { Gender } from '@/types';
 
 const useToast = inject('useToast');
 
@@ -149,10 +329,12 @@ const props = withDefaults(
 	defineProps<{
 		toastSuccessDescription?: string;
 		toastErrorDescription?: string;
+		withRace?: boolean;
 	}>(),
 	{
 		toastSuccessDescription: 'Cidadão cadastrado com sucesso.',
 		toastErrorDescription: 'Houve um erro ao cadastrar o cidadão.',
+		withRace: false,
 	}
 );
 
@@ -161,12 +343,17 @@ const emits = defineEmits(['success']);
 const model = defineModel<boolean>();
 const formRef = ref<FormContext | null>(null);
 const isLoading = ref(false);
+const citizenService = new CitizenService();
 
 const computedMaxDate = computed(() => {
 	return new Date().toISOString().split('T')[0];
 });
 
-const citizenService = new CitizenService();
+const disablePregnantField = computed(() => {
+	if (!formRef.value) return false;
+
+	return formRef.value?.values.gender?.value !== 'F';
+});
 
 async function handleOk() {
 	let formValidationResult;
@@ -238,4 +425,29 @@ async function handleOk() {
 function handleCancel() {
 	formRef.value?.resetForm();
 }
+
+function handleGenderChange(gender: Gender) {
+	if (gender.value === 'F') {
+		return;
+	}
+
+	formRef.value?.setFieldValue('pregnant', null);
+}
 </script>
+
+<style lang="scss" scoped>
+@import '@sysvale/cuida/dist/@sysvale/tokens.scss';
+
+.pregnant {
+	&__container {
+		padding: pt(9);
+		height: 100%;
+	}
+}
+
+.multifield {
+	&__container {
+		padding: py(4);
+	}
+}
+</style>

From 645b26576ad53d036272c396da90563360d49b8e Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 16:55:47 -0300
Subject: [PATCH 10/13] Cria getter de gestante

---
 src/models/Citizen.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/models/Citizen.ts b/src/models/Citizen.ts
index 31c7162..4583179 100644
--- a/src/models/Citizen.ts
+++ b/src/models/Citizen.ts
@@ -80,6 +80,10 @@ export class Citizen {
 		];
 	}
 
+	get isPregnant() {
+		return this.internalGender.value === 'F' && this.pregnant;
+	}
+
 	get fancyAddress() {
 		if (!this.address) {
 			return 'Não informado';

From ab1636a4504bf105f491f30f49dd5e28183997bb Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 16:56:06 -0300
Subject: [PATCH 11/13] =?UTF-8?q?feat:=20Adiciona=20formata=C3=A7=C3=A3o?=
 =?UTF-8?q?=20do=20campo=20de=20ra=C3=A7a/cor?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/CitizenResumeViewer.vue        | 118 ------------------
 src/components/CitizenSummaryViewer.vue       |  91 ++++++++++++++
 .../{ResumeSection.vue => SummarySection.vue} |  24 ++--
 src/index.ts                                  |   2 +-
 4 files changed, 107 insertions(+), 128 deletions(-)
 delete mode 100644 src/components/CitizenResumeViewer.vue
 create mode 100644 src/components/CitizenSummaryViewer.vue
 rename src/components/InternalComponents/{ResumeSection.vue => SummarySection.vue} (69%)

diff --git a/src/components/CitizenResumeViewer.vue b/src/components/CitizenResumeViewer.vue
deleted file mode 100644
index 5678a21..0000000
--- a/src/components/CitizenResumeViewer.vue
+++ /dev/null
@@ -1,118 +0,0 @@
-<template>
-	<div
-		class="citizen-resume-viewer"
-		:class="{ 'citizen-resume-viewer--limit-width': !fluid }"
-	>
-		<CdsBox fluid>
-			<CdsFlexbox
-				gap="6"
-				direction="column"
-			>
-				<CdsFlexbox
-					justify="space-between"
-				>
-					<CdsFlexbox
-						gap="3"
-						align="center"
-					>
-						<CdsText
-							as="subheading-2"
-							no-margin
-							font-weight="semibold"
-							color="n-700"
-						>
-							{{ smartTitleCase(citizen.name) }}
-						</CdsText>
-
-						<CdsBadge
-							v-if="isPregnant"
-							size="sm"
-							variant="pink"
-						>
-							Gestante
-						</CdsBadge>
-					</CdsFlexbox>
-
-					<CdsFlexbox gap="3">
-						<CdsIconButton
-							size="sm"
-							tooltip-text="Editar"
-							icon="edit-outline"
-						/>
-
-						<CdsIconButton
-							size="sm"
-							tooltip-text="Fechar"
-							icon="x-outline"
-						/>
-					</CdsFlexbox>
-				</CdsFlexbox>
-
-				<ResumeSection
-					title="Dados pessoais"
-					:items="personalInfoSectionItems"
-				/>
-
-				<ResumeSection
-					title="Informações de contato"
-					:items="contactInfoSectionItems"
-				/>
-			</CdsFlexbox>
-		</CdsBox>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue';
-import { maskCpf, maskCns, maskPhone, smartTitleCase } from '@sysvale/foundry';
-import { DateTime } from 'luxon';
-import { genderFromType } from '@/constants/genders';
-import ResumeSection from './InternalComponents/ResumeSection.vue';
-
-const props = defineProps<{ citizen: Citizen, fluid?: boolean }>();
-
-const isPregnant = computed(() => {
-	return props.citizen.pregnant;
-});
-
-const personalInfoSectionItems = computed(() => {
-	return [
-		{ label: 'CPF', value: maskCpf(props.citizen.cpf) ?? '--' },
-		{ label: 'CNS', value: maskCns(props.citizen.cns) ?? '--' },
-		{ label: 'RG', value: props.citizen.identification_document ?? '--' },
-		{ label: 'Nascimento', value: DateTime.fromISO(props.citizen.birth_date).toFormat('dd/MM/yyyy') },
-		{ label: 'Sexo', value: genderFromType(props.citizen.gender)?.name ?? '--' },
-		{ label: 'Raça/Cor', value: props.citizen.race ?? '--' },
-	];
-});
-
-const contactInfoSectionItems = computed(() => {
-	return [
-		{ label: 'Telefone', value: maskPhone(props.citizen.phone) ?? '--' },
-		{ label: 'Celular', value: maskPhone(props.citizen.cellphone) ?? '--' },
-		{ label: 'E-mail', value: props.citizen.email ?? '--' },
-		{ label: 'Endereço', value: getFancyAddress(), fill: true },
-	];
-});
-
-function getFancyAddress() {
-	const address = props.citizen.address
-
-	if (!address) {
-		return '--'
-	}
-
-	return `${address.street},
-		${address.number},
-		${address.neighborhood},
-		${address.city} - ${address.uf}`
-}
-</script>
-
-<style lang="scss" scoped>
-.citizen-resume-viewer {
-	&--limit-width {
-		width: 800px;
-	}
-}
-</style>
diff --git a/src/components/CitizenSummaryViewer.vue b/src/components/CitizenSummaryViewer.vue
new file mode 100644
index 0000000..1432613
--- /dev/null
+++ b/src/components/CitizenSummaryViewer.vue
@@ -0,0 +1,91 @@
+<template>
+	<div
+		class="citizen-resume-viewer"
+		:class="{ 'citizen-resume-viewer--limit-width': !fluid }"
+	>
+		<CdsBox fluid>
+			<CdsFlexbox
+				gap="6"
+				direction="column"
+			>
+				<CdsFlexbox
+					justify="space-between"
+				>
+					<CdsFlexbox
+						gap="3"
+						align="center"
+					>
+						<CdsText
+							as="subheading-2"
+							no-margin
+							font-weight="semibold"
+							color="n-700"
+						>
+							{{ smartTitleCase(citizen.name) }}
+						</CdsText>
+						<CdsBadge
+							v-if="internalCitizen?.isPregnant"
+							size="sm"
+							variant="pink"
+						>
+							Gestante
+						</CdsBadge>
+					</CdsFlexbox>
+					<CdsFlexbox gap="3">
+						<CdsIconButton
+							size="sm"
+							tooltip-text="Editar"
+							icon="edit-outline"
+							@cds-click="emits('edit')"
+						/>
+						<CdsIconButton
+							size="sm"
+							tooltip-text="Fechar"
+							icon="x-outline"
+							@cds-click="emits('close')"
+						/>
+					</CdsFlexbox>
+				</CdsFlexbox>
+				<SummarySection
+					v-if="internalCitizen"
+					title="Dados pessoais"
+					:items="internalCitizen.personalInfo"
+				/>
+				<SummarySection
+					v-if="internalCitizen"
+					title="Informações de contato"
+					:items="internalCitizen?.contactInfo"
+				/>
+			</CdsFlexbox>
+		</CdsBox>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { watch, ref, onMounted } from 'vue';
+import { smartTitleCase } from '@sysvale/foundry';
+import { Citizen as CitizenModel } from '@/models/Citizen';
+import SummarySection from './InternalComponents/SummarySection.vue';
+
+const props = defineProps<{ citizen: Citizen, fluid?: boolean }>();
+
+const emits = defineEmits(['edit', 'close']);
+
+const internalCitizen = ref<CitizenModel>();
+
+onMounted(() => {
+	internalCitizen.value = new CitizenModel(props.citizen);
+});
+
+watch(props.citizen, (newValue) => {
+	internalCitizen.value = new CitizenModel(newValue);
+})
+</script>
+
+<style lang="scss" scoped>
+.citizen-resume-viewer {
+	&--limit-width {
+		width: 800px;
+	}
+}
+</style>
diff --git a/src/components/InternalComponents/ResumeSection.vue b/src/components/InternalComponents/SummarySection.vue
similarity index 69%
rename from src/components/InternalComponents/ResumeSection.vue
rename to src/components/InternalComponents/SummarySection.vue
index 353896f..0901999 100644
--- a/src/components/InternalComponents/ResumeSection.vue
+++ b/src/components/InternalComponents/SummarySection.vue
@@ -21,18 +21,20 @@
 				:col-span="item.fill ? 3 : 1"
 			>
 				<CdsText
-					as="body-2"
+					as="caption"
 					color="n-600"
 					font-weight="semibold"
 				>
-					{{ item.label }}:
-				</CdsText>
-				<CdsText
-					as="body-2"
-					color="n-600"
-				>
-					{{ item.value }}
+					{{ item.label }}
 				</CdsText>
+				<CdsSpacer margin-top="1">
+					<CdsText
+						as="body-2"
+						color="n-600"
+					>
+						{{ item.value }}
+					</CdsText>
+				</CdsSpacer>
 			</CdsGridItem>
 		</CdsGrid>
 	</CdsFlexbox>
@@ -41,7 +43,11 @@
 <script setup lang="ts">
 defineProps<{
 	title: string,
-	items: Array<{ label: string, value: Nullable<string>, fill?: boolean }>,
+	items: Array<{
+		label: string,
+		value: Nullable<string>,
+		fill?: boolean,
+	}>,
 }>()
 </script>
 
diff --git a/src/index.ts b/src/index.ts
index edc0297..1d1099b 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,7 +1,7 @@
 export { default as CitizenSelect } from './components/CitizenSelect.vue';
 export { default as CitizenTable } from './components/CitizenTable.vue';
 export { default as CreateCitizenSidesheet } from './components/CreateCitizenSidesheet.vue';
-export { default as CitizenResumeViewer } from './components/CitizenResumeViewer.vue';
+export { default as CitizenSummaryViewer } from './components/CitizenSummaryViewer.vue';
 
 export { default as CitizenComponentsPlugin } from './plugin';
 export { default } from './plugin';

From 699a5d299596fd9a3fc2670a08ee70757adc264b Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 17:03:57 -0300
Subject: [PATCH 12/13] =?UTF-8?q?fix:=20Ajusta=20importa=C3=A7=C3=A3o=20de?=
 =?UTF-8?q?=20tipos?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/services/citizen/citizen.types.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/services/citizen/citizen.types.ts b/src/services/citizen/citizen.types.ts
index 1d64537..eb02c38 100644
--- a/src/services/citizen/citizen.types.ts
+++ b/src/services/citizen/citizen.types.ts
@@ -1,4 +1,4 @@
-import type { Address } from '@/types';
+import type { Address } from '../../types';
 
 export type Nullable<T> = T | null;
 

From 051253f122fd56329775464b2e72cca934ce72fa Mon Sep 17 00:00:00 2001
From: Lucas <lucas.barbosa.nas@gmail.com>
Date: Thu, 27 Nov 2025 17:07:44 -0300
Subject: [PATCH 13/13] =?UTF-8?q?feat:=20Adiciona=20exibi=C3=A7=C3=A3o=20c?=
 =?UTF-8?q?ondicional=20do=20campo=20de=20ra=C3=A7a/cor?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/CreateCitizenSidesheet.vue | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/CreateCitizenSidesheet.vue b/src/components/CreateCitizenSidesheet.vue
index b26cdbc..58689d7 100644
--- a/src/components/CreateCitizenSidesheet.vue
+++ b/src/components/CreateCitizenSidesheet.vue
@@ -122,7 +122,10 @@
 							/>
 						</Field>
 					</CdsGridItem>
-					<CdsGridItem :col-span="2">
+					<CdsGridItem
+						v-if="withRace"
+						:col-span="2"
+					>
 						<Field
 							v-slot="{ field, errors, meta }"
 							name="race"
@@ -145,7 +148,7 @@
 						</Field>
 					</CdsGridItem>
 					<CdsGridItem
-						:col-span="2"
+						:col-span="withRace ? 2 : 3"
 					>
 						<Field
 							v-slot="{ field, errors, meta }"