@farm-investimentos/front-mfe-components 3.4.7 → 3.4.8

package/package.json

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

package/src/components/MainFilter/MainFilter.scss

@@ -0,0 +1,17 @@
+section {
+	display: flex;
+	flex-direction: row;
+	.v-btn {
+		margin-left: 1rem;
+	}
+}
+@media screen and (max-width: 600px) {
+	section {
+		flex-direction: column;
+		margin-bottom: 1rem;
+		.v-btn {
+			margin-left: 0;
+			margin-top: 0 !important;
+		}
+	}
+}

package/src/components/MainFilter/MainFilter.vue

@@ -69,10 +69,10 @@ export default {
 			this.inputValue = newValue;
 		},
 	},
-	data: () => {
+	data() {
 		return {
 			timer: null,
-			inputValue: '',
+			inputValue: this.initialValue,
 		};
 	},
 	methods: {
@@ -105,21 +105,5 @@ export default {
 </script>
 
 <style scoped lang="scss">
-section {
-	display: flex;
-	flex-direction: row;
-	.v-btn {
-		margin-left: 1rem;
-	}
-}
-@media screen and (max-width: 600px) {
-	section {
-		flex-direction: column;
-		margin-bottom: 1rem;
-		.v-btn {
-			margin-left: 0;
-			margin-top: 0 !important;
-		}
-	}
-}
+@import './MainFilter.scss';
 </style>

package/src/examples/Buttons.stories.js

@@ -0,0 +1,75 @@
+import { withDesign } from 'storybook-addon-designs';
+import { DefaultButton } from '../main';
+
+export default {
+	title: 'Examples/Buttons',
+	decorators: [withDesign],
+	parameters: {
+		viewMode: 'docs',
+		docs: {
+			description: {
+				component: `DefaultButton`,
+			},
+		},
+	},
+};
+
+const colors = ['primary', 'secondary', 'error', 'extra', 'gray', 'accent', 'yellow'];
+
+export const ActiveButtons = () => ({
+	components: {
+		DefaultButton,
+	},
+	data() {
+		return {
+			colors,
+		};
+	},
+	template: `<div style="display: flex; flex-direction: column; max-width: 160px; width: 100%;">
+        <DefaultButton v-for="color of colors":key="color" :color="color" style="margin-bottom: 1rem;">
+            {{ color }}
+        </DefaultButton>
+	</div>`,
+});
+
+export const OutlinedButtons = () => ({
+	components: {
+		DefaultButton,
+	},
+	data() {
+		return {
+			colors,
+		};
+	},
+	template: `<div style="display: flex; flex-direction: column; max-width: 160px; width: 100%;">
+        <DefaultButton v-for="color of colors":key="color" :color="color" style="margin-bottom: 1rem;" outlined>
+            {{ color }}
+        </DefaultButton>
+	</div>`,
+});
+
+export const DisabledButtons = () => ({
+	components: {
+		DefaultButton,
+	},
+	data() {
+		return {
+			colors,
+		};
+	},
+	template: `<div style="display: flex; flex-direction: column; max-width: 160px; width: 100%;">
+        <DefaultButton v-for="color of colors":key="color" :color="color" style="margin-bottom: 1rem;" disabled>
+            {{ color }}
+        </DefaultButton>
+	</div>`,
+});
+
+ActiveButtons.story = {
+	name: 'Active',
+};
+OutlinedButtons.story = {
+	name: 'Outlined',
+};
+DisabledButtons.story = {
+	name: 'Disabled',
+};