@weni/unnnic-system 3.9.1-alpha.1 → 3.9.1-alpha.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.
Files changed (83) hide show
  1. package/CHANGELOG.md +1 -1
  2. package/dist/components/Button/Button.vue.d.ts.map +1 -1
  3. package/dist/components/DateFilter/DateFilter.vue.d.ts +3 -82
  4. package/dist/components/Input/BaseInput.vue.d.ts +0 -22
  5. package/dist/components/Input/BaseInput.vue.d.ts.map +1 -1
  6. package/dist/components/Input/Input.vue.d.ts +3 -82
  7. package/dist/components/Input/Input.vue.d.ts.map +1 -1
  8. package/dist/components/Input/TextInput.vue.d.ts +2 -53
  9. package/dist/components/Input/TextInput.vue.d.ts.map +1 -1
  10. package/dist/components/InputDatePicker/InputDatePicker.vue.d.ts +4 -83
  11. package/dist/components/InputNext/InputNext.vue.d.ts +1 -1
  12. package/dist/components/ModalDialog/ModalDialog.vue.d.ts +29 -203
  13. package/dist/components/ModalDialog/ModalDialog.vue.d.ts.map +1 -1
  14. package/dist/components/ModalNext/ModalNext.vue.d.ts +3 -82
  15. package/dist/components/SelectSmart/SelectSmart.vue.d.ts +2 -53
  16. package/dist/components/SelectTime/index.vue.d.ts +2 -53
  17. package/dist/components/index.d.ts +116 -1568
  18. package/dist/components/index.d.ts.map +1 -1
  19. package/dist/{es-de156c12.mjs → es-4ab705d8.mjs} +1 -1
  20. package/dist/{index-21cbba5d.mjs → index-fca1e425.mjs} +10495 -11246
  21. package/dist/locales/en.json.d.ts +1 -2
  22. package/dist/locales/es.json.d.ts +1 -2
  23. package/dist/locales/pt_br.json.d.ts +1 -2
  24. package/dist/{pt-br-5fa49a3e.mjs → pt-br-b286b97c.mjs} +1 -1
  25. package/dist/style.css +1 -1
  26. package/dist/unnnic.mjs +180 -194
  27. package/dist/unnnic.umd.js +35 -39
  28. package/package.json +1 -1
  29. package/src/assets/scss/tailwind.scss +0 -8
  30. package/src/components/Alert/__tests__/__snapshots__/Version1dot1.spec.js.snap +1 -1
  31. package/src/components/Button/Button.vue +0 -1
  32. package/src/components/Input/BaseInput.vue +2 -21
  33. package/src/components/Input/Input.scss +3 -3
  34. package/src/components/Input/Input.vue +1 -19
  35. package/src/components/Input/TextInput.vue +21 -62
  36. package/src/components/ModalDialog/ModalDialog.vue +148 -62
  37. package/src/components/ModalDialog/__tests__/ModalDialog.spec.js +221 -11
  38. package/src/components/ModalDialog/__tests__/__snapshots__/ModalDialog.spec.js.snap +22 -1
  39. package/src/components/Radio/__test__/__snapshots__/Radio.spec.js.snap +1 -0
  40. package/src/components/index.ts +8 -36
  41. package/src/locales/en.json +1 -2
  42. package/src/locales/es.json +1 -2
  43. package/src/locales/pt_br.json +1 -2
  44. package/src/stories/ModalDialog.mdx +0 -3
  45. package/src/stories/ModalDialog.stories.js +1 -1
  46. package/dist/components/ui/dialog/Dialog.vue.d.ts +0 -23
  47. package/dist/components/ui/dialog/Dialog.vue.d.ts.map +0 -1
  48. package/dist/components/ui/dialog/DialogClose.vue.d.ts +0 -19
  49. package/dist/components/ui/dialog/DialogClose.vue.d.ts.map +0 -1
  50. package/dist/components/ui/dialog/DialogContent.vue.d.ts +0 -43
  51. package/dist/components/ui/dialog/DialogContent.vue.d.ts.map +0 -1
  52. package/dist/components/ui/dialog/DialogFooter.vue.d.ts +0 -25
  53. package/dist/components/ui/dialog/DialogFooter.vue.d.ts.map +0 -1
  54. package/dist/components/ui/dialog/DialogHeader.vue.d.ts +0 -29
  55. package/dist/components/ui/dialog/DialogHeader.vue.d.ts.map +0 -1
  56. package/dist/components/ui/dialog/DialogTitle.vue.d.ts +0 -23
  57. package/dist/components/ui/dialog/DialogTitle.vue.d.ts.map +0 -1
  58. package/dist/components/ui/dialog/DialogTrigger.vue.d.ts +0 -19
  59. package/dist/components/ui/dialog/DialogTrigger.vue.d.ts.map +0 -1
  60. package/dist/components/ui/dialog/index.d.ts +0 -8
  61. package/dist/components/ui/dialog/index.d.ts.map +0 -1
  62. package/src/components/Alert/SIMPLE_MIGRATION_GUIDE.md +0 -152
  63. package/src/components/Popover/__tests__/Popover.spec.js +0 -147
  64. package/src/components/Popover/__tests__/__snapshots__/Popover.spec.js.snap +0 -8
  65. package/src/components/Popover/index.vue +0 -146
  66. package/src/components/Select/SelectOption.vue +0 -65
  67. package/src/components/Select/__tests__/Select.spec.js +0 -412
  68. package/src/components/Select/__tests__/SelectItem.spec.js +0 -330
  69. package/src/components/Select/__tests__/SelectOption.spec.js +0 -174
  70. package/src/components/Select/__tests__/__snapshots__/Select.spec.js.snap +0 -97
  71. package/src/components/Select/__tests__/__snapshots__/SelectItem.spec.js.snap +0 -15
  72. package/src/components/Select/__tests__/__snapshots__/SelectOption.spec.js.snap +0 -25
  73. package/src/components/Select/index.vue +0 -245
  74. package/src/components/ui/dialog/Dialog.vue +0 -15
  75. package/src/components/ui/dialog/DialogClose.vue +0 -25
  76. package/src/components/ui/dialog/DialogContent.vue +0 -133
  77. package/src/components/ui/dialog/DialogFooter.vue +0 -46
  78. package/src/components/ui/dialog/DialogHeader.vue +0 -79
  79. package/src/components/ui/dialog/DialogTitle.vue +0 -34
  80. package/src/components/ui/dialog/DialogTrigger.vue +0 -12
  81. package/src/components/ui/dialog/index.ts +0 -7
  82. package/src/stories/Dialog.stories.js +0 -832
  83. package/src/stories/Select.stories.js +0 -158
