@frollo/frollo-web-ui 5.0.2 → 5.0.3
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/cjs/index.js +1137 -778
- package/esm/{add-to-unscopables-2400f45b.js → add-to-unscopables-31609885.js} +2 -2
- package/esm/{array-iteration-107f927f.js → array-iteration-ec356eb3.js} +2 -2
- package/esm/{array-method-has-species-support-3d413468.js → array-method-has-species-support-8a4b1310.js} +1 -1
- package/esm/{array-method-is-strict-055b1830.js → array-method-is-strict-fc2e0d8d.js} +1 -1
- package/esm/{array-species-create-a5f5503b.js → array-species-create-b125f4a4.js} +2 -2
- package/esm/{classof-39c30bd5.js → classof-ee4b3b5b.js} +1 -1
- package/esm/{create-property-534611fd.js → create-property-c70ecc08.js} +1 -1
- package/esm/{delete-property-or-throw-8032646c.js → delete-property-or-throw-cd4c57d6.js} +3 -3
- package/esm/{does-not-exceed-safe-integer-31d08811.js → does-not-exceed-safe-integer-8e0042ec.js} +1 -1
- package/esm/{es.array.concat-987938be.js → es.array.concat-fe990345.js} +6 -6
- package/esm/{es.array.find-dfa1f42f.js → es.array.find-67b3b514.js} +5 -5
- package/esm/{es.array.includes-91be7771.js → es.array.includes-a06445a5.js} +3 -3
- package/esm/es.array.map-ae6c9437.js +43 -0
- package/esm/{es.function.name-557cb1f9.js → es.function.name-6daefaeb.js} +1 -1
- package/esm/{es.number.constructor-d6ff8874.js → es.number.constructor-98bae04f.js} +2 -2
- package/esm/es.string.includes-ade04f96.js +66 -0
- package/esm/{es.string.iterator-590198a8.js → es.string.iterator-0992bb28.js} +8 -8
- package/esm/{export-a37ba078.js → export-8a363004.js} +1 -1
- package/esm/{function-apply-ce251590.js → function-apply-b908d7e6.js} +1 -1
- package/esm/fw-animations.js +5 -5
- package/esm/fw-bar-chart.js +17 -16
- package/esm/{fw-button-8d131219.js → fw-button-b7a12ae1.js} +2 -2
- package/esm/fw-button.js +9 -9
- package/esm/fw-checkbox.js +9 -9
- package/esm/fw-drawer.js +9 -9
- package/esm/fw-dropdown-765dbbba.js +223 -0
- package/esm/fw-dropdown.js +15 -222
- package/esm/{fw-image-4787a8bd.js → fw-image-660d3e75.js} +10 -10
- package/esm/fw-image.js +18 -18
- package/esm/fw-input-7d25de48.js +235 -0
- package/esm/fw-input.js +20 -245
- package/esm/{fw-loading-spinner-c394fafc.js → fw-loading-spinner-3fda633e.js} +1 -1
- package/esm/fw-loading.js +3 -3
- package/esm/fw-modal.js +9 -9
- package/esm/fw-navigation-menu.js +9 -9
- package/esm/fw-progress-bar.js +3 -3
- package/esm/fw-provider-list.js +36 -0
- package/esm/fw-sidebar-menu.js +9 -9
- package/esm/fw-table-row-d390fe77.js +492 -0
- package/esm/fw-table.js +14 -494
- package/esm/fw-tabs.js +10 -10
- package/esm/fw-tag-9ef5331a.js +157 -0
- package/esm/fw-tag.js +13 -162
- package/esm/fw-toast.js +24 -85
- package/esm/fw-transactions-card.js +18 -18
- package/esm/{index-e4a2f8b0.js → index-04d3cb23.js} +1 -1
- package/esm/index-8c78a422.js +417 -0
- package/esm/{index-2766bfe4.js → index-c15f5641.js} +18 -55
- package/esm/index.js +48 -54
- package/esm/{is-forced-752b5893.js → is-forced-fc680e39.js} +1 -1
- package/esm/{object-create-f6f3a673.js → object-create-bc771493.js} +2 -2
- package/esm/{object-keys-4f5bf4e7.js → object-keys-17f3b440.js} +1 -1
- package/esm/{web.timers-0f117224.js → web.timers-c5316125.js} +3 -3
- package/frollo-web-ui.esm.js +1222 -832
- package/index.d.ts +118 -22
- package/package.json +1 -1
- package/types/components/fw-dropdown/fw-dropdown.vue.d.ts +17 -0
- package/types/components/fw-dropdown/index.types.d.ts +1 -0
- package/types/components/fw-provider-list/fw-provider-list.vue.d.ts +68 -0
- package/types/components/fw-provider-list/index.d.ts +2 -0
- package/types/components/fw-provider-list/index.types.d.ts +11 -0
- package/types/components/index.d.ts +1 -0
- package/types/components/index.types.d.ts +1 -0
- package/web-components/index.js +1267 -862
|
@@ -0,0 +1,223 @@
|
|
|
1
|
+
import './es.array.find-67b3b514.js';
|
|
2
|
+
import { defineComponent, toRef, ref, computed, onMounted, onBeforeUnmount, pushScopeId, popScopeId, resolveComponent, openBlock, createElementBlock, toDisplayString, createCommentVNode, createElementVNode, normalizeClass, createVNode, Transition, withCtx, Fragment, renderList } from 'vue';
|
|
3
|
+
import { u as useField } from './vee-validate.esm-a17a23c3.js';
|
|
4
|
+
import { b as render$1 } from './index-04d3cb23.js';
|
|
5
|
+
import './es.function.name-6daefaeb.js';
|
|
6
|
+
import { s as styleInject } from './style-inject.es-1f59c1d0.js';
|
|
7
|
+
|
|
8
|
+
var script = defineComponent({
|
|
9
|
+
name: 'FwDropdown',
|
|
10
|
+
components: {
|
|
11
|
+
ChevronDownSvg: render$1
|
|
12
|
+
},
|
|
13
|
+
props: {
|
|
14
|
+
/**
|
|
15
|
+
* The select v-model
|
|
16
|
+
*/
|
|
17
|
+
modelValue: {
|
|
18
|
+
type: String
|
|
19
|
+
},
|
|
20
|
+
/**
|
|
21
|
+
* The name of the input field. Must be unique per form.
|
|
22
|
+
*/
|
|
23
|
+
name: {
|
|
24
|
+
type: String,
|
|
25
|
+
required: true
|
|
26
|
+
},
|
|
27
|
+
/**
|
|
28
|
+
* Label for the input. Also renders to an aria-label attribute
|
|
29
|
+
*/
|
|
30
|
+
label: {
|
|
31
|
+
type: String
|
|
32
|
+
},
|
|
33
|
+
/**
|
|
34
|
+
* Validation rules. Accepts an object, string schema or validation function.
|
|
35
|
+
*/
|
|
36
|
+
rules: {
|
|
37
|
+
type: [Object, String, Function]
|
|
38
|
+
},
|
|
39
|
+
/**
|
|
40
|
+
* An array of options for the dropdown menu.
|
|
41
|
+
*/
|
|
42
|
+
options: {
|
|
43
|
+
type: Array,
|
|
44
|
+
required: true
|
|
45
|
+
},
|
|
46
|
+
/**
|
|
47
|
+
* The hint text shown below the input
|
|
48
|
+
*/
|
|
49
|
+
hint: {
|
|
50
|
+
type: String
|
|
51
|
+
},
|
|
52
|
+
/**
|
|
53
|
+
* Custom placeholder text
|
|
54
|
+
*/
|
|
55
|
+
placeholder: {
|
|
56
|
+
type: String,
|
|
57
|
+
required: false,
|
|
58
|
+
"default": 'Select'
|
|
59
|
+
},
|
|
60
|
+
/**
|
|
61
|
+
* Enable the error section UI.
|
|
62
|
+
* Defaults to true
|
|
63
|
+
*/
|
|
64
|
+
enableErrors: {
|
|
65
|
+
type: Boolean,
|
|
66
|
+
"default": true
|
|
67
|
+
}
|
|
68
|
+
},
|
|
69
|
+
setup: function setup(props, ctx) {
|
|
70
|
+
var menuButtonClass = "inline-flex w-full justify-between items-center rounded-md border-2 bg-white px-4 py-3\n shadow-sm focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2";
|
|
71
|
+
var menuClass = "absolute left-0 mt-1 w-full text-left z-10 origin-top-left rounded-md bg-grey-20 drop-shadow-lg\n ring-1 ring-black ring-opacity-5 focus:outline-none";
|
|
72
|
+
var menuItemClass = "block px-4 py-3 my-1 cursor-pointer hover:bg-white first:rounded-t-md last:rounded-b-md\n first:mt-0 last:mb-0";
|
|
73
|
+
var nameRef = toRef(props, 'name');
|
|
74
|
+
var _useField = useField(nameRef, props.rules),
|
|
75
|
+
errors = _useField.errors,
|
|
76
|
+
errorMessage = _useField.errorMessage,
|
|
77
|
+
meta = _useField.meta,
|
|
78
|
+
fieldVal = _useField.value;
|
|
79
|
+
var selectedOption = ref();
|
|
80
|
+
var selectValue = computed({
|
|
81
|
+
get: function get() {
|
|
82
|
+
return props.modelValue;
|
|
83
|
+
},
|
|
84
|
+
set: function set(state) {
|
|
85
|
+
fieldVal.value = state;
|
|
86
|
+
ctx.emit('update:modelValue', state);
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
var isOpen = ref(false);
|
|
90
|
+
var selectOption = function selectOption(option) {
|
|
91
|
+
selectValue.value = option.value;
|
|
92
|
+
selectedOption.value = option;
|
|
93
|
+
isOpen.value = false;
|
|
94
|
+
};
|
|
95
|
+
var onEscape = function onEscape(e) {
|
|
96
|
+
if (e.key === 'Esc' || e.key === 'Escape') {
|
|
97
|
+
isOpen.value = false;
|
|
98
|
+
}
|
|
99
|
+
};
|
|
100
|
+
var menuItemActiveClass = function menuItemActiveClass(option) {
|
|
101
|
+
var _selectedOption$value;
|
|
102
|
+
if (((_selectedOption$value = selectedOption.value) === null || _selectedOption$value === void 0 ? void 0 : _selectedOption$value.value) === option.value) {
|
|
103
|
+
return 'bg-white';
|
|
104
|
+
}
|
|
105
|
+
return 'bg-none';
|
|
106
|
+
};
|
|
107
|
+
onMounted(function () {
|
|
108
|
+
if (selectValue.value) {
|
|
109
|
+
selectedOption.value = props.options.find(function (option) {
|
|
110
|
+
return option.value === selectValue.value;
|
|
111
|
+
});
|
|
112
|
+
if (selectedOption.value) selectOption(selectedOption.value);
|
|
113
|
+
}
|
|
114
|
+
document.addEventListener('keydown', onEscape);
|
|
115
|
+
});
|
|
116
|
+
onBeforeUnmount(function () {
|
|
117
|
+
document.removeEventListener('keydown', onEscape);
|
|
118
|
+
});
|
|
119
|
+
return {
|
|
120
|
+
menuButtonClass: menuButtonClass,
|
|
121
|
+
menuClass: menuClass,
|
|
122
|
+
menuItemClass: menuItemClass,
|
|
123
|
+
menuItemActiveClass: menuItemActiveClass,
|
|
124
|
+
errors: errors,
|
|
125
|
+
errorMessage: errorMessage,
|
|
126
|
+
meta: meta,
|
|
127
|
+
fieldVal: fieldVal,
|
|
128
|
+
isOpen: isOpen,
|
|
129
|
+
selectValue: selectValue,
|
|
130
|
+
selectOption: selectOption,
|
|
131
|
+
selectedOption: selectedOption
|
|
132
|
+
};
|
|
133
|
+
}
|
|
134
|
+
});
|
|
135
|
+
|
|
136
|
+
var _withScopeId = function _withScopeId(n) {
|
|
137
|
+
return pushScopeId("data-v-461135b2"), n = n(), popScopeId(), n;
|
|
138
|
+
};
|
|
139
|
+
var _hoisted_1 = {
|
|
140
|
+
"class": "fw-dropdown relative"
|
|
141
|
+
};
|
|
142
|
+
var _hoisted_2 = {
|
|
143
|
+
key: 0,
|
|
144
|
+
"class": "block mb-2 font-medium text-left"
|
|
145
|
+
};
|
|
146
|
+
var _hoisted_3 = ["id", "aria-expanded"];
|
|
147
|
+
var _hoisted_4 = {
|
|
148
|
+
key: 0
|
|
149
|
+
};
|
|
150
|
+
var _hoisted_5 = {
|
|
151
|
+
key: 1,
|
|
152
|
+
"class": "text-grey-base"
|
|
153
|
+
};
|
|
154
|
+
var _hoisted_6 = ["aria-labelledby"];
|
|
155
|
+
var _hoisted_7 = ["onClick"];
|
|
156
|
+
var _hoisted_8 = {
|
|
157
|
+
key: 1,
|
|
158
|
+
"class": "italic text-right text-sm font-medium min-h-[21px]"
|
|
159
|
+
};
|
|
160
|
+
var _hoisted_9 = {
|
|
161
|
+
key: 0,
|
|
162
|
+
"class": "text-error"
|
|
163
|
+
};
|
|
164
|
+
var _hoisted_10 = {
|
|
165
|
+
key: 1
|
|
166
|
+
};
|
|
167
|
+
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
168
|
+
var _ctx$selectedOption, _ctx$selectedOption2;
|
|
169
|
+
var _component_ChevronDownSvg = resolveComponent("ChevronDownSvg");
|
|
170
|
+
return openBlock(), createElementBlock("div", _hoisted_1, [_ctx.label ? (openBlock(), createElementBlock("label", _hoisted_2, toDisplayString(_ctx.label), 1)) : createCommentVNode("", true), createElementVNode("button", {
|
|
171
|
+
type: "button",
|
|
172
|
+
"class": normalizeClass([_ctx.menuButtonClass, _ctx.isOpen ? 'border-primary' : 'border-grey-40 hover:border-grey-60']),
|
|
173
|
+
onClick: _cache[0] || (_cache[0] = function ($event) {
|
|
174
|
+
return _ctx.isOpen = !_ctx.isOpen;
|
|
175
|
+
}),
|
|
176
|
+
id: "".concat(_ctx.name, "-fw-dropdown--button"),
|
|
177
|
+
"aria-expanded": _ctx.isOpen,
|
|
178
|
+
"aria-haspopup": "true"
|
|
179
|
+
}, [(_ctx$selectedOption = _ctx.selectedOption) !== null && _ctx$selectedOption !== void 0 && _ctx$selectedOption.label ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString((_ctx$selectedOption2 = _ctx.selectedOption) === null || _ctx$selectedOption2 === void 0 ? void 0 : _ctx$selectedOption2.label), 1)) : (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(_ctx.placeholder), 1)), createVNode(_component_ChevronDownSvg, {
|
|
180
|
+
"class": normalizeClass(["w-6 text-primary transition-transform duration-300", _ctx.isOpen ? 'rotate-180' : ''])
|
|
181
|
+
}, null, 8, ["class"])], 10, _hoisted_3), createVNode(Transition, {
|
|
182
|
+
name: "slideUpDown"
|
|
183
|
+
}, {
|
|
184
|
+
"default": withCtx(function () {
|
|
185
|
+
return [_ctx.isOpen ? (openBlock(), createElementBlock("ul", {
|
|
186
|
+
key: 0,
|
|
187
|
+
"class": normalizeClass(_ctx.menuClass),
|
|
188
|
+
role: "menu",
|
|
189
|
+
"aria-orientation": "vertical",
|
|
190
|
+
"aria-labelledby": "".concat(_ctx.name, "-fw-dropdown--button"),
|
|
191
|
+
tabindex: "-1"
|
|
192
|
+
}, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, function (option) {
|
|
193
|
+
return openBlock(), createElementBlock("li", {
|
|
194
|
+
key: option.value,
|
|
195
|
+
"class": normalizeClass([_ctx.menuItemClass, _ctx.menuItemActiveClass(option)]),
|
|
196
|
+
role: "menuitem",
|
|
197
|
+
tabindex: "0",
|
|
198
|
+
onClick: function onClick($event) {
|
|
199
|
+
return _ctx.selectOption(option);
|
|
200
|
+
}
|
|
201
|
+
}, toDisplayString(option.label), 11, _hoisted_7);
|
|
202
|
+
}), 128))], 10, _hoisted_6)) : createCommentVNode("", true)];
|
|
203
|
+
}),
|
|
204
|
+
_: 1
|
|
205
|
+
}), _ctx.enableErrors ? (openBlock(), createElementBlock("div", _hoisted_8, [createVNode(Transition, {
|
|
206
|
+
name: "fwFadeIn",
|
|
207
|
+
mode: "out-in"
|
|
208
|
+
}, {
|
|
209
|
+
"default": withCtx(function () {
|
|
210
|
+
return [(_ctx.errorMessage || _ctx.errors[0]) && _ctx.meta.touched ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(_ctx.errorMessage || _ctx.errors[0]), 1)) : _ctx.hint ? (openBlock(), createElementBlock("span", _hoisted_10, toDisplayString(_ctx.hint), 1)) : createCommentVNode("", true)];
|
|
211
|
+
}),
|
|
212
|
+
_: 1
|
|
213
|
+
})])) : createCommentVNode("", true)]);
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
var css_248z = ".slideUpDown-enter-active[data-v-461135b2]{-webkit-animation:slideUpDown-461135b2 .3s;animation:slideUpDown-461135b2 .3s;-webkit-transition:all .3s ease-in;transition:all .3s ease-in}.slideUpDown-leave-active[data-v-461135b2]{animation:slideUpDown-461135b2 .3s reverse;-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out}@-webkit-keyframes slideUpDown-461135b2{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideUpDown-461135b2{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}";
|
|
217
|
+
var stylesheet = ".slideUpDown-enter-active[data-v-461135b2]{-webkit-animation:slideUpDown-461135b2 .3s;animation:slideUpDown-461135b2 .3s;-webkit-transition:all .3s ease-in;transition:all .3s ease-in}.slideUpDown-leave-active[data-v-461135b2]{animation:slideUpDown-461135b2 .3s reverse;-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out}@-webkit-keyframes slideUpDown-461135b2{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideUpDown-461135b2{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}";
|
|
218
|
+
styleInject(css_248z);
|
|
219
|
+
|
|
220
|
+
script.render = render;
|
|
221
|
+
script.__scopeId = "data-v-461135b2";
|
|
222
|
+
|
|
223
|
+
export { script as s };
|
package/esm/fw-dropdown.js
CHANGED
|
@@ -1,223 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import './
|
|
6
|
-
import
|
|
7
|
-
import './
|
|
8
|
-
import './
|
|
9
|
-
import './
|
|
10
|
-
import './
|
|
11
|
-
import '
|
|
12
|
-
import './
|
|
13
|
-
import './
|
|
14
|
-
import './object-keys-4f5bf4e7.js';
|
|
1
|
+
export { s as FwDropdown } from './fw-dropdown-765dbbba.js';
|
|
2
|
+
import './es.array.find-67b3b514.js';
|
|
3
|
+
import './is-forced-fc680e39.js';
|
|
4
|
+
import './classof-ee4b3b5b.js';
|
|
5
|
+
import './export-8a363004.js';
|
|
6
|
+
import './array-iteration-ec356eb3.js';
|
|
7
|
+
import './array-species-create-b125f4a4.js';
|
|
8
|
+
import './add-to-unscopables-31609885.js';
|
|
9
|
+
import './object-create-bc771493.js';
|
|
10
|
+
import './object-keys-17f3b440.js';
|
|
11
|
+
import 'vue';
|
|
12
|
+
import './vee-validate.esm-a17a23c3.js';
|
|
13
|
+
import './index-04d3cb23.js';
|
|
15
14
|
import './check-94a5917a.js';
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
name: 'FwDropdown',
|
|
19
|
-
components: {
|
|
20
|
-
ChevronDownSvg: render$1
|
|
21
|
-
},
|
|
22
|
-
props: {
|
|
23
|
-
/**
|
|
24
|
-
* The select v-model
|
|
25
|
-
*/
|
|
26
|
-
modelValue: {
|
|
27
|
-
type: String
|
|
28
|
-
},
|
|
29
|
-
/**
|
|
30
|
-
* The name of the input field. Must be unique per form.
|
|
31
|
-
*/
|
|
32
|
-
name: {
|
|
33
|
-
type: String,
|
|
34
|
-
required: true
|
|
35
|
-
},
|
|
36
|
-
/**
|
|
37
|
-
* Label for the input. Also renders to an aria-label attribute
|
|
38
|
-
*/
|
|
39
|
-
label: {
|
|
40
|
-
type: String
|
|
41
|
-
},
|
|
42
|
-
/**
|
|
43
|
-
* Validation rules. Accepts an object, string schema or validation function.
|
|
44
|
-
*/
|
|
45
|
-
rules: {
|
|
46
|
-
type: [Object, String, Function]
|
|
47
|
-
},
|
|
48
|
-
/**
|
|
49
|
-
* An array of options for the dropdown menu.
|
|
50
|
-
*/
|
|
51
|
-
options: {
|
|
52
|
-
type: Array,
|
|
53
|
-
required: true
|
|
54
|
-
},
|
|
55
|
-
/**
|
|
56
|
-
* The hint text shown below the input
|
|
57
|
-
*/
|
|
58
|
-
hint: {
|
|
59
|
-
type: String
|
|
60
|
-
},
|
|
61
|
-
/**
|
|
62
|
-
* Custom placeholder text
|
|
63
|
-
*/
|
|
64
|
-
placeholder: {
|
|
65
|
-
type: String,
|
|
66
|
-
required: false,
|
|
67
|
-
"default": 'Select'
|
|
68
|
-
}
|
|
69
|
-
},
|
|
70
|
-
setup: function setup(props, ctx) {
|
|
71
|
-
var menuButtonClass = "inline-flex w-full justify-between items-center rounded-md border-2 bg-white px-4 py-3\n shadow-sm focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2";
|
|
72
|
-
var menuClass = "absolute left-0 mt-1 w-full text-left z-10 origin-top-left rounded-md bg-grey-20 drop-shadow-lg\n ring-1 ring-black ring-opacity-5 focus:outline-none";
|
|
73
|
-
var menuItemClass = "block px-4 py-3 my-1 cursor-pointer hover:bg-white first:rounded-t-md last:rounded-b-md\n first:mt-0 last:mb-0";
|
|
74
|
-
var nameRef = toRef(props, 'name');
|
|
75
|
-
var _useField = useField(nameRef, props.rules),
|
|
76
|
-
errors = _useField.errors,
|
|
77
|
-
errorMessage = _useField.errorMessage,
|
|
78
|
-
meta = _useField.meta,
|
|
79
|
-
fieldVal = _useField.value;
|
|
80
|
-
var selectedOption = ref();
|
|
81
|
-
var selectValue = computed({
|
|
82
|
-
get: function get() {
|
|
83
|
-
return props.modelValue;
|
|
84
|
-
},
|
|
85
|
-
set: function set(state) {
|
|
86
|
-
fieldVal.value = state;
|
|
87
|
-
ctx.emit('update:modelValue', state);
|
|
88
|
-
}
|
|
89
|
-
});
|
|
90
|
-
var isOpen = ref(false);
|
|
91
|
-
var selectOption = function selectOption(option) {
|
|
92
|
-
selectValue.value = option.value;
|
|
93
|
-
selectedOption.value = option;
|
|
94
|
-
isOpen.value = false;
|
|
95
|
-
};
|
|
96
|
-
var onEscape = function onEscape(e) {
|
|
97
|
-
if (e.key === 'Esc' || e.key === 'Escape') {
|
|
98
|
-
isOpen.value = false;
|
|
99
|
-
}
|
|
100
|
-
};
|
|
101
|
-
var menuItemActiveClass = function menuItemActiveClass(option) {
|
|
102
|
-
var _selectedOption$value;
|
|
103
|
-
if (((_selectedOption$value = selectedOption.value) === null || _selectedOption$value === void 0 ? void 0 : _selectedOption$value.value) === option.value) {
|
|
104
|
-
return 'bg-white';
|
|
105
|
-
}
|
|
106
|
-
return 'bg-none';
|
|
107
|
-
};
|
|
108
|
-
onMounted(function () {
|
|
109
|
-
if (selectValue.value) {
|
|
110
|
-
selectedOption.value = props.options.find(function (option) {
|
|
111
|
-
return option.value === selectValue.value;
|
|
112
|
-
});
|
|
113
|
-
if (selectedOption.value) selectOption(selectedOption.value);
|
|
114
|
-
}
|
|
115
|
-
document.addEventListener('keydown', onEscape);
|
|
116
|
-
});
|
|
117
|
-
onBeforeUnmount(function () {
|
|
118
|
-
document.removeEventListener('keydown', onEscape);
|
|
119
|
-
});
|
|
120
|
-
return {
|
|
121
|
-
menuButtonClass: menuButtonClass,
|
|
122
|
-
menuClass: menuClass,
|
|
123
|
-
menuItemClass: menuItemClass,
|
|
124
|
-
menuItemActiveClass: menuItemActiveClass,
|
|
125
|
-
errors: errors,
|
|
126
|
-
errorMessage: errorMessage,
|
|
127
|
-
meta: meta,
|
|
128
|
-
fieldVal: fieldVal,
|
|
129
|
-
isOpen: isOpen,
|
|
130
|
-
selectValue: selectValue,
|
|
131
|
-
selectOption: selectOption,
|
|
132
|
-
selectedOption: selectedOption
|
|
133
|
-
};
|
|
134
|
-
}
|
|
135
|
-
});
|
|
136
|
-
|
|
137
|
-
var _withScopeId = function _withScopeId(n) {
|
|
138
|
-
return pushScopeId("data-v-1467a810"), n = n(), popScopeId(), n;
|
|
139
|
-
};
|
|
140
|
-
var _hoisted_1 = {
|
|
141
|
-
"class": "fw-dropdown relative"
|
|
142
|
-
};
|
|
143
|
-
var _hoisted_2 = {
|
|
144
|
-
key: 0,
|
|
145
|
-
"class": "block mb-2 font-medium text-left"
|
|
146
|
-
};
|
|
147
|
-
var _hoisted_3 = ["id", "aria-expanded"];
|
|
148
|
-
var _hoisted_4 = {
|
|
149
|
-
key: 0
|
|
150
|
-
};
|
|
151
|
-
var _hoisted_5 = {
|
|
152
|
-
key: 1,
|
|
153
|
-
"class": "text-grey-base"
|
|
154
|
-
};
|
|
155
|
-
var _hoisted_6 = ["aria-labelledby"];
|
|
156
|
-
var _hoisted_7 = ["onClick"];
|
|
157
|
-
var _hoisted_8 = {
|
|
158
|
-
"class": "italic text-right text-sm font-medium min-h-[21px]"
|
|
159
|
-
};
|
|
160
|
-
var _hoisted_9 = {
|
|
161
|
-
key: 0,
|
|
162
|
-
"class": "text-error"
|
|
163
|
-
};
|
|
164
|
-
var _hoisted_10 = {
|
|
165
|
-
key: 1
|
|
166
|
-
};
|
|
167
|
-
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
168
|
-
var _ctx$selectedOption, _ctx$selectedOption2;
|
|
169
|
-
var _component_ChevronDownSvg = resolveComponent("ChevronDownSvg");
|
|
170
|
-
return openBlock(), createElementBlock("div", _hoisted_1, [_ctx.label ? (openBlock(), createElementBlock("label", _hoisted_2, toDisplayString(_ctx.label), 1)) : createCommentVNode("", true), createElementVNode("button", {
|
|
171
|
-
type: "button",
|
|
172
|
-
"class": normalizeClass([_ctx.menuButtonClass, _ctx.isOpen ? 'border-primary' : 'border-grey-40 hover:border-grey-60']),
|
|
173
|
-
onClick: _cache[0] || (_cache[0] = function ($event) {
|
|
174
|
-
return _ctx.isOpen = !_ctx.isOpen;
|
|
175
|
-
}),
|
|
176
|
-
id: "".concat(_ctx.name, "-fw-dropdown--button"),
|
|
177
|
-
"aria-expanded": _ctx.isOpen,
|
|
178
|
-
"aria-haspopup": "true"
|
|
179
|
-
}, [(_ctx$selectedOption = _ctx.selectedOption) !== null && _ctx$selectedOption !== void 0 && _ctx$selectedOption.label ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString((_ctx$selectedOption2 = _ctx.selectedOption) === null || _ctx$selectedOption2 === void 0 ? void 0 : _ctx$selectedOption2.label), 1)) : (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(_ctx.placeholder), 1)), createVNode(_component_ChevronDownSvg, {
|
|
180
|
-
"class": normalizeClass(["w-6 text-primary transition-transform duration-300", _ctx.isOpen ? 'rotate-180' : ''])
|
|
181
|
-
}, null, 8, ["class"])], 10, _hoisted_3), createVNode(Transition, {
|
|
182
|
-
name: "slideUpDown"
|
|
183
|
-
}, {
|
|
184
|
-
"default": withCtx(function () {
|
|
185
|
-
return [_ctx.isOpen ? (openBlock(), createElementBlock("ul", {
|
|
186
|
-
key: 0,
|
|
187
|
-
"class": normalizeClass(_ctx.menuClass),
|
|
188
|
-
role: "menu",
|
|
189
|
-
"aria-orientation": "vertical",
|
|
190
|
-
"aria-labelledby": "".concat(_ctx.name, "-fw-dropdown--button"),
|
|
191
|
-
tabindex: "-1"
|
|
192
|
-
}, [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.options, function (option) {
|
|
193
|
-
return openBlock(), createElementBlock("li", {
|
|
194
|
-
key: option.value,
|
|
195
|
-
"class": normalizeClass([_ctx.menuItemClass, _ctx.menuItemActiveClass(option)]),
|
|
196
|
-
role: "menuitem",
|
|
197
|
-
tabindex: "0",
|
|
198
|
-
onClick: function onClick($event) {
|
|
199
|
-
return _ctx.selectOption(option);
|
|
200
|
-
}
|
|
201
|
-
}, toDisplayString(option.label), 11, _hoisted_7);
|
|
202
|
-
}), 128))], 10, _hoisted_6)) : createCommentVNode("", true)];
|
|
203
|
-
}),
|
|
204
|
-
_: 1
|
|
205
|
-
}), createElementVNode("div", _hoisted_8, [createVNode(Transition, {
|
|
206
|
-
name: "fwFadeIn",
|
|
207
|
-
mode: "out-in"
|
|
208
|
-
}, {
|
|
209
|
-
"default": withCtx(function () {
|
|
210
|
-
return [(_ctx.errorMessage || _ctx.errors[0]) && _ctx.meta.touched ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(_ctx.errorMessage || _ctx.errors[0]), 1)) : _ctx.hint ? (openBlock(), createElementBlock("span", _hoisted_10, toDisplayString(_ctx.hint), 1)) : createCommentVNode("", true)];
|
|
211
|
-
}),
|
|
212
|
-
_: 1
|
|
213
|
-
})])]);
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
var css_248z = ".slideUpDown-enter-active[data-v-1467a810]{-webkit-animation:slideUpDown-1467a810 .3s;animation:slideUpDown-1467a810 .3s;-webkit-transition:all .3s ease-in;transition:all .3s ease-in}.slideUpDown-leave-active[data-v-1467a810]{animation:slideUpDown-1467a810 .3s reverse;-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out}@-webkit-keyframes slideUpDown-1467a810{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideUpDown-1467a810{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}";
|
|
217
|
-
var stylesheet = ".slideUpDown-enter-active[data-v-1467a810]{-webkit-animation:slideUpDown-1467a810 .3s;animation:slideUpDown-1467a810 .3s;-webkit-transition:all .3s ease-in;transition:all .3s ease-in}.slideUpDown-leave-active[data-v-1467a810]{animation:slideUpDown-1467a810 .3s reverse;-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out}@-webkit-keyframes slideUpDown-1467a810{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideUpDown-1467a810{0%{opacity:0;-webkit-transform:translate3d(0,-3%,0);transform:translate3d(0,-3%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}";
|
|
218
|
-
styleInject(css_248z);
|
|
219
|
-
|
|
220
|
-
script.render = render;
|
|
221
|
-
script.__scopeId = "data-v-1467a810";
|
|
222
|
-
|
|
223
|
-
export { script as FwDropdown };
|
|
15
|
+
import './es.function.name-6daefaeb.js';
|
|
16
|
+
import './style-inject.es-1f59c1d0.js';
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import './es.array.includes-
|
|
2
|
-
import './es.number.constructor-
|
|
1
|
+
import './es.array.includes-a06445a5.js';
|
|
2
|
+
import './es.number.constructor-98bae04f.js';
|
|
3
3
|
import { defineComponent, computed, ref, resolveComponent, resolveDirective, withDirectives, openBlock, createElementBlock, normalizeClass, withKeys, createElementVNode, createVNode, renderSlot } from 'vue';
|
|
4
|
-
import { a as documentCreateElement$1, g as global$1, c as createNonEnumerableProperty$1 } from './is-forced-
|
|
5
|
-
import { _ as _export } from './export-
|
|
6
|
-
import { a as arrayIteration } from './array-iteration-
|
|
7
|
-
import { a as arrayMethodIsStrict$1 } from './array-method-is-strict-
|
|
8
|
-
import './es.array.find-
|
|
9
|
-
import './es.string.iterator-
|
|
10
|
-
import './web.timers-
|
|
4
|
+
import { a as documentCreateElement$1, g as global$1, c as createNonEnumerableProperty$1 } from './is-forced-fc680e39.js';
|
|
5
|
+
import { _ as _export } from './export-8a363004.js';
|
|
6
|
+
import { a as arrayIteration } from './array-iteration-ec356eb3.js';
|
|
7
|
+
import { a as arrayMethodIsStrict$1 } from './array-method-is-strict-fc2e0d8d.js';
|
|
8
|
+
import './es.array.find-67b3b514.js';
|
|
9
|
+
import './es.string.iterator-0992bb28.js';
|
|
10
|
+
import './web.timers-c5316125.js';
|
|
11
11
|
import { s as script$1 } from './fw-loading-bar-f5ca605c.js';
|
|
12
|
-
import { r as render$1 } from './index-
|
|
12
|
+
import { r as render$1 } from './index-04d3cb23.js';
|
|
13
13
|
import { s as styleInject } from './style-inject.es-1f59c1d0.js';
|
|
14
14
|
|
|
15
15
|
var es_array_forEach = {};
|
package/esm/fw-image.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
export { s as FwImage } from './fw-image-
|
|
2
|
-
import './es.array.includes-
|
|
3
|
-
import './is-forced-
|
|
4
|
-
import './export-
|
|
5
|
-
import './add-to-unscopables-
|
|
6
|
-
import './object-create-
|
|
7
|
-
import './object-keys-
|
|
8
|
-
import './es.number.constructor-
|
|
9
|
-
import './classof-
|
|
1
|
+
export { s as FwImage } from './fw-image-660d3e75.js';
|
|
2
|
+
import './es.array.includes-a06445a5.js';
|
|
3
|
+
import './is-forced-fc680e39.js';
|
|
4
|
+
import './export-8a363004.js';
|
|
5
|
+
import './add-to-unscopables-31609885.js';
|
|
6
|
+
import './object-create-bc771493.js';
|
|
7
|
+
import './object-keys-17f3b440.js';
|
|
8
|
+
import './es.number.constructor-98bae04f.js';
|
|
9
|
+
import './classof-ee4b3b5b.js';
|
|
10
10
|
import 'vue';
|
|
11
|
-
import './array-iteration-
|
|
12
|
-
import './array-species-create-
|
|
13
|
-
import './array-method-is-strict-
|
|
14
|
-
import './es.array.find-
|
|
15
|
-
import './es.string.iterator-
|
|
16
|
-
import './create-property-
|
|
17
|
-
import './web.timers-
|
|
18
|
-
import './function-apply-
|
|
11
|
+
import './array-iteration-ec356eb3.js';
|
|
12
|
+
import './array-species-create-b125f4a4.js';
|
|
13
|
+
import './array-method-is-strict-fc2e0d8d.js';
|
|
14
|
+
import './es.array.find-67b3b514.js';
|
|
15
|
+
import './es.string.iterator-0992bb28.js';
|
|
16
|
+
import './create-property-c70ecc08.js';
|
|
17
|
+
import './web.timers-c5316125.js';
|
|
18
|
+
import './function-apply-b908d7e6.js';
|
|
19
19
|
import './fw-loading-bar-f5ca605c.js';
|
|
20
20
|
import './style-inject.es-1f59c1d0.js';
|
|
21
|
-
import './index-
|
|
21
|
+
import './index-04d3cb23.js';
|
|
22
22
|
import './check-94a5917a.js';
|