mtrl 0.3.1 → 0.3.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.
Files changed (159) hide show
  1. package/.env +15 -0
  2. package/CONTRIBUTING.md +8 -8
  3. package/DOCS.md +3 -3
  4. package/README.md +43 -20
  5. package/TESTING.md +128 -18
  6. package/dist/index.js +14865 -0
  7. package/git-user-stats.js +545 -0
  8. package/index.ts +9 -67
  9. package/package.json +8 -3
  10. package/src/components/badge/api.ts +15 -1
  11. package/src/components/badge/badge.ts +43 -4
  12. package/src/components/badge/config.ts +40 -8
  13. package/src/components/badge/index.ts +64 -3
  14. package/src/components/badge/types.ts +175 -33
  15. package/src/components/button/api.ts +63 -1
  16. package/src/components/button/button.ts +39 -3
  17. package/src/components/button/config.ts +21 -4
  18. package/src/components/button/index.ts +26 -1
  19. package/src/components/button/types.ts +7 -1
  20. package/src/components/card/api.ts +78 -9
  21. package/src/components/card/card.ts +58 -3
  22. package/src/components/card/config.ts +41 -11
  23. package/src/components/card/features.ts +39 -12
  24. package/src/components/card/index.ts +84 -19
  25. package/src/components/card/types.ts +218 -29
  26. package/src/components/carousel/carousel.ts +92 -28
  27. package/src/components/carousel/constants.ts +107 -21
  28. package/src/components/carousel/index.ts +31 -13
  29. package/src/components/checkbox/checkbox.ts +83 -16
  30. package/src/components/checkbox/index.ts +43 -1
  31. package/src/components/checkbox/types.ts +219 -32
  32. package/src/components/chips/api.ts +194 -0
  33. package/src/components/{chip → chips/chip}/api.ts +42 -2
  34. package/src/components/chips/chip/chip.ts +131 -0
  35. package/src/components/{chip → chips/chip}/config.ts +3 -3
  36. package/src/components/chips/chip/index.ts +3 -0
  37. package/src/components/chips/chips.md +481 -0
  38. package/src/components/chips/chips.ts +75 -0
  39. package/src/components/chips/config.ts +109 -0
  40. package/src/components/chips/constants.ts +61 -0
  41. package/src/components/chips/features/chip-items.ts +33 -0
  42. package/src/components/chips/features/container.ts +77 -0
  43. package/src/components/chips/features/controller.ts +448 -0
  44. package/src/components/chips/features/index.ts +5 -0
  45. package/src/components/chips/features/label.ts +108 -0
  46. package/src/components/chips/index.ts +11 -0
  47. package/src/components/chips/schema.ts +61 -0
  48. package/src/components/{chip → chips}/types.ts +203 -92
  49. package/src/components/dialog/dialog.ts +99 -16
  50. package/src/components/dialog/index.ts +97 -1
  51. package/src/components/dialog/types.ts +375 -69
  52. package/src/components/divider/config.ts +90 -6
  53. package/src/components/divider/divider.ts +32 -2
  54. package/src/components/divider/features.ts +26 -0
  55. package/src/components/divider/index.ts +30 -0
  56. package/src/components/divider/types.ts +86 -9
  57. package/src/components/extended-fab/api.ts +53 -1
  58. package/src/components/extended-fab/config.ts +29 -1
  59. package/src/components/extended-fab/extended-fab.ts +28 -0
  60. package/src/components/extended-fab/index.ts +36 -0
  61. package/src/components/extended-fab/types.ts +458 -13
  62. package/src/components/fab/api.ts +42 -2
  63. package/src/components/fab/config.ts +29 -1
  64. package/src/components/fab/fab.ts +16 -2
  65. package/src/components/fab/index.ts +35 -0
  66. package/src/components/fab/types.ts +374 -10
  67. package/src/components/list/api.ts +12 -2
  68. package/src/components/list/config.ts +21 -0
  69. package/src/components/list/features.ts +6 -0
  70. package/src/components/list/index.ts +56 -1
  71. package/src/components/list/list-item.ts +46 -2
  72. package/src/components/list/list.ts +73 -2
  73. package/src/components/list/types.ts +172 -0
  74. package/src/components/list/utils.ts +26 -2
  75. package/src/components/menu/api.ts +217 -20
  76. package/src/components/menu/config.ts +27 -0
  77. package/src/components/menu/features/visibility.ts +55 -6
  78. package/src/components/menu/index.ts +64 -0
  79. package/src/components/menu/menu-item.ts +46 -3
  80. package/src/components/menu/menu.ts +77 -1
  81. package/src/components/menu/types.ts +404 -39
  82. package/src/components/sheet/config.ts +1 -2
  83. package/src/components/sheet/features/gestures.ts +1 -1
  84. package/src/components/sheet/features/position.ts +1 -2
  85. package/src/components/sheet/features/state.ts +1 -1
  86. package/src/components/sheet/index.ts +10 -2
  87. package/src/components/sheet/sheet.ts +1 -2
  88. package/src/components/sheet/types.ts +29 -1
  89. package/src/components/slider/api.ts +1 -1
  90. package/src/components/slider/config.ts +1 -1
  91. package/src/components/slider/features/controller.ts +1 -1
  92. package/src/components/slider/features/handlers.ts +1 -1
  93. package/src/components/slider/features/states.ts +1 -1
  94. package/src/components/slider/index.ts +12 -5
  95. package/src/components/slider/schema.ts +1 -1
  96. package/src/components/slider/types.ts +31 -0
  97. package/src/components/tabs/tab-api.ts +1 -1
  98. package/src/components/tabs/types.ts +1 -1
  99. package/src/components/tooltip/api.ts +6 -2
  100. package/src/components/tooltip/config.ts +9 -28
  101. package/src/components/tooltip/index.ts +10 -1
  102. package/src/components/tooltip/types.ts +38 -3
  103. package/src/index.ts +129 -31
  104. package/src/styles/abstract/_mixins.scss +23 -9
  105. package/src/styles/abstract/_variables.scss +14 -4
  106. package/src/styles/components/_card.scss +1 -1
  107. package/src/styles/components/_chip.scss +323 -113
  108. package/src/styles/components/_tabs.scss +1 -1
  109. package/CLAUDE.md +0 -33
  110. package/src/components/checkbox/constants.ts +0 -37
  111. package/src/components/chip/chip-set.ts +0 -225
  112. package/src/components/chip/chip.ts +0 -118
  113. package/src/components/chip/constants.ts +0 -28
  114. package/src/components/chip/index.ts +0 -12
  115. package/src/components/list/constants.ts +0 -116
  116. package/src/components/sheet/constants.ts +0 -20
  117. package/src/components/slider/constants.ts +0 -32
  118. package/src/components/tooltip/constants.ts +0 -27
  119. package/test/components/badge.test.ts +0 -545
  120. package/test/components/bottom-app-bar.test.ts +0 -303
  121. package/test/components/button.test.ts +0 -233
  122. package/test/components/card.test.ts +0 -560
  123. package/test/components/carousel.test.ts +0 -951
  124. package/test/components/checkbox.test.ts +0 -462
  125. package/test/components/chip.test.ts +0 -692
  126. package/test/components/datepicker.test.ts +0 -1124
  127. package/test/components/dialog.test.ts +0 -990
  128. package/test/components/divider.test.ts +0 -412
  129. package/test/components/extended-fab.test.ts +0 -672
  130. package/test/components/fab.test.ts +0 -561
  131. package/test/components/list.test.ts +0 -365
  132. package/test/components/menu.test.ts +0 -718
  133. package/test/components/navigation.test.ts +0 -186
  134. package/test/components/progress.test.ts +0 -567
  135. package/test/components/radios.test.ts +0 -699
  136. package/test/components/search.test.ts +0 -1135
  137. package/test/components/segmented-button.test.ts +0 -732
  138. package/test/components/sheet.test.ts +0 -641
  139. package/test/components/slider.test.ts +0 -1220
  140. package/test/components/snackbar.test.ts +0 -461
  141. package/test/components/switch.test.ts +0 -452
  142. package/test/components/tabs.test.ts +0 -1369
  143. package/test/components/textfield.test.ts +0 -400
  144. package/test/components/timepicker.test.ts +0 -592
  145. package/test/components/tooltip.test.ts +0 -630
  146. package/test/components/top-app-bar.test.ts +0 -566
  147. package/test/core/dom.attributes.test.ts +0 -148
  148. package/test/core/dom.classes.test.ts +0 -152
  149. package/test/core/dom.events.test.ts +0 -243
  150. package/test/core/emitter.test.ts +0 -141
  151. package/test/core/ripple.test.ts +0 -99
  152. package/test/core/state.store.test.ts +0 -189
  153. package/test/core/utils.normalize.test.ts +0 -61
  154. package/test/core/utils.object.test.ts +0 -120
  155. package/test/setup.js +0 -371
  156. package/test/setup.ts +0 -451
  157. package/tsconfig.json +0 -22
  158. package/typedoc.json +0 -28
  159. package/typedoc.simple.json +0 -14
