@farm-investimentos/front-mfe-components-vue3 0.3.4 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/dist/front-mfe-components.common.js +105 -117
  2. package/dist/front-mfe-components.common.js.map +1 -1
  3. package/dist/front-mfe-components.css +1 -1
  4. package/dist/front-mfe-components.umd.js +105 -117
  5. package/dist/front-mfe-components.umd.js.map +1 -1
  6. package/dist/front-mfe-components.umd.min.js +1 -1
  7. package/dist/front-mfe-components.umd.min.js.map +1 -1
  8. package/package.json +2 -2
  9. package/src/components/AlertBox/AlertBox.stories.js +3 -0
  10. package/src/components/AlertBox/AlertBox.vue +64 -73
  11. package/src/components/Label/Label.vue +11 -13
  12. package/src/components/ProgressBar/ProgressBar.scss +2 -2
  13. package/src/components/layout/Row/Row.scss +1 -2
  14. package/src/components/AlertBox/__tests__/valueWatcher.spec.js +0 -16
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@farm-investimentos/front-mfe-components-vue3",
3
- "version": "0.3.4",
3
+ "version": "0.4.0",
4
4
  "private": false,
5
5
  "repository": {
6
6
  "type": "git",
@@ -82,7 +82,7 @@
82
82
  "ts-jest": "^29.0.0",
83
83
  "typescript": "~4.1.5",
84
84
  "vite": "^4.4.9",
85
- "vue": "3.3.10",
85
+ "vue": "3.4.10",
86
86
  "vue-loader": "^16.8.3",
87
87
  "vue-tsc": "^1.8.11",
88
88
  "webpack-cli": "^5.1.4"
package/src/components/AlertBox/AlertBox.stories.js CHANGED
@@ -1,8 +1,11 @@
1
+ import AlertBox from './AlertBox.vue';
2
+
1
3
  import baseThemeColors from '../../configurations/_theme-colors-base.module.scss';
2
4
  const colors = Object.keys(baseThemeColors);
3
5
 
4
6
  export default {
5
7
  title: 'Feedback/AlertBox',
8
+ component: AlertBox,
6
9
  parameters: {
7
10
  docs: {
8
11
  description: {
package/src/components/AlertBox/AlertBox.vue CHANGED
@@ -39,89 +39,80 @@
39
39
  :color="color"
40
40
  @click="close"
41
41
  >
42
- <farm-icon variation="darken" size="md" :color="color">close</farm-icon>
42
+ <farm-icon
43
+ variation="darken"
44
+ size="md"
45
+ :color="color"
46
+ >
47
+ close
48
+ </farm-icon>
43
49
  </farm-btn>
44
50
  </div>
45
51
  </transition>
46
52
  </template>
47
53
 
48
- <script lang="ts">
49
- import { ref, PropType } from 'vue';
50
-
51
- import valueWatcher from './valueWatcher';
54
+ <script lang="ts" setup>
55
+ import { PropType } from 'vue';
52
56
 
53
- export default {
57
+ defineOptions({
54
58
  name: 'farm-alertbox',
55
- props: {
56
- /**
57
- * Left Icon?
58
- */
59
- icon: {
60
- type: String,
61
- default: null,
62
- },
63
- /**
64
- * Close icon and option to close AlertBox?
65
- */
66
- dismissable: {
67
- type: Boolean,
68
- default: false,
69
- },
70
- /**
71
- * Dense?
72
- */
73
- dense: {
74
- type: Boolean,
75
- default: false,
76
- },
77
- /**
78
- * Color
79
- */
80
- color: {
81
- type: String as PropType<
82
- | 'primary'
83
- | 'secondary'
84
- | 'secondary-green'
85
- | 'secondary-golden'
86
- | 'neutral'
87
- | 'info'
88
- | 'success'
89
- | 'error'
90
- | 'warning'
91
- | 'success'
92
- | 'extra-1'
93
- | 'extra-2'
94
- >,
95
- default: 'primary',
96
- },
97
- modelValue: {
98
- type: Boolean,
99
- default: true,
100
- },
101
- /**
102
- * Html tag (will be forwarded to farm-typography)
103
- */
104
- tag: {
105
- type: String,
106
- default: 'p',
107
- },
59
+ });
60
+ defineProps({
61
+ /**
62
+ * Left Icon?
63
+ */
64
+ icon: {
65
+ type: String,
66
+ default: null,
108
67
  },
109
- setup(props, { emit }) {
110
- const visible = ref(true);
111
-
112
- function close() {
113
- visible.value = false;
114
- emit('update:modelValue', false);
115
- }
68
+ /**
69
+ * Close icon and option to close AlertBox?
70
+ */
71
+ dismissable: {
72
+ type: Boolean,
73
+ default: false,
74
+ },
75
+ /**
76
+ * Dense?
77
+ */
78
+ dense: {
79
+ type: Boolean,
80
+ default: false,
81
+ },
82
+ /**
83
+ * Color
84
+ */
85
+ color: {
86
+ type: String as PropType<
87
+ | 'primary'
88
+ | 'secondary'
89
+ | 'secondary-green'
90
+ | 'secondary-golden'
91
+ | 'neutral'
92
+ | 'info'
93
+ | 'success'
94
+ | 'error'
95
+ | 'warning'
96
+ | 'success'
97
+ | 'extra-1'
98
+ | 'extra-2'
99
+ >,
100
+ default: 'primary',
101
+ },
102
+ /**
103
+ * Html tag (will be forwarded to farm-typography)
104
+ */
105
+ tag: {
106
+ type: String,
107
+ default: 'p',
108
+ },
109
+ });
116
110
 
117
- valueWatcher(props, visible);
111
+ const visible = defineModel({ type: Boolean, default: true });
118
112
 
119
- return {
120
- visible,
121
- close,
122
- };
123
- },
124
- };
113
+ function close() {
114
+ visible.value = false;
115
+ }
125
116
  </script>
126
117
  <style lang="scss" scoped>
127
118
  @import './AlertBox';
package/src/components/Label/Label.vue CHANGED
@@ -6,21 +6,19 @@
6
6
  <slot></slot>
7
7
  </label>
8
8
  </template>
9
- <script lang="ts">
10
-
11
-
12
- export default {
9
+ <script lang="ts" setup>
10
+ defineOptions({
13
11
  name: 'farm-label',
14
- props: {
15
- /**
16
- * Show required indicator
17
- */
18
- required: {
19
- type: Boolean,
20
- default: false,
21
- },
12
+ });
13
+ defineProps({
14
+ /**
15
+ * Show required indicator
16
+ */
17
+ required: {
18
+ type: Boolean,
19
+ default: false,
22
20
  },
23
- };
21
+ });
24
22
  </script>
25
23
  <style lang="scss" scoped>
26
24
  @import 'Label';
package/src/components/ProgressBar/ProgressBar.scss CHANGED
@@ -1,10 +1,10 @@
1
1
  @import '../../configurations/variables';
2
2
 
3
- $radius: 5px;
3
+ $radius: 8px;
4
4
 
5
5
  .farm-progressbar {
6
6
  width: 100%;
7
- height: 5px;
7
+ height: 8px;
8
8
  border-radius: $radius;
9
9
  overflow: hidden;
10
10
 
package/src/components/layout/Row/Row.scss CHANGED
@@ -34,8 +34,7 @@
34
34
  &--extra-decrease {
35
35
  margin: 0 -#{2 * gutter('vuetify')};
36
36
  }
37
-
38
- &--y-grid-gutters > .farm-col {
37
+ &--y-grid-gutters > :deep(.farm-col) {
39
38
  margin-top: 12px;
40
39
  margin-bottom: 12px;
41
40
  }
package/src/components/AlertBox/__tests__/valueWatcher.spec.js DELETED
@@ -1,16 +0,0 @@
1
- import { ref, reactive } from 'vue';
2
-
3
- import valueWatcher from '../valueWatcher';
4
-
5
- describe('valueWatcher', () => {
6
- it('Should change value for visible', done => {
7
- const visible = ref(false);
8
- const mockProps = reactive({ value: false });
9
- valueWatcher(mockProps, visible);
10
- mockProps.value = true;
11
- setTimeout(() => {
12
- expect(visible.value).toBeTruthy();
13
- done();
14
- });
15
- });
16
- });