@datametria/vue-components 1.2.0 → 2.0.1

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 (97) hide show
  1. package/README.md +548 -657
  2. package/dist/index.es.js +2353 -1364
  3. package/dist/index.umd.js +10 -10
  4. package/dist/vue-components.css +1 -1
  5. package/package.json +102 -98
  6. package/src/components/DatametriaAlert.vue +137 -137
  7. package/src/components/DatametriaAutocomplete.vue +184 -138
  8. package/src/components/DatametriaAvatar.vue +177 -33
  9. package/src/components/DatametriaBadge.vue +98 -98
  10. package/src/components/DatametriaBreadcrumb.vue +21 -21
  11. package/src/components/DatametriaButton.vue +177 -165
  12. package/src/components/DatametriaCard.vue +12 -12
  13. package/src/components/DatametriaCheckbox.vue +8 -8
  14. package/src/components/DatametriaChip.vue +145 -149
  15. package/src/components/DatametriaContainer.vue +4 -4
  16. package/src/components/DatametriaDatePicker.vue +686 -68
  17. package/src/components/DatametriaDivider.vue +13 -13
  18. package/src/components/DatametriaFileUpload.vue +272 -140
  19. package/src/components/DatametriaGrid.vue +3 -3
  20. package/src/components/DatametriaInput.vue +15 -15
  21. package/src/components/DatametriaMenu.vue +604 -619
  22. package/src/components/DatametriaModal.vue +16 -16
  23. package/src/components/DatametriaNavbar.vue +230 -252
  24. package/src/components/DatametriaPasswordInput.vue +430 -0
  25. package/src/components/DatametriaProgress.vue +18 -18
  26. package/src/components/DatametriaRadio.vue +20 -20
  27. package/src/components/DatametriaSelect.vue +15 -15
  28. package/src/components/DatametriaSkeleton.vue +243 -239
  29. package/src/components/DatametriaSlider.vue +395 -407
  30. package/src/components/DatametriaSortableTable.vue +585 -0
  31. package/src/components/DatametriaSpinner.vue +7 -7
  32. package/src/components/DatametriaSwitch.vue +16 -16
  33. package/src/components/DatametriaTable.vue +14 -14
  34. package/src/components/DatametriaTextarea.vue +28 -28
  35. package/src/components/DatametriaTimePicker.vue +285 -285
  36. package/src/components/DatametriaToast.vue +176 -176
  37. package/src/components/DatametriaTooltip.vue +408 -408
  38. package/src/components/__tests__/DatametriaAlert.test.js +35 -35
  39. package/src/components/__tests__/DatametriaAlert.test.ts +190 -0
  40. package/src/components/__tests__/DatametriaAutocomplete.test.ts +180 -0
  41. package/src/components/__tests__/DatametriaAvatar.test.ts +152 -0
  42. package/src/components/__tests__/DatametriaBadge.test.js +29 -29
  43. package/src/components/__tests__/DatametriaBadge.test.ts +167 -0
  44. package/src/components/__tests__/DatametriaBreadcrumb.test.ts +75 -0
  45. package/src/components/__tests__/DatametriaButton.test.js +30 -30
  46. package/src/components/__tests__/DatametriaButton.test.ts +283 -0
  47. package/src/components/__tests__/DatametriaCard.test.ts +201 -0
  48. package/src/components/__tests__/DatametriaCheckbox.test.ts +47 -0
  49. package/src/components/__tests__/DatametriaChip.test.js +38 -38
  50. package/src/components/__tests__/DatametriaContainer.test.ts +52 -0
  51. package/src/components/__tests__/DatametriaDatePicker.test.ts +234 -0
  52. package/src/components/__tests__/DatametriaDivider.test.ts +54 -0
  53. package/src/components/__tests__/DatametriaFileUpload.test.ts +291 -0
  54. package/src/components/__tests__/DatametriaGrid.test.ts +31 -0
  55. package/src/components/__tests__/DatametriaInput.test.ts +72 -0
  56. package/src/components/__tests__/DatametriaMenu.test.ts +366 -0
  57. package/src/components/__tests__/DatametriaModal.test.ts +86 -0
  58. package/src/components/__tests__/DatametriaNavbar.test.js +48 -48
  59. package/src/components/__tests__/DatametriaNavbar.test.ts +203 -0
  60. package/src/components/__tests__/DatametriaPasswordInput.test.js +305 -0
  61. package/src/components/__tests__/DatametriaProgress.test.ts +90 -0
  62. package/src/components/__tests__/DatametriaRadio.test.ts +77 -0
  63. package/src/components/__tests__/DatametriaSelect.test.ts +77 -0
  64. package/src/components/__tests__/DatametriaSlider.test.ts +261 -0
  65. package/src/components/__tests__/DatametriaSortableTable.test.js +168 -0
  66. package/src/components/__tests__/DatametriaSpinner.test.ts +156 -0
  67. package/src/components/__tests__/DatametriaSwitch.test.ts +64 -0
  68. package/src/components/__tests__/DatametriaTable.test.ts +97 -0
  69. package/src/components/__tests__/DatametriaTextarea.test.ts +66 -0
  70. package/src/components/__tests__/DatametriaToast.test.js +48 -48
  71. package/src/components/__tests__/DatametriaToast.test.ts +99 -0
  72. package/src/composables/useAccessibilityScale.ts +94 -94
  73. package/src/composables/useBreakpoints.ts +82 -82
  74. package/src/composables/useHapticFeedback.ts +439 -439
  75. package/src/composables/useRipple.ts +218 -218
  76. package/src/index.ts +68 -61
  77. package/src/stories/Variants.stories.js +95 -95
  78. package/src/styles/design-tokens.css +623 -623
  79. package/src/theme/ThemeProvider.vue +96 -0
  80. package/src/theme/__tests__/ThemeProvider.test.ts +208 -0
  81. package/src/theme/__tests__/constants.test.ts +31 -0
  82. package/src/theme/__tests__/presets.test.ts +166 -0
  83. package/src/theme/__tests__/tokens.test.ts +155 -0
  84. package/src/theme/__tests__/types.test.ts +153 -0
  85. package/src/theme/__tests__/useTheme.test.ts +146 -0
  86. package/src/theme/constants.ts +14 -0
  87. package/src/theme/index.ts +12 -0
  88. package/src/theme/presets/datametria.ts +94 -0
  89. package/src/theme/presets/default.ts +94 -0
  90. package/src/theme/presets/index.ts +8 -0
  91. package/src/theme/tokens/colors.ts +28 -0
  92. package/src/theme/tokens/index.ts +47 -0
  93. package/src/theme/tokens/spacing.ts +21 -0
  94. package/src/theme/tokens/typography.ts +35 -0
  95. package/src/theme/types.ts +111 -0
  96. package/src/theme/useTheme.ts +28 -0
  97. package/src/types/index.ts +19 -0
