diff --git a/src/components/BarChart.vue b/src/components/BarChart.vue
index 332d29f8..cba46593 100644
--- a/src/components/BarChart.vue
+++ b/src/components/BarChart.vue
@@ -125,18 +125,21 @@ export default {
 	watch: {
 		labels: {
 			handler(newValue) {
-				this.localLabels = newValue
+				this.localLabels = newValue;
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		variant: {
-			handler(newValue, oldValue) {
-				if (newValue === 'gray' || newValue === 'dark')  {
+			handler(newValue) {
+				if (newValue === 'gray' || newValue === 'dark') {
 					this.deleteFirstTwoColors = true;
 				} else {
 					this.deleteFirstTwoColors = false;
 				}
+
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
@@ -150,11 +153,38 @@ export default {
 
 		barWidth: {
 			handler(newValue) {
-				if (newValue >= 0.1 && newValue <= 1) {
-					this.chartOptions.categoryPercentage = newValue;
-				} else {
-					this.chartOptions.categoryPercentage = 1;
-				}
+				const categoryPercentage = (newValue >= 0.1 && newValue <= 1) ? newValue : 1;
+				this.chartOptions = {
+					...this.chartOptions,
+					categoryPercentage,
+				};
+			},
+			immediate: true,
+		},
+
+		horizontalBar: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					indexAxis: newValue ? 'y' : 'x',
+					scales: {
+						...this.chartOptions.scales,
+						x: newValue
+							? { beginAtZero: true }
+							: { ...this.chartOptions.scales?.x },
+						y: !newValue
+							? {
+								beginAtZero: true,
+								grace: '5%',
+								ticks: {
+									precision: 0
+								},
+								categoryPercentage: 0.6,
+								barPercentage: 0.8
+							}
+							: { ...this.chartOptions.scales?.y },
+					},
+				};
 			},
 			immediate: true,
 		},
diff --git a/src/components/DonutChart.vue b/src/components/DonutChart.vue
index 20eee72d..c5d92719 100644
--- a/src/components/DonutChart.vue
+++ b/src/components/DonutChart.vue
@@ -135,17 +135,34 @@ export default {
 		labels: {
 			handler(newValue) {
 				this.localLabels = newValue;
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		variant: {
 			handler(newValue) {
-				if (newValue === 'gray' || newValue === 'dark')  {
+				if (newValue === 'gray' || newValue === 'dark') {
 					this.deleteFirstTwoColors = true;
 				} else {
 					this.deleteFirstTwoColors = false;
 				}
+
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		theme: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		colors: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
diff --git a/src/components/LineChart.vue b/src/components/LineChart.vue
index ca08128f..63e0ecfa 100644
--- a/src/components/LineChart.vue
+++ b/src/components/LineChart.vue
@@ -232,18 +232,28 @@ export default {
 	watch: {
 		labels: {
 			handler(newValue) {
-				this.localLabels = newValue
+				this.localLabels = newValue;
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		variant: {
 			handler(newValue) {
-				if (newValue === 'gray' || newValue === 'dark')  {
+				if (newValue === 'gray' || newValue === 'dark') {
 					this.deleteFirstTwoColors = true;
 				} else {
 					this.deleteFirstTwoColors = false;
 				}
+
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		theme: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
@@ -255,6 +265,24 @@ export default {
 			immediate: true,
 		},
 
+		showLabelName: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		fill: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					fill: newValue,
+				};
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
 		isDashed: {
 			handler(newValue) {
 				if (newValue === true) {
@@ -263,6 +291,95 @@ export default {
 			},
 			immediate: true,
 		},
+
+		borderDash: {
+			handler() {
+				this.checkDashed();
+			},
+			immediate: true,
+		},
+
+		scales: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					scales: {
+						...this.chartOptions.scales,
+						...newValue,
+					},
+				};
+			},
+			immediate: true,
+		},
+
+		animation: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					animation: {
+						...newValue,
+					},
+				};
+			},
+			immediate: true,
+		},
+
+		plugins: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					plugins: {
+						...this.chartOptions.plugins,
+						...newValue,
+					},
+				};
+			},
+			immediate: true,
+		},
+
+		xAxisRange: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					scales: {
+						...this.chartOptions.scales,
+						x: {
+							...this.chartOptions.scales?.x,
+							suggestedMin: newValue[0],
+							suggestedMax: newValue[1],
+						},
+					},
+				};
+			},
+			immediate: true,
+		},
+
+		yAxisRange: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					scales: {
+						...this.chartOptions.scales,
+						y: {
+							...this.chartOptions.scales?.y,
+							suggestedMin: newValue[0],
+							suggestedMax: newValue[1],
+						},
+					},
+				};
+			},
+			immediate: true,
+		},
+
+		smoothing: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					tension: newValue,
+				};
+			},
+			immediate: true,
+		},
 	},
 
 	mounted() {
@@ -373,7 +490,10 @@ export default {
 		},
 
 		checkDashed() {
-			this.chartOptions.borderDash = [this.borderDash[0], this.borderDash[1]];
+			this.chartOptions = {
+				...this.chartOptions,
+				borderDash: this.isDashed ? [this.borderDash[0], this.borderDash[1]] : [],
+			};
 		}
 	}
 }