@@ -1,5 +1,5 @@
1
1
  import { mount } from '@vue/test-utils';
2
- import { describe, it } from 'vitest';
2
+ import { describe, it, vi } from 'vitest';
3
3
  import ModalDialog from '../ModalDialog.vue';
4
4
 
5
5
  describe('ModalDialog.vue', () => {
@@ -16,12 +16,7 @@ describe('ModalDialog.vue', () => {
16
16
  'onUpdate:modelValue': (e) => wrapper.setProps({ modelValue: e }),
17
17
  },
18
18
  global: {
19
- stubs: [
20
- 'teleport',
21
- 'UnnnicIcon',
22
- 'UnnnicButton',
23
- 'UnnnicDialogContent',
24
- ],
19
+ stubs: ['UnnnicIcon', 'UnnnicButton'],
25
20
  },
26
21
  });
27
22
  });
@@ -31,16 +26,231 @@ describe('ModalDialog.vue', () => {
31
26
  expect(wrapper.html()).toMatchSnapshot();
32
27
  });
33
28
 
29
+ it('should render correctly when modelValue is true', () => {
30
+ const modal = wrapper.find('[data-testid="modal-dialog"]');
31
+ expect(modal.exists()).toBe(true);
32
+ });
33
+
34
+ it('should not render when modelValue is false', async () => {
35
+ await wrapper.setProps({ modelValue: false });
36
+
37
+ const modal = wrapper.find('[data-testid="modal-dialog"]');
38
+ expect(modal.exists()).toBe(false);
39
+ });
40
+
34
41
  it('should apply the correct size class based on the size prop', async () => {
35
- const modalContainer = wrapper.find('[data-testid="modal-dialog"]');
42
+ const modalContainer = wrapper.find('[data-testid="modal-container"]');
43
+ const defaultClass = 'unnnic-modal-dialog__container';
36
44
 
37
- expect(modalContainer.attributes('size')).toContain('medium');
45
+ expect(modalContainer.classes()).toContain(defaultClass + '--md');
38
46
 
39
47
  await wrapper.setProps({ size: 'lg' });
40
- expect(modalContainer.attributes('size')).toContain('large');
48
+ expect(modalContainer.classes()).toContain(defaultClass + '--lg');
41
49
 
42
50
  await wrapper.setProps({ size: 'sm' });
43
- expect(modalContainer.attributes('size')).toContain('small');
51
+ expect(modalContainer.classes()).toContain(defaultClass + '--sm');
52
+ });
53
+
54
+ it('should render the icon and title when provided', () => {
55
+ const title = wrapper.find('[data-testid="title-text"]');
56
+ expect(title.exists()).toBe(true);
57
+ expect(title.text()).toBe('Test Title');
58
+
59
+ const icon = wrapper.findComponent('[data-testid="title-icon"]');
60
+ expect(icon.exists()).toBe(true);
61
+ expect(icon.props('icon')).toBe('test-icon');
62
+ });
63
+
64
+ it('should render the icon from iconsMapper when type prop is provided', async () => {
65
+ await wrapper.setProps({
66
+ type: 'success',
67
+ icon: '',
68
+ });
69
+
70
+ const icon = wrapper.findComponent('[data-testid="title-icon"]');
71
+ expect(icon.exists()).toBe(true);
72
+ expect(icon.props().icon).toBe(wrapper.vm.iconsMapper['success'].icon);
73
+ });
74
+
75
+ it('should not render the icon when both icon and type props are not provided', async () => {
76
+ await wrapper.setProps({
77
+ icon: '',
78
+ type: '',
79
+ });
80
+
81
+ const icon = wrapper.find('[data-testid="title-icon"]');
82
+ expect(icon.exists()).toBe(false);
83
+ });
84
+
85
+ it('should render the close icon when showCloseIcon is true', () => {
86
+ const closeIcon = wrapper.find('[data-testid="close-icon"]');
87
+ expect(closeIcon.exists()).toBe(true);
88
+ });
89
+
90
+ it('should not render buttons when primaryButtonProps is not provided', async () => {
91
+ await wrapper.setProps({ primaryButtonProps: undefined });
92
+
93
+ const primaryButton = wrapper.find('[data-testid="primary-button"]');
94
+ const secondaryButton = wrapper.find('[data-testid="secondary-button"]');
95
+ expect(primaryButton.exists()).toBe(false);
96
+ expect(secondaryButton.exists()).toBe(false);
97
+ });
98
+ });
99
+
100
+ describe('Overlay behavior', () => {
101
+ it('should close the modal when clicking on the overlay if persistent is false', async () => {
102
+ expect(wrapper.props().modelValue).toBe(true);
103
+
104
+ const overlay = wrapper.find('[data-testid="modal-overlay"]');
105
+ await overlay.trigger('click');
106
+
107
+ expect(wrapper.emitted('update:modelValue')).toBeTruthy();
108
+ expect(wrapper.emitted('update:modelValue')[0]).toEqual([false]);
109
+ expect(wrapper.props().modelValue).toBe(false);
110
+ });
111
+
112
+ it('should not close the modal when clicking on the overlay if persistent is true', async () => {
113
+ await wrapper.setProps({ persistent: true });
114
+
115
+ const overlay = wrapper.find('[data-testid="modal-overlay"]');
116
+ await overlay.trigger('click');
117
+
118
+ expect(wrapper.emitted('update:modelValue')).toBeFalsy();
119
+ expect(wrapper.props().modelValue).toBe(true);
120
+ });
121
+ });
122
+
123
+ describe('Slot rendering', () => {
124
+ it('should render leftSidebar slot when provided', () => {
125
+ const wrapper = mount(ModalDialog, {
126
+ props: {
127
+ modelValue: true,
128
+ },
129
+ slots: {
130
+ leftSidebar:
131
+ '<div data-testid="left-sidebar">Left Sidebar Content</div>',
132
+ },
133
+ });
134
+
135
+ const leftSidebar = wrapper.find('[data-testid="left-sidebar"]');
136
+ expect(leftSidebar.exists()).toBe(true);
137
+ expect(leftSidebar.text()).toBe('Left Sidebar Content');
138
+ });
139
+
140
+ it('should render default slot content', () => {
141
+ const wrapper = mount(ModalDialog, {
142
+ props: {
143
+ modelValue: true,
144
+ },
145
+ slots: {
146
+ default: '<div data-testid="default-slot">Default Slot Content</div>',
147
+ },
148
+ });
149
+
150
+ const defaultSlot = wrapper.find('[data-testid="default-slot"]');
151
+ expect(defaultSlot.exists()).toBe(true);
152
+ expect(defaultSlot.text()).toBe('Default Slot Content');
153
+ });
154
+ });
155
+
156
+ describe('Buttons actions', () => {
157
+ it('should close the modal when clicking on close icon', async () => {
158
+ const closeIcon = wrapper.find('[data-testid="close-icon"]');
159
+ await closeIcon.trigger('click');
160
+
161
+ expect(wrapper.emitted('update:modelValue')).toBeTruthy();
162
+ expect(wrapper.emitted('update:modelValue')[0]).toEqual([false]);
163
+ expect(wrapper.props().modelValue).toBe(false);
164
+ });
165
+
166
+ it('should emit primaryButtonClick event when the primary button is clicked', async () => {
167
+ const primaryButton = wrapper.find('[data-testid="primary-button"]');
168
+ await primaryButton.trigger('click');
169
+
170
+ expect(wrapper.emitted('primaryButtonClick')).toBeTruthy();
171
+ });
172
+
173
+ it('should emit secondaryButtonClick event when the secondary button is clicked', async () => {
174
+ await wrapper.setProps({
175
+ secondaryButtonProps: { text: 'Cancel' },
176
+ });
177
+
178
+ const secondaryButton = wrapper.find('[data-testid="secondary-button"]');
179
+ await secondaryButton.trigger('click');
180
+
181
+ expect(wrapper.emitted('secondaryButtonClick')).toBeTruthy();
182
+ });
183
+
184
+ it('should close the modal when the secondary button is clicked and no secondaryButtonClick event is provided', async () => {
185
+ const secondaryButton = wrapper.find('[data-testid="secondary-button"]');
186
+ await secondaryButton.trigger('click');
187
+
188
+ const emittedValue = wrapper.emitted('update:modelValue');
189
+
190
+ expect(emittedValue).toBeTruthy();
191
+ expect(emittedValue[0][0]).toEqual(false);
192
+ });
193
+ });
194
+
195
+ describe('Actions and appearance', () => {
196
+ it('should not render the secondary button when hideSecondaryButton is true', async () => {
197
+ await wrapper.setProps({
198
+ hideSecondaryButton: true,
199
+ });
200
+ const secondaryButton = wrapper.find('[data-testid="secondary-button"]');
201
+ expect(secondaryButton.exists()).toBe(false);
202
+ });
203
+
204
+ it('should apply a divider class to the actions section when showActionsDivider is true', async () => {
205
+ await wrapper.setProps({
206
+ showActionsDivider: true,
207
+ });
208
+
209
+ const actionsSection = wrapper.find('[data-testid="actions-section"]');
210
+ expect(actionsSection.classes()).toContain(
211
+ 'unnnic-modal-dialog__container__actions--divider',
212
+ );
213
+ });
214
+ });
215
+
216
+ describe('Body overflow', () => {
217
+ it('should toggle body overflow based on modal visibility', async () => {
218
+ await wrapper.setProps({ modelValue: false });
219
+ const updateBodyOverflowSpy = vi.spyOn(wrapper.vm, 'updateBodyOverflow');
220
+
221
+ await wrapper.setProps({ modelValue: true });
222
+ expect(updateBodyOverflowSpy).toHaveBeenCalledWith(true);
223
+
224
+ await wrapper.setProps({ modelValue: false });
225
+ expect(updateBodyOverflowSpy).toHaveBeenCalledWith(false);
226
+ });
227
+ });
228
+
229
+ describe('Validators', () => {
230
+ describe('type prop validator', () => {
231
+ it('should validate type prop when a valid value is provided', () => {
232
+ const validTypes = ['success', 'warning', 'attention'];
233
+ validTypes.forEach((validType) => {
234
+ expect(ModalDialog.props.type.validate(validType)).toBe(true);
235
+ });
236
+ });
237
+
238
+ it('should invalidate type prop when an invalid value is provided', () => {
239
+ expect(ModalDialog.props.type.validate('invalidType')).toBe(false);
240
+ });
241
+ });
242
+
243
+ describe('size prop validator', () => {
244
+ it('should validate size prop when a valid value is provided', () => {
245
+ const validSizes = ['sm', 'md', 'lg'];
246
+ validSizes.forEach((validSize) => {
247
+ expect(ModalDialog.props.size.validate(validSize)).toBe(true);
248
+ });
249
+ });
250
+
251
+ it('should invalidate size prop when an invalid value is provided', () => {
252
+ expect(ModalDialog.props.size.validate('invalidSize')).toBe(false);
253
+ });
44
254
  });
45
255
  });