package/src/stories/Variants.stories.js CHANGED
@@ -1,96 +1,96 @@
1
- import DatametriaButton from '../components/DatametriaButton.vue'
2
- import DatametriaAlert from '../components/DatametriaAlert.vue'
3
- import DatametriaBadge from '../components/DatametriaBadge.vue'
4
- import DatametriaChip from '../components/DatametriaChip.vue'
5
- import DatametriaToast from '../components/DatametriaToast.vue'
6
- import DatametriaNavbar from '../components/DatametriaNavbar.vue'
7
-
8
- export default {
9
- title: 'Design System/Variants',
10
- parameters: {
11
- docs: {
12
- description: {
13
- component: 'Showcase of all component variants with primary variant standardization'
14
- }
15
- }
16
- }
17
- }
18
-
19
- export const AllVariants = () => ({
20
- components: {
21
- DatametriaButton,
22
- DatametriaAlert,
23
- DatametriaBadge,
24
- DatametriaChip,
25
- DatametriaToast,
26
- DatametriaNavbar
27
- },
28
- template: `
29
- <div style="padding: 2rem; space-y: 2rem;">
30
- <section>
31
- <h2>Button Variants</h2>
32
- <div style="display: flex; gap: 1rem; margin: 1rem 0;">
33
- <DatametriaButton variant="primary">Primary</DatametriaButton>
34
- <DatametriaButton variant="secondary">Secondary</DatametriaButton>
35
- <DatametriaButton variant="outline">Outline</DatametriaButton>
36
- <DatametriaButton variant="ghost">Ghost</DatametriaButton>
37
- </div>
38
- </section>
39
-
40
- <section>
41
- <h2>Alert Variants</h2>
42
- <div style="display: flex; flex-direction: column; gap: 1rem; margin: 1rem 0;">
43
- <DatametriaAlert variant="primary" message="Primary alert message" />
44
- <DatametriaAlert variant="success" message="Success alert message" />
45
- <DatametriaAlert variant="error" message="Error alert message" />
46
- <DatametriaAlert variant="warning" message="Warning alert message" />
47
- <DatametriaAlert variant="info" message="Info alert message" />
48
- </div>
49
- </section>
50
-
51
- <section>
52
- <h2>Badge Variants</h2>
53
- <div style="display: flex; gap: 1rem; margin: 1rem 0;">
54
- <DatametriaBadge variant="primary" label="Primary" />
55
- <DatametriaBadge variant="secondary" label="Secondary" />
56
- <DatametriaBadge variant="success" label="Success" />
57
- <DatametriaBadge variant="error" label="Error" />
58
- <DatametriaBadge variant="warning" label="Warning" />
59
- <DatametriaBadge variant="info" label="Info" />
60
- </div>
61
- </section>
62
-
63
- <section>
64
- <h2>Chip Variants</h2>
65
- <div style="display: flex; gap: 1rem; margin: 1rem 0;">
66
- <DatametriaChip variant="primary" label="Primary" />
67
- <DatametriaChip variant="secondary" label="Secondary" />
68
- <DatametriaChip variant="success" label="Success" />
69
- <DatametriaChip variant="error" label="Error" />
70
- <DatametriaChip variant="warning" label="Warning" />
71
- </div>
72
- </section>
73
-
74
- <section>
75
- <h2>Toast Variants</h2>
76
- <div style="display: flex; flex-direction: column; gap: 1rem; margin: 1rem 0;">
77
- <DatametriaToast variant="primary" message="Primary toast" :model-value="true" />
78
- <DatametriaToast variant="success" message="Success toast" :model-value="true" />
79
- <DatametriaToast variant="error" message="Error toast" :model-value="true" />
80
- <DatametriaToast variant="warning" message="Warning toast" :model-value="true" />
81
- <DatametriaToast variant="info" message="Info toast" :model-value="true" />
82
- </div>
83
- </section>
84
-
85
- <section>
86
- <h2>Navbar Variants</h2>
87
- <div style="display: flex; flex-direction: column; gap: 1rem; margin: 1rem 0;">
88
- <DatametriaNavbar variant="primary" brand="Primary Navbar" />
89
- <DatametriaNavbar variant="light" brand="Light Navbar" />
90
- <DatametriaNavbar variant="dark" brand="Dark Navbar" />
91
- <DatametriaNavbar variant="transparent" brand="Transparent Navbar" />
92
- </div>
93
- </section>
94
- </div>
95
- `
1
+ import DatametriaButton from '../components/DatametriaButton.vue'
2
+ import DatametriaAlert from '../components/DatametriaAlert.vue'
3
+ import DatametriaBadge from '../components/DatametriaBadge.vue'
4
+ import DatametriaChip from '../components/DatametriaChip.vue'
5
+ import DatametriaToast from '../components/DatametriaToast.vue'
6
+ import DatametriaNavbar from '../components/DatametriaNavbar.vue'
7
+
8
+ export default {
9
+ title: 'Design System/Variants',
10
+ parameters: {
11
+ docs: {
12
+ description: {
13
+ component: 'Showcase of all component variants with primary variant standardization'
14
+ }
15
+ }
16
+ }
17
+ }
18
+
19
+ export const AllVariants = () => ({
20
+ components: {
21
+ DatametriaButton,
22
+ DatametriaAlert,
23
+ DatametriaBadge,
24
+ DatametriaChip,
25
+ DatametriaToast,
26
+ DatametriaNavbar
27
+ },
28
+ template: `
29
+ <div style="padding: 2rem; space-y: 2rem;">
30
+ <section>
31
+ <h2>Button Variants</h2>
32
+ <div style="display: flex; gap: 1rem; margin: 1rem 0;">
33
+ <DatametriaButton variant="primary">Primary</DatametriaButton>
34
+ <DatametriaButton variant="secondary">Secondary</DatametriaButton>
35
+ <DatametriaButton variant="outline">Outline</DatametriaButton>
36
+ <DatametriaButton variant="ghost">Ghost</DatametriaButton>
37
+ </div>
38
+ </section>
39
+
40
+ <section>
41
+ <h2>Alert Variants</h2>
42
+ <div style="display: flex; flex-direction: column; gap: 1rem; margin: 1rem 0;">
43
+ <DatametriaAlert variant="primary" message="Primary alert message" />
44
+ <DatametriaAlert variant="success" message="Success alert message" />
45
+ <DatametriaAlert variant="error" message="Error alert message" />
46
+ <DatametriaAlert variant="warning" message="Warning alert message" />
47
+ <DatametriaAlert variant="info" message="Info alert message" />
48
+ </div>
49
+ </section>
50
+
51
+ <section>
52
+ <h2>Badge Variants</h2>
53
+ <div style="display: flex; gap: 1rem; margin: 1rem 0;">
54
+ <DatametriaBadge variant="primary" label="Primary" />
55
+ <DatametriaBadge variant="secondary" label="Secondary" />
56
+ <DatametriaBadge variant="success" label="Success" />
57
+ <DatametriaBadge variant="error" label="Error" />
58
+ <DatametriaBadge variant="warning" label="Warning" />
59
+ <DatametriaBadge variant="info" label="Info" />
60
+ </div>
61
+ </section>
62
+
63
+ <section>
64
+ <h2>Chip Variants</h2>
65
+ <div style="display: flex; gap: 1rem; margin: 1rem 0;">
66
+ <DatametriaChip variant="primary" label="Primary" />
67
+ <DatametriaChip variant="secondary" label="Secondary" />
68
+ <DatametriaChip variant="success" label="Success" />
69
+ <DatametriaChip variant="error" label="Error" />
70
+ <DatametriaChip variant="warning" label="Warning" />
71
+ </div>
72
+ </section>
73
+
74
+ <section>
75
+ <h2>Toast Variants</h2>
76
+ <div style="display: flex; flex-direction: column; gap: 1rem; margin: 1rem 0;">
77
+ <DatametriaToast variant="primary" message="Primary toast" :model-value="true" />
78
+ <DatametriaToast variant="success" message="Success toast" :model-value="true" />
79
+ <DatametriaToast variant="error" message="Error toast" :model-value="true" />
80
+ <DatametriaToast variant="warning" message="Warning toast" :model-value="true" />
81
+ <DatametriaToast variant="info" message="Info toast" :model-value="true" />
82
+ </div>
83
+ </section>
84
+
85
+ <section>
86
+ <h2>Navbar Variants</h2>
87
+ <div style="display: flex; flex-direction: column; gap: 1rem; margin: 1rem 0;">
88
+ <DatametriaNavbar variant="primary" brand="Primary Navbar" />
89
+ <DatametriaNavbar variant="light" brand="Light Navbar" />
90
+ <DatametriaNavbar variant="dark" brand="Dark Navbar" />
91
+ <DatametriaNavbar variant="transparent" brand="Transparent Navbar" />
92
+ </div>
93
+ </section>
94
+ </div>
95
+ `
96
96
  })