diff --git a/src/components/PieChart.vue b/src/components/PieChart.vue
index 8e995909..63ee3bda 100644
--- a/src/components/PieChart.vue
+++ b/src/components/PieChart.vue
@@ -136,17 +136,27 @@ export default {
 		labels: {
 			handler(newValue) {
 				this.localLabels = newValue;
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		variant: {
 			handler(newValue) {
-				if (newValue === 'gray' || newValue === 'dark')  {
+				if (newValue === 'gray' || newValue === 'dark') {
 					this.deleteFirstTwoColors = true;
 				} else {
 					this.deleteFirstTwoColors = false;
 				}
+
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		colors: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
diff --git a/src/components/PolarAreaChart.vue b/src/components/PolarAreaChart.vue
index 0ac4d399..44da044c 100644
--- a/src/components/PolarAreaChart.vue
+++ b/src/components/PolarAreaChart.vue
@@ -125,18 +125,21 @@ export default {
 	watch: {
 		labels: {
 			handler(newValue) {
-				this.localLabels = newValue
+				this.localLabels = newValue;
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		variant: {
 			handler(newValue) {
-				if (newValue === 'gray' || newValue === 'dark')  {
+				if (newValue === 'gray' || newValue === 'dark') {
 					this.deleteFirstTwoColors = true;
 				} else {
 					this.deleteFirstTwoColors = false;
 				}
+
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
@@ -147,6 +150,25 @@ export default {
 			},
 			immediate: true,
 		},
+
+		isVisiblePointNames: {
+			handler(newValue) {
+				this.chartOptions = {
+					...this.chartOptions,
+					scales: {
+						...this.chartOptions.scales,
+						r: {
+							...this.chartOptions.scales?.r,
+							pointLabels: {
+								...this.chartOptions.scales?.r?.pointLabels,
+								display: newValue,
+							},
+						},
+					},
+				};
+			},
+			immediate: true,
+		},
 	},
 
 	methods: {
@@ -187,7 +209,7 @@ export default {
 			data.forEach(obj => {
 				obj.datasets.forEach(state => {
 					const dataset = {
-						label: this.showLabelName ? state.name :state.label,
+						label: state.label,
 						data: state.data,
 						name: state.name,
 						borderRadius: 6,
diff --git a/src/components/RadialBarChart.vue b/src/components/RadialBarChart.vue
index 442616fe..1b91f3aa 100644
--- a/src/components/RadialBarChart.vue
+++ b/src/components/RadialBarChart.vue
@@ -59,16 +59,9 @@ export default {
 		* `data` (array com os valores númericos).
 		*/
 		data: {
-			type: Object,
+			type: Array,
 			required: true,
-			default: () => ({
-				datasets: [
-					{
-						label: '',
-						data: [],
-					}
-				]
-			})
+			default: () => [],
 		},
 		/**
 		* Personaliza a paleta de cores do gráfico. São 11 variantes implementadas:
@@ -173,23 +166,41 @@ export default {
 		labels: {
 			handler(newValue) {
 				this.localLabels = newValue;
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		variant: {
 			handler(newValue) {
-				if (newValue === 'gray' || newValue === 'dark')  {
+				if (newValue === 'gray' || newValue === 'dark') {
 					this.deleteFirstTwoColors = true;
 				} else {
 					this.deleteFirstTwoColors = false;
 				}
+
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		theme: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		colors: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		data: {
 			handler(newValue) {
+				this.updateLargestValue(newValue);
 				this.mergeChartDataNoSelect(newValue);
 			},
 			immediate: true,
@@ -197,20 +208,22 @@ export default {
 	},
 
 	mounted() {
-
-		this.data.forEach(item => {
-			if (item.datasets[0].data[0] > this.largestValue) {
-				this.largestValue = item.datasets[0].data[0];
-			}
-			
-		})
-
+		this.updateLargestValue(this.data);
 		this.mergeChartDataNoSelect(this.data);
 	},
 
 	methods: {
 		paleteBuilder,
 
+		updateLargestValue(chartData) {
+			this.largestValue = 0;
+			chartData.forEach(item => {
+				if (item.datasets[0] && item.datasets[0].data && item.datasets[0].data[0] > this.largestValue) {
+					this.largestValue = item.datasets[0].data[0];
+				}
+			});
+		},
+
 		palete() {
 			this.palletColors = this.paleteBuilder(this.sassColorVariables.palete);
 			this.removeFirstTwoElements();
diff --git a/src/components/StackedBarChart.vue b/src/components/StackedBarChart.vue
index 8794f4f0..75377b3e 100644
--- a/src/components/StackedBarChart.vue
+++ b/src/components/StackedBarChart.vue
@@ -154,18 +154,28 @@ export default {
 	watch: {
 		labels: {
 			handler(newValue) {
-				this.localLabels = newValue
+				this.localLabels = newValue;
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
 
 		variant: {
 			handler(newValue) {
-				if (newValue === 'gray' || newValue === 'dark')  {
+				if (newValue === 'gray' || newValue === 'dark') {
 					this.deleteFirstTwoColors = true;
 				} else {
 					this.deleteFirstTwoColors = false;
 				}
+
+				this.mergeChartDataNoSelect(this.data);
+			},
+			immediate: true,
+		},
+
+		theme: {
+			handler() {
+				this.mergeChartDataNoSelect(this.data);
 			},
 			immediate: true,
 		},
@@ -179,11 +189,11 @@ export default {
 
 		barWidth: {
 			handler(newValue) {
-				if (newValue >= 0.1 && newValue <= 1) {
-					this.chartOptions.categoryPercentage = newValue;
-				} else {
-					this.chartOptions.categoryPercentage = 1;
-				}
+				const categoryPercentage = (newValue >= 0.1 && newValue <= 1) ? newValue : 1;
+				this.chartOptions = {
+					...this.chartOptions,
+					categoryPercentage,
+				};
 			},
 			immediate: true,
 		},