46
256
  });
@@ -1,3 +1,24 @@
1
1
  // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2
2
 
3
- exports[`ModalDialog.vue > Elements rendering > matches the snapshot 1`] = `"<unnnic-dialog-content-stub data-v-68ebadeb="" forcemount="false" disableoutsidepointerevents="false" aschild="false" parentclass="unnnic-modal-dialog," class="unnnic-modal-dialog__container" size="medium" data-testid="modal-dialog"></unnnic-dialog-content-stub>"`;
3
+ exports[`ModalDialog.vue > Elements rendering > matches the snapshot 1`] = `
4
+ "<section data-v-68ebadeb="" class="unnnic-modal-dialog" data-testid="modal-dialog">
5
+ <section data-v-68ebadeb="" class="unnnic-modal-dialog__overlay" data-testid="modal-overlay"></section>
6
+ <section data-v-68ebadeb="" class="unnnic-modal-dialog__container unnnic-modal-dialog__container--md" data-testid="modal-container">
7
+ <!--v-if-->
8
+ <section data-v-68ebadeb="" class="unnnic-modal-dialog__container__body">
9
+ <header data-v-68ebadeb="" class="unnnic-modal-dialog__container__header">
10
+ <section data-v-68ebadeb="" class="unnnic-modal-dialog__container__title-container">
11
+ <unnnic-icon-stub data-v-68ebadeb="" filled="false" icon="test-icon" clickable="false" size="md" scheme="neutral-darkest" data-testid="title-icon" class="unnnic-modal-dialog__container__title-icon"></unnnic-icon-stub>
12
+ <h1 data-v-68ebadeb="" class="unnnic-modal-dialog__container__title-text" data-testid="title-text">Test Title</h1>
13
+ </section>
14
+ <unnnic-icon-stub data-v-68ebadeb="" filled="false" icon="close" clickable="true" size="md" scheme="neutral-cloudy" data-testid="close-icon"></unnnic-icon-stub>
15
+ </header>
16
+ <section data-v-68ebadeb="" class="unnnic-modal-dialog__container__content"></section>
17
+ <section data-v-68ebadeb="" data-testid="actions-section" class="unnnic-modal-dialog__container__actions">
18
+ <unnnic-button-stub data-v-68ebadeb="" size="large" text="Cancel" type="tertiary" float="false" iconleft="" iconright="" iconcenter="" iconsfilled="false" disabled="false" loading="false" data-testid="secondary-button" class="unnnic-modal-dialog__container__actions__secondary-button"></unnnic-button-stub>
19
+ <unnnic-button-stub data-v-68ebadeb="" size="large" text="Confirm" type="primary" float="false" iconleft="" iconright="" iconcenter="" iconsfilled="false" disabled="false" loading="false" data-testid="primary-button" class="unnnic-modal-dialog__container__actions__primary-button"></unnnic-button-stub>
20
+ </section>
21
+ </section>
22
+ </section>
23
+ </section>"
24
+ `;
@@ -3,5 +3,6 @@
3
3
  exports[`Radio.vue > matches the snapshot 1`] = `
4
4
  "<section data-v-38c6bf5e="" class="unnnic-radio" size="md"><label data-v-38c6bf5e="" class="unnnic-radio__input-wrapper"><input data-v-38c6bf5e="" class="unnnic-radio__input" type="radio" name="">
5
5
  <p data-v-38c6bf5e="" class="unnnic-radio__label"> Option 1</p>
6
+ <!--v-if-->
6
7
  </label></section>"
7
8
  `;
