@farm-investimentos/front-mfe-components 15.8.3 → 15.8.4

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@farm-investimentos/front-mfe-components",
-	"version": "15.8.3",
+	"version": "15.8.4",
 	"author": "farm investimentos",
 	"private": false,
 	"main": "./dist/front-mfe-components.common.js",

package/src/components/Buttons/DefaultButton/DefaultButton.vue

@@ -1,6 +1,6 @@
 <template>
 	<button
-		v-if="!to"
+		v-if="!to || disabled"
 		v-on="$listeners"
 		v-bind="$attrs"
 		:disabled="disabled"

package/src/components/DatePicker/DatePicker.stories.js

@@ -85,11 +85,11 @@ export const OnlyAllowedDates = () => ({
 	},
 	props: {
 		allowedDates: {
-			default: () => (value) => {
+			default: () => value => {
 				const day = parseInt(value.split('-')[2], 10);
 				return [5, 10, 15, 20, 25].includes(day);
-			}
-		}
+			},
+		},
 	},
 	template: `<div style='max-width: 320px'><farm-input-datepicker position="bottom" :allowed-dates="allowedDates" inputId="input-custom-id-1" v-model="date" /></div>`,
 });
@@ -98,7 +98,7 @@ export const WithInitialMonth = () => ({
 	data() {
 		return {
 			date: '',
-			pickerDate: '2023-01'
+			pickerDate: '2023-01',
 		};
 	},
 	template: `<div style='max-width: 320px'>
@@ -140,10 +140,16 @@ export const MultipleDates = () => ({
 	computed: {
 		dates() {
 			return this.date.join('  ///  ');
-		}
+		},
 	},
 	template: `<div style='max-width: 320px'>
         <farm-input-datepicker inputId="input-custom-id-0" v-model="date" multiple />
 		{{ dates }}
     </div>`,
-});
+});
+
+export const Disabled = () => ({
+	template: `<div style='max-width: 320px'>
+        <farm-input-datepicker :disabled="true"  value="2021-08-01" inputId="input-custom-id-3"/>
+    </div>`,
+});

package/src/components/DatePicker/DatePicker.vue

@@ -51,6 +51,7 @@
 				:mask="`${isReadonly ? '' : '##/##/####'}`"
 				:id="inputId"
 				:rules="rules"
+				:disabled="disabled"
 				@keyup="keyUpInput"
 			/>
 		</template>
@@ -138,6 +139,13 @@ export default defineComponent({
 			type: Boolean,
 			default: false,
 		},
+		/**
+		 * Disabled field
+		 */
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	data() {
 		const s = this.formatDateRange(this.value);

package/src/components/RangeDatePicker/RangeDatePicker.stories.js

@@ -81,3 +81,15 @@ export const Reset = () => ({
 		</farm-btn>
 	</div>`,
 });
+
+export const disabled = () => ({
+	data() {
+		return {
+			date: ['2023-08-01', '2023-08-05'],
+		};
+	},
+	template: `<div style='max-width: 320px'>
+		<RangeDatePicker disabled inputId="input-custom-id" :value="date" />
+		date: {{ date }}
+	</div>`,
+});

package/src/components/RangeDatePicker/RangeDatePicker.vue

@@ -49,6 +49,7 @@
 				:id="inputId"
 				:mask="`${readonly ? [''] : ['##/##/####' + ' a ' + '##/##/####']}`"
 				:rules="[checkDateValid, checkRequire]"
+				:disabled="disabled"
 				@keyup="keyUpInput"
 			/>
 		</template>
@@ -115,6 +116,13 @@ export default defineComponent({
 			type: Boolean,
 			default: false,
 		},
+		/**
+		 * Disabled field
+		 */
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	data() {
 		const s = this.formatDateRange(this.value);