mtrl 0.3.6 → 0.3.7

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 (45) hide show
  1. package/package.json +1 -1
  2. package/src/components/button/api.ts +16 -0
  3. package/src/components/button/types.ts +9 -0
  4. package/src/components/menu/api.ts +15 -13
  5. package/src/components/menu/config.ts +5 -5
  6. package/src/components/menu/features/anchor.ts +99 -15
  7. package/src/components/menu/features/controller.ts +418 -221
  8. package/src/components/menu/features/index.ts +2 -1
  9. package/src/components/menu/features/position.ts +353 -0
  10. package/src/components/menu/index.ts +5 -5
  11. package/src/components/menu/menu.ts +18 -60
  12. package/src/components/menu/types.ts +17 -16
  13. package/src/components/select/api.ts +78 -0
  14. package/src/components/select/config.ts +76 -0
  15. package/src/components/select/features.ts +317 -0
  16. package/src/components/select/index.ts +38 -0
  17. package/src/components/select/select.ts +73 -0
  18. package/src/components/select/types.ts +355 -0
  19. package/src/components/textfield/api.ts +78 -6
  20. package/src/components/textfield/features/index.ts +17 -0
  21. package/src/components/textfield/features/leading-icon.ts +127 -0
  22. package/src/components/textfield/features/placement.ts +149 -0
  23. package/src/components/textfield/features/prefix-text.ts +107 -0
  24. package/src/components/textfield/features/suffix-text.ts +100 -0
  25. package/src/components/textfield/features/supporting-text.ts +113 -0
  26. package/src/components/textfield/features/trailing-icon.ts +108 -0
  27. package/src/components/textfield/textfield.ts +51 -15
  28. package/src/components/textfield/types.ts +70 -0
  29. package/src/core/collection/adapters/base.ts +62 -0
  30. package/src/core/collection/collection.ts +300 -0
  31. package/src/core/collection/index.ts +57 -0
  32. package/src/core/collection/list-manager.ts +333 -0
  33. package/src/index.ts +4 -1
  34. package/src/styles/abstract/_variables.scss +18 -0
  35. package/src/styles/components/_button.scss +21 -5
  36. package/src/styles/components/{_chip.scss → _chips.scss} +118 -4
  37. package/src/styles/components/_menu.scss +103 -24
  38. package/src/styles/components/_select.scss +265 -0
  39. package/src/styles/components/_textfield.scss +233 -42
  40. package/src/styles/main.scss +2 -1
  41. package/src/components/textfield/features.ts +0 -322
  42. package/src/core/collection/adapters/base.js +0 -26
  43. package/src/core/collection/collection.js +0 -259
  44. package/src/core/collection/list-manager.js +0 -157
  45. /package/src/core/collection/adapters/{route.js → route.ts} +0 -0
@@ -1,157 +0,0 @@
1
- // src/core/collection/list-manager.js
2
-
3
- import { createRouteAdapter } from './adapters/route'
4
-
5
- /**
6
- * Creates a list manager for a specific collection
7
- * @param {string} collection - Collection name
8
- * @param {Object} config - Configuration options
9
- * @param {Function} config.transform - Transform function for items
10
- * @param {string} config.baseUrl - Base API URL
11
- * @returns {Object} List manager methods
12
- */
13
- export const createListManager = (collection, config = {}) => {
14
- const {
15
- transform = (item) => item,
16
- baseUrl = 'http://localhost:4000/api'
17
- } = config
18
-
19
- // Initialize route adapter
20
- const adapter = createRouteAdapter({
21
- base: baseUrl,
22
- endpoints: {
23
- list: `/${collection}`
24
- },
25
- headers: {
26
- 'Content-Type': 'application/json'
27
- }
28
- })
29
-
30
- // Load items with cursor pagination
31
- const loadItems = async (params = {}) => {
32
- try {
33
- const response = await adapter.read(params)
34
-
35
- return {
36
- items: response.items.map(transform),
37
- meta: response.meta
38
- }
39
- } catch (error) {
40
- console.error(`Error loading ${collection}:`, error)
41
- return {
42
- items: [],
43
- meta: {
44
- cursor: null,
45
- hasNext: false
46
- }
47
- }
48
- }
49
- }
50
-
51
- // Utility to create a cursor-based page loader
52
- const createPageLoader = (list, { onLoad, pageSize = 20 } = {}) => {
53
- let currentCursor = null
54
- let loading = false
55
- const pageHistory = []
56
-
57
- const load = async (cursor = null, addToHistory = true) => {
58
- if (loading) return
59
-
60
- loading = true
61
- onLoad?.({ loading: true })
62
-
63
- const { items, meta } = await loadItems({
64
- limit: pageSize,
65
- cursor
66
- })
67
-
68
- if (addToHistory && cursor) {
69
- pageHistory.push(currentCursor)
70
- }
71
- currentCursor = meta.cursor
72
-
73
- list.setItems(items)
74
- loading = false
75
-
76
- onLoad?.({
77
- loading: false,
78
- hasNext: meta.hasNext,
79
- hasPrev: pageHistory.length > 0,
80
- items
81
- })
82
-
83
- return {
84
- hasNext: meta.hasNext,
85
- hasPrev: pageHistory.length > 0
86
- }
87
- }
88
-
89
- const loadNext = () => load(currentCursor)
90
-
91
- const loadPrev = () => {
92
- const previousCursor = pageHistory.pop()
93
- return load(previousCursor, false)
94
- }
95
-
96
- return {
97
- load,
98
- loadNext,
99
- loadPrev,
100
- get loading () { return loading },
101
- get cursor () { return currentCursor }
102
- }
103
- }
104
-
105
- return {
106
- loadItems,
107
- createPageLoader
108
- }
109
- }
110
-
111
- /**
112
- * Transform functions for common collections
113
- */
114
- export const transforms = {
115
- track: (track) => ({
116
- id: track._id,
117
- headline: track.title || 'Untitled',
118
- supportingText: track.artist || 'Unknown Artist',
119
- meta: track.year?.toString() || ''
120
- }),
121
-
122
- playlist: (playlist) => ({
123
- id: playlist._id,
124
- headline: playlist.name || 'Untitled Playlist',
125
- supportingText: `${playlist.tracks?.length || 0} tracks`,
126
- meta: playlist.creator || ''
127
- }),
128
-
129
- country: (country) => ({
130
- id: country._id,
131
- headline: country.name || country.code,
132
- supportingText: country.continent || '',
133
- meta: country.code || ''
134
- })
135
- }
136
-
137
- /**
138
- * Usage example:
139
- *
140
- * const trackManager = createListManager('track', {
141
- * transform: transforms.track
142
- * })
143
- *
144
- * const loader = trackManager.createPageLoader(list, {
145
- * onLoad: ({ loading, hasNext, items }) => {
146
- * updateNavigation({ loading, hasNext })
147
- * logEvent(`Loaded ${items.length} tracks`)
148
- * }
149
- * })
150
- *
151
- * // Initial load
152
- * await loader.load()
153
- *
154
- * // Navigation
155
- * nextButton.onclick = () => loader.loadNext()
156
- * prevButton.onclick = () => loader.loadPrev()
157
- */