@@ -89,8 +89,6 @@ import ModalDialog from './ModalDialog/ModalDialog.vue';
89
89
  import Tour from './Tour/Tour.vue';
90
90
  import Navigator from './Navigator/index.vue';
91
91
  import SelectTime from './SelectTime/index.vue';
92
- import TemplatePreview from './TemplatePreview/TemplatePreview.vue';
93
- import TemplatePreviewModal from './TemplatePreview/TemplatePreviewModal.vue';
94
92
  import DataTable from './DataTable/index.vue';
95
93
  import Chip from './Chip/Chip.vue';
96
94
  import Toast from './Toast/Toast.vue';
@@ -99,13 +97,8 @@ import Popover from './ui/popover/Popover.vue';
99
97
  import PopoverContent from './ui/popover/PopoverContent.vue';
100
98
  import PopoverTrigger from './ui/popover/PopoverTrigger.vue';
101
99
  import PopoverFooter from './ui/popover/PopoverFooter.vue';
102
- import Dialog from './ui/dialog/Dialog.vue';
103
- import DialogContent from './ui/dialog/DialogContent.vue';
104
- import DialogFooter from './ui/dialog/DialogFooter.vue';
105
- import DialogHeader from './ui/dialog/DialogHeader.vue';
106
- import DialogTitle from './ui/dialog/DialogTitle.vue';
107
- import DialogTrigger from './ui/dialog/DialogTrigger.vue';
108
- import DialogClose from './ui/dialog/DialogClose.vue';
100
+ import TemplatePreview from './TemplatePreview/TemplatePreview.vue';
101
+ import TemplatePreviewModal from './TemplatePreview/TemplatePreviewModal.vue';
109
102
  import Tabs from './ui/tabs/Tabs.vue';
