@forizi-tecnologia/ui 0.0.2
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/LICENSE +21 -0
- package/README.md +220 -0
- package/dist/chunks/components/buttons-FzIconToolTip-D_cBN1TN.js +53 -0
- package/dist/chunks/components/buttons-FzIconToolTip-D_cBN1TN.js.map +1 -0
- package/dist/chunks/components/inputs-FzEmailField-B07tsUyr.js +86 -0
- package/dist/chunks/components/inputs-FzEmailField-B07tsUyr.js.map +1 -0
- package/dist/chunks/components/inputs-FzFullAddress-e05j6MFg.js +195 -0
- package/dist/chunks/components/inputs-FzFullAddress-e05j6MFg.js.map +1 -0
- package/dist/chunks/components/inputs-FzMoneyField-BxAg9Bd_.js +106 -0
- package/dist/chunks/components/inputs-FzMoneyField-BxAg9Bd_.js.map +1 -0
- package/dist/chunks/components/inputs-FzNumberField-BAPRZpBo.js +107 -0
- package/dist/chunks/components/inputs-FzNumberField-BAPRZpBo.js.map +1 -0
- package/dist/chunks/components/inputs-FzPhoneField-DKMx53pK.js +272 -0
- package/dist/chunks/components/inputs-FzPhoneField-DKMx53pK.js.map +1 -0
- package/dist/chunks/components/inputs-FzZipCodeField-kkCMb3t9.js +102 -0
- package/dist/chunks/components/inputs-FzZipCodeField-kkCMb3t9.js.map +1 -0
- package/dist/chunks/components/layout-FzLoadingOverlay-DbVh5Ncb.js +58 -0
- package/dist/chunks/components/layout-FzLoadingOverlay-DbVh5Ncb.js.map +1 -0
- package/dist/chunks/components/messages-FzConfirmDialog-kcpokBc2.js +18 -0
- package/dist/chunks/components/messages-FzConfirmDialog-kcpokBc2.js.map +1 -0
- package/dist/chunks/components/messages-FzCustomConfirmDialog-CttE2KMh.js +107 -0
- package/dist/chunks/components/messages-FzCustomConfirmDialog-CttE2KMh.js.map +1 -0
- package/dist/chunks/components/messages-FzFloatingNotify-BdlkCu5i.js +96 -0
- package/dist/chunks/components/messages-FzFloatingNotify-BdlkCu5i.js.map +1 -0
- package/dist/chunks/components/modals-FzModalBase-C4wU9yAp.js +131 -0
- package/dist/chunks/components/modals-FzModalBase-C4wU9yAp.js.map +1 -0
- package/dist/chunks/composables/useBreakpoint-DnFIVluv.js +13 -0
- package/dist/chunks/composables/useBreakpoint-DnFIVluv.js.map +1 -0
- package/dist/chunks/composables/useGlobals-AagqYKoP.js +15 -0
- package/dist/chunks/composables/useGlobals-AagqYKoP.js.map +1 -0
- package/dist/chunks/composables/useLoading-Cu1i2QIr.js +20 -0
- package/dist/chunks/composables/useLoading-Cu1i2QIr.js.map +1 -0
- package/dist/chunks/composables/useNumericInput-DGw52-Ds.js +71 -0
- package/dist/chunks/composables/useNumericInput-DGw52-Ds.js.map +1 -0
- package/dist/chunks/index-Bu6SLmX_.js +31 -0
- package/dist/chunks/index-Bu6SLmX_.js.map +1 -0
- package/dist/chunks/utils/api-N1Cju-89.js +26 -0
- package/dist/chunks/utils/api-N1Cju-89.js.map +1 -0
- package/dist/chunks/utils/confirm-DiGEPjua.js +18 -0
- package/dist/chunks/utils/confirm-DiGEPjua.js.map +1 -0
- package/dist/chunks/utils/loading-dXhCGa6R.js +17 -0
- package/dist/chunks/utils/loading-dXhCGa6R.js.map +1 -0
- package/dist/chunks/utils/notify-CE_gbk11.js +65 -0
- package/dist/chunks/utils/notify-CE_gbk11.js.map +1 -0
- package/dist/chunks/utils/types-DV6li0y5.js +6 -0
- package/dist/chunks/utils/types-DV6li0y5.js.map +1 -0
- package/dist/chunks/utils/vuetify-check-DRI6ZYnO.js +21 -0
- package/dist/chunks/utils/vuetify-check-DRI6ZYnO.js.map +1 -0
- package/dist/components/buttons/FzIconToolTip.vue.d.ts +22 -0
- package/dist/components/buttons/FzIconToolTip.vue.d.ts.map +1 -0
- package/dist/components/index.d.ts +13 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/index.js +27 -0
- package/dist/components/index.js.map +1 -0
- package/dist/components/inputs/FzEmailField.vue.d.ts +49 -0
- package/dist/components/inputs/FzEmailField.vue.d.ts.map +1 -0
- package/dist/components/inputs/FzFullAddress.vue.d.ts +40 -0
- package/dist/components/inputs/FzFullAddress.vue.d.ts.map +1 -0
- package/dist/components/inputs/FzMoneyField.vue.d.ts +47 -0
- package/dist/components/inputs/FzMoneyField.vue.d.ts.map +1 -0
- package/dist/components/inputs/FzNumberField.vue.d.ts +49 -0
- package/dist/components/inputs/FzNumberField.vue.d.ts.map +1 -0
- package/dist/components/inputs/FzPhoneField.vue.d.ts +38 -0
- package/dist/components/inputs/FzPhoneField.vue.d.ts.map +1 -0
- package/dist/components/inputs/FzZipCodeField.vue.d.ts +50 -0
- package/dist/components/inputs/FzZipCodeField.vue.d.ts.map +1 -0
- package/dist/components/layout/FzLoadingOverlay.vue.d.ts +13 -0
- package/dist/components/layout/FzLoadingOverlay.vue.d.ts.map +1 -0
- package/dist/components/messages/FzConfirmDialog.vue.d.ts +7 -0
- package/dist/components/messages/FzConfirmDialog.vue.d.ts.map +1 -0
- package/dist/components/messages/FzCustomConfirmDialog.vue.d.ts +7 -0
- package/dist/components/messages/FzCustomConfirmDialog.vue.d.ts.map +1 -0
- package/dist/components/messages/FzFloatingNotify.vue.d.ts +4 -0
- package/dist/components/messages/FzFloatingNotify.vue.d.ts.map +1 -0
- package/dist/components/modals/FzModalBase.vue.d.ts +45 -0
- package/dist/components/modals/FzModalBase.vue.d.ts.map +1 -0
- package/dist/composables/index.d.ts +5 -0
- package/dist/composables/index.d.ts.map +1 -0
- package/dist/composables/index.js +13 -0
- package/dist/composables/index.js.map +1 -0
- package/dist/composables/useBreakpoint.d.ts +5 -0
- package/dist/composables/useBreakpoint.d.ts.map +1 -0
- package/dist/composables/useGlobals.d.ts +9 -0
- package/dist/composables/useGlobals.d.ts.map +1 -0
- package/dist/composables/useLoading.d.ts +7 -0
- package/dist/composables/useLoading.d.ts.map +1 -0
- package/dist/composables/useNumericInput.d.ts +14 -0
- package/dist/composables/useNumericInput.d.ts.map +1 -0
- package/dist/index.d.ts +12 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +94 -0
- package/dist/index.js.map +1 -0
- package/dist/plugins/globals.d.ts +16 -0
- package/dist/plugins/globals.d.ts.map +1 -0
- package/dist/plugins/index.d.ts +2 -0
- package/dist/plugins/index.d.ts.map +1 -0
- package/dist/plugins/index.js +12 -0
- package/dist/plugins/index.js.map +1 -0
- package/dist/ui.css +1 -0
- package/dist/utils/api.d.ts +8 -0
- package/dist/utils/api.d.ts.map +1 -0
- package/dist/utils/confirm.d.ts +15 -0
- package/dist/utils/confirm.d.ts.map +1 -0
- package/dist/utils/index.d.ts +7 -0
- package/dist/utils/index.d.ts.map +1 -0
- package/dist/utils/index.js +25 -0
- package/dist/utils/index.js.map +1 -0
- package/dist/utils/loading.d.ts +12 -0
- package/dist/utils/loading.d.ts.map +1 -0
- package/dist/utils/notify.d.ts +40 -0
- package/dist/utils/notify.d.ts.map +1 -0
- package/dist/utils/types.d.ts +21 -0
- package/dist/utils/types.d.ts.map +1 -0
- package/dist/utils/vuetify-check.d.ts +4 -0
- package/dist/utils/vuetify-check.d.ts.map +1 -0
- package/dist/vuetifyComponents.d.ts +22 -0
- package/dist/vuetifyComponents.d.ts.map +1 -0
- package/package.json +111 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 wallaceSW11
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,220 @@
|
|
|
1
|
+
# @forizi/ui
|
|
2
|
+
|
|
3
|
+
Forizi UI — Vue 3 + TypeScript + Vuetify 3 component library.
|
|
4
|
+
|
|
5
|
+
Reusable components and utilities for Vue 3 projects with Vuetify.
|
|
6
|
+
|
|
7
|
+
> 📚 **Full documentation**: visit the [Storybook](https://forizi.github.io/ui) for interactive examples of every component.
|
|
8
|
+
|
|
9
|
+
## Installation
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
pnpm add @forizi/ui
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Peer dependencies
|
|
16
|
+
|
|
17
|
+
Ensure your project has these installed:
|
|
18
|
+
|
|
19
|
+
```bash
|
|
20
|
+
pnpm add vue vuetify pinia axios maska
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
## Quick Setup
|
|
24
|
+
|
|
25
|
+
```ts
|
|
26
|
+
import { createApp } from 'vue';
|
|
27
|
+
import { createPinia } from 'pinia';
|
|
28
|
+
import { createVuetify } from 'vuetify';
|
|
29
|
+
import { setupLib, requiredVuetifyComponents } from '@forizi/ui';
|
|
30
|
+
import '@forizi/ui/style.css';
|
|
31
|
+
|
|
32
|
+
const app = createApp(App);
|
|
33
|
+
const pinia = createPinia();
|
|
34
|
+
const vuetify = createVuetify({
|
|
35
|
+
components: requiredVuetifyComponents,
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
app.use(pinia); // Must come before setupLib
|
|
39
|
+
app.use(vuetify);
|
|
40
|
+
setupLib(app); // Registers all components + global utilities
|
|
41
|
+
app.mount('#app');
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
### App.vue — Required global components
|
|
45
|
+
|
|
46
|
+
For notifications, confirm dialogs, and loading overlay to work, include these in your `App.vue`:
|
|
47
|
+
|
|
48
|
+
```vue
|
|
49
|
+
<template>
|
|
50
|
+
<v-app>
|
|
51
|
+
<router-view />
|
|
52
|
+
|
|
53
|
+
<!-- Global utilities -->
|
|
54
|
+
<FzFloatingNotify />
|
|
55
|
+
<FzLoadingOverlay />
|
|
56
|
+
<FzConfirmDialog />
|
|
57
|
+
</v-app>
|
|
58
|
+
</template>
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
## Components
|
|
62
|
+
|
|
63
|
+
### Inputs
|
|
64
|
+
|
|
65
|
+
```vue
|
|
66
|
+
<template>
|
|
67
|
+
<FzMoneyField v-model="price" label="Preço" />
|
|
68
|
+
<FzNumberField v-model="quantity" label="Quantidade" :decimal-places="0" />
|
|
69
|
+
<FzEmailField v-model="email" label="E-mail" required />
|
|
70
|
+
<FzPhoneField v-model="phone" label="Telefone" />
|
|
71
|
+
<FzZipCodeField v-model="cep" label="CEP" @zip-code-found="onAddress" />
|
|
72
|
+
<FzFullAddress v-model="address" />
|
|
73
|
+
</template>
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
### Buttons
|
|
77
|
+
|
|
78
|
+
```vue
|
|
79
|
+
<template>
|
|
80
|
+
<FzIconToolTip icon="mdi-pencil" tooltip="Editar" @click="edit" />
|
|
81
|
+
<FzIconToolTip icon="mdi-delete" tooltip="Excluir" disabled disabled-tooltip="Sem permissão" />
|
|
82
|
+
</template>
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
### Modals
|
|
86
|
+
|
|
87
|
+
```vue
|
|
88
|
+
<script setup lang="ts">
|
|
89
|
+
import { ref } from 'vue';
|
|
90
|
+
import { FzModalBase } from '@forizi/ui';
|
|
91
|
+
import type { ModalAction } from '@forizi/ui';
|
|
92
|
+
|
|
93
|
+
const open = ref(false);
|
|
94
|
+
|
|
95
|
+
const actions: ModalAction[] = [
|
|
96
|
+
{ text: 'Salvar', color: 'primary', handler: () => { save(); open.value = false; } },
|
|
97
|
+
{ text: 'Cancelar', color: 'secondary', handler: () => open.value = false },
|
|
98
|
+
];
|
|
99
|
+
</script>
|
|
100
|
+
|
|
101
|
+
<template>
|
|
102
|
+
<FzModalBase v-model="open" title="Editar Produto" :actions="actions">
|
|
103
|
+
<p>Conteúdo do modal</p>
|
|
104
|
+
</FzModalBase>
|
|
105
|
+
</template>
|
|
106
|
+
```
|
|
107
|
+
|
|
108
|
+
### Notifications
|
|
109
|
+
|
|
110
|
+
Notifications appear at the top-right with a colored card, progress bar, and auto-hide.
|
|
111
|
+
Colors follow your Vuetify theme automatically — change `success`/`error` in your theme config
|
|
112
|
+
and the notifications follow.
|
|
113
|
+
|
|
114
|
+
```vue
|
|
115
|
+
<script setup lang="ts">
|
|
116
|
+
import { notify } from '@forizi/ui';
|
|
117
|
+
|
|
118
|
+
notify.success('Salvo', 'Produto salvo com sucesso');
|
|
119
|
+
notify.error('Erro', 'Falha ao salvar produto');
|
|
120
|
+
notify.warning('Atenção', 'Estoque baixo');
|
|
121
|
+
notify.info('Info', 'Produto atualizado');
|
|
122
|
+
</script>
|
|
123
|
+
```
|
|
124
|
+
|
|
125
|
+
**Features:**
|
|
126
|
+
- Decremental progress bar tracking the auto-hide timer
|
|
127
|
+
- Hover the card to **pause** the timer (read at your own pace)
|
|
128
|
+
- Move the mouse away to **resume**
|
|
129
|
+
- Theme-aware: border, title, icon and progress fill use the type color from your Vuetify theme
|
|
130
|
+
|
|
131
|
+
### Confirm Dialog
|
|
132
|
+
|
|
133
|
+
No manual setup required — just place `<FzConfirmDialog />` in `App.vue` and use `confirm.show()`.
|
|
134
|
+
|
|
135
|
+
```vue
|
|
136
|
+
<script setup lang="ts">
|
|
137
|
+
import { confirm } from '@forizi/ui';
|
|
138
|
+
|
|
139
|
+
async function handleDelete() {
|
|
140
|
+
const ok = await confirm.show('Excluir', 'Esta ação não pode ser desfeita.', {
|
|
141
|
+
confirmText: 'Sim, excluir',
|
|
142
|
+
confirmColor: 'error',
|
|
143
|
+
});
|
|
144
|
+
if (ok) deleteItem();
|
|
145
|
+
}
|
|
146
|
+
</script>
|
|
147
|
+
```
|
|
148
|
+
|
|
149
|
+
### Loading Overlay
|
|
150
|
+
|
|
151
|
+
```vue
|
|
152
|
+
<script setup lang="ts">
|
|
153
|
+
import { loading } from '@forizi/ui';
|
|
154
|
+
|
|
155
|
+
loading.show('Salvando...');
|
|
156
|
+
await doSomething();
|
|
157
|
+
loading.hide();
|
|
158
|
+
</script>
|
|
159
|
+
```
|
|
160
|
+
|
|
161
|
+
## Composables
|
|
162
|
+
|
|
163
|
+
```ts
|
|
164
|
+
import { useBreakpoint, useGlobals, useLoading } from '@forizi/ui';
|
|
165
|
+
|
|
166
|
+
// Responsive breakpoints
|
|
167
|
+
const { isMobile, isMobileOrTablet } = useBreakpoint();
|
|
168
|
+
|
|
169
|
+
// Access global utilities inside setup
|
|
170
|
+
const { notify, loading, confirm } = useGlobals();
|
|
171
|
+
|
|
172
|
+
// Local loading state
|
|
173
|
+
const { isActive, message, show, hide } = useLoading();
|
|
174
|
+
```
|
|
175
|
+
|
|
176
|
+
## API (HTTP Client)
|
|
177
|
+
|
|
178
|
+
```ts
|
|
179
|
+
import api, { configureApi } from '@forizi/ui/utils';
|
|
180
|
+
|
|
181
|
+
configureApi({ baseURL: 'https://api.example.com', timeout: 15000 });
|
|
182
|
+
|
|
183
|
+
const response = await api.get('/items');
|
|
184
|
+
```
|
|
185
|
+
|
|
186
|
+
## Package Entry Points
|
|
187
|
+
|
|
188
|
+
```ts
|
|
189
|
+
// Main — all components + composables + utilities
|
|
190
|
+
import { FzMoneyField, useBreakpoint, notify } from '@forizi/ui';
|
|
191
|
+
|
|
192
|
+
// Components only (tree-shakeable)
|
|
193
|
+
import { FzMoneyField } from '@forizi/ui/components';
|
|
194
|
+
|
|
195
|
+
// Composables only
|
|
196
|
+
import { useBreakpoint } from '@forizi/ui/composables';
|
|
197
|
+
|
|
198
|
+
// Utilities only
|
|
199
|
+
import { notify, confirm, loading } from '@forizi/ui/utils';
|
|
200
|
+
|
|
201
|
+
// Plugin (for manual registration)
|
|
202
|
+
import { globalsPlugin } from '@forizi/ui/plugins';
|
|
203
|
+
```
|
|
204
|
+
|
|
205
|
+
## Development
|
|
206
|
+
|
|
207
|
+
```bash
|
|
208
|
+
pnpm dev # watch mode build
|
|
209
|
+
pnpm build # build + type declarations
|
|
210
|
+
pnpm lint # eslint --fix
|
|
211
|
+
pnpm test # vitest run
|
|
212
|
+
pnpm check # lint + test
|
|
213
|
+
pnpm dev:playground # visual test environment
|
|
214
|
+
pnpm storybook # Storybook dev server on port 6006
|
|
215
|
+
pnpm build:storybook # static Storybook build → storybook-static/
|
|
216
|
+
```
|
|
217
|
+
|
|
218
|
+
## License
|
|
219
|
+
|
|
220
|
+
MIT
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { defineComponent as x, computed as a, resolveComponent as l, createBlock as i, openBlock as n, withCtx as B, createElementVNode as C, mergeProps as T, normalizeClass as y } from "vue";
|
|
2
|
+
const z = /* @__PURE__ */ x({
|
|
3
|
+
__name: "FzIconToolTip",
|
|
4
|
+
props: {
|
|
5
|
+
icon: {},
|
|
6
|
+
tooltip: { default: void 0 },
|
|
7
|
+
color: { default: "primary" },
|
|
8
|
+
asButton: { type: Boolean, default: !1 },
|
|
9
|
+
disabled: { type: Boolean, default: !1 },
|
|
10
|
+
disabledTooltip: { default: void 0 }
|
|
11
|
+
},
|
|
12
|
+
emits: ["click"],
|
|
13
|
+
setup(o, { emit: d }) {
|
|
14
|
+
const t = o, s = d, r = a(() => t.disabled ? !!t.disabledTooltip : !!t.tooltip), u = a(() => t.disabled ? t.disabledTooltip ?? "" : t.tooltip ?? "");
|
|
15
|
+
function m(e) {
|
|
16
|
+
t.disabled || s("click", e);
|
|
17
|
+
}
|
|
18
|
+
return (e, c) => {
|
|
19
|
+
const p = l("v-btn"), b = l("v-icon"), f = l("v-tooltip");
|
|
20
|
+
return n(), i(f, {
|
|
21
|
+
text: u.value,
|
|
22
|
+
location: "top",
|
|
23
|
+
disabled: !r.value
|
|
24
|
+
}, {
|
|
25
|
+
activator: B(({ props: v }) => [
|
|
26
|
+
C("span", T(v, {
|
|
27
|
+
class: ["d-inline-flex", { "opacity-50": o.disabled && !o.asButton }]
|
|
28
|
+
}), [
|
|
29
|
+
o.asButton ? (n(), i(p, {
|
|
30
|
+
key: 0,
|
|
31
|
+
icon: o.icon,
|
|
32
|
+
color: o.color,
|
|
33
|
+
variant: "text",
|
|
34
|
+
disabled: o.disabled,
|
|
35
|
+
onClick: c[0] || (c[0] = (k) => e.$emit("click", k))
|
|
36
|
+
}, null, 8, ["icon", "color", "disabled"])) : (n(), i(b, {
|
|
37
|
+
key: 1,
|
|
38
|
+
icon: o.icon,
|
|
39
|
+
color: o.color,
|
|
40
|
+
class: y({ "cursor-pointer": !o.disabled }),
|
|
41
|
+
onClick: m
|
|
42
|
+
}, null, 8, ["icon", "color", "class"]))
|
|
43
|
+
], 16)
|
|
44
|
+
]),
|
|
45
|
+
_: 1
|
|
46
|
+
}, 8, ["text", "disabled"]);
|
|
47
|
+
};
|
|
48
|
+
}
|
|
49
|
+
});
|
|
50
|
+
export {
|
|
51
|
+
z as _
|
|
52
|
+
};
|
|
53
|
+
//# sourceMappingURL=buttons-FzIconToolTip-D_cBN1TN.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"buttons-FzIconToolTip-D_cBN1TN.js","sources":["../../../src/components/buttons/FzIconToolTip.vue"],"sourcesContent":["<template>\n <v-tooltip :text=\"tooltipText\" location=\"top\" :disabled=\"!hasTooltip\">\n <template #activator=\"{ props: tooltipProps }\">\n <span v-bind=\"tooltipProps\" class=\"d-inline-flex\" :class=\"{ 'opacity-50': disabled && !asButton }\">\n <v-btn\n v-if=\"asButton\"\n :icon=\"icon\"\n :color=\"color\"\n variant=\"text\"\n :disabled=\"disabled\"\n @click=\"(e: MouseEvent) => $emit('click', e)\"\n />\n <v-icon\n v-else\n :icon=\"icon\"\n :color=\"color\"\n :class=\"{ 'cursor-pointer': !disabled }\"\n @click=\"handleIconClick\"\n />\n </span>\n </template>\n </v-tooltip>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\n\ninterface Props {\n icon: string;\n tooltip?: string;\n color?: string;\n asButton?: boolean;\n disabled?: boolean;\n disabledTooltip?: string;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n tooltip: undefined,\n color: 'primary',\n asButton: false,\n disabled: false,\n disabledTooltip: undefined,\n});\n\nconst emit = defineEmits<{\n (e: 'click', event: MouseEvent): void;\n}>();\n\nconst hasTooltip = computed(() => {\n if (props.disabled) return !!props.disabledTooltip;\n\n return !!props.tooltip;\n});\n\nconst tooltipText = computed(() => {\n if (props.disabled) return props.disabledTooltip ?? '';\n\n return props.tooltip ?? '';\n});\n\nfunction handleIconClick(e: MouseEvent) {\n if (props.disabled) return;\n\n emit('click', e);\n}\n</script>\n"],"names":["props","__props","emit","__emit","hasTooltip","computed","tooltipText","handleIconClick","_createBlock","_component_v_tooltip","_withCtx","tooltipProps","_createElementVNode","_mergeProps","_component_v_btn","_cache","e","$emit","_component_v_icon"],"mappings":";;;;;;;;;;;;;AAoCA,UAAMA,IAAQC,GAQRC,IAAOC,GAIPC,IAAaC,EAAS,MACtBL,EAAM,WAAiB,CAAC,CAACA,EAAM,kBAE5B,CAAC,CAACA,EAAM,OAChB,GAEKM,IAAcD,EAAS,MACvBL,EAAM,WAAiBA,EAAM,mBAAmB,KAE7CA,EAAM,WAAW,EACzB;AAED,aAASO,EAAgB,GAAe;AACtC,MAAIP,EAAM,YAEVE,EAAK,SAAS,CAAC;AAAA,IACjB;;;kBA/DEM,EAoBYC,GAAA;AAAA,QApBA,MAAMH,EAAA;AAAA,QAAa,UAAS;AAAA,QAAO,WAAWF,EAAA;AAAA,MAAA;QAC7C,WAASM,EAClB,CAgBO,EAAA,OAjBsBC,QAAY;AAAA,UACzCC,EAgBO,QAhBPC,EAgBOF,GAhBmB;AAAA,YAAE,OAAK,CAAC,iBAAe,EAAA,cAAyBV,EAAA,aAAaA,EAAA,SAAA,CAAQ;AAAA,UAAA;YAErFA,EAAA,iBADRO,EAOEM,GAAA;AAAA;cALC,MAAMb,EAAA;AAAA,cACN,OAAOA,EAAA;AAAA,cACR,SAAQ;AAAA,cACP,UAAUA,EAAA;AAAA,cACV,SAAKc,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,MAAkBC,EAAAA,eAAeD,CAAC;AAAA,YAAA,oDAE7CR,EAMEU,GAAA;AAAA;cAJC,MAAMjB,EAAA;AAAA,cACN,OAAOA,EAAA;AAAA,cACP,8BAA4BA,EAAA,UAAQ;AAAA,cACpC,SAAOM;AAAA,YAAA;;;;;;;;"}
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { defineComponent as k, ref as x, computed as t, resolveComponent as m, createBlock as $, openBlock as z, createSlots as C, withCtx as o, renderSlot as c, createVNode as E, createTextVNode as M, toDisplayString as A } from "vue";
|
|
2
|
+
const O = /* @__PURE__ */ k({
|
|
3
|
+
__name: "FzEmailField",
|
|
4
|
+
props: {
|
|
5
|
+
modelValue: { default: "" },
|
|
6
|
+
label: { default: "Email" },
|
|
7
|
+
rules: { default: () => [] },
|
|
8
|
+
disabled: { type: Boolean, default: !1 },
|
|
9
|
+
hint: { default: "" },
|
|
10
|
+
required: { type: Boolean, default: !1 },
|
|
11
|
+
validateOnBlur: { type: Boolean, default: !0 },
|
|
12
|
+
requiredMessage: { default: "" },
|
|
13
|
+
invalidMessage: { default: "" },
|
|
14
|
+
variant: { default: "underlined" },
|
|
15
|
+
maxlength: { default: 100 }
|
|
16
|
+
},
|
|
17
|
+
emits: ["update:modelValue", "isValid"],
|
|
18
|
+
setup(a, { emit: f }) {
|
|
19
|
+
const l = a, r = f, v = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/, n = x(!1), p = t(() => !!l.hint), h = t(() => n.value ? "mdi-email-check" : "mdi-email-outline"), V = t(() => n.value ? "success" : void 0), d = t({
|
|
20
|
+
get: () => l.modelValue,
|
|
21
|
+
set: (e) => {
|
|
22
|
+
l.validateOnBlur || s(e), r("update:modelValue", e);
|
|
23
|
+
}
|
|
24
|
+
}), g = t(() => [u, ...l.rules]);
|
|
25
|
+
function u(e) {
|
|
26
|
+
return e ? v.test(e) ? !0 : l.invalidMessage || "Formato de e-mail inválido" : l.required ? l.requiredMessage || "Email é obrigatório" : !0;
|
|
27
|
+
}
|
|
28
|
+
function s(e) {
|
|
29
|
+
const i = u(e);
|
|
30
|
+
n.value = i === !0, r("isValid", n.value);
|
|
31
|
+
}
|
|
32
|
+
function B() {
|
|
33
|
+
l.validateOnBlur && s(d.value);
|
|
34
|
+
}
|
|
35
|
+
return (e, i) => {
|
|
36
|
+
const b = m("v-icon"), y = m("v-text-field");
|
|
37
|
+
return z(), $(y, {
|
|
38
|
+
modelValue: d.value,
|
|
39
|
+
"onUpdate:modelValue": i[0] || (i[0] = (q) => d.value = q),
|
|
40
|
+
label: a.label,
|
|
41
|
+
rules: g.value,
|
|
42
|
+
disabled: a.disabled,
|
|
43
|
+
hint: a.hint,
|
|
44
|
+
"persistent-hint": p.value,
|
|
45
|
+
required: a.required,
|
|
46
|
+
variant: a.variant,
|
|
47
|
+
maxlength: a.maxlength,
|
|
48
|
+
type: "email",
|
|
49
|
+
inputmode: "email",
|
|
50
|
+
autocomplete: "email",
|
|
51
|
+
onBlur: B
|
|
52
|
+
}, C({ _: 2 }, [
|
|
53
|
+
e.$slots.prepend ? {
|
|
54
|
+
name: "prepend",
|
|
55
|
+
fn: o(() => [
|
|
56
|
+
c(e.$slots, "prepend")
|
|
57
|
+
]),
|
|
58
|
+
key: "0"
|
|
59
|
+
} : void 0,
|
|
60
|
+
e.$slots.append ? {
|
|
61
|
+
name: "append",
|
|
62
|
+
fn: o(() => [
|
|
63
|
+
c(e.$slots, "append")
|
|
64
|
+
]),
|
|
65
|
+
key: "1"
|
|
66
|
+
} : void 0,
|
|
67
|
+
e.$slots.prepend ? void 0 : {
|
|
68
|
+
name: "prepend-inner",
|
|
69
|
+
fn: o(() => [
|
|
70
|
+
E(b, { color: V.value }, {
|
|
71
|
+
default: o(() => [
|
|
72
|
+
M(A(h.value), 1)
|
|
73
|
+
]),
|
|
74
|
+
_: 1
|
|
75
|
+
}, 8, ["color"])
|
|
76
|
+
]),
|
|
77
|
+
key: "2"
|
|
78
|
+
}
|
|
79
|
+
]), 1032, ["modelValue", "label", "rules", "disabled", "hint", "persistent-hint", "required", "variant", "maxlength"]);
|
|
80
|
+
};
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
export {
|
|
84
|
+
O as _
|
|
85
|
+
};
|
|
86
|
+
//# sourceMappingURL=inputs-FzEmailField-B07tsUyr.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"inputs-FzEmailField-B07tsUyr.js","sources":["../../../src/components/inputs/FzEmailField.vue"],"sourcesContent":["<template>\n <v-text-field\n v-model=\"innerValue\"\n :label=\"label\"\n :rules=\"mergedRules\"\n :disabled=\"disabled\"\n :hint=\"hint\"\n :persistent-hint=\"hasHint\"\n :required=\"required\"\n :variant=\"variant\"\n :maxlength=\"maxlength\"\n type=\"email\"\n inputmode=\"email\"\n autocomplete=\"email\"\n @blur=\"handleBlur\"\n >\n <template v-if=\"$slots.prepend\" #prepend>\n <slot name=\"prepend\" />\n </template>\n <template v-if=\"$slots.append\" #append>\n <slot name=\"append\" />\n </template>\n <template v-if=\"!$slots.prepend\" #prepend-inner>\n <v-icon :color=\"iconColor\">\n {{ emailIcon }}\n </v-icon>\n </template>\n </v-text-field>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed } from 'vue';\nimport type { TextFieldVariant } from '@/utils/types';\n\ntype ValidationRule = (value: string) => boolean | string;\n\ninterface Props {\n modelValue?: string\n label?: string\n rules?: ValidationRule[]\n disabled?: boolean\n hint?: string\n required?: boolean\n validateOnBlur?: boolean\n requiredMessage?: string\n invalidMessage?: string\n variant?: TextFieldVariant\n maxlength?: number\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n modelValue: '',\n label: 'Email',\n rules: () => [],\n disabled: false,\n hint: '',\n required: false,\n validateOnBlur: true,\n requiredMessage: '',\n invalidMessage: '',\n variant: 'underlined',\n maxlength: 100,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string]\n isValid: [value: boolean]\n}>();\n\nconst emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$/;\n\nconst isValid = ref(false);\n\nconst hasHint = computed(() => !!props.hint);\n\nconst emailIcon = computed(() => isValid.value ? 'mdi-email-check' : 'mdi-email-outline');\n\nconst iconColor = computed(() => isValid.value ? 'success' : undefined);\n\nconst innerValue = computed({\n get: () => props.modelValue,\n set: (val: string) => {\n if (!props.validateOnBlur) resolveValidation(val);\n\n emit('update:modelValue', val);\n },\n});\n\nconst mergedRules = computed(() => [validateEmail, ...props.rules]);\n\nfunction validateEmail(value: string): boolean | string {\n if (!value) return props.required ? (props.requiredMessage || 'Email é obrigatório') : true;\n\n if (!emailRegex.test(value)) return props.invalidMessage || 'Formato de e-mail inválido';\n\n return true;\n}\n\nfunction resolveValidation(value: string) {\n const result = validateEmail(value);\n isValid.value = result === true;\n emit('isValid', isValid.value);\n}\n\nfunction handleBlur() {\n if (!props.validateOnBlur) return;\n\n resolveValidation(innerValue.value);\n}\n</script>\n"],"names":["props","__props","emit","__emit","emailRegex","isValid","ref","hasHint","computed","emailIcon","iconColor","innerValue","val","resolveValidation","mergedRules","validateEmail","value","result","handleBlur","_createBlock","_component_v_text_field","$event","$slots","_renderSlot","_ctx","_createVNode","_component_v_icon"],"mappings":";;;;;;;;;;;;;;;;;;AAkDA,UAAMA,IAAQC,GAcRC,IAAOC,GAKPC,IAAa,oDAEbC,IAAUC,EAAI,EAAK,GAEnBC,IAAUC,EAAS,MAAM,CAAC,CAACR,EAAM,IAAI,GAErCS,IAAYD,EAAS,MAAMH,EAAQ,QAAQ,oBAAoB,mBAAmB,GAElFK,IAAYF,EAAS,MAAMH,EAAQ,QAAQ,YAAY,MAAS,GAEhEM,IAAaH,EAAS;AAAA,MAC1B,KAAK,MAAMR,EAAM;AAAA,MACjB,KAAK,CAACY,MAAgB;AACpB,QAAKZ,EAAM,kBAAgBa,EAAkBD,CAAG,GAEhDV,EAAK,qBAAqBU,CAAG;AAAA,MAC/B;AAAA,IAAA,CACD,GAEKE,IAAcN,EAAS,MAAM,CAACO,GAAe,GAAGf,EAAM,KAAK,CAAC;AAElE,aAASe,EAAcC,GAAiC;AACtD,aAAKA,IAEAZ,EAAW,KAAKY,CAAK,IAEnB,KAF6BhB,EAAM,kBAAkB,+BAFzCA,EAAM,WAAYA,EAAM,mBAAmB,wBAAyB;AAAA,IAKzF;AAEA,aAASa,EAAkBG,GAAe;AACxC,YAAMC,IAASF,EAAcC,CAAK;AAClC,MAAAX,EAAQ,QAAQY,MAAW,IAC3Bf,EAAK,WAAWG,EAAQ,KAAK;AAAA,IAC/B;AAEA,aAASa,IAAa;AACpB,MAAKlB,EAAM,kBAEXa,EAAkBF,EAAW,KAAK;AAAA,IACpC;;;kBA3GEQ,EA0BeC,GAAA;AAAA,oBAzBJT,EAAA;AAAA,sDAAAA,EAAU,QAAAU;AAAA,QAClB,OAAOpB,EAAA;AAAA,QACP,OAAOa,EAAA;AAAA,QACP,UAAUb,EAAA;AAAA,QACV,MAAMA,EAAA;AAAA,QACN,mBAAiBM,EAAA;AAAA,QACjB,UAAUN,EAAA;AAAA,QACV,SAASA,EAAA;AAAA,QACT,WAAWA,EAAA;AAAA,QACZ,MAAK;AAAA,QACL,WAAU;AAAA,QACV,cAAa;AAAA,QACZ,QAAMiB;AAAA,MAAA;QAESI,EAAAA,OAAO;gBAAU;AAAA,gBAC/B,MAAuB;AAAA,YAAvBC,EAAuBC,EAAA,QAAA,SAAA;AAAA,UAAA;;;QAETF,EAAAA,OAAO;gBAAS;AAAA,gBAC9B,MAAsB;AAAA,YAAtBC,EAAsBC,EAAA,QAAA,QAAA;AAAA,UAAA;;;QAEPF,EAAAA,OAAO;gBAAU;AAAA,gBAChC,MAES;AAAA,YAFTG,EAESC,GAAA,EAFA,OAAOhB,EAAA,SAAS;AAAA,yBACvB,MAAe;AAAA,oBAAZD,EAAA,KAAS,GAAA,CAAA;AAAA,cAAA;;;;;;;;;;"}
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
import { defineComponent as g, reactive as E, ref as y, computed as c, watch as p, nextTick as B, resolveComponent as b, createBlock as F, openBlock as G, withCtx as u, createVNode as l } from "vue";
|
|
2
|
+
import { _ as z } from "./inputs-FzZipCodeField-kkCMb3t9.js";
|
|
3
|
+
const U = /* @__PURE__ */ g({
|
|
4
|
+
__name: "FzFullAddress",
|
|
5
|
+
props: {
|
|
6
|
+
modelValue: { default: () => ({}) },
|
|
7
|
+
disabled: { type: Boolean, default: !1 },
|
|
8
|
+
disabledFields: { type: Boolean, default: !1 },
|
|
9
|
+
labels: { default: () => ({}) },
|
|
10
|
+
variant: { default: "underlined" }
|
|
11
|
+
},
|
|
12
|
+
emits: ["update:modelValue"],
|
|
13
|
+
setup(n, { emit: V }) {
|
|
14
|
+
const o = n, C = V;
|
|
15
|
+
let f = !1;
|
|
16
|
+
const P = [
|
|
17
|
+
{ uf: "AC", name: "AC - Acre" },
|
|
18
|
+
{ uf: "AL", name: "AL - Alagoas" },
|
|
19
|
+
{ uf: "AP", name: "AP - Amapá" },
|
|
20
|
+
{ uf: "AM", name: "AM - Amazonas" },
|
|
21
|
+
{ uf: "BA", name: "BA - Bahia" },
|
|
22
|
+
{ uf: "CE", name: "CE - Ceará" },
|
|
23
|
+
{ uf: "DF", name: "DF - Distrito Federal" },
|
|
24
|
+
{ uf: "ES", name: "ES - Espírito Santo" },
|
|
25
|
+
{ uf: "GO", name: "GO - Goiás" },
|
|
26
|
+
{ uf: "MA", name: "MA - Maranhão" },
|
|
27
|
+
{ uf: "MT", name: "MT - Mato Grosso" },
|
|
28
|
+
{ uf: "MS", name: "MS - Mato Grosso do Sul" },
|
|
29
|
+
{ uf: "MG", name: "MG - Minas Gerais" },
|
|
30
|
+
{ uf: "PA", name: "PA - Pará" },
|
|
31
|
+
{ uf: "PB", name: "PB - Paraíba" },
|
|
32
|
+
{ uf: "PR", name: "PR - Paraná" },
|
|
33
|
+
{ uf: "PE", name: "PE - Pernambuco" },
|
|
34
|
+
{ uf: "PI", name: "PI - Piauí" },
|
|
35
|
+
{ uf: "RJ", name: "RJ - Rio de Janeiro" },
|
|
36
|
+
{ uf: "RN", name: "RN - Rio Grande do Norte" },
|
|
37
|
+
{ uf: "RS", name: "RS - Rio Grande do Sul" },
|
|
38
|
+
{ uf: "RO", name: "RO - Rondônia" },
|
|
39
|
+
{ uf: "RR", name: "RR - Roraima" },
|
|
40
|
+
{ uf: "SC", name: "SC - Santa Catarina" },
|
|
41
|
+
{ uf: "SP", name: "SP - São Paulo" },
|
|
42
|
+
{ uf: "SE", name: "SE - Sergipe" },
|
|
43
|
+
{ uf: "TO", name: "TO - Tocantins" }
|
|
44
|
+
], e = E({
|
|
45
|
+
zipCode: "",
|
|
46
|
+
street: "",
|
|
47
|
+
number: "",
|
|
48
|
+
complement: "",
|
|
49
|
+
neighborhood: "",
|
|
50
|
+
city: "",
|
|
51
|
+
state: "",
|
|
52
|
+
...o.modelValue
|
|
53
|
+
}), v = y(!1), m = c(() => ({
|
|
54
|
+
zipCode: o.labels.zipCode ?? "CEP",
|
|
55
|
+
street: o.labels.street ?? "Logradouro",
|
|
56
|
+
number: o.labels.number ?? "Número",
|
|
57
|
+
complement: o.labels.complement ?? "Complemento",
|
|
58
|
+
neighborhood: o.labels.neighborhood ?? "Bairro",
|
|
59
|
+
city: o.labels.city ?? "Cidade",
|
|
60
|
+
state: o.labels.state ?? "Estado"
|
|
61
|
+
})), r = c(() => o.disabled || o.disabledFields && v.value);
|
|
62
|
+
function A(d) {
|
|
63
|
+
e.street = d.street, e.neighborhood = d.neighborhood, e.city = d.city, e.state = d.state, v.value = !0;
|
|
64
|
+
}
|
|
65
|
+
function R() {
|
|
66
|
+
v.value = !1;
|
|
67
|
+
}
|
|
68
|
+
return p(() => o.modelValue, (d) => {
|
|
69
|
+
d && (f = !0, Object.assign(e, d), B(() => {
|
|
70
|
+
f = !1;
|
|
71
|
+
}));
|
|
72
|
+
}, { deep: !0, immediate: !0 }), p(e, (d) => {
|
|
73
|
+
f || C("update:modelValue", { ...d });
|
|
74
|
+
}, { deep: !0 }), (d, a) => {
|
|
75
|
+
const i = b("v-col"), s = b("v-text-field"), S = b("v-select"), M = b("v-row");
|
|
76
|
+
return G(), F(M, null, {
|
|
77
|
+
default: u(() => [
|
|
78
|
+
l(i, {
|
|
79
|
+
cols: "12",
|
|
80
|
+
md: "4"
|
|
81
|
+
}, {
|
|
82
|
+
default: u(() => [
|
|
83
|
+
l(z, {
|
|
84
|
+
modelValue: e.zipCode,
|
|
85
|
+
"onUpdate:modelValue": a[0] || (a[0] = (t) => e.zipCode = t),
|
|
86
|
+
disabled: n.disabled,
|
|
87
|
+
onZipCodeFound: A,
|
|
88
|
+
onZipCodeNotFound: R
|
|
89
|
+
}, null, 8, ["modelValue", "disabled"])
|
|
90
|
+
]),
|
|
91
|
+
_: 1
|
|
92
|
+
}),
|
|
93
|
+
l(i, {
|
|
94
|
+
cols: "12",
|
|
95
|
+
md: "8"
|
|
96
|
+
}, {
|
|
97
|
+
default: u(() => [
|
|
98
|
+
l(s, {
|
|
99
|
+
modelValue: e.street,
|
|
100
|
+
"onUpdate:modelValue": a[1] || (a[1] = (t) => e.street = t),
|
|
101
|
+
label: m.value.street,
|
|
102
|
+
disabled: r.value,
|
|
103
|
+
variant: n.variant
|
|
104
|
+
}, null, 8, ["modelValue", "label", "disabled", "variant"])
|
|
105
|
+
]),
|
|
106
|
+
_: 1
|
|
107
|
+
}),
|
|
108
|
+
l(i, {
|
|
109
|
+
cols: "12",
|
|
110
|
+
md: "3"
|
|
111
|
+
}, {
|
|
112
|
+
default: u(() => [
|
|
113
|
+
l(s, {
|
|
114
|
+
modelValue: e.number,
|
|
115
|
+
"onUpdate:modelValue": a[2] || (a[2] = (t) => e.number = t),
|
|
116
|
+
label: m.value.number,
|
|
117
|
+
disabled: n.disabled,
|
|
118
|
+
variant: n.variant
|
|
119
|
+
}, null, 8, ["modelValue", "label", "disabled", "variant"])
|
|
120
|
+
]),
|
|
121
|
+
_: 1
|
|
122
|
+
}),
|
|
123
|
+
l(i, {
|
|
124
|
+
cols: "12",
|
|
125
|
+
md: "5"
|
|
126
|
+
}, {
|
|
127
|
+
default: u(() => [
|
|
128
|
+
l(s, {
|
|
129
|
+
modelValue: e.complement,
|
|
130
|
+
"onUpdate:modelValue": a[3] || (a[3] = (t) => e.complement = t),
|
|
131
|
+
label: m.value.complement,
|
|
132
|
+
disabled: n.disabled,
|
|
133
|
+
variant: n.variant
|
|
134
|
+
}, null, 8, ["modelValue", "label", "disabled", "variant"])
|
|
135
|
+
]),
|
|
136
|
+
_: 1
|
|
137
|
+
}),
|
|
138
|
+
l(i, {
|
|
139
|
+
cols: "12",
|
|
140
|
+
md: "4"
|
|
141
|
+
}, {
|
|
142
|
+
default: u(() => [
|
|
143
|
+
l(s, {
|
|
144
|
+
modelValue: e.neighborhood,
|
|
145
|
+
"onUpdate:modelValue": a[4] || (a[4] = (t) => e.neighborhood = t),
|
|
146
|
+
label: m.value.neighborhood,
|
|
147
|
+
disabled: r.value,
|
|
148
|
+
variant: n.variant
|
|
149
|
+
}, null, 8, ["modelValue", "label", "disabled", "variant"])
|
|
150
|
+
]),
|
|
151
|
+
_: 1
|
|
152
|
+
}),
|
|
153
|
+
l(i, {
|
|
154
|
+
cols: "12",
|
|
155
|
+
md: "6"
|
|
156
|
+
}, {
|
|
157
|
+
default: u(() => [
|
|
158
|
+
l(s, {
|
|
159
|
+
modelValue: e.city,
|
|
160
|
+
"onUpdate:modelValue": a[5] || (a[5] = (t) => e.city = t),
|
|
161
|
+
label: m.value.city,
|
|
162
|
+
disabled: r.value,
|
|
163
|
+
variant: n.variant
|
|
164
|
+
}, null, 8, ["modelValue", "label", "disabled", "variant"])
|
|
165
|
+
]),
|
|
166
|
+
_: 1
|
|
167
|
+
}),
|
|
168
|
+
l(i, {
|
|
169
|
+
cols: "12",
|
|
170
|
+
md: "6"
|
|
171
|
+
}, {
|
|
172
|
+
default: u(() => [
|
|
173
|
+
l(S, {
|
|
174
|
+
modelValue: e.state,
|
|
175
|
+
"onUpdate:modelValue": a[6] || (a[6] = (t) => e.state = t),
|
|
176
|
+
label: m.value.state,
|
|
177
|
+
items: P,
|
|
178
|
+
"item-title": "name",
|
|
179
|
+
"item-value": "uf",
|
|
180
|
+
disabled: r.value,
|
|
181
|
+
variant: n.variant
|
|
182
|
+
}, null, 8, ["modelValue", "label", "disabled", "variant"])
|
|
183
|
+
]),
|
|
184
|
+
_: 1
|
|
185
|
+
})
|
|
186
|
+
]),
|
|
187
|
+
_: 1
|
|
188
|
+
});
|
|
189
|
+
};
|
|
190
|
+
}
|
|
191
|
+
});
|
|
192
|
+
export {
|
|
193
|
+
U as _
|
|
194
|
+
};
|
|
195
|
+
//# sourceMappingURL=inputs-FzFullAddress-e05j6MFg.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"inputs-FzFullAddress-e05j6MFg.js","sources":["../../../src/components/inputs/FzFullAddress.vue"],"sourcesContent":["<template>\n <v-row>\n <v-col cols=\"12\" md=\"4\">\n <FzZipCodeField\n v-model=\"internal.zipCode\"\n :disabled=\"disabled\"\n @zip-code-found=\"onZipCodeFound\"\n @zip-code-not-found=\"onZipCodeNotFound\"\n />\n </v-col>\n\n <v-col cols=\"12\" md=\"8\">\n <v-text-field\n v-model=\"internal.street\"\n :label=\"labels.street\"\n :disabled=\"isAutoDisabled\"\n :variant=\"variant\"\n />\n </v-col>\n\n <v-col cols=\"12\" md=\"3\">\n <v-text-field v-model=\"internal.number\" :label=\"labels.number\" :disabled=\"disabled\" :variant=\"variant\" />\n </v-col>\n\n <v-col cols=\"12\" md=\"5\">\n <v-text-field v-model=\"internal.complement\" :label=\"labels.complement\" :disabled=\"disabled\" :variant=\"variant\" />\n </v-col>\n\n <v-col cols=\"12\" md=\"4\">\n <v-text-field\n v-model=\"internal.neighborhood\"\n :label=\"labels.neighborhood\"\n :disabled=\"isAutoDisabled\"\n :variant=\"variant\"\n />\n </v-col>\n\n <v-col cols=\"12\" md=\"6\">\n <v-text-field\n v-model=\"internal.city\"\n :label=\"labels.city\"\n :disabled=\"isAutoDisabled\"\n :variant=\"variant\"\n />\n </v-col>\n\n <v-col cols=\"12\" md=\"6\">\n <v-select\n v-model=\"internal.state\"\n :label=\"labels.state\"\n :items=\"brazilianStates\"\n item-title=\"name\"\n item-value=\"uf\"\n :disabled=\"isAutoDisabled\"\n :variant=\"variant\"\n />\n </v-col>\n </v-row>\n</template>\n\n<script setup lang=\"ts\">\nimport { reactive, ref, watch, computed, nextTick } from 'vue';\nimport type { TextFieldVariant } from '@/utils/types';\nimport FzZipCodeField, { type ZipCodeResponse } from './FzZipCodeField.vue';\n\nexport interface Address {\n zipCode: string\n street: string\n number: string\n complement: string\n neighborhood: string\n city: string\n state: string\n}\n\nexport interface AddressLabels {\n zipCode?: string\n street?: string\n number?: string\n complement?: string\n neighborhood?: string\n city?: string\n state?: string\n}\n\ninterface Props {\n modelValue?: Partial<Address>\n disabled?: boolean\n disabledFields?: boolean\n labels?: AddressLabels\n variant?: TextFieldVariant\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n modelValue: () => ({}),\n disabled: false,\n disabledFields: false,\n labels: () => ({}),\n variant: 'underlined',\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: Address]\n}>();\n\nlet skipInternalEmit = false;\n\nconst brazilianStates = [\n { uf: 'AC', name: 'AC - Acre' },\n { uf: 'AL', name: 'AL - Alagoas' },\n { uf: 'AP', name: 'AP - Amapá' },\n { uf: 'AM', name: 'AM - Amazonas' },\n { uf: 'BA', name: 'BA - Bahia' },\n { uf: 'CE', name: 'CE - Ceará' },\n { uf: 'DF', name: 'DF - Distrito Federal' },\n { uf: 'ES', name: 'ES - Espírito Santo' },\n { uf: 'GO', name: 'GO - Goiás' },\n { uf: 'MA', name: 'MA - Maranhão' },\n { uf: 'MT', name: 'MT - Mato Grosso' },\n { uf: 'MS', name: 'MS - Mato Grosso do Sul' },\n { uf: 'MG', name: 'MG - Minas Gerais' },\n { uf: 'PA', name: 'PA - Pará' },\n { uf: 'PB', name: 'PB - Paraíba' },\n { uf: 'PR', name: 'PR - Paraná' },\n { uf: 'PE', name: 'PE - Pernambuco' },\n { uf: 'PI', name: 'PI - Piauí' },\n { uf: 'RJ', name: 'RJ - Rio de Janeiro' },\n { uf: 'RN', name: 'RN - Rio Grande do Norte' },\n { uf: 'RS', name: 'RS - Rio Grande do Sul' },\n { uf: 'RO', name: 'RO - Rondônia' },\n { uf: 'RR', name: 'RR - Roraima' },\n { uf: 'SC', name: 'SC - Santa Catarina' },\n { uf: 'SP', name: 'SP - São Paulo' },\n { uf: 'SE', name: 'SE - Sergipe' },\n { uf: 'TO', name: 'TO - Tocantins' },\n];\n\nconst internal = reactive<Address>({\n zipCode: '',\n street: '',\n number: '',\n complement: '',\n neighborhood: '',\n city: '',\n state: '',\n ...props.modelValue,\n});\n\nconst zipCodeFound = ref(false);\n\nconst labels = computed(() => ({\n zipCode: props.labels.zipCode ?? 'CEP',\n street: props.labels.street ?? 'Logradouro',\n number: props.labels.number ?? 'Número',\n complement: props.labels.complement ?? 'Complemento',\n neighborhood: props.labels.neighborhood ?? 'Bairro',\n city: props.labels.city ?? 'Cidade',\n state: props.labels.state ?? 'Estado',\n}));\n\nconst isAutoDisabled = computed(() => props.disabled || (props.disabledFields && zipCodeFound.value));\n\nfunction onZipCodeFound(data: ZipCodeResponse) {\n internal.street = data.street;\n internal.neighborhood = data.neighborhood;\n internal.city = data.city;\n internal.state = data.state;\n zipCodeFound.value = true;\n}\n\nfunction onZipCodeNotFound() {\n zipCodeFound.value = false;\n}\n\nwatch(() => props.modelValue, (val) => {\n if (!val) return;\n\n skipInternalEmit = true;\n\n Object.assign(internal, val);\n\n nextTick(() => {\n skipInternalEmit = false;\n });\n}, { deep: true, immediate: true });\n\nwatch(internal, (val) => {\n if (skipInternalEmit) return;\n\n emit('update:modelValue', { ...val });\n}, { deep: true });\n</script>\n"],"names":["props","__props","emit","__emit","skipInternalEmit","brazilianStates","internal","reactive","zipCodeFound","ref","labels","computed","isAutoDisabled","onZipCodeFound","data","onZipCodeNotFound","watch","val","nextTick","_createBlock","_component_v_row","_createVNode","_component_v_col","FzZipCodeField","_cache","$event","_component_v_text_field","_component_v_select"],"mappings":";;;;;;;;;;;;;AA6FA,UAAMA,IAAQC,GAQRC,IAAOC;AAIb,QAAIC,IAAmB;AAEvB,UAAMC,IAAkB;AAAA,MACtB,EAAE,IAAI,MAAM,MAAM,YAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,eAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,aAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,gBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,aAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,aAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,wBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,sBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,aAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,gBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,mBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,0BAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,oBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,YAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,eAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,cAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,kBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,aAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,sBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,2BAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,yBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,gBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,eAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,sBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,iBAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,eAAA;AAAA,MAClB,EAAE,IAAI,MAAM,MAAM,iBAAA;AAAA,IAAiB,GAG/BC,IAAWC,EAAkB;AAAA,MACjC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,QAAQ;AAAA,MACR,YAAY;AAAA,MACZ,cAAc;AAAA,MACd,MAAM;AAAA,MACN,OAAO;AAAA,MACP,GAAGP,EAAM;AAAA,IAAA,CACV,GAEKQ,IAAeC,EAAI,EAAK,GAExBC,IAASC,EAAS,OAAO;AAAA,MAC7B,SAASX,EAAM,OAAO,WAAW;AAAA,MACjC,QAAQA,EAAM,OAAO,UAAU;AAAA,MAC/B,QAAQA,EAAM,OAAO,UAAU;AAAA,MAC/B,YAAYA,EAAM,OAAO,cAAc;AAAA,MACvC,cAAcA,EAAM,OAAO,gBAAgB;AAAA,MAC3C,MAAMA,EAAM,OAAO,QAAQ;AAAA,MAC3B,OAAOA,EAAM,OAAO,SAAS;AAAA,IAAA,EAC7B,GAEIY,IAAiBD,EAAS,MAAMX,EAAM,YAAaA,EAAM,kBAAkBQ,EAAa,KAAM;AAEpG,aAASK,EAAeC,GAAuB;AAC7C,MAAAR,EAAS,SAASQ,EAAK,QACvBR,EAAS,eAAeQ,EAAK,cAC7BR,EAAS,OAAOQ,EAAK,MACrBR,EAAS,QAAQQ,EAAK,OACtBN,EAAa,QAAQ;AAAA,IACvB;AAEA,aAASO,IAAoB;AAC3B,MAAAP,EAAa,QAAQ;AAAA,IACvB;AAEA,WAAAQ,EAAM,MAAMhB,EAAM,YAAY,CAACiB,MAAQ;AACrC,MAAKA,MAELb,IAAmB,IAEnB,OAAO,OAAOE,GAAUW,CAAG,GAE3BC,EAAS,MAAM;AACb,QAAAd,IAAmB;AAAA,MACrB,CAAC;AAAA,IACH,GAAG,EAAE,MAAM,IAAM,WAAW,IAAM,GAElCY,EAAMV,GAAU,CAACW,MAAQ;AACvB,MAAIb,KAEJF,EAAK,qBAAqB,EAAE,GAAGe,GAAK;AAAA,IACtC,GAAG,EAAE,MAAM,IAAM;;kBA7LfE,EAwDQC,GAAA,MAAA;AAAA,mBAvDN,MAOQ;AAAA,UAPRC,EAOQC,GAAA;AAAA,YAPD,MAAK;AAAA,YAAK,IAAG;AAAA,UAAA;uBAClB,MAKE;AAAA,cALFD,EAKEE,GAAA;AAAA,gBAJS,YAAAjB,EAAS;AAAA,gBAAT,uBAAAkB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAnB,EAAS,UAAOmB;AAAA,gBACxB,UAAUxB,EAAA;AAAA,gBACV,gBAAAY;AAAA,gBACA,mBAAAE;AAAA,cAAA;;;;UAILM,EAOQC,GAAA;AAAA,YAPD,MAAK;AAAA,YAAK,IAAG;AAAA,UAAA;uBAClB,MAKE;AAAA,cALFD,EAKEK,GAAA;AAAA,gBAJS,YAAApB,EAAS;AAAA,gBAAT,uBAAAkB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAnB,EAAS,SAAMmB;AAAA,gBACvB,OAAOf,EAAA,MAAO;AAAA,gBACd,UAAUE,EAAA;AAAA,gBACV,SAASX,EAAA;AAAA,cAAA;;;;UAIdoB,EAEQC,GAAA;AAAA,YAFD,MAAK;AAAA,YAAK,IAAG;AAAA,UAAA;uBAClB,MAAyG;AAAA,cAAzGD,EAAyGK,GAAA;AAAA,gBAAlF,YAAApB,EAAS;AAAA,gBAAT,uBAAAkB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAnB,EAAS,SAAMmB;AAAA,gBAAG,OAAOf,EAAA,MAAO;AAAA,gBAAS,UAAUT,EAAA;AAAA,gBAAW,SAASA,EAAA;AAAA,cAAA;;;;UAGhGoB,EAEQC,GAAA;AAAA,YAFD,MAAK;AAAA,YAAK,IAAG;AAAA,UAAA;uBAClB,MAAiH;AAAA,cAAjHD,EAAiHK,GAAA;AAAA,gBAA1F,YAAApB,EAAS;AAAA,gBAAT,uBAAAkB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAnB,EAAS,aAAUmB;AAAA,gBAAG,OAAOf,EAAA,MAAO;AAAA,gBAAa,UAAUT,EAAA;AAAA,gBAAW,SAASA,EAAA;AAAA,cAAA;;;;UAGxGoB,EAOQC,GAAA;AAAA,YAPD,MAAK;AAAA,YAAK,IAAG;AAAA,UAAA;uBAClB,MAKE;AAAA,cALFD,EAKEK,GAAA;AAAA,gBAJS,YAAApB,EAAS;AAAA,gBAAT,uBAAAkB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAnB,EAAS,eAAYmB;AAAA,gBAC7B,OAAOf,EAAA,MAAO;AAAA,gBACd,UAAUE,EAAA;AAAA,gBACV,SAASX,EAAA;AAAA,cAAA;;;;UAIdoB,EAOQC,GAAA;AAAA,YAPD,MAAK;AAAA,YAAK,IAAG;AAAA,UAAA;uBAClB,MAKE;AAAA,cALFD,EAKEK,GAAA;AAAA,gBAJS,YAAApB,EAAS;AAAA,gBAAT,uBAAAkB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAnB,EAAS,OAAImB;AAAA,gBACrB,OAAOf,EAAA,MAAO;AAAA,gBACd,UAAUE,EAAA;AAAA,gBACV,SAASX,EAAA;AAAA,cAAA;;;;UAIdoB,EAUQC,GAAA;AAAA,YAVD,MAAK;AAAA,YAAK,IAAG;AAAA,UAAA;uBAClB,MAQE;AAAA,cARFD,EAQEM,GAAA;AAAA,gBAPS,YAAArB,EAAS;AAAA,gBAAT,uBAAAkB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAC,MAAAnB,EAAS,QAAKmB;AAAA,gBACtB,OAAOf,EAAA,MAAO;AAAA,gBACd,OAAOL;AAAA,gBACR,cAAW;AAAA,gBACX,cAAW;AAAA,gBACV,UAAUO,EAAA;AAAA,gBACV,SAASX,EAAA;AAAA,cAAA;;;;;;;;;;"}
|