@farm-investimentos/front-mfe-components 11.8.0 → 11.8.1

package/package.json

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

package/src/components/DialogHeader/DialogHeader.vue

@@ -10,6 +10,7 @@
 		<farm-btn
 			v-if="hasCloseIcon"
 			icon
+			color="secondary"
 			class="farm-dialog-header__close"
 			title="Fechar"
 			@click="onClose"

package/src/components/IdCaption/IdCaption.scss

@@ -1,6 +1,6 @@
 .idcaption {
 	display: flex;
-	
+
 	.farm-icon-box {
 		margin-right: 8px;
 	}
@@ -17,11 +17,12 @@
 		}
 
 		.farm-typography {
-			
+
 			margin-bottom: 0;
 			display: flex;
 			flex: none;
-			> span {
+
+			>span {
 				position: relative;
 			}
 		}
@@ -33,4 +34,9 @@
 			top: -8px;
 		}
 	}
+
+	.farm-btn--clickable {
+		position: absolute;
+		top: -50%;
+	}
 }

package/src/components/IdCaption/IdCaption.stories.js

@@ -183,3 +183,21 @@ export const CustomTooltipColor = () => ({
     </farm-idcaption>
     `,
 });
+
+
+export const Teste = () => ({
+	template: `
+    <farm-idcaption 
+    icon="account-box-outline"
+    copy-text=""
+    :link="true"
+    >
+        <template v-slot:title>
+            Upper Line Text
+        </template>
+        <template v-slot:subtitle>
+            0
+        </template>
+    </farm-idcaption>
+    `,
+});

package/src/components/IdCaption/IdCaption.vue

@@ -7,7 +7,13 @@
 			<farm-caption variation="medium" v-if="hasTitle">
 				<span>
 					<slot name="title"></slot>
-					<farm-btn icon color="gray" v-if="link" @click="$emit('onLinkClick')">
+					<farm-btn
+						v-if="link"
+						icon
+						color="gray"
+						class="farm-btn--clickable"
+						@click="$emit('onLinkClick')"
+					>
 						<farm-icon size="xs">open-in-new</farm-icon>
 					</farm-btn>
 				</span>

package/src/components/Modal/Modal.vue

@@ -5,7 +5,7 @@
 			:class="{ 'farm-modal': true, ['farm-modal--size-' + size]: true }"
 			:style="styleObject"
 		>
-			<div class="farm-modal--container teste">
+			<div class="farm-modal--container">
 				<div class="farm-modal--header">
 					<!-- @slot header -->
 					<slot name="header"></slot>

package/src/components/MultipleFilePicker/MultipleFilePicker.vue

@@ -195,15 +195,19 @@ export default Vue.extend({
 				this.$emit('onFileChange', newValue);
 				return;
 			}
-			const invalidTypeArray = newValue.filter(
-				file =>
+			const invalidTypeArray = newValue.filter(file => {
+				const type = file.type;
+
+				return (
 					this.acceptedFileTypes !== '*' &&
-					this.acceptedFileTypes.indexOf(file.type) === -1
-			);
+					(this.acceptedFileTypes.indexOf(file.type) === -1 || !type)
+				);
+			});
 
 			if (invalidTypeArray.length > 0) {
 				const validTypeArray = newValue.filter(file => {
-					if (this.acceptedFileTypes.indexOf(file.type) === -1) {
+					const type = file.type;
+					if (this.acceptedFileTypes.indexOf(file.type) === -1 || !type) {
 						return false;
 					}
 					return true;

package/src/components/Select/Select.scss

@@ -4,9 +4,14 @@
 	background-color: var(--farm-neutral-lighten);
 }
 
+.farm-contextmenu {
+	width: 100%;
+}
+
 .farm-icon {
 	transition: all ease 0.3s;
 	cursor: pointer;
+
 	&--rotate {
 		transform: rotate(180deg);
 	}

package/src/components/Select/__tests__/Select.spec.js

@@ -31,5 +31,10 @@ describe('Select component', () => {
 			component.onBlur();
 			expect(component.isBlured).toBeTruthy();
 		});
+
+		it('clickInput', () => {
+			component.clickInput();
+			expect(component.isTouched).toBeTruthy();
+		});
 	});
 });

package/src/components/TableContextMenu/TableContextMenu.scss

@@ -1,17 +1,7 @@
-.v-list-item.v-list-item--link {
-	border-bottom: 1px solid var(--farm-stroke-base);
-}
-
-.v-list-item__title {
-	display: flex;
-	align-items: center;
-
-
-}
-
-::v-deep .v-application--wrap {
-	min-height: auto;
-	font-family: 'Montserrat', sans-serif !important;
+.farm-context-menu {
+	&--disabled {
+		pointer-events: none;
+	}
 }
 
 .farm-listitem {
@@ -21,4 +11,4 @@
 		vertical-align: sub;
 		margin-right: 8px;
 	}
-}
+}

package/src/components/TableContextMenu/TableContextMenu.stories.js

@@ -28,6 +28,12 @@ export const Primary = () => ({
 	</div>`,
 });
 
+export const Disabled = () => ({
+	template: `<div style="padding-left: 80px">
+		<farm-context-menu disabled :items="[{ label: 'Remover', icon: { color: 'error', type: 'open-in-new' } }]" />
+	</div>`,
+});
+
 export const Icons = () => ({
 	template: `<div style="padding-left: 80px">
 		<farm-context-menu
@@ -70,7 +76,10 @@ export const OnRightSide = () => ({
 		return {
 			items: [
 				{ label: 'Novo', icon: { type: 'open-in-new' } },
-				{ label: 'Nome bem longo sem quebrar linha', icon: { color: 'secondary', type: 'open-in-new' } },
+				{
+					label: 'Nome bem longo sem quebrar linha',
+					icon: { color: 'secondary', type: 'open-in-new' },
+				},
 				{ label: 'Remover', icon: { color: 'error', type: 'delete' } },
 			],
 		};
@@ -78,4 +87,4 @@ export const OnRightSide = () => ({
 	template: `<div style="padding-left: 80px; display: flex; justify-content: end;">
 		<farm-context-menu ref="multi" :items="items" />
 	</div>`,
-});
+});

package/src/components/TableContextMenu/TableContextMenu.vue

@@ -1,7 +1,16 @@
 <template>
-	<farm-contextmenu v-model="value">
-		<template v-slot:activator="{}">
-			<farm-btn icon @click="toggleValue" title="Abrir opções" color="secondary">
+	<farm-contextmenu
+		:class="{ 'farm-context-menu': true, 'farm-context-menu--disabled': disabled }"
+		v-model="value"
+	>
+		<template v-slot:activator>
+			<farm-btn
+				icon
+				title="Abrir opções"
+				color="secondary"
+				:disabled="disabled"
+				@click="toggleValue"
+			>
 				<farm-icon size="md">dots-horizontal</farm-icon>
 			</farm-btn>
 		</template>
@@ -47,6 +56,13 @@ export default Vue.extend({
 			type: Array as PropType<Array<IContextMenuOption>>,
 			required: true,
 		},
+		/**
+		 * Is disabled?
+		 */
+		disabled: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	data() {
 		return {