110
103
  import TabsList from './ui/tabs/TabsList.vue';
111
104
  import TabsTrigger from './ui/tabs/TabsTrigger.vue';
@@ -219,13 +212,6 @@ export const components: ComponentsMap = {
219
212
  unnnicPopover: Popover,
220
213
  unnnicPopoverContent: PopoverContent,
221
214
  unnnicPopoverTrigger: PopoverTrigger,
222
- unnnicDialog: Dialog,
223
- unnnicDialogContent: DialogContent,
224
- unnnicDialogFooter: DialogFooter,
225
- unnnicDialogHeader: DialogHeader,
226
- unnnicDialogTitle: DialogTitle,
227
- unnnicDialogTrigger: DialogTrigger,
228
- unnnicDialogClose: DialogClose,
229
215
  unnnicTabs: Tabs,
230
216
  unnnicTabsList: TabsList,
231
217
  unnnicTabsTrigger: TabsTrigger,
@@ -324,10 +310,8 @@ export const unnnicDrawer = Drawer;
324
310
  export const unnnicTableNext = TableNext;
325
311
  export const unnnicTour = Tour;
326
312
  export const unnnicNavigator = Navigator;
327
- export const unnnicSelectTime = SelectTime as VueComponent;
328
- export const unnnicTemplatePreview = TemplatePreview as VueComponent;
329
- export const unnnicTemplatePreviewModal = TemplatePreviewModal as VueComponent;
330
313
  export const unnnicDataTable = DataTable as VueComponent;
314
+ export const unnnicSelectTime = SelectTime as VueComponent;
331
315
  export const unnnicChip = Chip;
332
316
  export const unnnicToast = Toast;
333
317
  export const unnnicToastManager = toast;
@@ -335,13 +319,8 @@ export const unnnicPopover = Popover;
335
319
  export const unnnicPopoverContent = PopoverContent;
336
320
  export const unnnicPopoverTrigger = PopoverTrigger;
337
321
  export const unnnicPopoverFooter = PopoverFooter;
338
- export const unnnicDialog = Dialog;
339
- export const unnnicDialogContent = DialogContent;
340
- export const unnnicDialogFooter = DialogFooter;
341
- export const unnnicDialogHeader = DialogHeader;
342
- export const unnnicDialogTitle = DialogTitle;
343
- export const unnnicDialogTrigger = DialogTrigger;
344
- export const unnnicDialogClose = DialogClose;
322
+ export const unnnicTemplatePreview = TemplatePreview as VueComponent;
323
+ export const unnnicTemplatePreviewModal = TemplatePreviewModal as VueComponent;
345
324
  export const unnnicTabs = Tabs;
346
325
  export const unnnicTabsList = TabsList;
347
326
  export const unnnicTabsTrigger = TabsTrigger;
@@ -438,10 +417,8 @@ export const UnnnicDrawer = Drawer;
438
417
  export const UnnnicTableNext = TableNext;
439
418
  export const UnnnicTour = Tour;
440
419
  export const UnnnicNavigator = Navigator;
441
- export const UnnnicSelectTime = SelectTime as VueComponent;
442
- export const UnnnicTemplatePreview = TemplatePreview as VueComponent;
443
- export const UnnnicTemplatePreviewModal = TemplatePreviewModal as VueComponent;
444
420
  export const UnnnicDataTable = DataTable as VueComponent;
421
+ export const UnnnicSelectTime = SelectTime as VueComponent;
445
422
  export const UnnnicChip = Chip;
446
423
  export const UnnnicToast = Toast;
447
424
  export const UnnnicToastManager = toast;
@@ -449,13 +426,8 @@ export const UnnnicPopover = Popover;
449
426
  export const UnnnicPopoverContent = PopoverContent;
450
427
  export const UnnnicPopoverTrigger = PopoverTrigger;
451
428
  export const UnnnicPopoverFooter = PopoverFooter;
452
- export const UnnnicDialog = Dialog;
453
- export const UnnnicDialogContent = DialogContent;
454
- export const UnnnicDialogFooter = DialogFooter;
455
- export const UnnnicDialogHeader = DialogHeader;
456
- export const UnnnicDialogTitle = DialogTitle;
457
- export const UnnnicDialogTrigger = DialogTrigger;
458
- export const UnnnicDialogClose = DialogClose;
429
+ export const UnnnicTemplatePreview = TemplatePreview as VueComponent;
430
+ export const UnnnicTemplatePreviewModal = TemplatePreviewModal as VueComponent;
459
431
  export const UnnnicTabs = Tabs;
460
432
  export const UnnnicTabsList = TabsList;
461
433
  export const UnnnicTabsTrigger = TabsTrigger;
@@ -41,6 +41,5 @@
41
41
  "flags": "Flags",
42
42
  "custom": "Custom"
43
43
  }
