@farm-investimentos/front-mfe-components 11.5.6 → 11.6.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.
- package/dist/front-mfe-components.common.js +114 -98
- package/dist/front-mfe-components.common.js.map +1 -1
- package/dist/front-mfe-components.css +1 -1
- package/dist/front-mfe-components.umd.js +114 -98
- package/dist/front-mfe-components.umd.js.map +1 -1
- package/dist/front-mfe-components.umd.min.js +1 -1
- package/dist/front-mfe-components.umd.min.js.map +1 -1
- package/package.json +1 -1
- package/src/components/ContextMenu/__tests__/ContextMenu.spec.js +2 -2
- package/src/components/layout/Row/Row.scss +10 -0
- package/src/components/layout/Row/Row.stories.js +70 -0
- package/src/components/layout/Row/Row.vue +16 -0
- package/src/scss/FormOverrides.scss +1 -0
package/package.json
CHANGED
|
@@ -71,3 +71,73 @@ export const Justify = () => ({
|
|
|
71
71
|
export const NoDefaultGutters = () => ({
|
|
72
72
|
template: '<farm-row :no-default-gutters="true">no gutters</farm-row>',
|
|
73
73
|
});
|
|
74
|
+
|
|
75
|
+
export const DefaultGrid = () => ({
|
|
76
|
+
template: `<div>
|
|
77
|
+
<farm-row>
|
|
78
|
+
<farm-col md="6">
|
|
79
|
+
<div style="border:1px solid red;">col 1</div>
|
|
80
|
+
</farm-col>
|
|
81
|
+
<farm-col md="6">
|
|
82
|
+
<div style="border:1px solid red;">col 2</div>
|
|
83
|
+
</farm-col>
|
|
84
|
+
<farm-col md="6">
|
|
85
|
+
<div style="border:1px solid red;">col 3</div>
|
|
86
|
+
</farm-col>
|
|
87
|
+
<farm-col md="6">
|
|
88
|
+
<div style="border:1px solid red;">col 4</div>
|
|
89
|
+
</farm-col>
|
|
90
|
+
</farm-row>
|
|
91
|
+
</div>`,
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
export const yGridGutters = () => ({
|
|
96
|
+
template: `<div>
|
|
97
|
+
<farm-row y-grid-gutters>
|
|
98
|
+
<farm-col md="6">
|
|
99
|
+
<div style="border:1px solid red;">col 1</div>
|
|
100
|
+
</farm-col>
|
|
101
|
+
<farm-col md="6">
|
|
102
|
+
<div style="border:1px solid red;">col 2</div>
|
|
103
|
+
</farm-col>
|
|
104
|
+
<farm-col md="6">
|
|
105
|
+
<div style="border:1px solid red;">col 3</div>
|
|
106
|
+
</farm-col>
|
|
107
|
+
<farm-col md="6">
|
|
108
|
+
<div style="border:1px solid red;">col 4</div>
|
|
109
|
+
</farm-col>
|
|
110
|
+
</farm-row>
|
|
111
|
+
</div>`,
|
|
112
|
+
});
|
|
113
|
+
|
|
114
|
+
export const yFormGutters = () => ({
|
|
115
|
+
template: `<div>
|
|
116
|
+
<farm-row y-form-gutters>
|
|
117
|
+
<farm-col md="6">
|
|
118
|
+
<div style="border:1px solid red;">
|
|
119
|
+
<farm-label>label 1</farm-label>
|
|
120
|
+
<farm-textfield />
|
|
121
|
+
</div>
|
|
122
|
+
</farm-col>
|
|
123
|
+
<farm-col md="6">
|
|
124
|
+
<div style="border:1px solid red;">
|
|
125
|
+
<farm-label>label 2</farm-label>
|
|
126
|
+
<farm-textfield />
|
|
127
|
+
</div>
|
|
128
|
+
</farm-col>
|
|
129
|
+
<farm-col md="6">
|
|
130
|
+
<div style="border:1px solid red;">
|
|
131
|
+
<farm-label>label 3</farm-label>
|
|
132
|
+
<farm-textfield hint="some hint text" persistent-hint />
|
|
133
|
+
</div>
|
|
134
|
+
</farm-col>
|
|
135
|
+
<farm-col md="6">
|
|
136
|
+
<div style="border:1px solid red;">
|
|
137
|
+
<farm-label>label 4</farm-label>
|
|
138
|
+
<farm-textfield />
|
|
139
|
+
</div>
|
|
140
|
+
</farm-col>
|
|
141
|
+
</farm-row>
|
|
142
|
+
</div>`,
|
|
143
|
+
});
|
|
@@ -8,6 +8,8 @@
|
|
|
8
8
|
[`farm-row--justify-${justify}`]: justify,
|
|
9
9
|
'farm-row--no-default-gutters': noDefaultGutters,
|
|
10
10
|
'farm-row--extra-decrease': extraDecrease,
|
|
11
|
+
'farm-row--y-grid-gutters': yGridGutters,
|
|
12
|
+
'farm-row--y-form-gutters': yFormGutters,
|
|
11
13
|
}"
|
|
12
14
|
>
|
|
13
15
|
<slot></slot>
|
|
@@ -60,6 +62,20 @@ export default Vue.extend({
|
|
|
60
62
|
type: Boolean,
|
|
61
63
|
default: false,
|
|
62
64
|
},
|
|
65
|
+
/**
|
|
66
|
+
* Add gutters to farm-cols in Y axis
|
|
67
|
+
*/
|
|
68
|
+
yGridGutters: {
|
|
69
|
+
type: Boolean,
|
|
70
|
+
default: false,
|
|
71
|
+
},
|
|
72
|
+
/**
|
|
73
|
+
* Add proper gutters to farm-cols in Y axis to be used with form elements
|
|
74
|
+
*/
|
|
75
|
+
yFormGutters: {
|
|
76
|
+
type: Boolean,
|
|
77
|
+
default: false,
|
|
78
|
+
},
|
|
63
79
|
},
|
|
64
80
|
inheritAttrs: true,
|
|
65
81
|
});
|