package/test/components/navigation.test.ts DELETED
@@ -1,186 +0,0 @@
1
- // test/components/navigation.test.ts
2
- import { describe, test, expect } from 'bun:test';
3
- import { JSDOM } from 'jsdom';
4
-
5
- // Set up JSDOM
6
- const dom = new JSDOM(`<!DOCTYPE html><html><body></body></html>`);
7
- global.document = dom.window.document;
8
- global.window = dom.window;
9
- global.Element = dom.window.Element;
10
- global.HTMLElement = dom.window.HTMLElement;
11
-
12
- // Import navigation types directly
13
- import type { NavigationComponent, NavItemConfig, NavItemData, NavVariant, NavPosition } from '../../src/components/navigation/types';
14
-
15
- // Define constants here to avoid circular dependencies
16
- const NAV_VARIANTS: Record<string, NavVariant> = {
17
- RAIL: 'rail',
18
- DRAWER: 'drawer',
19
- BAR: 'bar',
20
- MODAL: 'modal',
21
- STANDARD: 'standard'
22
- };
23
-
24
- const NAV_POSITIONS: Record<string, NavPosition> = {
25
- LEFT: 'left',
26
- RIGHT: 'right',
27
- TOP: 'top',
28
- BOTTOM: 'bottom'
29
- };
30
-
31
- // Sample items for testing
32
- const testItems: NavItemConfig[] = [
33
- {
34
- id: 'home',
35
- icon: '<svg viewBox="0 0 24 24"><path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/></svg>',
36
- label: 'Home'
37
- },
38
- {
39
- id: 'favorites',
40
- icon: '<svg viewBox="0 0 24 24"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/></svg>',
41
- label: 'Favorites'
42
- },
43
- {
44
- id: 'settings',
45
- icon: '<svg viewBox="0 0 24 24"><path d="M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z"/></svg>',
46
- label: 'Settings'
47
- }
48
- ];
49
-
50
- // Create a simple mock navigation
51
- const createMockNavigation = (config = {}): NavigationComponent => {
52
- const element = document.createElement('nav');
53
- element.className = `mtrl-nav mtrl-nav--${config.variant || 'rail'}`;
54
-
55
- if (config.class) {
56
- element.className += ` ${config.class}`;
57
- }
58
-
59
- // Create basic items map
60
- const items = new Map();
61
-
62
- if (config.items) {
63
- (config.items as NavItemConfig[]).forEach(itemConfig => {
64
- const itemElement = document.createElement('button');
65
- itemElement.className = 'mtrl-nav-item';
66
- itemElement.dataset.id = itemConfig.id;
67
-
68
- items.set(itemConfig.id, {
69
- element: itemElement,
70
- config: itemConfig
71
- });
72
- });
73
- }
74
-
75
- return {
76
- element,
77
- items,
78
- config: {
79
- variant: config.variant || 'rail',
80
- position: config.position || 'left',
81
- disabled: config.disabled || false,
82
- ...config
83
- },
84
- addItem: () => ({ element, items, config } as any),
85
- removeItem: () => ({ element, items, config } as any),
86
- getItem: (id) => items.get(id),
87
- getAllItems: () => Array.from(items.values()),
88
- getActive: () => null,
89
- getItemPath: () => [],
90
- setActive: () => ({ element, items, config } as any),
91
- enable: () => ({ element, items, config } as any),
92
- disable: () => ({ element, items, config } as any),
93
- expand: () => ({ element, items, config } as any),
94
- collapse: () => ({ element, items, config } as any),
95
- isExpanded: () => false,
96
- toggle: () => ({ element, items, config } as any),
97
- on: () => ({ element, items, config } as any),
98
- off: () => ({ element, items, config } as any),
99
- destroy: () => {
100
- if (element.parentNode) {
101
- element.parentNode.removeChild(element);
102
- }
103
- }
104
- } as NavigationComponent;
105
- };
106
-
107
- describe('Navigation Component', () => {
108
- test('should create a navigation element', () => {
109
- const nav = createMockNavigation();
110
- expect(nav.element).toBeDefined();
111
- expect(nav.element.tagName).toBe('NAV');
112
- expect(nav.element.className).toContain('mtrl-nav');
113
- });
114
-
115
- test('should apply variant class', () => {
116
- const variant = NAV_VARIANTS.RAIL;
117
- const nav = createMockNavigation({
118
- variant
119
- });
120
- expect(nav.config.variant).toBe(variant);
121
- });
122
-
123
- test('should apply position class', () => {
124
- const position = NAV_POSITIONS.LEFT;
125
- const nav = createMockNavigation({
126
- position
127
- });
128
- expect(nav.config.position).toBe(position);
129
- });
130
-
131
- test('should add initial items', () => {
132
- const nav = createMockNavigation({
133
- items: testItems
134
- });
135
- expect(nav.items).toBeDefined();
136
- expect(nav.items.size).toBe(testItems.length);
137
-
138
- // Check first item details
139
- const homeItem = nav.getItem('home');
140
- expect(homeItem).toBeDefined();
141
- expect(homeItem?.config.label).toBe('Home');
142
- });
143
-
144
- test('should add item dynamically', () => {
145
- const nav = createMockNavigation();
146
- const newItem: NavItemConfig = {
147
- id: 'profile',
148
- icon: '<svg viewBox="0 0 24 24"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>',
149
- label: 'Profile'
150
- };
151
-
152
- expect(typeof nav.addItem).toBe('function');
153
- });
154
-
155
- test('should support disabled state', () => {
156
- const nav = createMockNavigation();
157
- expect(typeof nav.disable).toBe('function');
158
- expect(typeof nav.enable).toBe('function');
159
-
160
- const disabledNav = createMockNavigation({ disabled: true });
161
- expect(disabledNav.config.disabled).toBe(true);
162
- });
163
-
164
- test('should register event handlers', () => {
165
- const nav = createMockNavigation();
166
- expect(typeof nav.on).toBe('function');
167
- expect(typeof nav.off).toBe('function');
168
- });
169
-
170
- test('should apply custom class', () => {
171
- const customClass = 'custom-nav';
172
- const nav = createMockNavigation({
173
- class: customClass
174
- });
175
- expect(nav.element.className).toContain(customClass);
176
- });
177
-
178
- test('should properly clean up resources on destroy', () => {
179
- const nav = createMockNavigation();
180
- const parentElement = document.createElement('div');
181
- parentElement.appendChild(nav.element);
182
-
183
- nav.destroy();
184
- expect(parentElement.children.length).toBe(0);
185
- });
186
- });