44
- },
45
- "search": "Search"
44
+ }
46
45
  }
@@ -41,6 +41,5 @@
41
41
  "flags": "Banderas",
42
42
  "custom": "Personalizados"
43
43
  }
44
- },
45
- "search": "Buscar"
44
+ }
46
45
  }
@@ -41,6 +41,5 @@
41
41
  "flags": "Bandeiras",
42
42
  "custom": "Personalizados"
43
43
  }
44
- },
45
- "search": "Buscar"
44
+ }
46
45
  }
@@ -6,9 +6,6 @@ import * as ModalDialogStories from './ModalDialog.stories';
6
6
 
7
7
  # ModalDialog
8
8
 
9
- > **⚠️ DEPRECATED**: This component has been deprecated in favor of the new `Dialog` component. Please use `UnnnicDialog`
10
- instead for new implementations. See the [Dialog documentation](?path=/docs/feedback-dialog--docs) for more information.
11
-
12
9
  The ModalDialog was designed to inform the user about a specific task, request information, or involve other tasks.
13
10
 
14
11
  <Source
@@ -7,7 +7,7 @@ import iconsList from '../utils/iconList';
7
7
  import colorsList from '../utils/colorsList';
8
8
 
9
9
  export default {
10
- title: 'Feedback/ModalDialog',
10
+ title: 'Example/ModalDialog',
11
11
  component: UnnnicModalDialog,
12
12
  argTypes: {
13
13
  type: {
@@ -1,23 +0,0 @@
1
- import { DialogRootProps } from 'reka-ui';
2
- declare function __VLS_template(): {
3
- attrs: Partial<{}>;
4
- slots: {
5
- default?(_: {}): any;
6
- };
7
- refs: {};
8
- rootEl: any;
9
- };
10
- type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
11
- declare const __VLS_component: import('vue').DefineComponent<DialogRootProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
12
- "update:open": (value: boolean) => any;
13
- }, string, import('vue').PublicProps, Readonly<DialogRootProps> & Readonly<{
14
- "onUpdate:open"?: ((value: boolean) => any) | undefined;
15
- }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
16
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
17
- export default _default;
18
- type __VLS_WithTemplateSlots<T, S> = T & {
19
- new (): {
20
- $slots: S;
21
- };
22
- };
23
- //# sourceMappingURL=Dialog.vue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Dialog.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/Dialog.vue"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAmB,eAAe,EAAE,MAAM,SAAS,CAAC;AAYhE,iBAAS,cAAc;WAgCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAWD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;kFAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -1,19 +0,0 @@
1
- import { DialogCloseProps } from 'reka-ui';
2
- declare function __VLS_template(): {
3
- attrs: Partial<{}>;
4
- slots: {
5
- default?(_: {}): any;
6
- };
7
- refs: {};
8
- rootEl: any;
9
- };
10
- type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
11
- declare const __VLS_component: import('vue').DefineComponent<DialogCloseProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<DialogCloseProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
12
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
13
- export default _default;
14
- type __VLS_WithTemplateSlots<T, S> = T & {
15
- new (): {
16
- $slots: S;
17
- };
18
- };
19
- //# sourceMappingURL=DialogClose.vue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogClose.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/DialogClose.vue"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAQhD,iBAAS,cAAc;WAsCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AASD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe,4SAOnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -1,43 +0,0 @@
1
- import { DialogContentProps } from 'reka-ui';
2
- import { HTMLAttributes } from 'vue';
3
- type __VLS_Props = DialogContentProps & {
4
- parentClass?: HTMLAttributes['class'];
5
- class?: HTMLAttributes['class'];
6
- size?: 'small' | 'medium' | 'large';
7
- };
8
- declare function __VLS_template(): {
9
- attrs: Partial<{}>;
10
- slots: {
11
- default?(_: {}): any;
12
- };
13
- refs: {};
14
- rootEl: any;
15
- };
16
- type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
17
- declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
18
- escapeKeyDown: (event: KeyboardEvent) => any;
19
- pointerDownOutside: (event: import('reka-ui').PointerDownOutsideEvent) => any;
20
- focusOutside: (event: import('reka-ui').FocusOutsideEvent) => any;
21
- interactOutside: (event: import('reka-ui').PointerDownOutsideEvent | import('reka-ui').FocusOutsideEvent) => any;
22
- openAutoFocus: (event: Event) => any;
23
- closeAutoFocus: (event: Event) => any;
24
- }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
25
- onEscapeKeyDown?: ((event: KeyboardEvent) => any) | undefined;
26
- onPointerDownOutside?: ((event: import('reka-ui').PointerDownOutsideEvent) => any) | undefined;
27
- onFocusOutside?: ((event: import('reka-ui').FocusOutsideEvent) => any) | undefined;
28
- onInteractOutside?: ((event: import('reka-ui').PointerDownOutsideEvent | import('reka-ui').FocusOutsideEvent) => any) | undefined;
29
- onOpenAutoFocus?: ((event: Event) => any) | undefined;
30
- onCloseAutoFocus?: ((event: Event) => any) | undefined;
31
- }>, {
32
- size: "small" | "medium" | "large";
33
- class: HTMLAttributes["class"];
34
- parentClass: HTMLAttributes["class"];
35
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
36
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
37
- export default _default;
38
- type __VLS_WithTemplateSlots<T, S> = T & {
39
- new (): {
40
- $slots: S;
41
- };
42
- };
43
- //# sourceMappingURL=DialogContent.vue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogContent.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/DialogContent.vue"],"names":[],"mappings":"AAuIA,OAAO,KAAK,EAAsB,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACtE,OAAO,KAAK,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAWrD,KAAK,WAAW,GAAG,kBAAkB,GAAG;IAClC,WAAW,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IACtC,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC,CAAC;AA2CN,iBAAS,cAAc;WAkET,OAAO,IAA6B;;yBAVpB,GAAG;;;;EAehC;AAgBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;UApIR,OAAO,GAAG,QAAQ,GAAG,OAAO;WAD3B,cAAc,CAAC,OAAO,CAAC;iBADjB,cAAc,CAAC,OAAO,CAAC;6EA+IzC,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -1,25 +0,0 @@
1
- import { HTMLAttributes } from 'vue';
2
- type __VLS_Props = {
3
- class?: HTMLAttributes['class'];
4
- divider?: boolean;
5
- };
6
- declare function __VLS_template(): {
7
- attrs: Partial<{}>;
8
- slots: {
9
- default?(_: {}): any;
10
- };
11
- refs: {};
12
- rootEl: HTMLElement;
13
- };
14
- type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
15
- declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
16
- divider: boolean;
17
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
18
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
19
- export default _default;
20
- type __VLS_WithTemplateSlots<T, S> = T & {
21
- new (): {
22
- $slots: S;
23
- };
24
- };
25
- //# sourceMappingURL=DialogFooter.vue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogFooter.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/DialogFooter.vue"],"names":[],"mappings":"AAgDA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,KAAK,WAAW,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAa1E,iBAAS,cAAc;WAgCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAUD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;aA7D2C,OAAO;qFAqErE,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -1,29 +0,0 @@
1
- import { HTMLAttributes } from 'vue';
2
- type __VLS_Props = {
3
- class?: HTMLAttributes['class'];
4
- divider?: boolean;
5
- type?: 'default' | 'success' | 'warning' | 'attention';
6
- closeButton?: boolean;
7
- };
8
- declare function __VLS_template(): {
9
- attrs: Partial<{}>;
10
- slots: {
11
- default?(_: {}): any;
12
- };
13
- refs: {};
14
- rootEl: HTMLElement;
15
- };
16
- type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
17
- declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
18
- type: "default" | "success" | "warning" | "attention";
19
- divider: boolean;
20
- closeButton: boolean;
21
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
22
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
23
- export default _default;
24
- type __VLS_WithTemplateSlots<T, S> = T & {
25
- new (): {
26
- $slots: S;
27
- };
28
- };
29
- //# sourceMappingURL=DialogHeader.vue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogHeader.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/DialogHeader.vue"],"names":[],"mappings":"AAiFA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAM1C,KAAK,WAAW,GAAG;IACf,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,WAAW,CAAC;IACvD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAwBJ,iBAAS,cAAc;WA0ET,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAcD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;UAxHV,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,WAAW;aAD5C,OAAO;iBAEH,OAAO;qFA+HvB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -1,23 +0,0 @@
1
- import { DialogTitleProps } from 'reka-ui';
2
- import { HTMLAttributes } from 'vue';
3
- type __VLS_Props = DialogTitleProps & {
4
- class?: HTMLAttributes['class'];
5
- };
6
- declare function __VLS_template(): {
7
- attrs: Partial<{}>;
8
- slots: {
9
- default?(_: {}): any;
10
- };
11
- refs: {};
12
- rootEl: any;
13
- };
14
- type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
15
- declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
16
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
17
- export default _default;
18
- type __VLS_WithTemplateSlots<T, S> = T & {
19
- new (): {
20
- $slots: S;
21
- };
22
- };
23
- //# sourceMappingURL=DialogTitle.vue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogTitle.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/DialogTitle.vue"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAK1C,KAAK,WAAW,GAAG,gBAAgB,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;CAAE,CAAC;AAW1E,iBAAS,cAAc;WAqCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAWD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe,kSAOnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -1,19 +0,0 @@
1
- import { DialogTriggerProps } from 'reka-ui';
2
- declare function __VLS_template(): {
3
- attrs: Partial<{}>;
4
- slots: {
5
- default?(_: {}): any;
6
- };
7
- refs: {};
8
- rootEl: any;
9
- };
10
- type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
11
- declare const __VLS_component: import('vue').DefineComponent<DialogTriggerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<DialogTriggerProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
12
- declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
13
- export default _default;
14
- type __VLS_WithTemplateSlots<T, S> = T & {
15
- new (): {
16
- $slots: S;
17
- };
18
- };
19
- //# sourceMappingURL=DialogTrigger.vue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DialogTrigger.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/dialog/DialogTrigger.vue"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAQlD,iBAAS,cAAc;WAgCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AASD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe,gTAOnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}